/* Generated by tools/build-style-bundles.py; phpBB 3.3.19.
 * Module revision: stelsm.css?v=1.3.4; header.css?v=1.0.2.
 * Edit source modules, then rebuild this file. */

/* prosilver/normalize.css */
/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */

/**
 * 1. Set default font family to sans-serif.
 * 2. Prevent iOS and IE text size adjust after device orientation change,
 *    without disabling user zoom.
 */

html {
	font-family: sans-serif; /* 1 */
	-ms-text-size-adjust: 100%; /* 2 */
	-webkit-text-size-adjust: 100%; /* 2 */
}

/**
 * Remove default margin.
 */

body {
	margin: 0;
}

/* HTML5 display definitions
	 ========================================================================== */

/**
 * Correct `block` display not defined for any HTML5 element in IE 8/9.
 * Correct `block` display not defined for `details` or `summary` in IE 10/11
 * and Firefox.
 * Correct `block` display not defined for `main` in IE 11.
 */

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
summary {
	display: block;
}

/**
 * 1. Correct `inline-block` display not defined in IE 8/9.
 * 2. Normalize vertical alignment of `progress` in Chrome, Firefox, and Opera.
 */

audio,
canvas,
progress,
video {
	display: inline-block; /* 1 */
	vertical-align: baseline; /* 2 */
}

/**
 * Prevent modern browsers from displaying `audio` without controls.
 * Remove excess height in iOS 5 devices.
 */

audio:not([controls]) {
	display: none;
	height: 0;
}

/**
 * Address `[hidden]` styling not present in IE 8/9/10.
 * Hide the `template` element in IE 8/9/10/11, Safari, and Firefox < 22.
 */

[hidden],
template {
	display: none;
}

/* Links
	 ========================================================================== */

/**
 * Remove the gray background color from active links in IE 10.
 */

a {
	background-color: transparent;
}

/**
 * Improve readability of focused elements when they are also in an
 * active/hover state.
 */

a:active,
a:hover {
	outline: 0;
}

/* Text-level semantics
	 ========================================================================== */

/**
 * Address styling not present in IE 8/9/10/11, Safari, and Chrome.
 */

abbr[title] {
	border-bottom: 1px dotted;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari, and Chrome.
 */

b,
strong {
	font-weight: bold;
}

/**
 * Address styling not present in Safari and Chrome.
 */

dfn {
	font-style: italic;
}

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari, and Chrome.
 */

h1 {
	font-size: 2em;
	margin: 0.67em 0;
}

/**
 * Address styling not present in IE 8/9.
 */

mark {
	background: #ff0;
	color: #000;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
	font-size: 80%;
}

/**
 * Prevent `sub` and `sup` affecting `line-height` in all browsers.
 */

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sup {
	top: -0.5em;
}

sub {
	bottom: -0.25em;
}

/* Embedded content
	 ========================================================================== */

/**
 * Remove border when inside `a` element in IE 8/9/10.
 */

img {
	border: 0;
}

/**
 * Correct overflow not hidden in IE 9/10/11.
 */

svg:not(:root) {
	overflow: hidden;
}

/* Grouping content
	 ========================================================================== */

/**
 * Address margin not present in IE 8/9 and Safari.
 */

figure {
	margin: 1em 40px;
}

/**
 * Address differences between Firefox and other browsers.
 */

hr {
	box-sizing: content-box;
	height: 0;
}

/**
 * Contain overflow in all browsers.
 */

pre {
	overflow: auto;
}

/**
 * Address odd `em`-unit font size rendering in all browsers.
 */

code,
kbd,
pre,
samp {
	font-family: monospace, monospace;
	font-size: 1em;
}

/* Forms
	 ========================================================================== */

/**
 * Known limitation: by default, Chrome and Safari on OS X allow very limited
 * styling of `select`, unless a `border` property is set.
 */

/**
 * 1. Correct color not being inherited.
 *    Known issue: affects color of disabled elements.
 * 2. Correct font properties not being inherited.
 * 3. Address margins set differently in Firefox 4+, Safari, and Chrome.
 */

button,
input,
optgroup,
select,
textarea {
	color: inherit; /* 1 */
	font: inherit; /* 2 */
	margin: 0; /* 3 */
}

/**
 * Address `overflow` set to `hidden` in IE 8/9/10/11.
 */

button {
	overflow: visible;
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Firefox, IE 8/9/10/11, and Opera.
 * Correct `select` style inheritance in Firefox.
 */

button,
select {
	text-transform: none;
}

/**
 * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
 *    and `video` controls.
 * 2. Correct inability to style clickable `input` types in iOS.
 * 3. Improve usability and consistency of cursor style between image-type
 *    `input` and others.
 */

button,
html input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
	-webkit-appearance: button; /* 2 */
	cursor: pointer; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
	cursor: default;
}

/**
 * Remove inner padding and border in Firefox 4+.
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
	border: 0;
	padding: 0;
}

/**
 * Address Firefox 4+ setting `line-height` on `input` using `!important` in
 * the UA stylesheet.
 */

input {
	line-height: normal;
}

/**
 * It's recommended that you don't attempt to style these elements.
 * Firefox's implementation doesn't respect box-sizing, padding, or width.
 *
 * 1. Address box sizing set to `content-box` in IE 8/9/10.
 * 2. Remove excess padding in IE 8/9/10.
 */

input[type="checkbox"],
input[type="radio"] {
	box-sizing: border-box; /* 1 */
	padding: 0; /* 2 */
}

/**
 * Fix the cursor style for Chrome's increment/decrement buttons. For certain
 * `font-size` values of the `input`, it causes the cursor style of the
 * decrement button to change from `default` to `text`.
 */

input[type="number"]::-webkit-inner-spin-button,
input[type="number"]::-webkit-outer-spin-button {
	height: auto;
}

/**
 * 1. Address `appearance` set to `searchfield` in Safari and Chrome.
 * 2. Address `box-sizing` set to `border-box` in Safari and Chrome.
 */

input[type="search"] {
	-webkit-appearance: textfield; /* 1 */
	box-sizing: content-box; /* 2 */
}

/**
 * Remove inner padding and search cancel button in Safari and Chrome on OS X.
 * Safari (but not Chrome) clips the cancel button when the search input has
 * padding (and `textfield` appearance).
 */

input[type="search"]::-webkit-search-cancel-button,
input[type="search"]::-webkit-search-decoration {
	-webkit-appearance: none;
}

/**
 * Define consistent border, margin, and padding.
 */

fieldset {
	border: 1px solid #c0c0c0;
	margin: 0 2px;
	padding: 0.35em 0.625em 0.75em;
}

/**
 * 1. Correct `color` not being inherited in IE 8/9/10/11.
 * 2. Remove padding so people aren't caught out if they zero out fieldsets.
 */

legend {
	border: 0; /* 1 */
	padding: 0; /* 2 */
}

/**
 * Remove default vertical scrollbar in IE 8/9/10/11.
 */

textarea {
	overflow: auto;
}

/**
 * Don't inherit the `font-weight` (applied by a rule above).
 * NOTE: the default cannot safely be changed in Chrome and Safari on OS X.
 */

optgroup {
	font-weight: bold;
}

/* Tables
	 ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

table {
	border-collapse: collapse;
	border-spacing: 0;
}

td,
th {
	padding: 0;
}


/* prosilver/base.css */
/* --------------------------------------------------------------
	$Base
-------------------------------------------------------------- */

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

/* Define your base font-size here; most elements will inherit this. _NO__DOTCOMMA__AFTER__*/
html {
	font-size: 1em; /* Assuming 16px... */
	line-height: 1.5; /* 24px (This is now our magic number; all subsequent margin-bottoms and line-heights want to be a multiple of this number in order to maintain vertical rhythm.) _NO__DOTCOMMA__AFTER__*/
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

body {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	color: #333333;
	background-color: #ffffff;
}

input,
button,
select,
textarea {
	font-family: inherit;
	font-size: inherit;
	line-height: inherit;
}

figure { margin: 0; }
img { vertical-align: middle; }

hr {
	margin-top: 20px;
	margin-bottom: 20px;
	border: 0;
	border-top: 1px solid #e5e5e5;
}

a {
	color: #428bca;
	text-decoration: none;
}

a:hover,
a:focus,
a:active {
	color: #2a6496;
	text-decoration: underline;
}

blockquote,
dl,
dd,
h1,
h2,
h3,
h4,
h5,
h6,
figure,
p,
pre { margin: 0; }
button {
	background: transparent;
	border: 0;
	padding: 0;
}

/**
 * Work around a Firefox/IE bug where the transparent `button` background
 * results in a loss of the default `button` focus styles.
 */
button:focus {
	outline: 1px dotted;
	outline: 5px auto -webkit-focus-ring-color;
}

fieldset {
	border: 0;
	margin: 0;
	padding: 0;
}

iframe { border: 0; }
ol,
ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

/**
 * Suppress the focus outline on links that cannot be accessed via keyboard.
 * This prevents an unwanted focus outline from appearing around elements that
 * might still respond to pointer events.
 */
[tabindex="-1"]:focus { outline: none !important; }

/**
 * Remove double underline from recent version of firefox
 */
abbr[title] {
	text-decoration: none;
}


/* prosilver/utilities.css */
/* --------------------------------------------------------------
	$Utilities
-------------------------------------------------------------- */

.sr-only {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}

.sr-only-focusable:active,
.sr-only-focusable:focus {
	position: static;
	width: auto;
	height: auto;
	margin: 0;
	overflow: visible;
	clip: auto;
}

.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after {
	content: " ";
	display: table;
}
.clearfix:after,
.container:after,
.container-fluid:after,
.row:after { clear: both; }

.center-block {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.pull-right { float: right !important; }
.pull-left { float: left !important; }
.hide { display: none !important; }
.show { display: block !important; }
.invisible { visibility: hidden; }

.text-hide {
	font: 0/0 a;
	color: transparent;
	text-shadow: none;
	background-color: transparent;
	border: 0;
}

.hidden {
	display: none;
}

.affix { position: fixed; }


/* prosilver/common.css */
/* General Markup Styles
---------------------------------------- */
html {
	font-size: 100%;
	/* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-IE browsers */
	height: 101%;
}

body {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 10px;
	line-height: normal;
	margin: 0;
	padding: 12px 0;
	word-wrap: break-word;
	-webkit-print-color-adjust: exact;
}

h1 {
	/* Forum name */
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	margin-right: 200px;
	margin-top: 15px;
	font-weight: bold;
	font-size: 2em;
}

h2 {
	/* Forum header titles */
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 2em;
	margin: 0.8em 0 0.2em 0;
}

h2.solo {
	margin-bottom: 1em;
}

h3 {
	/* Sub-headers (also used as post headers, but defined later) */
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	text-transform: uppercase;
	border-bottom: 1px solid transparent;
	margin-bottom: 3px;
	padding-bottom: 2px;
	font-size: 1.05em;
	margin-top: 20px;
}

h4 {
	/* Forum and topic list titles */
	font-family: "Trebuchet MS", Verdana, Helvetica, Arial, Sans-serif;
	font-size: 1.3em;
}

p {
	line-height: 1.3em;
	font-size: 1.1em;
	margin-bottom: 1.5em;
}

img {
	border-width: 0;
}

hr {
	border: 0 solid transparent;
	border-top-width: 1px;
	height: 1px;
	margin: 5px 0;
	display: block;
	clear: both;
}

hr.dashed {
	border-top-style: dashed;
	margin: 10px 0;
}

hr.divider {
	display: none;
}

p.right {
	text-align: right;
}

p.jumpbox-return {
	margin-top: 10px;
	margin-bottom: 0;
	float: left;
}

b, strong {
	font-weight: bold;
}

.text-strong {
	font-weight: bold;
}

i, em {
	font-style: italic;
}

.text-italics {
	font-style: italic;
}

u {
	text-decoration: underline;
}

ul {
	list-style-type: disc;
}

ol {
	list-style-type: decimal;
}

li {
	display: list-item;
}

ul ul, ol ul {
	list-style-type: circle;
}

ol ol ul, ol ul ul, ul ol ul, ul ul ul {
	list-style-type: square;
}

a:hover	{ text-decoration: underline; }

/* Main blocks
---------------------------------------- */
.wrap {
	border: 1px solid transparent;
	border-radius: 8px;
	margin: 0 auto;
	max-width: 1152px;
	min-width: 625px;
	padding: 15px;
}

@media only screen and (max-width: 1220px), only screen and (max-device-width: 1220px) {
	.wrap {
		margin: 0 12px;
	}
}

.page-body {
	margin: 4px 0;
	clear: both;
}

.page-footer {
	clear: both;
}

.page-footer h3 {
	margin-top: 20px;
}

.logo {
	float: left;
	width: auto;
	padding: 10px 13px 0 10px;
}

.logo:hover {
	text-decoration: none;
}

.site_logo {
	background-repeat: no-repeat;
	display: inline-block;
	width: 149px;
	height: 52px;
}

/* Site description and logo */
.site-description {
	float: left;
	width: 65%;
}

.site-description h1 {
	margin-right: 0;
}

/* Round cornered boxes and backgrounds
---------------------------------------- */
.headerbar {
	margin-bottom: 4px;
	padding: 5px;
	border-radius: 7px;
}

.navbar {
	padding: 3px 10px;
	border-radius: 7px;
}

.forabg {
	margin-bottom: 4px;
	padding: 5px;
	clear: both;
	border-radius: 7px;
}

.forumbg {
	margin-bottom: 4px;
	padding: 5px;
	clear: both;
	border-radius: 7px;
}

.panel {
	margin-bottom: 4px;
	padding: 5px 10px;
	border-radius: 7px;
}

.post {
	padding: 5px 10px;
	margin-bottom: 4px;
	background-repeat: no-repeat;
	background-position: 100% 0;
	border-radius: 7px;
	position: relative;
}

.rowbg {
	margin: 5px 5px 2px 5px;
}

/* Horizontal lists
----------------------------------------*/
.navbar ul.linklist {
	padding: 2px 0;
	list-style-type: none;
}

ul.linklist {
	display: block;
	margin: 0;
}

.cp-main .panel {
	padding: 5px 10px;
}

ul.linklist > li {
	float: left;
	font-size: 1.1em;
	line-height: 2.2em;
	list-style-type: none;
	margin-right: 7px;
	padding-top: 1px;
	width: auto;
}

ul.linklist > li.rightside, p.rightside, a.rightside {
	float: right;
	margin-right: 0;
	margin-left: 7px;
	text-align: right;
}

ul.navlinks {
	border-top: 1px solid transparent;
}

ul.leftside {
	float: left;
	margin-left: 0;
	margin-right: 5px;
	text-align: left;
}

ul.rightside {
	float: right;
	margin-left: 5px;
	margin-right: -5px;
	text-align: right;
}

ul.linklist li.responsive-menu {
	position: relative;
	margin: 0 5px 0 0;
}

.hasjs ul.linklist.leftside, .hasjs ul.linklist.rightside {
	max-width: 48%;
}

.hasjs ul.linklist.fullwidth {
	max-width: none;
}

li.responsive-menu.dropdown-right .dropdown {
	left: -9px;
}

li.responsive-menu.dropdown-left .dropdown {
	right: -6px;
}

ul.linklist .dropdown {
	top: 22px;
}

ul.linklist .dropdown-up .dropdown {
	bottom: 18px;
	top: auto;
}

/* Bulletin icons for list items
----------------------------------------*/
ul.linklist.bulletin > li:before {
	display: inline-block;
	content: "\2022";
	font-size: inherit;
	line-height: inherit;
	padding-right: 4px;
}

ul.linklist.bulletin > li:first-child:before,
ul.linklist.bulletin > li.rightside:last-child:before {
	content: none;
}

ul.linklist.bulletin > li.no-bulletin:before {
	content: none;
}

.responsive-menu:before {
	display: none !important;
}

/* Profile in overall_header.html */
.header-profile {
	display: inline-block;
	vertical-align: top;
}

a.header-avatar,
a.header-avatar:hover {
	text-decoration: none;
}

a.header-avatar img {
	margin-bottom: 2px;
	max-height: 20px;
	vertical-align: middle;
	width: auto;
}

a.header-avatar span:after {
	content: '\f0dd';
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	padding-left: 6px;
	padding-top: 2px;
	vertical-align: top;
}

/* Dropdown menu
----------------------------------------*/
.dropdown-container {
	position: relative;
}

.dropdown-container-right {
	float: right;
}

.dropdown-container-left {
	float: left;
}

.nojs .dropdown-container:hover .dropdown {
	display: block !important;
}

.dropdown {
	display: none;
	position: absolute;
	left: 0;
	top: 1.2em;
	z-index: 2;
	border: 1px solid transparent;
	border-radius: 5px;
	padding: 9px 0 0;
	margin-right: -500px;
}

.dropdown.live-search {
	top: auto;
}

.dropdown-container.topic-tools {
	float: left;
}

.dropdown-up .dropdown {
	top: auto;
	bottom: 1.2em;
	padding: 0 0 9px;
}

.dropdown-left .dropdown, .nojs .rightside .dropdown {
	left: auto;
	right: 0;
	margin-left: -500px;
	margin-right: 0;
}

.dropdown-button-control .dropdown {
	top: 24px;
}

.dropdown-button-control.dropdown-up .dropdown {
	top: auto;
	bottom: 24px;
}

.dropdown .pointer, .dropdown .pointer-inner {
	position: absolute;
	width: 0;
	height: 0;
	border-top-width: 0;
	border-bottom: 10px solid transparent;
	border-left: 10px dashed transparent;
	border-right: 10px dashed transparent;
	-webkit-transform: rotate(360deg); /* better anti-aliasing in webkit */
	display: block;
}

.dropdown-up .pointer, .dropdown-up .pointer-inner {
	border-bottom-width: 0;
	border-top: 10px solid transparent;
}

.dropdown .pointer {
	right: auto;
	left: 10px;
	top: -1px;
	z-index: 3;
}

.dropdown-up .pointer {
	bottom: -1px;
	top: auto;
}

.dropdown-left .dropdown .pointer, .nojs .rightside .dropdown .pointer {
	left: auto;
	right: 10px;
}

.dropdown .pointer-inner {
	top: auto;
	bottom: -11px;
	left: -10px;
}

.dropdown-up .pointer-inner {
	bottom: auto;
	top: -11px;
}

.dropdown .dropdown-contents {
	z-index: 2;
	overflow: hidden;
	overflow-y: auto;
	border: 1px solid transparent;
	border-radius: 5px;
	padding: 5px;
	position: relative;
	max-height: 300px;
}

.dropdown-contents a {
	display: block;
	padding: 5px;
}

.jumpbox {
	margin: 5px 0;
}

.jumpbox .dropdown li {
	border-top: 1px solid transparent;
}

.jumpbox .dropdown-select {
	margin: 0;
}

.jumpbox .dropdown-contents {
	padding: 0;
	text-decoration: none;
}

.jumpbox .dropdown-contents li {
	padding: 0;
}

.jumpbox .dropdown-contents a {
	margin-right: 20px;
	padding: 5px 10px;
	text-decoration: none;
	width: 100%;
}

.jumpbox .spacer {
	display: inline-block;
	width: 0px;
}

.jumpbox .spacer + .spacer {
	width: 20px;
}

.dropdown-contents a {
	display: block;
	padding: 5px;
}

.jumpbox .dropdown-select {
	margin: 0;
}

.jumpbox .dropdown-contents a {
	text-decoration: none;
}

.dropdown li {
	display: list-item;
	border-top: 1px dotted transparent;
	float: none !important;
	line-height: normal !important;
	font-size: 1em !important;
	list-style: none;
	margin: 0;
	white-space: nowrap;
	text-align: left;
}

.dropdown-contents > li {
	padding-right: 15px;
}

.dropdown-nonscroll > li {
	padding-right: 0;
}

.dropdown li:first-child, .dropdown li.separator + li, .dropdown li li {
	border-top: 0;
}

.dropdown li li:first-child {
	margin-top: 4px;
}

.dropdown li li:last-child {
	padding-bottom: 0;
}

.dropdown li li {
	border-top: 1px dotted transparent;
	padding-left: 18px;
}

.wrap .dropdown li, .dropdown.wrap li, .dropdown-extended li {
	white-space: normal;
}

.dropdown li.separator {
	border-top: 1px solid transparent;
	padding: 0;
}

.dropdown li.separator:first-child, .dropdown li.separator:last-child {
	display: none !important;
}

/* Responsive breadcrumbs
----------------------------------------*/
.breadcrumbs .crumb {
	float: left;
	font-weight: bold;
	word-wrap: normal;
}

.breadcrumbs .crumb:before {
	content: '\2039';
	font-weight: bold;
	padding: 0 0.5em;
}

.breadcrumbs .crumb:first-child:before {
	content: none;
}

.breadcrumbs .crumb a {
	white-space: nowrap;
	text-overflow: ellipsis;
	vertical-align: bottom;
	overflow: hidden;
}

.breadcrumbs.wrapped .crumb a { letter-spacing: -.3px; }
.breadcrumbs.wrapped .crumb.wrapped-medium a { letter-spacing: -.4px; }
.breadcrumbs.wrapped .crumb.wrapped-tiny a { letter-spacing: -.5px; }

.breadcrumbs .crumb.wrapped-max a { max-width: 120px; }
.breadcrumbs .crumb.wrapped-wide a { max-width: 100px; }
.breadcrumbs .crumb.wrapped-medium a { max-width: 80px; }
.breadcrumbs .crumb.wrapped-small a { max-width: 60px; }
.breadcrumbs .crumb.wrapped-tiny a { max-width: 40px; }

/* Table styles
----------------------------------------*/
table.table1 {
	width: 100%;
}

.ucp-main table.table1 {
	padding: 2px;
}

table.table1 thead th {
	font-weight: normal;
	text-transform: uppercase;
	line-height: 1.3em;
	font-size: 1em;
	padding: 0 0 4px 3px;
}

table.table1 thead th span {
	padding-left: 7px;
}

table.table1 tbody tr {
	border: 1px solid transparent;
}

table.table1 td {
	font-size: 1.1em;
}

table.table1 tbody td {
	padding: 5px;
	border-top: 1px solid transparent;
}

table.table1 tbody th {
	padding: 5px;
	border-bottom: 1px solid transparent;
	text-align: left;
}

/* Specific column styles */
table.table1 .name		{ text-align: left; }
table.table1 .center		{ text-align: center; }
table.table1 .reportby		{ width: 15%; }
table.table1 .posts		{ text-align: center; width: 7%; }
table.table1 .joined		{ text-align: left; width: 15%; }
table.table1 .active		{ text-align: left; width: 15%; }
table.table1 .mark		{ text-align: center; width: 7%; }
table.table1 .info		{ text-align: left; width: 30%; }
table.table1 .info div		{ width: 100%; white-space: normal; overflow: hidden; }
table.table1 .autocol		{ line-height: 2em; white-space: nowrap; }
table.table1 thead .autocol	{ padding-left: 1em; }

table.table1 span.rank-img {
	float: right;
	width: auto;
}

table.info td {
	padding: 3px;
}

table.info tbody th {
	padding: 3px;
	text-align: right;
	vertical-align: top;
	font-weight: normal;
}

.forumbg table.table1 {
	margin: 0;
}

.forumbg-table > .inner {
	margin: 0 -1px;
}

.color_palette_placeholder table {
	border-collapse: separate;
	border-spacing: 1px;
}

/* Misc layout styles
---------------------------------------- */
/* column[1-2] styles are containers for two column layouts */
.column1 {
	float: left;
	clear: left;
	width: 49%;
}

.column2 {
	float: right;
	clear: right;
	width: 49%;
}

/* General classes for placing floating blocks */
.left-box {
	float: left;
	width: auto;
	text-align: left;
	max-width: 100%;
}

.avatar-rank-container {
	max-width: 20%;
}

.left-box.profile-details {
	width: 80%;
}

.right-box {
	float: right;
	width: auto;
	text-align: right;
	max-width: 100%;
}

dl.details {
	font-size: 1.1em;
}

dl.details dt {
	float: left;
	clear: left;
	width: 30%;
	text-align: right;
	display: block;
}

dl.details dd {
	margin-left: 0;
	padding-left: 5px;
	margin-bottom: 5px;
	float: left;
	width: 65%;
	overflow: hidden;
	text-overflow: ellipsis;
}

.clearfix, fieldset dl, ul.topiclist dl, dl.polls {
	overflow: hidden;
}

fieldset.fields1 ul.recipients {
	list-style-type: none;
	line-height: 1.8;
	max-height: 150px;
	overflow-y: auto;
}

fieldset.fields1 dd.recipients {
	clear: left;
	margin-left: 1em;
}

fieldset.fields1 dl.pmlist > dt {
	width: auto !important;
}

fieldset.fields1 dl.pmlist dd.recipients {
	margin-left: 0 !important;
}

/* Action-bars (container for post/reply buttons, pagination, etc.)
---------------------------------------- */
.action-bar {
	font-size: 11px;
	margin: 4px 0;
}

.forabg + .action-bar {
	margin-top: 2em;
}

.action-bar .button {
	margin-right: 5px;
	float: left;
}

.action-bar .button-search {
	margin-right: 0;
}

/* Pagination
---------------------------------------- */
.pagination {
	float: right;
	text-align: right;
	width: auto;
}

.action-bar.bar-bottom .pagination {
	margin-top: 0;
}

.action-bar .pagination .button {
	margin-right: 0;
	float: none;
}

.pagination > ul {
	display: inline-block;
	list-style: none !important;
	margin-left: 5px;
}

.pagination > ul > li {
	display: inline-block !important;
	padding: 0;
	font-size: 100%;
	line-height: normal;
	vertical-align: middle;
}

.pagination li a, .pagination li span {
	border-radius: 2px;
	padding: 2px 5px;
}

.pagination li.active span {
	display: inline-block;
	font-size: 13px;
	font-weight: normal;
	font-family: "Open Sans", "Droid Sans", Verdana, Arial, Helvetica;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	border: 1px solid transparent;
}

.pagination li.ellipsis span {
	border: none;
	padding: 0;
}

.pagination li.page-jump {
	margin-right: 5px;
}

.pagination li.page-jump a {
	padding: 0 8px;
}

.pagination li.page-jump a i {
	font-size: 21px;
}

.pagination .arrow a {
	padding: 2px 0;
}

/* Pagination in viewforum for multipage topics */
.row .pagination {
	display: block;
	margin-top: 3px;
	margin-bottom: 3px;
}

.row .pagination > ul {
	margin: 0;
}

.row .pagination li a, .row .pagination li span {
	border-radius: 2px;
	padding: 1px 3px;
	font-size: 9px;
}

/* jQuery popups
---------------------------------------- */
.phpbb_alert {
	border: 1px solid transparent;
	display: none;
	left: 0;
	padding: 0 25px 20px 25px;
	position: fixed;
	right: 0;
	top: 150px;
	z-index: 50;
	width: 620px;
	margin: 0 auto;
}

@media only screen and (max-height: 500px), only screen and (max-device-width: 500px)
{
	.phpbb_alert {
		top: 25px;
	}
}

.phpbb_alert .alert_close {
	float: right;
	margin-right: -36px;
	margin-top: -8px;
}

.phpbb_alert p {
	margin: 8px 0;
	padding-bottom: 8px;
}

.phpbb_alert label {
	display: block;
	margin: 8px 0;
	padding-bottom: 8px;
}

.phpbb_alert div.alert_text > p,
.phpbb_alert div.alert_text > label,
.phpbb_alert div.alert_text > select,
.phpbb_alert div.alert_text > textarea,
.phpbb_alert div.alert_text > input {
	font-size: 1.1em;
}

.darkenwrapper {
	display: none;
	position: relative;
	z-index: 44;
}

.darken {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0.5;
	z-index: 45;
}

.loading_indicator {
	background: center center no-repeat;
	border-radius: 5px;
	display: none;
	opacity: 0.8;
	margin-top: -50px;
	margin-left: -50px;
	height: 50px;
	width: 50px;
	position: fixed;
	left: 50%;
	top: 50%;
	z-index: 51;
}

/* Miscellaneous styles
---------------------------------------- */
.copyright {
	font-size: 10px;
	text-align: center;
	padding: 10px;
}

.footer-row {
	font-size: 10px;
	line-height: 1.8;
	margin: 0;
}

.small {
	font-size: 0.9em !important;
}

.titlespace {
	margin-bottom: 15px;
}

.headerspace {
	margin-top: 20px;
}

.error {
	font-weight: bold;
	font-size: 1em;
}

div.rules {
	margin: 10px 0;
	font-size: 1.1em;
	padding: 5px 10px;
	border-radius: 7px;
}

div.rules ul, div.rules ol {
	margin-left: 20px;
}

p.post-notice {
	position: relative;
	padding: 5px;
	min-height: 14px;
	margin-bottom: 1em;
}

form > p.post-notice strong {
	line-height: 20px;
}

.stat-block {
	clear: both;
}

.top-anchor {
	display: block;
	position: absolute;
	top: -20px;
}

.clear {
	display: block;
	clear: both;
	font-size: 1px;
	line-height: 1px;
	background: transparent;
}

/* Inner box-model clearing */
.inner:after,
ul.linklist:after,
.action-bar:after,
.notification_text:after,
.tabs-container:after,
.tabs > ul:after,
.minitabs > ul:after,
.postprofile .avatar-container:after {
	clear: both;
	content: '';
	display: block;
}

.emoji {
	min-height: 18px;
	min-width: 18px;
	height: 1em;
	width: 1em;
}

.smilies {
	vertical-align: text-bottom;
}

.icon-notification {
	position: relative;
}

.member-search {
	float: left;
	margin: 0;
	padding: 6px 10px;
}

.member-search strong {
	font-size: 0.95em;
}

.dropdown-extended {
	display: none;
	z-index: 1;
}

.dropdown-extended ul {
	max-height: 350px;
	overflow-y: auto;
	overflow-x: hidden;
	clear: both;
}

.dropdown-extended ul li {
	padding: 0;
	margin: 0 !important;
	float: none;
	border-top: 1px solid;
	list-style-type: none;
	font-size: 0.95em;
	clear: both;
	position: relative;
}

.dropdown-extended ul li:first-child {
	border-top: none;
}

.dropdown-extended ul li.no_notifications {
	padding: 10px;
}

.dropdown-extended .dropdown-contents {
	max-height: none;
	padding: 0;
	position: absolute;
	width: 340px;
}

.nojs .dropdown-extended .dropdown-contents {
	position: relative;
}

.dropdown-extended .header {
	padding: 0 10px;
	font-family: Arial, "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-weight: bold;
	text-align: left;
	text-shadow: 1px 1px 1px white;
	text-transform: uppercase;
	line-height: 3em;
	border-bottom: 1px solid;
	border-radius: 5px 5px 0 0;
}

.dropdown-extended .header .header_settings {
	float: right;
	font-weight: normal;
	text-transform: none;
}

.dropdown-extended .header .header_settings a {
	display: inline-block;
	padding: 0 5px;
}

.dropdown-extended .header:after {
	content: '';
	display: table;
	clear: both;
}

.dropdown-extended .footer {
	text-align: center;
	font-size: 1.1em;
}

.dropdown-extended ul li a, .dropdown-extended ul li.no-url {
	padding: 8px;
}

.dropdown-extended .footer > a {
	padding: 5px 0;
}

.dropdown-extended ul li a, .notification_list dt > a, .dropdown-extended .footer > a {
	display: block;
	text-decoration: none;
}

.notification_list ul li img {
	float: left;
	max-height: 50px;
	max-width: 50px;
	width: auto !important;
	height: auto !important;
	margin-right: 5px;
}

.notification_list ul li p {
	margin-bottom: 4px;
	font-size: 1em;
}

.notification_list p.notification-reference,
.notification_list p.notification-location,
.notification_list li a p.notification-reason {
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.notification_list p.notification-time {
	font-size: 0.9em;
	margin: 0;
	text-align: right;
}

.notification_list div.notifications {
	margin-left: 50px;
	padding: 5px;
}

.notification_list div.notifications a {
	display: block;
}

.notification_list p.notifications_title {
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	font-size: 1.2em !important;
}

.notification_list p.notifications_title strong {
	font-weight: bold;
}

.notification_list p.notifications_time {
	font-size: 0.9em !important;
}

.notification_text {
	margin-left: 58px;
}

.badge {
	border-radius: 10px;
	opacity: 0.8;
	text-align: center;
	white-space: nowrap;
	font-size: 10px;
	line-height: 1;
	float: right;
	display: inline-block;
	margin-left: 3px;
	vertical-align: baseline;
	position: relative;
	top: 3px;
	padding: 4px 6px;
}

.badge.hidden {
	display: none;
}

/* Navbar specific list items
----------------------------------------*/

.linklist .quick-links {
	margin: 0 7px 0 0;
}

.linklist.compact .rightside > a > span {
	display: none;
}

.dropdown-page-jump .dropdown {
	top: 20px;
}

.dropdown-page-jump.dropdown-up .dropdown {
	bottom: 20px;
}

.dropdown-page-jump input.tiny {
	width: 50px;
}

.dropdown .clone.hidden {
	display: none;
}

.dropdown .clone.hidden + li.separator {
	display: none;
}

.dropdown .clone.hidden + li {
	border-top: none;
}


/* prosilver/links.css */
/* Link Styles
---------------------------------------- */

/* Links adjustment to correctly display an order of rtl/ltr mixed content */
a {
	direction: ltr;
	unicode-bidi: embed;
	text-decoration: none;
	/* we use links inline more often then not so to address several bugs with
	IE and some other browsers we render all links as inlineblock by default */
	display: inline-block;

}

/* Coloured usernames */
.username-coloured {
	font-weight: bold;
	display: inline !important;
	padding: 0 !important;
}

/* Links on gradient backgrounds */
.forumbg .header a, .forabg .header a, th a {
	text-decoration: none;
}

.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
	text-decoration: underline;
}

/* Notification mark read link */
.dropdown-extended a.mark_read {
	background-position: center center;
	background-repeat: no-repeat;
	border-radius: 3px 0 0 3px;
	display: none;
	margin-top: -20px;
	position: absolute;
	z-index: 2;
	right: 0;
	top: 50%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.dropdown-extended li:hover a.mark_read {
	display: block;
}

.dropdown-extended a.mark_read:hover {
	width: 50px;
}

.jumpbox-cat-link,
.jumpbox-forum-link { font-weight: bold; }


/* Links for forum/topic lists */
a.forumtitle {
	font-family: "Trebuchet MS", Helvetica, Arial, Sans-serif;
	font-size: 1.2em;
	font-weight: bold;
	text-decoration: none;
}

a.forumtitle:hover {
	text-decoration: underline;
}

a.topictitle {
	font-family: "Trebuchet MS", Helvetica, Arial, Sans-serif;
	font-size: 1.2em;
	font-weight: bold;
	text-decoration: none;
	display: inline;
}

a.topictitle:hover {
	text-decoration: underline;
}

a.lastsubject {
	font-weight: bold;
	text-decoration: none;
}

a.lastsubject:hover {
	text-decoration: underline;
}

.row-item a:hover {
	text-decoration: none;
}

.row-item .forumtitle:hover,
.row-item .topictitle:hover,
.row-item .lastsubject:hover,
.row-item .subforum:hover,
.row-item a.username:hover,
.row-item a.username-coloured:hover {
	text-decoration: underline;
}

/* Post body links */
.postlink {
	text-decoration: none;
	border-bottom: 1px solid transparent;
	padding-bottom: 0;
}

.postlink:hover {
	text-decoration: none;
}

.signature a, .signature a:hover {
	border: none;
	text-decoration: underline;
}

/* Profile links */
.postprofile a, .postprofile dt.author a {
	font-weight: bold;
	text-decoration: none;
}

.postprofile a:hover, .postprofile dt.author a:hover {
	text-decoration: underline;
}

/* Profile searchresults */
.search .postprofile a {
	text-decoration: none;
	font-weight: normal;
}

.search .postprofile a:hover {
	text-decoration: underline;
}

.top {
	font-size: 12px;
	text-decoration: none;
	margin-top: 10px;
}

/* Back to top of page */
.back2top {
	clear: both;
}

.back2top .top {
	float: right;
	margin-right: -10px;
	margin-top: 0;
}

/* Arrow links  */

.arrow-up {
	padding-left: 10px;
	text-decoration: none;
	border-bottom-width: 0;
}

.arrow-up:hover { }

.arrow-down {
	padding-right: 10px;
}

.arrow-down:hover { }

.arrow-left:hover {
	text-decoration: none;
}

.arrow-right:hover {
	text-decoration: none;
}

/* invisible skip link, used for accessibility  */
.skiplink {
	position: absolute;
	left: -999px;
	width: 990px;
}

/* Feed icon in forumlist_body.html */
a.feed-icon-forum {
	float: right;
	margin: 3px;
}

a.anchor {
	display: block;
}


/* prosilver/content.css */
/* Content Styles
---------------------------------------- */

ul.topiclist {
	display: block;
	list-style-type: none;
	margin: 0;
}

ul.topiclist li {
	display: block;
	list-style-type: none;
	margin: 0;
}

ul.topiclist dl {
	position: relative;
}

ul.topiclist li.row dl {
	margin: 2px 0;
}

ul.topiclist dt, ul.topiclist dd {
	display: block;
	float: left;
}

ul.topiclist dt {
	width: 100%;
	margin-right: -440px;
	font-size: 1.1em;
}

ul.topiclist.missing-column dt {
	margin-right: -345px;
}

ul.topiclist.two-long-columns dt {
	margin-right: -250px;
}

ul.topiclist.two-columns dt {
	margin-right: -80px;
}

ul.topiclist dt .list-inner {
	margin-right: 440px;
	padding-left: 5px;
	padding-right: 5px;
}

ul.topiclist.missing-column dt .list-inner {
	margin-right: 345px;
}

ul.topiclist.two-long-columns dt .list-inner {
	margin-right: 250px;
}

ul.topiclist.two-columns dt .list-inner {
	margin-right: 80px;
}

ul.topiclist dd {
	border-left: 1px solid transparent;
	padding: 4px 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

ul.topiclist li.row dd {
	padding: 4px 0 999px 0;
	margin-bottom: -995px;
}

ul.topiclist dfn {
	/* Labels for post/view counts */
	border: 0;
	position: absolute;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	width: 1px;
	height: 1px;
	margin: -1px;
	padding: 0;
}

.forum-image {
	float: left;
	padding-top: 5px;
	margin-right: 5px;
}

.forum-image img {
	max-width: 100%;
}

li.row {
	border-top: 1px solid transparent;
	border-bottom: 1px solid transparent;
}

li.row strong {
	font-weight: normal;
}

li.header dt, li.header dd {
	line-height: 1.6em;
	border-left-width: 0;
	margin: 2px 0 4px 0;
	padding-top: 2px;
	padding-bottom: 2px;
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
}

li.header dt {
	font-weight: bold;
	width: 100%;
	margin-right: -440px;
}

li.header dt .list-inner {
	margin-right: 440px;
}

li.header dd {
	padding-left: 1px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

li.header dl.row-item dt, li.header dl.row-item dd {
	min-height: 0;
}

li.header dl.row-item dt .list-inner {
	/* Tweak for headers alignment when folder icon used */
	padding-left: 0;
	padding-right: 50px;
}

/* Forum list column styles */
.row .list-inner { padding: 4px 0; }

dl.row-item {
	background-position: 10px 50%;		/* Position of folder icon */
	background-repeat: no-repeat;
	background-size: 32px;
}

dl.row-item dt {
	background-repeat: no-repeat;
	background-position: 5px 95%;		/* Position of topic icon */
	background-size: 17px;
}

dl.row-item dt .list-inner {
	padding-left: 52px;			/* Space for folder icon */
}

dl.row-item dt, dl.row-item dd {
	min-height: 35px;
}

dl.row-item dt a {
	display: inline;
}

dl a.row-item-link {				/* topic row icon links */
	display: block;
	width: 30px;
	height: 30px;
	padding: 0;
	position: absolute;
	top: 50%;
	left: 0;
	margin-top: -15px;
	margin-left: 9px;
}

dd.posts, dd.topics, dd.views, dd.extra, dd.mark {
	width: 80px;
	text-align: center;
	line-height: 2.2em;
	font-size: 1.2em;
}

dd.posts, dd.topics, dd.views {
	width: 95px;
}

/* List in forum description */
dl.row-item dt ol,
dl.row-item dt ul {
	list-style-position: inside;
	margin-left: 1em;
}

dl.row-item dt li {
	display: list-item;
	list-style-type: inherit;
}

dd.lastpost, dd.redirect, dd.moderation, dd.time, dd.info {
	width: 250px;
	font-size: 1.1em;
}

dd.redirect {
	line-height: 2.5em;
}

dd.time {
	line-height: 200%;
}

dd.lastpost > span, ul.topiclist dd.info > span, ul.topiclist dd.time > span, dd.redirect > span, dd.moderation > span {
	display: block;
	padding-left: 5px;
}

dd.extra, dd.mark {
	line-height: 200%;
}

dd.option {
	width: 125px;
	line-height: 200%;
	text-align: center;
	font-size: 1.1em;
}

/* Post body styles
----------------------------------------*/
.postbody {
	padding: 0;
	line-height: 1.48em;
	width: 76%;
	float: left;
	position: relative;
}

.postbody .ignore {
	font-size: 1.1em;
}

.postbody h3.first {
	/* The first post on the page uses this */
	font-size: 1.7em;
}

.postbody h3 {
	/* Postbody requires a different h3 format - so change it here */
	float: left;
	font-size: 1.5em;
	padding: 2px 0 0 0;
	margin-top: 0 !important;
	margin-bottom: 0.3em !important;
	text-transform: none;
	border: none;
	font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
	line-height: 125%;
}

.postbody h3 img {
	vertical-align: bottom;
}

.has-profile .postbody h3 {
	/* If there is a post-profile, we position the post-buttons differently */
	float: none !important;
	margin-right: 180px;
}

.postbody .content {
	font-size: 1.3em;
	overflow-x: auto;
}

.postbody img.postimage {
	max-width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.search .postbody {
	width: 68%;
}

/* Topic review panel
----------------------------------------*/
.panel .review {
	margin-top: 2em;
}

.topicreview {
	padding-right: 5px;
	overflow: auto;
	height: 300px;
}

.topicreview .postbody {
	width: auto;
	float: none;
	margin: 0;
	height: auto;
}

.topicreview .post {
	height: auto;
}

.topicreview h2 {
	border-bottom-width: 0;
}

.post-ignore .postbody {
	display: none;
}

/* MCP Post details
----------------------------------------*/
.post_details {
	/* This will only work in IE7+, plus the others */
	overflow: auto;
	max-height: 300px;
}

/* Content container styles
----------------------------------------*/
.content {
	clear: both;
	min-height: 3em;
	overflow: hidden;
	line-height: 1.4em;
	font-family: "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
	font-size: 1em;
	padding-bottom: 1px;
}

.content h2, .panel h2 {
	font-weight: normal;
	border-bottom: 1px solid transparent;
	font-size: 1.6em;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	padding-bottom: 0.5em;
}

.panel h3 {
	margin: 0.5em 0;
}

.panel p {
	font-size: 1.2em;
	margin-bottom: 1em;
	line-height: 1.4em;
}

.content p {
	font-family: "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
	font-size: 1.2em;
	margin-bottom: 1em;
	line-height: 1.4em;
}

.agreement {
	font-size: 12px;
	line-height: 17px;
	margin-bottom: 10px;
}

.agreement-text {
	line-height: 17px;
	margin-bottom: 10px;
}

dl.faq {
	font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
	font-size: 1.1em;
	margin-top: 1em;
	margin-bottom: 2em;
	line-height: 1.4em;
}

dl.faq dt {
	font-weight: bold;
}

.content dl.faq {
	font-size: 1.2em;
	margin-bottom: 0.5em;
}

.content li {
	list-style-type: inherit;
}

.content ul, .content ol {
	margin: 0.8em 0 0.9em 3em;
}

.posthilit {
	padding: 0 2px 1px 2px;
}

/* Post author */
p.author {
	margin-bottom: 0.6em;
	padding: 0 0 5px 0;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 1em;
	line-height: 1.2em;
	clear: both;
}

/* Post signature */
.signature {
	margin-top: 1.5em;
	padding-top: 0.2em;
	font-size: 1.1em;
	border-top: 1px solid transparent;
	clear: left;
	line-height: 140%;
	overflow: hidden;
	width: 100%;
}

.signature.standalone {
	border-top-width: 0;
	margin-top: 0;
}

dd .signature {
	margin: 0;
	padding: 0;
	clear: none;
	border: none;
}

.signature li {
	list-style-type: inherit;
}

.signature ul, .signature ol {
	margin: 0.8em 0 0.9em 3em;
}

/* Post noticies */
.notice {
	font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
	width: auto;
	margin-top: 1.5em;
	padding-top: 0.2em;
	font-size: 1em;
	border-top: 1px dashed transparent;
	clear: left;
	line-height: 130%;
}

/* Jump to post link for now */
ul.searchresults {
	list-style: none;
	text-align: right;
	clear: both;
}

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
	border: 1px solid transparent;
	font-size: 0.95em;
	margin: 1em 1px 1em 25px;
	overflow: hidden;
	padding: 5px;
}

blockquote blockquote {
	/* Nested quotes */
	font-size: 1em;
	margin: 1em 1px 1em 15px;
}

blockquote cite {
	/* Username/source of quoter */
	font-style: normal;
	font-weight: bold;
	display: block;
	font-size: 0.9em;
}

blockquote cite cite {
	font-size: 1em;
}

blockquote cite:before, .uncited:before {
	padding-right: 5px;
}

blockquote cite > span {
	float: right;
	font-weight: normal;
}

.postbody .content li blockquote {
	overflow: inherit;
	margin-left: 0;
}

/* Code block */
.codebox {
	border: 1px solid transparent;
	font-size: 1em;
	margin: 1em 0 1.2em 0;
	word-wrap: normal;
}

.codebox p {
	text-transform: uppercase;
	border-bottom: 1px solid transparent;
	margin-bottom: 0;
	padding: 3px;
	font-size: 0.8em !important;
	font-weight: bold;
	display: block;
}

blockquote .codebox {
	margin-left: 0;
}

.codebox code {
	overflow: auto;
	display: block;
	height: auto;
	max-height: 200px;
	padding: 5px 3px;
	font: 0.9em Monaco, "Andale Mono","Courier New", Courier, monospace;
	line-height: 1.3em;
}

/* Attachments
----------------------------------------*/
.attachbox {
	font-size: 13px;
	float: left;
	width: auto;
	max-width: 100%;
	margin: 5px 5px 5px 0;
	padding: 6px;
	border: 1px dashed transparent;
	clear: left;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.attachbox dt {
	font-family: Arial, Helvetica, sans-serif;
	text-transform: uppercase;
}

.attachbox dd {
	margin-top: 4px;
	padding-top: 4px;
	clear: left;
	border-top: 1px solid transparent;
	overflow-x: auto;
	overflow-y: hidden;
}

.attachbox dd dd {
	border: none;
}

.attachbox p {
	line-height: 110%;
	font-weight: normal;
	clear: left;
}

.attachbox p.stats {
	line-height: 110%;
	font-weight: normal;
	clear: left;
}

.attach-image {
	margin: 3px 0;
	max-width: 100%;
}

.attach-image img {
	border: 1px solid transparent;
	cursor: default;
}

/* Inline image thumbnails */
div.inline-attachment dl.thumbnail, div.inline-attachment dl.file {
	display: block;
	margin-bottom: 4px;
}

div.inline-attachment p {
	font-size: 100%;
}

dl.file {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	display: block;
}

dl.file dt {
	text-transform: none;
	margin: 0;
	padding: 0;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

dl.file dd {
	margin: 0;
	padding: 0;
}

dl.thumbnail img {
	padding: 3px;
	border: 1px solid transparent;
	box-sizing: border-box;
}

dl.thumbnail dd {
	font-style: italic;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

.attachbox dl.thumbnail dd {
	font-size: 100%;
}

dl.thumbnail dt a:hover img {
	border: 1px solid transparent;
}

/* Post poll styles
----------------------------------------*/
fieldset.polls {
	font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
}

fieldset.polls dl {
	margin-top: 5px;
	border-top: 1px solid transparent;
	padding: 5px 0 0 0;
	line-height: 120%;
}

fieldset.polls dl.voted {
	font-weight: bold;
}

fieldset.polls dt {
	text-align: left;
	float: left;
	display: block;
	width: 30%;
	border-right: none;
	padding: 0;
	margin: 0;
	font-size: 1.1em;
}

fieldset.polls dd {
	float: left;
	width: 10%;
	border-left: none;
	padding: 0 5px;
	margin-left: 0;
	font-size: 1.1em;
}

fieldset.polls dd.resultbar {
	width: 50%;
}

fieldset.polls dd input {
	margin: 2px 0;
}

fieldset.polls dd div {
	text-align: right;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	padding: 2px 2px 0 2px;
	overflow: visible;
	min-width: 8px;
}

.pollbar1, .pollbar2, .pollbar3, .pollbar4, .pollbar5 {
	border-bottom: 1px solid transparent;
	border-right: 1px solid transparent;
}

.vote-submitted {
	font-size: 1.2em;
	font-weight: bold;
	text-align: center;
}

/* Poster profile block
----------------------------------------*/
.postprofile {
	margin: 5px 0 10px 0;
	min-height: 80px;
	border: 1px solid transparent;
	border-width: 0 0 0 1px;
	width: 22%;
	float: right;
	display: inline;
}

.postprofile dd, .postprofile dt {
	line-height: 1.2em;
	margin-left: 8px;
}

.postprofile dd {
	overflow: hidden;
	text-overflow: ellipsis;
}

.postprofile strong {
	font-weight: normal;
}

.postprofile dt.no-profile-rank, .postprofile dd.profile-rank, .postprofile .search-result-date {
	margin-bottom: 10px;
}

.profile-rank img {
	max-width: 160px;
}

/* Post-profile avatars */
.postprofile .has-avatar .avatar-container {
	margin-bottom: 3px;
	overflow: hidden;
}

.postprofile .avatar {
	display: block;
	float: left;
	max-width: 100%;
}

.postprofile .avatar img {
	display: block;
	height: auto !important;
	max-width: 100%;
}

.postprofile .profile-posts a {
	font-weight: normal;
}

dd.profile-warnings {
	font-weight: bold;
}

dd.profile-contact {
	overflow: visible;
}

.profile-contact .dropdown-container {
	display: inline-block;
}

.profile-contact .icon_contact {
	vertical-align: middle;
}

.profile-contact .dropdown {
	margin-right: -14px;
}

.online {
	background-image: none;
	background-position: 100% 0;
	background-repeat: no-repeat;
}

/* Poster profile used by search*/
.search .postprofile {
	width: 30%;
}

/* Profile used on view-profile */
.profile-avatar img {
	max-width: 100%;
}

/* pm list in compose message if mass pm is enabled */
dl.pmlist dt {
	width: 60% !important;
}

dl.pmlist dt textarea {
	width: 95%;
}

dl.pmlist dd {
	margin-left: 61% !important;
	margin-bottom: 2px;
}

.action-bar div.dl_links {
	padding: 10px 0 0 10px;
}

div.dl_links {
	display: inline-block;
	text-transform: none;
}

.dl_links strong {
	font-weight: bold;
}

.dl_links ul {
	list-style-type: none;
	margin: 0;
	display: inline-block;
}

.dl_links li {
	display: inline-block;
}

.attachment-filename {
	width: 100%;
}

.ellipsis-text {
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

table.fixed-width-table {
	table-layout: fixed;
}

/* Show scrollbars for items with overflow on iOS devices
----------------------------------------*/
.postbody .content::-webkit-scrollbar, .topicreview::-webkit-scrollbar, .post_details::-webkit-scrollbar, .codebox code::-webkit-scrollbar, .attachbox dd::-webkit-scrollbar, .attach-image::-webkit-scrollbar, .dropdown-extended ul::-webkit-scrollbar {
	width: 8px;
	height: 8px;
	-webkit-appearance: none;
	background: rgba(0, 0, 0, .1);
	border-radius: 3px;
}

.postbody .content::-webkit-scrollbar-thumb, .topicreview::-webkit-scrollbar-thumb, .post_details::-webkit-scrollbar-thumb, .codebox code::-webkit-scrollbar-thumb, .attachbox dd::-webkit-scrollbar-thumb, .attach-image::-webkit-scrollbar-thumb, .dropdown-extended ul::-webkit-scrollbar-thumb {
	background: rgba(0, 0, 0, .3);
	border-radius: 3px;
}

#memberlist tr.inactive, #team tr.inactive {
	font-style: italic;
}

/* Memberlist
----------------------------------------*/
.group-description {
	font-size: 1.3em;
}

.group-description ol, .group-description ul {
	list-style-position: inside;
}


/* prosilver/buttons.css */
/* Button Styles
---------------------------------------- */

.button {
	display: inline-block;
	padding: 2px 8px;
	font-size: 13px;
	font-weight: 600;
	font-family: "Open Sans", "Droid Sans", Verdana, Arial, Helvetica;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	    touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	border: 1px solid transparent;
	border-radius: 4px;
}

.button:focus,
.button:hover {
 	text-decoration: none;
 	outline: none;
}

.caret {
	border-left: 1px solid;
	position: relative;
	right: -6px;
}

.caret i {
	vertical-align: top;
}

/* Posting page styles
----------------------------------------*/
.button-search,
.button-search-end  {
	float: left;
	border-radius: 0;
	margin: 0;
	padding: 2px 5px;
}

.button-search-end {
	border-left-width: 0;
	border-radius: 0 4px 4px 0;
}

.search-header .button-search,
.search-header .button-search-end {
	border-top-width: 0;
	border-bottom-width: 0;
	padding: 3px 5px;
}

.search-header .button-search-end {
	border-right-width: 0;
}

.button-icon-only {
	padding-left: 3px;
	padding-right: 3px;
}

/* Poster contact icons
----------------------------------------*/
.contact-icons.dropdown-contents {
	min-width: 0;
	padding: 0;
	font-size: 0;
}

.contact-icon {
	background-repeat: no-repeat;
	display: block;
	height: 16px;
	width: 16px;
}
.contact-icons a {
	border-bottom: 1px dotted;
	border-right: 1px dotted;
	display: block;
	float: left;
	padding: 8px;
}

.contact-icons .last-cell {
	border-right: none;
}

.contact-icons div:last-child a {
	border-bottom: none;
}

.contact-icons div {
	clear: left;
}

/* Post control buttons
--------------------------------------------- */
.post-buttons {
	float: right;
	list-style: none;
	margin-top: 2px;
}

.has-profile .post-buttons {
	float: none;
	position: absolute;
	margin: 0;
	right: 0;
	top: 5px;
}

.post-buttons > li {
	float: left;
	margin-right: 3px;
}

.post-buttons .button, .format-buttons .button {
	padding-left: 3px;
	padding-right: 3px;
}

.hastouch .post-buttons {
	margin-right: 10px;
}

.post-buttons .button span {
	font-size: 0;
}

/* Responsive buttons in post body */
.post-buttons .dropdown {
	top: 18px;
}

.post-buttons .dropdown a {
	display: block;
	font-size: 1.2em;
	text-align: right;
}

.hasjs .postbody .post-buttons {
	max-width: 40%;
}

/* Browser-specific tweaks */
button::-moz-focus-inner {
	padding: 0;
	border: 0;
}

/* Deprecated as of version 3.2
-------------------------------------------------*/
.small-icon {
	background-position: 0 50%;
	background-repeat: no-repeat;
	background-image: none;
}

.dropdown .small-icon {
	background-position: 5px 50%;
	padding: 5px;
}

.small-icon > a {
	padding: 0 0 0 18px;
}

ul.linklist.bulletin > li.small-icon:before {
	display: none;
}

.dropdown .small-icon > a {
	display: block;
}

.rtl .small-icon {
	background-position: 100% 50%;
}

.rtl .small-icon > a {
	padding-left: 0;
	padding-right: 19px;
}


/* prosilver/cp.css */
/* Control Panel Styles
---------------------------------------- */


/* Main CP box
----------------------------------------*/
.cp-menu {
	float: left;
	width: 19%;
	margin-top: 1em;
	margin-bottom: 5px;
}

.cp-main {
	float: left;
	width: 81%;
}

.cp-main .content {
	padding: 0;
}

.panel-container .panel p {
	font-size: 1.1em;
}

.panel-container .panel ol {
	margin-left: 2em;
	font-size: 1.1em;
}

.panel-container .panel li.row {
	border-bottom: 1px solid transparent;
	border-top: 1px solid transparent;
}

ul.cplist {
	margin-bottom: 5px;
	border-top: 1px solid transparent;
}

.panel-container .panel li.header dd, .panel-container .panel li.header dt {
	margin-bottom: 2px;
}

.panel-container table.table1 {
	margin-bottom: 1em;
}

.panel-container table.table1 thead th {
	font-weight: bold;
	border-bottom: 1px solid transparent;
	padding: 5px;
}

.panel-container table.table1 tbody th {
	font-style: italic;
	background-color: transparent !important;
	border-bottom: none;
}

.cp-main .pm-message {
	border: 1px solid transparent;
	margin: 10px 0;
	width: auto;
	float: none;
}

.pm-message h2 {
	padding-bottom: 5px;
}

.cp-main .postbody h3, .cp-main .box2 h3 {
	margin-top: 0;
}

.panel-container .postbody p.author {
	font-size: 1.1em;
}

.cp-main .buttons {
	margin-left: 0;
}

.cp-main ul.linklist {
	margin: 0;
}

/* MCP Specific tweaks */
.mcp-main .postbody {
	width: 100%;
}

.tabs-container h2 {
	float: left;
	margin-bottom: 0px;
}

/* CP tabs shared
----------------------------------------*/
.tabs, .minitabs {
	line-height: normal;
}

.tabs > ul, .minitabs > ul {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

.tabs .tab, .minitabs .tab {
	display: block;
	float: left;
	font-size: 1em;
	font-weight: bold;
	line-height: 1.4em;
}

.tabs .tab > a, .minitabs .tab > a {
	display: block;
	padding: 5px 9px;
	position: relative;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
}

/* CP tabbed menu
----------------------------------------*/
.tabs {
	margin: 20px 0 0 7px;
}

.tabs .tab > a {
	border: 1px solid transparent;
	border-radius: 4px 4px 0 0;
	margin: 1px 1px 0 0;
}

.tabs .activetab > a {
	margin-top: 0;
	padding-bottom: 7px;
}

/* Mini tabbed menu used in MCP
----------------------------------------*/
.minitabs {
	float: right;
	margin: 15px 7px 0 0;
	max-width: 50%;
}

.minitabs .tab {
	float: right;
}

.minitabs .tab > a {
	border-radius: 5px 5px 0 0;
	margin-left: 2px;
}

.minitabs .tab > a:hover {
	text-decoration: none;
}

/* Responsive tabs
----------------------------------------*/
.responsive-tab {
	position: relative;
}

.responsive-tab > a.responsive-tab-link {
	display: block;
	font-size: 1.6em;
	position: relative;
	width: 16px;
	line-height: 0.9em;
	text-decoration: none;
}

.responsive-tab .responsive-tab-link:before {
	content: '';
	position: absolute;
	left: 10px;
	top: 7px;
	height: .125em;
	width: 14px;
	border-bottom: 0.125em solid transparent;
	border-top: 0.375em double transparent;
}

.tabs .dropdown, .minitabs .dropdown {
	top: 20px;
	margin-right: -2px;
	font-size: 1.1em;
	font-weight: normal;
}

.minitabs .dropdown {
	margin-right: -4px;
}

.tabs .dropdown-up .dropdown, .minitabs .dropdown-up .dropdown {
	bottom: 20px;
	top: auto;
}

.tabs .dropdown li {
	text-align: right;
}

.minitabs .dropdown li {
	text-align: left;
}

/* UCP navigation menu
----------------------------------------*/
/* Container for sub-navigation list */
.navigation {
	width: 100%;
	padding-top: 36px;
}

.navigation ul {
	list-style: none;
}

/* Default list state */
.navigation li {
	display: inline;
	font-weight: bold;
	margin: 1px 0;
	padding: 0;
}

/* Link styles for the sub-section links */
.navigation a {
	display: block;
	padding: 5px;
	margin: 1px 0;
	text-decoration: none;
}

.navigation a:hover {
	text-decoration: none;
}

/* Preferences pane layout
----------------------------------------*/
.cp-main h2 {
	border-bottom: none;
	padding: 0;
	margin-left: 10px;
}

/* Friends list */
.cp-mini {
	margin: 10px 15px 10px 5px;
	max-height: 200px;
	overflow-y: auto;
	padding: 5px 10px;
	border-radius: 7px;
}

dl.mini dt {
	font-weight: bold;
}

dl.mini dd {
	padding-top: 4px;
}

.friend-online {
	font-weight: bold;
}

.friend-offline {
	font-style: italic;
}

/* PM Styles
----------------------------------------*/
/* Defined rules list for PM options */
ol.def-rules {
	padding-left: 0;
}

ol.def-rules li {
	line-height: 180%;
	padding: 1px;
}

/* PM marking colours */
.pmlist li.bg1 {
	padding: 0 3px;
}

.pmlist li.bg2 {
	padding: 0 3px;
}

.pmlist li.pm_message_reported_colour, .pm_message_reported_colour,
.pmlist li.pm_marked_colour, .pm_marked_colour,
.pmlist li.pm_replied_colour, .pm_replied_colour,
.pmlist li.pm_friend_colour, .pm_friend_colour,
.pmlist li.pm_foe_colour, .pm_foe_colour {
	padding: 0;
	border: solid 3px transparent;
	border-width: 0 3px;
}

.pm-legend {
	border-left-width: 10px;
	border-left-style: solid;
	border-right-width: 0;
	margin-bottom: 3px;
	padding-left: 3px;
}

/* Avatar gallery */
.gallery label {
	position: relative;
	float: left;
	margin: 10px;
	padding: 5px;
	width: auto;
	border: 1px solid transparent;
	text-align: center;
}

/* Responsive *CP navigation
----------------------------------------*/
@media only screen and (max-width: 900px), only screen and (max-device-width: 900px)
{
	.nojs .tabs a span, .nojs .minitabs a span {
		max-width: 40px;
		overflow: hidden;
		text-overflow: ellipsis;
		letter-spacing: -.5px;
	}

	.cp-menu, .navigation, .cp-main {
		float: none;
		width: auto;
		margin: 0;
	}

	.navigation {
		padding: 0;
		margin: 0 auto;
		max-width: 320px;
	}

	.navigation a {
		background-image: none;
	}

	.navigation li:first-child a {
		border-top-left-radius: 5px;
		border-top-right-radius: 5px;
	}

	.navigation li:last-child a {
		border-bottom-left-radius: 5px;
		border-bottom-right-radius: 5px;
	}
}


/* prosilver/forms.css */
/* Form Styles
---------------------------------------- */

/* General form styles
----------------------------------------*/
fieldset {
	border-width: 0;
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 1.1em;
}

input {
	font-weight: normal;
	vertical-align: middle;
	padding: 0 3px;
	font-size: 1em;
	font-family: Verdana, Helvetica, Arial, sans-serif;
}

select {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-weight: normal;
	cursor: pointer;
	vertical-align: middle;
	border: 1px solid transparent;
	padding: 1px;
	font-size: 1em;
}

select:focus {
	outline-style: none;
}

option {
	padding-right: 1em;
}

select optgroup option {
	padding-right: 1em;
	font-family: Verdana, Helvetica, Arial, sans-serif;
}

textarea {
	font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
	width: 60%;
	padding: 2px;
	font-size: 1em;
	line-height: 1.4em;
}

label {
	cursor: default;
	padding-right: 5px;
}

label input {
	vertical-align: middle;
}

label img {
	vertical-align: middle;
}

/* Definition list layout for forms
---------------------------------------- */
fieldset dl {
	padding: 4px 0;
}

fieldset dt {
	float: left;
	width: 40%;
	text-align: left;
	display: block;
}

fieldset dd {
	margin-left: 41%;
	vertical-align: top;
	margin-bottom: 3px;
}

/* Specific layout 1 */
fieldset.fields1 dt {
	width: 15em;
	border-right-width: 0;
}

fieldset.fields1 dd {
	margin-left: 15em;
	border-left-width: 0;
}

fieldset.fields1 div {
	margin-bottom: 3px;
}

/* Set it back to 0px for the reCaptcha divs: PHPBB3-9587 */
fieldset.fields1 .live-search div {
	margin-bottom: 0;
}

/* Specific layout 2 */
fieldset.fields2 dt {
	width: 15em;
	border-right-width: 0;
}

fieldset.fields2 dd {
	margin-left: 16em;
	border-left-width: 0;
}

/* Form elements */
dt label {
	font-weight: bold;
	text-align: left;
}

dd label {
	white-space: nowrap;
}

dd input, dd textarea {
	margin-right: 3px;
}

dd select {
	width: auto;
}

dd select[multiple] {
	width: 100%;
}

dd textarea {
	width: 85%;
}

/* Hover effects */
.timezone {
	width: 95%;
}

/* Browser-specific tweaks */
button::-moz-focus-inner {
	padding: 0;
	border: 0;
}

/* Quick-login on index page */
fieldset.quick-login {
	margin-top: 5px;
}

fieldset.quick-login input {
	width: auto;
}

fieldset.quick-login input.inputbox {
	width: 15%;
	vertical-align: middle;
	margin-right: 5px;
}

fieldset.quick-login label {
	white-space: nowrap;
	padding-right: 2px;
}

/* Display options on viewtopic/viewforum pages  */
fieldset.display-options {
	text-align: center;
	margin: 3px 0 5px 0;
}

fieldset.display-options label {
	white-space: nowrap;
	padding-right: 2px;
}

fieldset.display-options a {
	margin-top: 3px;
}

.dropdown fieldset.display-options {
	font-size: 1em;
	margin: 0;
	padding: 0;
}

.dropdown fieldset.display-options label {
	display: block;
	margin: 4px;
	padding: 0;
	text-align: right;
	white-space: nowrap;
}

.dropdown fieldset.display-options select {
	min-width: 120px;
}

/* Display actions for ucp and mcp pages */
fieldset.display-actions {
	text-align: right;
	line-height: 2em;
	white-space: nowrap;
	padding-right: 1em;
}

fieldset.display-actions label {
	white-space: nowrap;
	padding-right: 2px;
}

fieldset.sort-options {
	line-height: 2em;
}

/* MCP forum selection*/
fieldset.forum-selection {
	margin: 5px 0 3px 0;
	float: right;
}

fieldset.forum-selection2 {
	margin: 13px 0 3px 0;
	float: right;
}

/* Submit button fieldset */
fieldset.submit-buttons {
	text-align: center;
	vertical-align: middle;
	margin: 5px 0;
}

fieldset.submit-buttons input {
	vertical-align: middle;
}

/* Posting page styles
----------------------------------------*/

/* Buttons used in the editor */
.format-buttons {
	margin: 15px 0 2px 0;
}

.format-buttons input, .format-buttons select {
	vertical-align: middle;
}

/* Main message box */
.message-box {
	width: 80%;
}

.message-box textarea {
	font-family: "Trebuchet MS", Verdana, Helvetica, Arial, sans-serif;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 450px;
	height: 270px;
	min-width: 100%;
	max-width: 100%;
	font-size: 1.2em;
	resize: vertical;
	outline: 3px dashed transparent;
	outline-offset: -4px;
	-webkit-transition: all .5s ease, height 1ms linear;
	-moz-transition: all .5s ease, height 1ms linear;
	-ms-transition: all .5s ease, height 1ms linear;
	-o-transition: all .5s ease, height 1ms linear;
	transition: all .5s ease, height 1ms linear;
}

/* Emoticons panel */
.smiley-box {
	width: 18%;
	float: right;
}

.smiley-box img {
	margin: 3px;
}

/* Input field styles
---------------------------------------- */
.inputbox {
	border: 1px solid transparent;
	padding: 2px;
}

.inputbox:hover, .inputbox:focus {
	border: 1px solid transparent;
	outline-style: none;
}

input.inputbox	{ width: 85%; }
input.medium	{ width: 50%; }
input.narrow	{ width: 25%; }
input.tiny	{ width: 150px; }

textarea.inputbox {
	width: 85%;
}

.autowidth {
	width: auto !important;
}

input[type="number"] {
	-moz-padding-end: 0;
}

input[type="search"] {
	-webkit-appearance: textfield;
	-webkit-box-sizing: content-box;
}

input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-results-button, input[type="search"]::-webkit-search-results-decoration {
	display: none;
}

input[type="search"]::-webkit-search-cancel-button {
	cursor: pointer;
}

/* Form button styles
---------------------------------------- */
input.button1, input.button2 {
	font-size: 1em;
}

a.button1, input.button1, input.button3, a.button2, input.button2 {
	width: auto !important;
	padding-top: 1px;
	padding-bottom: 1px;
	font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
	background: transparent none repeat-x top left;
	line-height: 1.5;
}

a.button1, input.button1 {
	font-weight: bold;
	border: 1px solid transparent;
}

input.button3 {
	padding: 0;
	margin: 0;
	line-height: 5px;
	height: 12px;
	background-image: none;
	font-variant: small-caps;
}

input[type="button"], input[type="submit"], input[type="reset"], input[type="checkbox"], input[type="radio"], .search-results li {
	cursor: pointer;
}

/* Alternative button */
a.button2, input.button2, input.button3 {
	border: 1px solid transparent;
}

/* <a> button in the style of the form buttons */
a.button1, a.button2 {
	text-decoration: none;
	padding: 0 3px;
	vertical-align: text-bottom;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	border: 1px solid transparent;
}

input.disabled {
	font-weight: normal;
}

/* Focus states */
input.button1:focus, input.button2:focus, input.button3:focus {
	outline-style: none;
}

/* Topic and forum Search */
.search-box {
	float: left;
}

.search-box .inputbox {
	background-image: none;
	border-right-width: 0;
	border-radius: 4px 0 0 4px;
	float: left;
	height: 24px;
	padding: 3px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

/* Search box (header)
--------------------------------------------- */
.search-header {
	border-radius: 4px;
	display: block;
	float: right;
	margin-right: 5px;
	margin-top: 30px;
}

.search-header .inputbox { border: 0; }

.navbar .linklist > li.responsive-search { display: none; }

input.search {
	background-image: none;
	background-repeat: no-repeat;
	background-position: left 1px;
	padding-left: 17px;
}

.full { width: 95%; }
.medium { width: 50%; }
.narrow { width: 25%; }
.tiny { width: 10%; }


/* prosilver/icons.css */
/* --------------------------------------------------------------
	$Icons
-------------------------------------------------------------- */

/* Global module setup
--------------------------------*/

/* Renamed version of .fa class for agnostic usage of icon fonts.
 * Just change the name of the font after the 14/1 to the name of
 * the font you wish to use.
 */
.icon, .button .icon, blockquote cite:before, .uncited:before {
	display: inline-block;
  	font-family: FontAwesome;
  	font-weight: normal;
  	font-style: normal;
  	font-variant: normal;
  	font-size: 14px;
  	line-height: 1;
  	text-rendering: auto; /* optimizelegibility throws things off #1094 */
  	-webkit-font-smoothing: antialiased;
  	-moz-osx-font-smoothing: grayscale;
}

.icon:before { padding-right: 2px; }

.button .icon:before {
	padding-right: 0;
}

/* Icon size classes - Default size is 14px, use these for small variations */

.icon.icon-xl {
	font-size: 20px;
}

.icon.icon-lg {
	font-size: 16px;
}

.icon.icon-md {
	font-size: 10px;
}

.icon.icon-sm {
	font-size: 8px;
}

/* icon modifiers */
.icon-tiny {
	width: 12px;
	transform: scale(0.65, 0.75);
	vertical-align: text-bottom;
	font-size: 16px;
}

.arrow-left .icon {
	float: left;
}

.arrow-left:hover .icon {
	margin-left: -5px;
	margin-right: 5px;
}

.arrow-right .icon {
	float: right;
}

.arrow-right:hover .icon {
	margin-left: 5px;
	margin-right: -5px;
}

.post-buttons .dropdown-contents .icon {
	float: right;
	margin-left: 5px;
}

.alert_close .icon:before {
	padding: 0;
	border-radius: 50%;
	width: 11px;
	display: block;
	line-height: .9;
	height: 12px;
}

blockquote cite:before, .uncited:before {
	content: '\f10d'; /* Font Awesome quote-left */
}

.rtl blockquote cite:before, .rtl .uncited:before {
	content: '\f10e'; /* Font Awesome quote-right */
}



/* prosilver/colours.css */
/*
--------------------------------------------------------------
Colours and backgrounds for common.css
-------------------------------------------------------------- */

html, body {
	color: #536482;
	background-color: #F5F7FA;
}

h1 {
	color: #FFFFFF;
}

h2 {
	color: #28313F;
}

h3 {
	border-bottom-color: #CCCCCC;
	color: #115098;
}

hr {
	border-color: #FFFFFF;
	border-top-color: #CCCCCC;
}

/*
--------------------------------------------------------------
Colours and backgrounds for links.css
-------------------------------------------------------------- */

a { color: #105289; }
a:hover { color: #D31141; }

/* Links on gradient backgrounds */
.forumbg .header a, .forabg .header a, th a {
	color: #FFFFFF;
}

.forumbg .header a:hover, .forabg .header a:hover, th a:hover {
	color: #A8D8FF;
}

/* Notification mark read link */
.dropdown-extended a.mark_read {
	background-color: #FFFFFF;
}

/* Post body links */
.postlink {
	border-bottom-color: #368AD2;
	color: #368AD2;
}

.postlink:visited {
	border-bottom-color: #5D8FBD;
	color: #5D8FBD;
}

.postlink:hover {
	background-color: #D0E4F6;
	color: #0D4473;
}

.signature a, .signature a:hover {
	background-color: transparent;
}

/* Back to top of page */
.top i {
	color: #999999;
}

/* Arrow links  */
.arrow-left:hover, .arrow-right:hover {
	color: #368AD2;
}

/* Round cornered boxes and backgrounds
---------------------------------------- */
.wrap {
	background-color: #FFF;
	border-color: #E6E9ED;
}

.headerbar {
	color: #FFFFFF;
}

.headerbar, .forumbg {
	background-color: #12A3EB;
	background-image: -webkit-linear-gradient(top, #6ACEFF 0%, #0076B1 2px, #12A3EB 92px, #12A3EB 100%);
	background-image: linear-gradient(to bottom, #6ACEFF 0%,#0076B1 2px,#12A3EB 92px,#12A3EB 100%);
	background-repeat: repeat-x;
}

.forabg {
	background-color: #0076B1;
	background-image: -webkit-linear-gradient(top, #6ACEFF 0%, #12A3EB 2px, #0076B1 92px, #0076B1 100%);
	background-image: linear-gradient(to bottom, #6ACEFF 0%,#12A3EB 2px,#0076B1 92px,#0076B1 100%);
	background-repeat: repeat-x;
}

.navbar {
	background-color: #CADCEB;
}

.panel {
	background-color: #ECF1F3;
	color: #28313F;
}

.post:target .content {
	color: #000000;
}

.post h3 a.first-unread,
.post:target h3 a {
	color: #000000;
}

.bg1 {
	background-color: #ECF3F7;
}

table.zebra-list tr:nth-child(odd) td, ul.zebra-list li:nth-child(odd) {
	background-color: #ECF3F7;
}

.bg2 {
	background-color: #E1EBF2;
}

table.zebra-list tr:nth-child(even) td, ul.zebra-list li:nth-child(even) {
	background-color: #E1EBF2;
}

.bg3 {
	background-color: #CADCEB;
}

.ucprowbg {
	background-color: #DCDEE2;
}

.fieldsbg {
	background-color: #E7E8EA;
}

.site_logo {
	background-image: url("../../prosilver/theme/images/site_logo.svg");
}

/* Horizontal lists
----------------------------------------*/

ul.navlinks {
	border-top-color: #FFFFFF;
}

/* Table styles
----------------------------------------*/
table.table1 thead th {
	color: #FFFFFF;
}

table.table1 tbody tr {
	border-color: #BFC1CF;
}

table.table1 tbody tr:hover, table.table1 tbody tr.hover {
	background-color: #CFE1F6;
	color: #000;
}

table.table1 td {
	color: #536482;
}

table.table1 tbody td {
	border-top-color: #FAFAFA;
}

table.table1 tbody th {
	border-bottom-color: #000000;
	color: #333333;
	background-color: #FFFFFF;
}

table.info tbody th {
	color: #000000;
}

/* Misc layout styles
---------------------------------------- */
dl.details dt {
	color: #000000;
}

dl.details dd {
	color: #536482;
}

.sep {
	color: #1198D9;
}

/* Icon styles
---------------------------------------- */
.icon.icon-blue, a:hover .icon.icon-blue {
	color: #196db5;
}

.icon.icon-green, a:hover .icon.icon-green {
	color: #1b9A1B;
}

.icon.icon-red, a:hover .icon.icon-red {
	color: #BC2A4D;
}

.icon.icon-orange, a:hover .icon.icon-orange {
	color: #FF6600;
}

.icon.icon-bluegray, a:hover .icon.icon-bluegray {
	color: #536482;
}

.icon.icon-gray, a:hover .icon.icon-gray {
	color: #777777;
}

.icon.icon-lightgray, a:hover .icon.icon-lightgray {
	color: #999999;
}

.icon.icon-black, a:hover .icon.icon-black {
	color: #333333;
}

.alert_close .icon:before {
	background-color: #FFFFFF;
}

/* Jumpbox */
.jumpbox .dropdown li {
	border-top-color: #CCCCCC;
}

.jumpbox-cat-link {
	background-color: #0076b1;
	border-top-color: #0076B1;
	color: #FFFFFF;
}

.jumpbox-cat-link:hover {
	background-color: #12A3EB;
	border-top-color: #12A3EB;
	color: #FFFFFF;
}

.jumpbox-forum-link {
	background-color: #E1EBF2;
}

.jumpbox-forum-link:hover {
	background-color: #F6F4D0;
}

.jumpbox .dropdown .pointer-inner {
	border-color: #E1EBF2 transparent;
}

.jumpbox-sub-link {
	background-color: #E1EBF2;
}

.jumpbox-sub-link:hover {
	background-color: #F1F8FF;
}

/* Miscellaneous styles
---------------------------------------- */

.copyright {
	color: #555555;
}

.error {
	color: #BC2A4D;
}

.reported {
	background-color: #F7ECEF;
}

li.reported:hover {
	background-color: #ECD5D8 !important;
}
.sticky, .announce {
	/* you can add a background for stickies and announcements*/
}

div.rules {
	background-color: #ECD5D8;
	color: #BC2A4D;
}

p.post-notice {
	background-color: #ECD5D8;
	background-image: none;
}

/*
--------------------------------------------------------------
Colours and backgrounds for content.css
-------------------------------------------------------------- */

ul.forums {
	background-color: #EEF5F9; /* Old browsers */ /* FF3.6+ */
	background-image: -webkit-linear-gradient(top, #D2E0EB 0%, #EEF5F9 100%);
	background-image: linear-gradient(to bottom, #D2E0EB 0%,#EEF5F9 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2E0EB', endColorstr='#EEF5F9',GradientType=0 ); /* IE6-9 */
}

ul.topiclist li {
	color: #4C5D77;
}

ul.topiclist dd {
	border-left-color: #FFFFFF;
}

.rtl ul.topiclist dd {
	border-right-color: #FFFFFF;
	border-left-color: transparent;
}

li.row {
	border-top-color: #FFFFFF;
	border-bottom-color: #00608F;
}

li.row strong {
	color: #000000;
}

li.row:hover {
	background-color: #F6F4D0;
}

li.row:hover dd {
	border-left-color: #CCCCCC;
}

.rtl li.row:hover dd {
	border-right-color: #CCCCCC;
	border-left-color: transparent;
}

li.header dt, li.header dd {
	color: #FFFFFF;
}

/* Post body styles
----------------------------------------*/
.postbody {
	color: #333333;
}

/* Content container styles
----------------------------------------*/
.content {
	color: #333333;
}

.content h2, .panel h2 {
	color: #115098;
	border-bottom-color: #CCCCCC;
}

dl.faq dt {
	color: #333333;
}

.posthilit {
	background-color: #F3BFCC;
	color: #BC2A4D;
}

.announce, .unreadpost {
	/* Highlight the announcements & unread posts box */
}

/* Post signature */
.signature {
	border-top-color: #CCCCCC;
}

/* Post noticies */
.notice {
	border-top-color: #CCCCCC;
}

/* BB Code styles
----------------------------------------*/
/* Quote block */
blockquote {
	background-color: #EBEADD;
	border-color:#DBDBCE;
}

blockquote blockquote {
	/* Nested quotes */
	background-color: #EFEED9;
}

blockquote blockquote blockquote {
	/* Nested quotes */
	background-color: #EBEADD;
}

/* Code block */
.codebox {
	background-color: #FFFFFF;
	border-color: #C9D2D8;
}

.codebox p {
	border-bottom-color: #CCCCCC;
}

.codebox code {
	color: #2E8B57;
}

/* Attachments
----------------------------------------*/
.attachbox {
	background-color: #FFFFFF;
	border-color: #C9D2D8;
}

.pm-message .attachbox {
	background-color: #F2F3F3;
}

.attachbox dd {
	border-top-color: #C9D2D8;
}

.attachbox p {
	color: #666666;
}

.attachbox p.stats {
	color: #666666;
}

.attach-image img {
	border-color: #999999;
}

/* Inline image thumbnails */

dl.file dd {
	color: #666666;
}

dl.thumbnail img {
	border-color: #666666;
	background-color: #FFFFFF;
}

dl.thumbnail dd {
	color: #666666;
}

dl.thumbnail dt a:hover {
	background-color: #EEEEEE;
}

dl.thumbnail dt a:hover img {
	border-color: #368AD2;
}

/* Post poll styles
----------------------------------------*/

fieldset.polls dl {
	border-top-color: #DCDEE2;
	color: #666666;
}

fieldset.polls dl.voted {
	color: #000000;
}

fieldset.polls dd div {
	color: #FFFFFF;
}

.rtl .pollbar1, .rtl .pollbar2, .rtl .pollbar3, .rtl .pollbar4, .rtl .pollbar5 {
	border-right-color: transparent;
}

.pollbar1 {
	background-color: #AA2346;
	border-bottom-color: #74162C;
	border-right-color: #74162C;
}

.rtl .pollbar1 {
	border-left-color: #74162C;
}

.pollbar2 {
	background-color: #BE1E4A;
	border-bottom-color: #8C1C38;
	border-right-color: #8C1C38;
}

.rtl .pollbar2 {
	border-left-color: #8C1C38;
}

.pollbar3 {
	background-color: #D11A4E;
	border-bottom-color: #AA2346;
	border-right-color: #AA2346;
}

.rtl .pollbar3 {
	border-left-color: #AA2346;
}

.pollbar4 {
	background-color: #E41653;
	border-bottom-color: #BE1E4A;
	border-right-color: #BE1E4A;
}

.rtl .pollbar4 {
	border-left-color: #BE1E4A;
}

.pollbar5 {
	background-color: #F81157;
	border-bottom-color: #D11A4E;
	border-right-color: #D11A4E;
}

.rtl .pollbar5 {
	border-left-color: #D11A4E;
}

/* Poster profile block
----------------------------------------*/
.postprofile {
	color: #666666;
	border-color: #FFFFFF;
}

.pm .postprofile {
	border-color: #DDDDDD;
}

.postprofile strong {
	color: #000000;
}

.online {
	background-image: url("../../prosilver/theme/en/icon_user_online.gif");
}

dd.profile-warnings {
	color: #BC2A4D;
}

/*
--------------------------------------------------------------
Colours and backgrounds for buttons.css
-------------------------------------------------------------- */
.button {
	border-color: #C7C3BF;
	background-color: #E9E9E9; /* Old browsers */ /* FF3.6+ */
	background-image: -webkit-linear-gradient(top, #FFFFFF 0%, #E9E9E9 100%);
	background-image: linear-gradient(to bottom, #FFFFFF 0%,#E9E9E9 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#E9E9E9',GradientType=0 ); /* IE6-9 */
	box-shadow: 0 0 0 1px #FFFFFF inset;
	-webkit-box-shadow: 0 0 0 1px #FFFFFF inset;
	color: #D31141;
}

.button:hover,
.button:focus {
	border-color: #0A8ED0;
	background-color: #FFFFFF; /* Old browsers */ /* FF3.6+ */
	background-image: -webkit-linear-gradient(top, #E9E9E9 0%, #FFFFFF 100%);
	background-image: linear-gradient(to bottom, #E9E9E9 0%,#FFFFFF 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E9E9E9', endColorstr='#FFFFFF',GradientType=0 ); /* IE6-9 */
	text-shadow: 1px 1px 0 #FFFFFF, -1px -1px 0 #FFFFFF, -1px -1px 0 rgba(188, 42, 77, 0.2);
}

.button .icon,
.button-secondary {
	color: #8f8f8f;
}

.button-secondary:focus,
.button-secondary:hover,
.button:focus .icon,
.button:hover .icon {
	color: #0A8ED0;
}

.button-search:hover,
.button-search-end:hover {
	border-color: #C7C3BF;
}

.caret	{ border-color: #DADADA; }
.caret	{ border-color: #C7C3BF; }

.contact-icons a	{ border-color: #DCDCDC; }
.contact-icons a:hover	{ background-color: #F2F6F9; }

/* Pagination
---------------------------------------- */

.pagination li a {
	background: #ECEDEE;
	filter: none;
	border-color: #B4BAC0;
	box-shadow: none;
	-webkit-box-shadow: none;
	color: #5C758C;
}

.pagination li.ellipsis span {
	background: transparent;
	color: #000000;
}

.pagination li.active span {
	background: #4692BF;
	border-color: #4692BF;
	color: #FFFFFF;
}

.pagination li a:hover, .pagination li a:hover .icon, .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
	background: #368AD2;
	border-color: #368AD2;
	filter: none;
	color: #FFFFFF;
	text-shadow: none;
}

/* Search box
--------------------------------------------- */

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus {
	border-color: #C7C3BF;
}

.search-header {
	box-shadow: 0 0 10px #0075B0;
}

.search-results li:hover,
.search-results li.active {
	background-color: #CFE1F6;
}

/* Icon images
---------------------------------------- */

.contact-icon						{ background-image: url("../../prosilver/theme/images/icons_contact.png"); }

/* Profile & navigation icons */
.pm-icon						{ background-position: 0 0; }
.email-icon						{ background-position: -21px 0; }
.jabber-icon						{ background-position: -80px 0; }
.phpbb_icq-icon						{ background-position: -61px 0 ; }
.phpbb_wlm-icon						{ background-position: -182px 0; }
.phpbb_aol-icon						{ background-position: -244px 0; }
.phpbb_website-icon					{ background-position: -40px 0; }
.phpbb_youtube-icon					{ background-position: -98px 0; }
.phpbb_facebook-icon					{ background-position: -119px 0; }
.phpbb_skype-icon					{ background-position: -161px 0; }
.phpbb_twitter-icon					{ background-position: -202px 0; }
.phpbb_yahoo-icon					{ background-position: -224px 0; }

/* Forum icons & Topic icons */
.global_read						{ background-image: url("../../prosilver/theme/images/announce_read.gif"); }
.global_read_mine					{ background-image: url("../../prosilver/theme/images/announce_read_mine.gif"); }
.global_read_locked					{ background-image: url("../../prosilver/theme/images/announce_read_locked.gif"); }
.global_read_locked_mine				{ background-image: url("../../prosilver/theme/images/announce_read_locked_mine.gif"); }
.global_unread						{ background-image: url("../../prosilver/theme/images/announce_unread.gif"); }
.global_unread_mine					{ background-image: url("../../prosilver/theme/images/announce_unread_mine.gif"); }
.global_unread_locked					{ background-image: url("../../prosilver/theme/images/announce_unread_locked.gif"); }
.global_unread_locked_mine				{ background-image: url("../../prosilver/theme/images/announce_unread_locked_mine.gif"); }

.announce_read						{ background-image: url("../../prosilver/theme/images/announce_read.gif"); }
.announce_read_mine					{ background-image: url("../../prosilver/theme/images/announce_read_mine.gif"); }
.announce_read_locked					{ background-image: url("../../prosilver/theme/images/announce_read_locked.gif"); }
.announce_read_locked_mine				{ background-image: url("../../prosilver/theme/images/announce_read_locked_mine.gif"); }
.announce_unread					{ background-image: url("../../prosilver/theme/images/announce_unread.gif"); }
.announce_unread_mine					{ background-image: url("../../prosilver/theme/images/announce_unread_mine.gif"); }
.announce_unread_locked					{ background-image: url("../../prosilver/theme/images/announce_unread_locked.gif"); }
.announce_unread_locked_mine				{ background-image: url("../../prosilver/theme/images/announce_unread_locked_mine.gif"); }

.forum_link						{ background-image: url("../../prosilver/theme/images/forum_link.gif"); }
.forum_read						{ background-image: url("../../prosilver/theme/images/forum_read.gif"); }
.forum_read_locked					{ background-image: url("../../prosilver/theme/images/forum_read_locked.gif"); }
.forum_read_subforum					{ background-image: url("../../prosilver/theme/images/forum_read_subforum.gif"); }
.forum_unread						{ background-image: url("../../prosilver/theme/images/forum_unread.gif"); }
.forum_unread_locked					{ background-image: url("../../prosilver/theme/images/forum_unread_locked.gif"); }
.forum_unread_subforum					{ background-image: url("../../prosilver/theme/images/forum_unread_subforum.gif"); }

.sticky_read						{ background-image: url("../../prosilver/theme/images/sticky_read.gif"); }
.sticky_read_mine					{ background-image: url("../../prosilver/theme/images/sticky_read_mine.gif"); }
.sticky_read_locked					{ background-image: url("../../prosilver/theme/images/sticky_read_locked.gif"); }
.sticky_read_locked_mine				{ background-image: url("../../prosilver/theme/images/sticky_read_locked_mine.gif"); }
.sticky_unread						{ background-image: url("../../prosilver/theme/images/sticky_unread.gif"); }
.sticky_unread_mine					{ background-image: url("../../prosilver/theme/images/sticky_unread_mine.gif"); }
.sticky_unread_locked					{ background-image: url("../../prosilver/theme/images/sticky_unread_locked.gif"); }
.sticky_unread_locked_mine				{ background-image: url("../../prosilver/theme/images/sticky_unread_locked_mine.gif"); }

.topic_moved						{ background-image: url("../../prosilver/theme/images/topic_moved.gif"); }
.pm_read,
.topic_read						{ background-image: url("../../prosilver/theme/images/topic_read.gif"); }
.topic_read_mine					{ background-image: url("../../prosilver/theme/images/topic_read_mine.gif"); }
.topic_read_hot						{ background-image: url("../../prosilver/theme/images/topic_read_hot.gif"); }
.topic_read_hot_mine					{ background-image: url("../../prosilver/theme/images/topic_read_hot_mine.gif"); }
.topic_read_locked					{ background-image: url("../../prosilver/theme/images/topic_read_locked.gif"); }
.topic_read_locked_mine					{ background-image: url("../../prosilver/theme/images/topic_read_locked_mine.gif"); }
.pm_unread,
.topic_unread						{ background-image: url("../../prosilver/theme/images/topic_unread.gif"); }
.topic_unread_mine					{ background-image: url("../../prosilver/theme/images/topic_unread_mine.gif"); }
.topic_unread_hot					{ background-image: url("../../prosilver/theme/images/topic_unread_hot.gif"); }
.topic_unread_hot_mine					{ background-image: url("../../prosilver/theme/images/topic_unread_hot_mine.gif"); }
.topic_unread_locked					{ background-image: url("../../prosilver/theme/images/topic_unread_locked.gif"); }
.topic_unread_locked_mine				{ background-image: url("../../prosilver/theme/images/topic_unread_locked_mine.gif"); }


/*
--------------------------------------------------------------
Colours and backgrounds for cp.css
-------------------------------------------------------------- */

/* Main CP box
----------------------------------------*/

.panel-container h3, .panel-container hr, .cp-menu hr {
	border-color: #A4B3BF;
}

.panel-container .panel li.row {
	border-bottom-color: #B5C1CB;
	border-top-color: #F9F9F9;
}

ul.cplist {
	border-top-color: #B5C1CB;
}

.panel-container .panel li.header dd, .panel-container .panel li.header dt {
	color: #000000;
}

.panel-container table.table1 thead th {
	color: #333333;
	border-bottom-color: #333333;
}

.cp-main .pm-message {
	border-color: #DBDEE2;
	background-color: #FFFFFF;
}

/* CP tabbed menu
----------------------------------------*/
.tabs .tab > a {
	background: #BACCD9;
	color: #536482;
}

.tabs .tab > a:hover {
	background: #DDEDFB;
	color: #D31141;
}

.tabs .activetab > a,
.tabs .activetab > a:hover {
	background-color: #CADCEB; /* Old browsers */ /* FF3.6+ */
	background-image: -webkit-linear-gradient(top, #E2F2FF 0%, #CADCEB 100%);
	background-image: linear-gradient(to bottom, #E2F2FF 0%,#CADCEB 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E2F2FF', endColorstr='#CADCEB',GradientType=0 ); /* IE6-9 */
	border-color: #CADCEB;
	box-shadow: 0 1px 1px #F2F9FF inset;
	color: #333333;
}

.tabs .activetab > a:hover {
	color: #000000;
}

/* Mini tabbed menu used in MCP
----------------------------------------*/
.minitabs .tab > a {
	background-color: #E1EBF2;
}

.minitabs .activetab > a,
.minitabs .activetab > a:hover {
	background-color: #F9F9F9;
	color: #333333;
}

/* Responsive tabs
----------------------------------------*/
.responsive-tab .responsive-tab-link:before {
	border-color: #536482;
}

.responsive-tab .responsive-tab-link:hover:before {
	border-color: #D31141;
}

/* UCP navigation menu
----------------------------------------*/

/* Link styles for the sub-section links */
.navigation a {
	color: #333;
	background: #CADCEB; /* Old browsers */ /* FF3.6+ */
	background: -webkit-linear-gradient(left, #B4C4D1 50%, #CADCEB 100%);
	background: linear-gradient(to right, #B4C4D1 50%,#CADCEB 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#B4C4D1', endColorstr='#CADCEB',GradientType=1 ); /* IE6-9 */
}

.rtl .navigation a {
	background: #B4C4D1; /* Old browsers */ /* FF3.6+ */
	background: -webkit-linear-gradient(left, #CADCEB 50%, #B4C4D1 100%);
	background: linear-gradient(to right, #CADCEB 50%,#B4C4D1 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#CADCEB', endColorstr='#B4C4D1',GradientType=1 ); /* IE6-9 */
}

.navigation a:hover {
	background: #AABAC6;
	color: #BC2A4D;
	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}

.navigation .active-subsection a {
	background: #F9F9F9;
	color: #D31141;
	filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
}

.navigation .active-subsection a:hover {
	color: #D31141;
}

@media only screen and (max-width: 900px), only screen and (max-device-width: 900px)
{
	#navigation a, .rtl #navigation a {
		background: #B2C2CF;
	}
}

/* Preferences pane layout
----------------------------------------*/
.panel-container h2 {
	color: #333333;
}

.panel-container .panel {
	background-color: #F9F9F9;
}

.cp-main .pm {
	background-color: #FFFFFF;
}

/* Friends list */
.cp-mini {
	background-color: #EEF5F9;
}

dl.mini dt {
	color: #425067;
}

/* PM Styles
----------------------------------------*/
/* PM Message history */
.current {
	color: #000000 !important;
}

/* PM marking colours */
.pmlist li.pm_message_reported_colour, .pm_message_reported_colour {
	border-left-color: #BC2A4D;
	border-right-color: #BC2A4D;
}

.pmlist li.pm_marked_colour, .pm_marked_colour {
	border-color: #FF6600;
}

.pmlist li.pm_replied_colour, .pm_replied_colour {
	border-color: #A9B8C2;
}

.pmlist li.pm_friend_colour, .pm_friend_colour {
	border-color: #5D8FBD;
}

.pmlist li.pm_foe_colour, .pm_foe_colour {
	border-color: #000000;
}

/* Avatar gallery */
.gallery label {
	background: #FFFFFF;
	border-color: #CCC;
}

.gallery label:hover {
	background-color: #EEE;
}

/*
--------------------------------------------------------------
Colours and backgrounds for forms.css
-------------------------------------------------------------- */

/* General form styles
----------------------------------------*/
select {
	border-color: #666666;
	background-color: #FAFAFA;
	color: #000;
}

label {
	color: #425067;
}

option.disabled-option {
	color: graytext;
}

/* Definition list layout for forms
---------------------------------------- */
dd label {
	color: #333;
}

fieldset.fields1 {
	background-color: transparent;
}

/* Hover effects */
fieldset dl:hover dt label {
	color: #000000;
}

fieldset.fields2 dl:hover dt label {
	color: inherit;
}

/* Quick-login on index page */
fieldset.quick-login input.inputbox {
	background-color: #F2F3F3;
}

/* Posting page styles
----------------------------------------*/

.message-box textarea {
	color: #333333;
}

.message-box textarea.drag-n-drop {
	outline-color: rgba(102, 102, 102, 0.5);
}

.message-box textarea.drag-n-drop-highlight {
	outline-color: rgba(17, 163, 234, 0.5);
}

/* Input field styles
---------------------------------------- */
.inputbox {
	background-color: #FFFFFF;
	border-color: #B4BAC0;
	color: #333333;
}

.inputbox:-moz-placeholder {
	color: #333333;
}

.inputbox::-webkit-input-placeholder {
	color: #333333;
}

.inputbox:hover {
	border-color: #11A3EA;
}

.inputbox:focus {
	border-color: #11A3EA;
}

.inputbox:focus:-moz-placeholder {
	color: transparent;
}

.inputbox:focus::-webkit-input-placeholder {
	color: transparent;
}


/* Form button styles
---------------------------------------- */

a.button1, input.button1, input.button3, a.button2, input.button2 {
	color: #000;
	background-color: #EFEFEF; /* Old browsers */ /* FF3.6+ */
	background-image: -webkit-linear-gradient(top, #D2D2D2 0%, #EFEFEF 100%);
	background-image: linear-gradient(to bottom, #D2D2D2 0%,#EFEFEF 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#D2D2D2', endColorstr='#EFEFEF',GradientType=0 ); /* IE6-9 */
}

a.button1, input.button1 {
	border-color: #666666;
}

input.button3 {
	background-image: none;
}

/* Alternative button */
a.button2, input.button2, input.button3 {
	border-color: #666666;
}

/* <a> button in the style of the form buttons */
a.button1, a.button2 {
	color: #000000;
}

/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	border-color: #D31141;
	color: #D31141;
	background-color: #D2D2D2; /* Old browsers */ /* FF3.6+ */
	background-image: -webkit-linear-gradient(top, #EFEFEF 0%, #D2D2D2 100%);
	background-image: linear-gradient(to bottom, #EFEFEF 0%,#D2D2D2 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#EFEFEF', endColorstr='#D2D2D2',GradientType=0 ); /* IE6-9 */
}

/* Focus states */
input.button1:focus, input.button2:focus, input.button3:focus {
	border-color: #11A3EA;
	color: #0F4987;
}

input.disabled {
	color: #666666;
}

/* jQuery popups
---------------------------------------- */
.phpbb_alert {
	background-color: #FFFFFF;
	border-color: #999999;
}
.darken {
	background-color: #000000;
}

.loading_indicator {
	background-color: #000000;
	background-image: url("../../prosilver/theme/images/loading.gif");
}

.dropdown-extended ul li {
	border-top-color: #B9B9B9;
}

.dropdown-extended ul li:hover {
	background-color: #CFE1F6;
	color: #000000;
}

.dropdown-extended .header, .dropdown-extended .footer {
	border-color: #B9B9B9;
	color: #000000;
}

.dropdown-extended .footer {
	border-top-style: solid;
	border-top-width: 1px;
}

.dropdown-extended .header {
	background-color: #F1F8FF; /* Old browsers */ /* FF3.6+ */
	background-image: -webkit-linear-gradient(top, #F1F8FF 0%, #CADCEB 100%);
	background-image: linear-gradient(to bottom, #F1F8FF 0%,#CADCEB 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F1F8FF', endColorstr='#CADCEB',GradientType=0 ); /* IE6-9 */
}

.dropdown .pointer {
	border-color: #B9B9B9 transparent;
}

.dropdown .pointer-inner {
	border-color: #FFF transparent;
}

.dropdown-extended .pointer-inner {
	border-color: #F1F8FF transparent;
}

.dropdown .dropdown-contents {
	background: #fff;
	border-color: #B9B9B9;
	box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
}

.dropdown-up .dropdown-contents {
	box-shadow: 1px 0 5px rgba(0, 0, 0, 0.2);
}

.dropdown li, .dropdown li li {
	border-color: #DCDCDC;
}

.dropdown li.separator {
	border-color: #DCDCDC;
}

/* Notifications
---------------------------------------- */

.notification_list p.notification-time {
	color: #4C5D77;
}

li.notification-reported strong, li.notification-disapproved strong {
	color: #D31141;
}

.badge {
	background-color: #D31141;
	color: #ffffff;
}


/* prosilver/responsive.css */
/* Responsive Design
---------------------------------------- */

@media (max-width: 320px) {
	select, .inputbox {
		max-width: 240px;
	}
}

/* Notifications list
----------------------------------------*/
@media (max-width: 350px) {
	.dropdown-extended .dropdown-contents {
		width: auto;
	}
}

@media (max-width: 430px) {
	.action-bar .search-box .inputbox {
		width: 120px;
	}

	.section-viewtopic .search-box .inputbox {
		width: 57px;
	}
}

@media (max-width: 500px) {
	dd label {
		white-space: normal;
	}

	select, .inputbox {
		max-width: 260px;
	}

	.captcha-panel dd.captcha {
		margin-left: 0;
	}

	.captcha-panel dd.captcha-image img {
		width: 100%;
	}

	dl.details dt, dl.details dd {
		width: auto;
		float: none;
		text-align: left;
	}

	dl.details dd {
		margin-left: 20px;
	}

	p.responsive-center {
		float: none;
		text-align: center;
		margin-bottom: 5px;
	}

	.action-bar > div {
		margin-bottom: 5px;
 	}

	.action-bar > .pagination {
		float: none;
		clear: both;
		padding-bottom: 1px;
		text-align: center;
	}

	.action-bar > .pagination li.page-jump {
		margin: 0 2px;
	}

	p.jumpbox-return {
		display: none;
	}

	.display-options > label:nth-child(1) {
		display: block;
		margin-bottom: 5px;
	}

	.attach-controls {
		margin-top: 5px;
		width: 100%;
	}

	.quick-links .dropdown-trigger span {
		display: none;
	}
}

@media (max-width: 550px) {
	ul.topiclist.forums dt {
		margin-right: 0;
	}

	ul.topiclist.forums dt .list-inner {
		margin-right: 0;
	}

	ul.topiclist.forums dd.lastpost {
		display: none;
	}
}

@media (max-width: 700px) {
	.responsive-hide { display: none !important; }
	.responsive-show { display: block !important; }
	.responsive-show-inline { display: inline !important; }
	.responsive-show-inline-block { display: inline-block !important; }

	/* Content wrappers
	----------------------------------------*/
	html {
		height: auto;
	}

	body {
		padding: 0;
	}

	.wrap {
		border: none;
		border-radius: 0;
		margin: 0;
		min-width: 290px;
		padding: 0 5px;
	}

	/* Common block wrappers
	----------------------------------------*/
	.headerbar, .navbar, .forabg, .forumbg, .post, .panel {
		border-radius: 0;
		margin-left: -5px;
		margin-right: -5px;
	}

	.cp-main .forabg, .cp-main .forumbg, .cp-main .post, .cp-main .panel {
		border-radius: 7px;
	}

	/* Logo block
	----------------------------------------*/
	.site-description {
		float: none;
		width: auto;
		text-align: center;
	}

	.logo {
		/* change display value to inline-block to show logo */
		display: none;
		float: none;
		padding: 10px;
	}

	.site-description h1, .site-description p {
		text-align: inherit;
		float: none;
		margin: 5px;
		line-height: 1.2em;
		overflow: hidden;
		text-overflow: ellipsis;
	}

	.site-description p, .search-header {
		display: none;
	}

	/* Navigation
	----------------------------------------*/
	.headerbar + .navbar {
		margin-top: -5px;
	}

	/* Search
	----------------------------------------*/
	.responsive-search { display: block !important; }

	/* .topiclist lists
	----------------------------------------*/
	li.header dt {
		text-align: center;
		text-transform: none;
		line-height: 1em;
		font-size: 1.2em;
		padding-bottom: 4px;
	}

	ul.topiclist li.header dt, ul.topiclist li.header dt .list-inner {
		margin-right: 0 !important;
		padding-right: 0;
	}

	ul.topiclist li.header dd {
		display: none !important;
	}

	ul.topiclist dt, ul.topiclist dt .list-inner,
	ul.topiclist.missing-column dt, ul.topiclist.missing-column dt .list-inner,
	ul.topiclist.two-long-columns dt, ul.topiclist.two-long-columns dt .list-inner,
	ul.topiclist.two-columns dt, ul.topiclist.two-columns dt .list-inner {
		margin-right: 0;
	}

	ul.topiclist dt .list-inner.with-mark {
		padding-right: 34px;
	}

	ul.topiclist dt .list-inner {
		min-height: 28px;
	}

	ul.topiclist li.header dt .list-inner {
		min-height: 0;
	}

	ul.topiclist dd {
		display: none;
	}
	ul.topiclist dd.mark {
		display: block;
	}

	/* Forums and topics lists
	----------------------------------------*/
	ul.topiclist.forums dt {
		margin-right: -250px;
	}

	ul.topiclist dd.mark {
		display: block;
		position: absolute;
		right: 5px;
		top: 0;
		margin: 0;
		width: auto;
		min-width: 0;
		text-align: left;
	}

	ul.topiclist.forums dd.topics dfn, ul.topiclist.topics dd.posts dfn {
		position: relative;
		left: 0;
		width: auto;
		display: inline;
		font-weight: normal;
	}

	li.row .responsive-show strong {
		font-weight: bold;
		color: inherit;
	}

	ul.topiclist li.row dt a.subforum {
		vertical-align: bottom;
		overflow: hidden;
		text-overflow: ellipsis;
		max-width: 100px;
	}

	/* Pagination
	----------------------------------------*/
	.pagination > ul {
		margin: 5px 0 0;
	}

	.row .pagination .ellipsis + li {
		display: none !important;
	}

	/* Responsive tables
	----------------------------------------*/
	table.responsive, table.responsive tbody, table.responsive tr, table.responsive td {
		display: block;
	}

	table.responsive thead, table.responsive th {
		display: none;
	}

	table.responsive.show-header thead, table.responsive.show-header th:first-child {
		display: block;
		width: auto !important;
		text-align: left !important;
	}

	table.responsive.show-header th:first-child span.rank-img {
		display: none;
	}

	table.responsive tr {
		margin: 2px 0;
	}

	table.responsive td {
		width: auto !important;
		text-align: left !important;
		padding: 4px;
	}

	table.responsive td.empty {
		display: none !important;
	}

	table.responsive td > dfn {
		display: inline-block !important;
	}

	table.responsive td > dfn:after {
		content: ':';
		padding-right: 5px;
	}

	table.responsive span.rank-img {
		float: none;
		padding-right: 5px;
	}

	table.responsive.memberlist td:first-child input[type="checkbox"] {
		float: right;
	}

	/* Forms
	----------------------------------------*/
	fieldset dt, fieldset.fields1 dt, fieldset.fields2 dt {
		width: auto;
		float: none;
	}

	fieldset dd, fieldset.fields1 dd, fieldset.fields2 dd {
		margin-left: 0;
	}

	textarea, dd textarea, .message-box textarea {
		width: 100%;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
	}

	dl.pmlist dt {
		width: auto !important;
		margin-bottom: 5px;
	}

	dl.pmlist dd {
		display: inline-block;
		margin-left: 0 !important;
	}

	dl.pmlist dd:first-of-type {
		padding-left: 20px;
	}

	.smiley-box, .message-box {
		float: none;
		width: auto;
	}

	.smiley-box {
		margin-top: 5px;
	}

	.bbcode-status {
		display: none;
	}

	.colour-palette, .colour-palette tbody, .colour-palette tr {
		display: block;
	}

	.colour-palette td {
		display: inline-block;
		margin-right: 2px;
	}

	.horizontal-palette td:nth-child(2n), .vertical-palette tr:nth-child(2n) {
		display: none;
	}

	fieldset.quick-login label {
		display: block;
		margin-bottom: 5px;
		white-space: normal;
	}

	fieldset.quick-login label > span {
		display: inline-block;
		min-width: 100px;
	}

	fieldset.quick-login input.inputbox {
		width: 85%;
		max-width: 300px;
		margin-left: 20px;
	}

	fieldset.quick-login label[for="autologin"] {
		display: inline-block;
		text-align: right;
		min-width: 50%;
	}

	/* User profile
	----------------------------------------*/
	.column1, .column2, .left-box.profile-details {
		float: none;
		width: auto;
		clear: both;
	}

	.avatar-rank-container {
		max-width: 100%;
	}

	/* Polls
	----------------------------------------*/
	fieldset.polls dt {
		width: 90%;
	}

	fieldset.polls dd.resultbar {
		padding-left: 20px;
	}

	fieldset.polls dd.poll_option_percent {
		width: 20%;
	}

	fieldset.polls dd.resultbar, fieldset.polls dd.poll_option_percent {
		margin-top: 5px;
	}

	/* Post
	----------------------------------------*/
	.postbody {
		position: inherit;
	}

	.postprofile, .postbody, .search .postbody {
		display: block;
		width: auto;
		float: none;
		padding: 0;
		min-height: 0;
	}

	.post .postprofile {
		width: auto;
		border-width: 0 0 1px 0;
		padding-bottom: 5px;
		margin: 0 0 5px 0;
		min-height: 40px;
		overflow: hidden;
	}

	.postprofile dd {
		display: none;
	}

	.postprofile dt, .postprofile dd.profile-rank, .search .postprofile dd {
		display: block;
		margin: 0;
	}

	.postprofile .has-avatar .avatar-container {
		margin: 0;
		overflow: inherit;
	}

	.postprofile .avatar-container:after {
		clear: none;
	}

	.postprofile .avatar {
		margin-right: 5px;
	}

	.postprofile .avatar img {
		width: auto !important;
		height: auto !important;
		max-height: 32px;
	}

	.has-profile .postbody h3 {
		margin-left: 0 !important;
		margin-right: 0 !important;
	}

	.has-profile .post-buttons {
		right: 30px;
		top: 15px;
	}

	.online {
		background-size: 40px;
	}

	/* Misc stuff
	----------------------------------------*/
	h2 {
		margin-top: .5em;
	}

	p {
		margin-bottom: .5em;
		overflow: hidden;
	}

	p.rightside {
		margin-bottom: 0;
	}

	fieldset.display-options label {
		display: block;
		clear: both;
		margin-bottom: 5px;
	}

	dl.mini dd.pm-legend {
		float: left;
		min-width: 200px;
	}

	.topicreview {
		margin: 0 -5px;
		padding: 0 5px;
	}

	fieldset.display-actions {
		white-space: normal;
	}

	.phpbb_alert {
		width: auto;
		margin: 0 5px;
	}

	.attach-comment dfn {
		width: 100%;
	}
}

@media (min-width: 701px) {
	.postbody {
		width: calc(100% - 200px - 1px - 16px);
	}

	.postprofile {
		width: 200px;
	}
}

@media (min-width: 701px) and (max-width: 950px) {
	ul.topiclist dt {
		margin-right: -410px;
	}

	ul.topiclist dt .list-inner {
		margin-right: 410px;
	}

	dd.posts, dd.topics, dd.views {
		width: 80px;
	}
}


/* stelsm-light/tokens.css */
/* ==========================================================================
   STELSM-CLUB.RU — tokens.css  (ЕДИНЫЙ источник для stelsm-light и stelsm-dark)
   --------------------------------------------------------------------------
   Только токены. Никаких селекторов компонентов.
   Светлая палитра — на :root (и [data-theme="light"]);
   тёмная палитра  — на [data-theme="dark"].
   Файл ИДЕНТИЧЕН в обоих дочерних стилях (требование контракта).
   ========================================================================== */

/* --- Нецветовые токены: типографика, шкалы, сетка, движение, z-index ----- */
:root {
  /* Типографика */
  --font-sans: "Inter", "Segoe UI", "Roboto", Arial, sans-serif;
  --font-condensed: "Roboto Condensed", "Inter", "Segoe UI", Arial, sans-serif;
  --font-mono: "JetBrains Mono", Consolas, "Courier New", monospace;

  --text-xs: 12px;
  --text-sm: 13px;
  --text-base: 14px;
  --text-md: 16px;
  --text-lg: 18px;
  --text-xl: 22px;
  --text-2xl: 28px;
  --text-hero: clamp(44px, 4vw, 72px);

  --weight-regular: 400;
  --weight-medium: 500;
  --weight-semibold: 600;
  --weight-bold: 700;
  --weight-heavy: 800;

  --leading-tight: 1.15;
  --leading-snug: 1.3;
  --leading-normal: 1.5;
  --leading-relaxed: 1.6;

  --tracking-tight: -1px;
  --tracking-wide: 0.04em;
  --tracking-wider: 0.08em;

  /* Radius */
  --radius-xs: 6px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-pill: 999px;

  /* Spacing */
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;

  /* Layout */
  --container-max: 1440px;
  --container-gutter: 24px;
  --header-h: 68px;
  --header-h-mobile: 62px;
  --header-blur: 14px;
  --nav-link-h: 40px;
  --hero-h: 400px;
  --hero-h-mobile: 270px;
  --stats-h: 68px;
  --sidebar-w: 390px;
  --sidebar-w-compact: 330px;
  --reading-max: 960px;
  --mobile-page-max: 600px;
  --mobile-pad: 14px;
  --bottom-nav-h: 68px;
  --drawer-w: min(88vw, 360px);
  --touch-target: 44px;

  /* Движение */
  --dur-hover: 150ms;
  --dur-theme: 180ms;
  --dur-drawer: 260ms;
  --dur-sheet: 250ms;
  --ease-standard: cubic-bezier(0.2, 0, 0.2, 1);

  /* Z-index */
  --z-base: 1;
  --z-sticky: 50;
  --z-nav: 100;
  --z-drawer-backdrop: 200;
  --z-drawer: 210;
  --z-modal: 300;
  --z-toast: 400;

  /* Breakpoints (справочно) */
  --bp-desktop: 1280px;
  --bp-tablet: 1023px;
  --bp-mobile: 767px;
  --bp-mobile-compact: 479px;
}

/* ==========================================================================
   СВЕТЛАЯ ПАЛИТРА (theme-light.css прототипа)
   ========================================================================== */
:root,
[data-theme="light"] {
  color-scheme: light;

  --bg-page: #F7F3ED;
  --bg-surface: #FFFFFF;
  --bg-surface-soft: #FBF7F1;
  --bg-surface-muted: #F1ECE5;
  --bg-elevated: #FFFFFF;

  --text-primary: #181A1D;
  --text-secondary: #5D626A;
  --text-tertiary: #696F76;

  --border-default: #E5DED4;
  --border-soft: #EEE8E0;

  --accent: #FF5A0A;
  --accent-hover: #E94D00;
  --accent-active: #D64500;

  --accent-strong: #C94400;
  --accent-strong-hover: #B03C00;
  --accent-strong-active: #9E3600;
  --accent-text: #C24100;
  --accent-on-soft: #B83D00;

  --accent-soft: #FFF0E6;
  --accent-soft-hover: #FFE3D2;

  --icon-primary: #25282D;
  --icon-secondary: #737880;

  --success: #2E7D4E;
  --warning: #E59A17;
  --danger: #D94747;

  --shadow-sm:
    0 1px 2px rgba(31, 24, 18, .06),
    0 4px 10px rgba(31, 24, 18, .04);
  --shadow-md:
    0 8px 24px rgba(31, 24, 18, .10);

  --focus-ring:
    0 0 0 3px rgba(255, 90, 10, .22);

  --header-bg: rgba(255, 255, 255, .92);
  --header-border: var(--border-soft);

  --hero-overlay:
    linear-gradient(
      90deg,
      rgba(248, 242, 234, .90) 0%,
      rgba(248, 242, 234, .52) 34%,
      rgba(248, 242, 234, .03) 60%
    );
  --hero-text-shadow: none;

  --link-color: #3C566B;
  --link-hover: var(--accent-text);

  --selection-bg: rgba(255, 90, 10, .22);
  --placeholder: #696F76;

  --img-filter: contrast(1.02) saturate(.95);
  --skeleton: #EEE9E3;

  --quote-bg: #F5F0E9;
  --code-bg: #F2EEE8;

  --row-hover: #FFF8F3;
  --scrollbar-thumb: #D8CFC2;
  --scrollbar-track: #F1ECE5;

  --on-accent: #FFFFFF;
  --on-photo: #FFFFFF;
  --backdrop: rgba(0, 0, 0, .45);
  --promo-overlay: rgba(20, 15, 10, .25);
  --promo-text-shadow: 0 1px 10px rgba(0, 0, 0, .45);
}

/* ==========================================================================
   ТЁМНАЯ ПАЛИТРА (theme-dark.css прототипа)
   ========================================================================== */
[data-theme="dark"] {
  color-scheme: dark;

  --bg-page: #0D1217;
  --bg-surface: #131A20;
  --bg-surface-soft: #171F26;
  --bg-surface-muted: #1C252D;
  --bg-elevated: #202A33;

  --text-primary: #F2F4F6;
  --text-secondary: #AAB2BA;
  --text-tertiary: #828D96;

  --border-default: #2B353E;
  --border-soft: #222C34;

  --accent: #FF5A0A;
  --accent-hover: #FF6B20;
  --accent-active: #E94D00;

  --accent-strong: #C94400;
  --accent-strong-hover: #B03C00;
  --accent-strong-active: #9E3600;
  --accent-text: #FF5A0A;
  --accent-on-soft: #FF5A0A;

  --accent-soft: rgba(255, 90, 10, .15);
  --accent-soft-hover: rgba(255, 90, 10, .23);

  --icon-primary: #ECEFF2;
  --icon-secondary: #9099A2;

  --success: #55B77A;
  --warning: #EAA73C;
  --danger: #E25A5A;

  --shadow-sm:
    0 1px 2px rgba(0, 0, 0, .30),
    0 5px 12px rgba(0, 0, 0, .15);
  --shadow-md:
    0 12px 30px rgba(0, 0, 0, .35);

  --focus-ring:
    0 0 0 3px rgba(255, 90, 10, .30);

  --header-bg: rgba(13, 18, 23, .94);
  --header-border: var(--border-soft);

  --hero-overlay:
    linear-gradient(
      90deg,
      rgba(7, 12, 17, .92) 0%,
      rgba(7, 12, 17, .54) 38%,
      rgba(7, 12, 17, .12) 70%
    );
  --hero-text-shadow: 0 1px 8px rgba(0, 0, 0, .35);

  --link-color: #DCE3E8;
  --link-hover: var(--accent-text);

  --selection-bg: rgba(255, 90, 10, .35);
  --placeholder: #828D96;

  --img-filter: brightness(.82) contrast(1.05) saturate(.90);
  --skeleton: #202931;

  --quote-bg: #192129;
  --code-bg: #080C10;

  --row-hover: #1C252D;
  --scrollbar-thumb: #36424C;
  --scrollbar-track: #11171C;

  --on-accent: #FFFFFF;
  --on-photo: #FFFFFF;
  --backdrop: rgba(0, 0, 0, .45);
  --promo-overlay: rgba(0, 0, 0, .35);
  --promo-text-shadow: 0 1px 10px rgba(0, 0, 0, .45);

  /* B6 — dark-safe replacements for DB-driven group colours.
     The inline style phpBB prints (style="color: #AA0000") is re-mapped only
     on dark surfaces; every value below keeps WCAG AA (>= 4.5:1) against
     --bg-surface #131A20 / --bg-page #0D1217. */
  --username-safe-admin: #FF8A80;   /* replaces #AA0000 (2.26:1) -> ~7.9:1 */
  --username-safe-mod: #6FE3A0;     /* replaces #00AA00 -> ~11.2:1        */
  --username-safe-bot: #CDBFD4;     /* replaces #9E8DA7 -> ~10.2:1        */
  --username-safe-default: var(--accent-text); /* #FF5A0A -> ~5.7:1     */
}


/* stelsm-light/stelsm.css */
/* ==========================================================================
   STELSM-CLUB.RU — stelsm.css
   Переопределения компонентов prosilver через токены (var(--token)).
   Никаких физических hex/rgb — только токены из tokens.css.
   Загружается после prosilver-стилей, поэтому равная специфичность = наш wins.
   ========================================================================== */

/* ==========================================================================
   1. BASE
   ========================================================================== */
html {
  background-color: var(--bg-page);
  -webkit-text-size-adjust: 100%;
}

body {
  background-color: var(--bg-page);
  color: var(--text-primary);
  font-family: var(--font-sans);
  font-size: var(--text-base);
  line-height: var(--leading-normal);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  transition:
    background-color var(--dur-theme) ease,
    color var(--dur-theme) ease,
    border-color var(--dur-theme) ease;
}

a {
  color: var(--link-color);
}

a:hover {
  color: var(--link-hover);
}

::selection {
  background: var(--selection-bg);
}

:focus-visible {
  outline: 2px solid transparent;
  outline-offset: 2px;
  box-shadow: var(--focus-ring);
  border-radius: var(--radius-xs);
}

* {
  scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
}

hr {
  border-color: transparent;
  border-top-color: var(--border-soft);
}

h1, h2, h3, h4 {
  color: var(--text-primary);
}

h1 {
  font-family: var(--font-condensed);
  font-weight: var(--weight-heavy);
  letter-spacing: var(--tracking-tight);
}

h3 {
  border-bottom-color: var(--border-soft);
  color: var(--text-primary);
}

p {
  color: var(--text-primary);
}

/* ==========================================================================
   2. WRAP / HEADER
   ========================================================================== */
.wrap {
  background-color: transparent;
  border-color: transparent;
  border-radius: 0;
  max-width: var(--container-max);
  min-width: 0;
  padding: var(--space-4) var(--container-gutter);
}

/* The full-bleed hero uses 100vw, which includes the vertical scrollbar on
   desktop browsers. Clip only the few excess horizontal pixels without
   creating a new scroll container (sticky header remains functional). */
html { overflow-x: clip; }

.headerbar {
  position: relative;
  background-color: var(--bg-surface);
  background-image: none;
  color: var(--text-primary);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  margin-bottom: var(--space-3);
}

.headerbar .inner {
  display: flex;
  align-items: center;
  gap: var(--space-4);
}

.site-description {
  float: none;
  width: auto;
  flex: 1 1 auto;
  min-width: 0;
}

.site-description h1 {
  margin-right: 0;
  margin-top: 0;
  font-size: var(--text-2xl);
  color: var(--text-primary);
}

.site-description p {
  color: var(--text-secondary);
  font-size: var(--text-sm);
}

.logo {
  padding: 0 var(--space-3) 0 0;
}

.site_logo {
  width: 46px;
  height: 46px;
  background-image: none;
  background-color: var(--text-primary);
  -webkit-mask: url("./images/logo-mark.svg") center / contain no-repeat;
  mask: url("./images/logo-mark.svg") center / contain no-repeat;
}

/* --- Theme toggle (Lucide sun/moon inline) ------------------------------- */
.stelsm-theme-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  background-color: var(--bg-surface-soft);
  color: var(--icon-primary);
  cursor: pointer;
  transition:
    background-color var(--dur-hover) ease,
    color var(--dur-hover) ease,
    border-color var(--dur-hover) ease;
}

.stelsm-theme-toggle:hover {
  background-color: var(--bg-surface-muted);
  border-color: var(--accent);
  color: var(--accent-text);
}

.stelsm-theme-toggle svg {
  width: 20px;
  height: 20px;
}

.stelsm-theme-toggle .stelsm-theme-toggle__moon {
  display: none;
}

[data-theme="dark"] .stelsm-theme-toggle .stelsm-theme-toggle__sun {
  display: none;
}

[data-theme="dark"] .stelsm-theme-toggle .stelsm-theme-toggle__moon {
  display: block;
}

/* ==========================================================================
   3. NAVBAR / BREADCRUMBS / DROPDOWNS
   ========================================================================== */
.navbar {
  background-color: var(--bg-surface);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
}

.navbar ul.linklist > li {
  font-size: var(--text-base);
}

.navbar a {
  color: var(--text-secondary);
}

.navbar a:hover {
  color: var(--accent-text);
}

.nav-main a {
  color: var(--text-secondary);
}

.nav-main a:hover {
  color: var(--accent-text);
}

.breadcrumbs .crumb {
  font-weight: var(--weight-medium);
}

.breadcrumbs .crumb a {
  color: var(--text-secondary);
}

.breadcrumbs .crumb a:hover {
  color: var(--accent-text);
}

.breadcrumbs .crumb:before {
  color: var(--text-tertiary);
}

ul.navlinks {
  border-top-color: var(--border-soft);
}

.dropdown .dropdown-contents {
  background: var(--bg-elevated);
  border-color: var(--border-default);
  box-shadow: var(--shadow-md);
}

.dropdown li,
.dropdown li li,
.dropdown li.separator {
  border-color: var(--border-soft);
}

.dropdown .pointer {
  border-color: var(--border-default) transparent;
}

.dropdown .pointer-inner {
  border-color: var(--bg-elevated) transparent;
}

.dropdown-contents a {
  color: var(--text-primary);
}

.dropdown-contents a:hover {
  color: var(--accent-text);
}

.dropdown-extended ul li {
  border-top-color: var(--border-soft);
}

.dropdown-extended ul li:hover {
  background-color: var(--row-hover);
  color: var(--text-primary);
}

.dropdown-extended .header,
.dropdown-extended .footer {
  border-color: var(--border-soft);
  color: var(--text-primary);
}

.dropdown-extended .header {
  background-color: var(--bg-surface-soft);
  background-image: none;
  text-shadow: none;
}

.dropdown-extended .pointer-inner {
  border-color: var(--bg-surface-soft) transparent;
}

.notification_list p.notification-time {
  color: var(--text-tertiary);
}

.badge {
  background-color: var(--danger);
  color: var(--on-accent);
}

/* ==========================================================================
   4. FORUM / TOPIC LISTS
   ========================================================================== */
.forabg,
.forumbg {
  background-color: var(--bg-surface);
  background-image: none;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  margin-bottom: var(--space-3);
}

ul.forums {
  background-color: transparent;
  background-image: none;
  filter: none;
}

.forumbg .header a,
.forabg .header a,
th a {
  color: var(--text-primary);
}

.forumbg .header a:hover,
.forabg .header a:hover,
th a:hover {
  color: var(--accent-text);
}

li.header dt,
li.header dd {
  color: var(--text-tertiary);
}

ul.topiclist li {
  color: var(--text-primary);
}

ul.topiclist dd {
  border-left-color: var(--border-soft);
}

li.row {
  border-top-color: var(--border-soft);
  border-bottom-color: transparent;
}

li.row strong {
  color: var(--text-primary);
}

li.row:hover {
  background-color: var(--row-hover);
}

li.row:hover dd {
  border-left-color: var(--border-soft);
}

a.forumtitle,
a.topictitle,
a.lastsubject {
  color: var(--text-primary);
  font-family: var(--font-condensed);
  font-weight: var(--weight-semibold);
}

a.forumtitle:hover,
a.topictitle:hover,
a.lastsubject:hover {
  color: var(--accent-text);
}

.row-item a:hover {
  text-decoration: none;
}

.row-item .forumtitle:hover,
.row-item .topictitle:hover,
.row-item .lastsubject:hover,
.row-item .subforum:hover {
  text-decoration: underline;
}

dd.posts,
dd.topics,
dd.views,
dd.extra,
dd.mark,
dd.lastpost,
dd.redirect,
dd.moderation,
dd.time,
dd.info {
  color: var(--text-secondary);
}

/* ==========================================================================
   5. POSTS / CONTENT / BBCODE
   ========================================================================== */
.post {
  background-color: var(--bg-surface);
  background-image: none;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  padding: var(--space-4) var(--space-5);
  margin-bottom: var(--space-3);
}

[data-theme="dark"] .post {
  border-color: var(--border-default);
  box-shadow: none;
}

.post.bg1,
.post.bg2,
.post.online,
.post.reported {
  background-color: var(--bg-surface);
}

.post:target .content,
.post h3 a.first-unread,
.post:target h3 a {
  color: var(--text-primary);
}

.postbody {
  color: var(--text-primary);
}

.postbody h3,
.postbody h3.first {
  color: var(--text-primary);
  font-family: var(--font-condensed);
  font-size: var(--text-lg);
}

.postbody h3 a {
  color: var(--text-primary);
}

.postbody h3 a:hover {
  color: var(--accent-text);
}

.postbody .content {
  font-size: 15.5px;
  line-height: var(--leading-relaxed);
  color: var(--text-primary);
}

.content {
  color: var(--text-primary);
}

.content h2,
.panel h2 {
  color: var(--text-primary);
  border-bottom-color: var(--border-soft);
}

p.author {
  color: var(--text-tertiary);
}

p.author strong {
  color: var(--text-primary);
}

.postlink {
  color: var(--accent-text);
  border-bottom-color: var(--accent);
}

.postlink:visited {
  color: var(--accent-on-soft);
  border-bottom-color: var(--accent-on-soft);
}

.postlink:hover {
  background-color: var(--accent-soft);
  color: var(--accent-on-soft);
}

.posthilit {
  background-color: var(--accent-soft);
  color: var(--accent-on-soft);
}

.signature {
  border-top-color: var(--border-soft);
  color: var(--text-secondary);
}

.notice {
  border-top-color: var(--border-soft);
  color: var(--text-secondary);
}

blockquote {
  background-color: var(--quote-bg);
  border-color: var(--border-soft);
  border-left: 3px solid var(--accent);
  border-radius: 0 var(--radius-sm) var(--radius-sm) 0;
  color: var(--text-secondary);
}

blockquote blockquote,
blockquote blockquote blockquote {
  background-color: var(--quote-bg);
}

blockquote cite {
  color: var(--text-secondary);
}

blockquote cite:before,
.uncited:before {
  color: var(--accent-text);
}

.codebox {
  background-color: var(--code-bg);
  border-color: var(--border-soft);
  border-radius: var(--radius-sm);
}

.codebox p {
  border-bottom-color: var(--border-soft);
  color: var(--text-tertiary);
}

.codebox code {
  color: var(--text-primary);
  font-family: var(--font-mono);
}

.attachbox {
  background-color: var(--bg-surface-soft);
  border-color: var(--border-soft);
  border-radius: var(--radius-sm);
}

.pm-message .attachbox {
  background-color: var(--bg-surface-soft);
}

.attachbox dd {
  border-top-color: var(--border-soft);
}

.attachbox p,
.attachbox p.stats,
dl.file dd,
dl.thumbnail dd {
  color: var(--text-tertiary);
}

.attach-image img {
  border-color: var(--border-default);
}

dl.thumbnail img {
  border-color: var(--border-default);
  background-color: var(--bg-surface);
}

dl.thumbnail dt a:hover img {
  border-color: var(--accent);
}

/* --- Poster profile / avatars ------------------------------------------- */
.postprofile {
  color: var(--text-secondary);
  border-color: var(--border-soft);
}

.postprofile strong {
  color: var(--text-primary);
}

.postprofile a,
.postprofile dt.author a {
  color: var(--link-color);
}

.postprofile a:hover,
.postprofile dt.author a:hover {
  color: var(--accent-text);
}

.online {
  background-image: url("./images/no_avatar.gif");
  background-image: none;
}

dd.profile-warnings {
  color: var(--danger);
}

/* --- Post notices / rules / reported ------------------------------------ */
div.rules {
  background-color: var(--accent-soft);
  color: var(--accent-on-soft);
  border-radius: var(--radius-sm);
}

p.post-notice {
  background-color: var(--bg-surface-muted);
  background-image: none;
  border-radius: var(--radius-sm);
}

p.post-notice.unapproved,
p.post-notice.deleted,
p.post-notice.reported {
  background-color: var(--bg-surface-muted);
}

.reported {
  background-color: var(--accent-soft);
}

li.reported:hover {
  background-color: var(--accent-soft-hover) !important;
}

/* ==========================================================================
   6. BUTTONS / PAGINATION / SEARCH
   ========================================================================== */
.button {
  background-color: var(--bg-surface);
  background-image: none;
  border-color: var(--border-default);
  border-radius: var(--radius-sm);
  box-shadow: none;
  color: var(--text-primary);
  text-shadow: none;
}

/* Keep the neutral resting shadow while restoring the shared keyboard ring.
   The class-qualified selector must beat `.button { box-shadow: none; }`. */
.button:focus-visible {
  box-shadow: var(--focus-ring);
}

.button:hover,
.button:focus {
  background-color: var(--bg-surface-soft);
  background-image: none;
  border-color: var(--accent);
  color: var(--accent-text);
  text-shadow: none;
}

.button .icon,
.button-secondary {
  color: var(--icon-secondary);
}

/* The jumpbox label is text, not an icon. Keep its caret on the icon token,
   while giving “Перейти” an AA-safe text colour on the neutral button. */
.jumpbox .dropdown-trigger.button-secondary {
  color: var(--text-secondary);
}

.button-secondary:focus,
.button-secondary:hover,
.button:focus .icon,
.button:hover .icon {
  color: var(--accent-text);
}

.caret {
  border-color: var(--border-default);
}

a.button1,
input.button1 {
  background-color: var(--accent-strong);
  background-image: none;
  border-color: var(--accent-strong);
  color: var(--on-accent);
}

a.button1:hover,
input.button1:hover {
  background-color: var(--accent-strong-hover);
  border-color: var(--accent-strong-hover);
  color: var(--on-accent);
}

a.button1:active,
input.button1:active {
  background-color: var(--accent-strong-active);
  border-color: var(--accent-strong-active);
}

a.button2,
input.button2,
input.button3 {
  background-color: var(--bg-surface);
  background-image: none;
  border-color: var(--border-default);
  color: var(--text-primary);
}

a.button2:hover,
input.button2:hover,
input.button3:hover {
  background-color: var(--bg-surface-soft);
  border-color: var(--accent);
  color: var(--accent-text);
}

input.button1:focus,
input.button2:focus,
input.button3:focus {
  border-color: var(--accent);
  color: var(--text-primary);
}

.pagination li a {
  background: var(--bg-surface);
  border-color: var(--border-default);
  box-shadow: none;
  color: var(--text-secondary);
  filter: none;
}

.pagination li a:hover,
.pagination li a:hover .icon {
  background: var(--bg-surface-soft);
  border-color: var(--accent);
  color: var(--accent-text);
  text-shadow: none;
}

.pagination li.active span {
  background: var(--accent-strong);
  border-color: var(--accent-strong);
  color: var(--on-accent);
}

.pagination li.ellipsis span {
  background: transparent;
  color: var(--text-tertiary);
}

.search-header {
  box-shadow: none;
  margin: 0 0 0 auto;
  float: none;
}

.search-box .inputbox,
.search-box .inputbox:hover,
.search-box .inputbox:focus {
  border-color: var(--border-default);
}

.search-box .inputbox {
  background-color: var(--bg-surface-soft);
  color: var(--text-primary);
}

.search-box .inputbox:hover,
.search-box .inputbox:focus {
  border-color: var(--accent);
}

.button-search,
.button-search-end {
  background-color: var(--bg-surface-soft);
  border-color: var(--border-default);
  color: var(--icon-secondary);
}

.button-search:hover,
.button-search-end:hover {
  border-color: var(--accent);
  color: var(--accent-text);
}

.search-results li:hover,
.search-results li.active {
  background-color: var(--row-hover);
}

/* ==========================================================================
   7. FORMS
   ========================================================================== */
select {
  background-color: var(--bg-surface);
  border-color: var(--border-default);
  color: var(--text-primary);
}

label {
  color: var(--text-secondary);
}

dt label {
  color: var(--text-primary);
}

dd label {
  color: var(--text-primary);
}

fieldset dl:hover dt label {
  color: var(--text-primary);
}

.inputbox {
  background-color: var(--bg-surface);
  border-color: var(--border-default);
  color: var(--text-primary);
}

.inputbox::placeholder {
  color: var(--placeholder);
  opacity: 1;
}

.inputbox:hover,
.inputbox:focus {
  border-color: var(--accent);
}

fieldset.quick-login input.inputbox {
  background-color: var(--bg-surface-soft);
}

.message-box textarea {
  color: var(--text-primary);
}

.message-box textarea.drag-n-drop {
  outline-color: var(--border-default);
}

.message-box textarea.drag-n-drop-highlight {
  outline-color: var(--accent);
}

/* ==========================================================================
   8. TABLES / PANELS / CP / TABS
   ========================================================================== */
table.table1 thead th {
  color: var(--text-tertiary);
}

table.table1 tbody tr {
  border-color: var(--border-soft);
}

table.table1 tbody tr:hover,
table.table1 tbody tr.hover {
  background-color: var(--row-hover);
  color: var(--text-primary);
}

table.table1 td {
  color: var(--text-primary);
}

table.table1 tbody td {
  border-top-color: var(--border-soft);
}

table.table1 tbody th {
  border-bottom-color: var(--border-soft);
  color: var(--text-primary);
  background-color: var(--bg-surface);
}

table.info tbody th {
  color: var(--text-primary);
}

.panel {
  background-color: var(--bg-surface);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-sm);
  color: var(--text-primary);
}

.panel-container h3,
.panel-container hr,
.cp-menu hr {
  border-color: var(--border-soft);
}

.panel-container .panel li.row {
  border-bottom-color: var(--border-soft);
  border-top-color: var(--border-soft);
}

ul.cplist {
  border-top-color: var(--border-soft);
}

.panel-container .panel li.header dd,
.panel-container .panel li.header dt {
  color: var(--text-tertiary);
}

.panel-container table.table1 thead th {
  color: var(--text-tertiary);
  border-bottom-color: var(--border-soft);
}

.panel-container h2 {
  color: var(--text-primary);
}

.panel-container .panel {
  background-color: var(--bg-surface);
}

.cp-main .pm,
.cp-main .pm-message {
  background-color: var(--bg-surface);
  border-color: var(--border-soft);
}

.cp-mini {
  background-color: var(--bg-surface-soft);
}

dl.mini dt {
  color: var(--text-secondary);
}

.tabs .tab > a {
  background: var(--bg-surface-muted);
  color: var(--text-secondary);
}

.tabs .tab > a:hover {
  background: var(--bg-surface-soft);
  color: var(--accent-text);
}

.tabs .activetab > a,
.tabs .activetab > a:hover {
  background-color: var(--accent-soft);
  background-image: none;
  border-color: var(--accent-soft);
  box-shadow: none;
  color: var(--accent-on-soft);
  filter: none;
}

.minitabs .tab > a {
  background-color: var(--bg-surface-muted);
}

.minitabs .activetab > a,
.minitabs .activetab > a:hover {
  background-color: var(--bg-surface-soft);
  color: var(--text-primary);
}

.navigation a {
  color: var(--text-secondary);
  background: var(--bg-surface-muted);
  filter: none;
}

.navigation a:hover {
  background: var(--bg-surface-soft);
  color: var(--accent-text);
  filter: none;
}

.navigation .active-subsection a {
  background: var(--accent-soft);
  color: var(--accent-on-soft);
  filter: none;
}

.navigation .active-subsection a:hover {
  color: var(--accent-on-soft);
}

.responsive-tab .responsive-tab-link:before {
  border-color: var(--text-secondary);
}

.responsive-tab .responsive-tab-link:hover:before {
  border-color: var(--accent-text);
}

/* ==========================================================================
   9. JUMPBOX / POLLS / MISC / FOOTER / ICONS
   ========================================================================== */
.jumpbox .dropdown li {
  border-top-color: var(--border-soft);
}

.jumpbox-cat-link {
  background-color: var(--accent-strong);
  border-top-color: var(--accent-strong);
  color: var(--on-accent);
}

.jumpbox-cat-link:hover {
  background-color: var(--accent-strong-hover);
  border-top-color: var(--accent-strong-hover);
  color: var(--on-accent);
}

.jumpbox-forum-link,
.jumpbox-sub-link {
  background-color: var(--bg-surface-muted);
  color: var(--text-primary);
}

.jumpbox-forum-link:hover,
.jumpbox-sub-link:hover {
  background-color: var(--bg-surface-soft);
}

.jumpbox .dropdown .pointer-inner {
  border-color: var(--bg-surface-muted) transparent;
}

.pollbar1, .pollbar2, .pollbar3, .pollbar4, .pollbar5 {
  background-color: var(--accent-strong);
  border-color: var(--accent-strong-active);
}

fieldset.polls dl {
  border-top-color: var(--border-soft);
  color: var(--text-secondary);
}

fieldset.polls dl.voted {
  color: var(--text-primary);
}

.copyright {
  color: var(--text-tertiary);
}

.footer-row {
  color: var(--text-tertiary);
}

.footer-link {
  color: var(--text-secondary);
}

.footer-link:hover {
  color: var(--accent-text);
}

.error {
  color: var(--danger);
}

.sep {
  color: var(--text-tertiary);
}

dl.details dt {
  color: var(--text-secondary);
}

dl.details dd {
  color: var(--text-primary);
}

.icon.icon-blue,
a:hover .icon.icon-blue {
  color: var(--link-color);
}

.icon.icon-green,
a:hover .icon.icon-green {
  color: var(--success);
}

.icon.icon-red,
a:hover .icon.icon-red {
  color: var(--danger);
}

.icon.icon-orange,
a:hover .icon.icon-orange {
  color: var(--warning);
}

.icon.icon-bluegray,
a:hover .icon.icon-bluegray {
  color: var(--text-secondary);
}

.icon.icon-gray,
a:hover .icon.icon-gray {
  color: var(--icon-secondary);
}

.icon.icon-lightgray,
a:hover .icon.icon-lightgray {
  color: var(--text-tertiary);
}

.icon.icon-black,
a:hover .icon.icon-black {
  color: var(--text-primary);
}

.top i {
  color: var(--icon-secondary);
}

.alert_close .icon:before {
  background-color: var(--bg-surface);
}

.phpbb_alert {
  background-color: var(--bg-surface);
  border-color: var(--border-default);
}

.loading_indicator {
  background-color: var(--bg-surface);
}

/* --- background helper classes ------------------------------------------ */
.bg1 {
  background-color: var(--bg-surface-soft);
}

.bg2 {
  background-color: var(--bg-surface-muted);
}

.bg3 {
  background-color: var(--bg-surface-muted);
}

.ucprowbg {
  background-color: var(--bg-surface-muted);
}

.fieldsbg {
  background-color: var(--bg-surface-soft);
}

table.zebra-list tr:nth-child(odd) td,
ul.zebra-list li:nth-child(odd) {
  background-color: var(--bg-surface-soft);
}

table.zebra-list tr:nth-child(even) td,
ul.zebra-list li:nth-child(even) {
  background-color: var(--bg-surface-muted);
}

/* ==========================================================================
   10. RESPONSIVE / MOBILE
   ========================================================================== */
@media (max-width: 1023px) {
  .headerbar .inner {
    gap: var(--space-3);
  }
}

@media (max-width: 700px) {
  .wrap {
    padding: 0 var(--mobile-pad) var(--space-8);
  }

  .headerbar .inner {
    display: block;
  }

  .site-description {
    padding: 0 48px;
    text-align: center;
  }

  .site-description h1 {
    font-size: var(--text-xl);
  }

  .site-description p {
    font-size: var(--text-xs);
  }

  .stelsm-theme-toggle {
    position: absolute;
    top: 10px;
    right: 10px;
    margin: 0;
  }

  .headerbar,
  .navbar,
  .forabg,
  .forumbg,
  .panel,
  .post {
    margin-left: 0;
    margin-right: 0;
  }

  .post {
    padding: var(--space-3) var(--space-4);
    border-radius: var(--radius-md);
  }

  .postbody .content {
    font-size: 15px;
  }

  .action-bar .button {
    margin-bottom: var(--space-1);
  }

  .pagination li a,
  .pagination li span {
    min-height: var(--touch-target);
    min-width: var(--touch-target);
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* D-5 (wave 6): prosilver `dl.row-item dt a { display: inline }` (0,1,3) beat
     `.pagination li a` (0,1,2), so min-height/min-width were inert on the
     numeric page links (14.4x15px boxes, 12.5px top spread, no 44px touch
     target). This 0,5,4 selector wins and pins every chip to one 44px line. */
  .forumbg ul.topiclist.topics li.row .pagination li a,
  .forumbg ul.topiclist.topics li.row .pagination li span {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: var(--touch-target);
    min-width: var(--touch-target);
  }

  .stelsm-theme-toggle {
    width: var(--touch-target);
    height: var(--touch-target);
  }
}

/* ========================================================================
   21. UI/UX PRODUCTION FIXES — wave 2 (D-01…D-07)
   ======================================================================== */

/* Empty parsed descriptions such as `<t></t>` must not create a 21px line.
   Forum details are not part of the compact row contract at any width. */
.stelsm-forum-description:empty,
.stelsm-forum-description:has(> t:only-child:empty),
.stelsm-forum-details {
  display: none !important;
}

.stelsm-forum-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-height: 100%;
}

/* Desktop forum rows may grow for unusual content. Normal rows still land at
   the 66px minimum; title/description are the only ellipsized text tracks. */
@media (min-width: 1280px) {
  .forabg ul.topiclist.forums li.row,
  .forabg ul.topiclist.forums li.row dl.row-item,
  .forabg ul.topiclist.forums li.row dl.row-item dt,
  .forabg ul.topiclist.forums li.row dl.row-item dd,
  .forabg ul.topiclist.forums li.row dt .list-inner {
    height: auto;
    max-height: none;
  }

  .forabg ul.topiclist.forums li.row { min-height: 66px; }
  .forabg ul.topiclist.forums li.row dl.row-item,
  .forabg ul.topiclist.forums li.row dl.row-item dt,
  .forabg ul.topiclist.forums li.row dl.row-item dd,
  .forabg ul.topiclist.forums li.row dt .list-inner { min-height: 64px; }

  /* Sticky/announcement rows can contain an additional type/meta line. */
  .forumbg.announcement ul.topiclist.topics li.row,
  .forumbg ul.topiclist.topics li.row.sticky,
  .forumbg ul.topiclist.topics li.row.announce,
  .forumbg ul.topiclist.topics li.row.global-announce,
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item,
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item dt,
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item dd,
  .forumbg.announcement ul.topiclist.topics li.row dt .list-inner,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item dt,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.sticky dt .list-inner,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item dt,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.announce dt .list-inner,
  .forumbg ul.topiclist.topics li.row.global-announce dl.row-item,
  .forumbg ul.topiclist.topics li.row.global-announce dl.row-item dt,
  .forumbg ul.topiclist.topics li.row.global-announce dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.global-announce dt .list-inner {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  .forumbg.announcement ul.topiclist.topics li.row,
  .forumbg ul.topiclist.topics li.row.sticky,
  .forumbg ul.topiclist.topics li.row.announce,
  .forumbg ul.topiclist.topics li.row.global-announce { min-height: 66px; }
}

/* The avatar-fallback contract is defined ONCE for both palettes in the
   "§34: avatar fallback" block below (html .stelsm-avatar--fallback).
   A theme-scoped light-only override used to live here; it left dark mode on
   the extension's grey --bg-surface-muted / --icon-secondary pair. */

/* Guest registration is the primary desktop auth action (§27). */
#page-header .stelsm-usernav > li > a.stelsm-usernav__register {
  min-height: 40px;
  padding-inline: 18px;
  background: var(--accent-strong);
  border: 1px solid var(--accent-strong);
  border-radius: 10px;
  color: var(--on-accent);
}
#page-header .stelsm-usernav > li > a.stelsm-usernav__register:hover,
#page-header .stelsm-usernav > li > a.stelsm-usernav__register:focus {
  background: var(--accent-strong-hover);
  border-color: var(--accent-strong-hover);
  color: var(--on-accent);
}
#page-header .stelsm-usernav__register .icon { color: inherit; }

/* Full-width compact/mobile search overlay (§28). */
.stelsm-header-search {
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.stelsm-search-overlay { display: none; }
.stelsm-search-overlay.is-open {
  position: fixed;
  inset: env(safe-area-inset-top) 0 auto;
  z-index: var(--z-drawer);
  display: block;
  padding: var(--space-3) var(--mobile-pad);
  background: var(--bg-surface);
  border-bottom: 1px solid var(--border-default);
  box-shadow: var(--shadow-md);
}
.stelsm-search-overlay__form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) var(--touch-target) var(--touch-target);
  gap: var(--space-2);
  width: min(100%, var(--mobile-page-max));
  margin-inline: auto;
}
.stelsm-search-overlay__form .inputbox {
  width: 100%;
  min-width: 0;
  height: var(--touch-target);
  box-sizing: border-box;
}
.stelsm-search-overlay__form .button-search,
.stelsm-search-overlay__close {
  width: var(--touch-target);
  min-width: var(--touch-target);
  height: var(--touch-target);
  min-height: var(--touch-target);
  padding: 0;
  border: 1px solid var(--border-default);
  border-radius: var(--radius-sm);
  background: var(--bg-surface-soft);
  color: var(--icon-primary);
  cursor: pointer;
}

@media (max-width: 767px) {
  #page-header .headerbar { position: relative; }
  #page-header .stelsm-burger {
    position: absolute;
    left: var(--mobile-pad);
    top: 50%;
    z-index: 1;
    transform: translateY(-50%);
  }
  #page-header .headerbar .inner {
    width: 100%;
    min-width: 0;
    padding-left: calc(var(--mobile-pad) + var(--touch-target) + var(--space-2));
  }
  #page-header .site-description { column-gap: var(--space-2); }
  #page-header .site-description .logo { min-width: 32px; min-height: 32px; }
  #page-header .site-description .site_logo { width: 32px; height: 32px; }
  #page-header .site-description h1 {
    font-size: var(--text-lg);
    line-height: 1.05;
    overflow-wrap: normal;
    word-break: normal;
  }
  #page-header .stelsm-theme-toggle { display: none; }

  .stelsm-hero,
  .stelsm-stats,
  .stelsm-stats__card,
  .stelsm-index-grid,
  .stelsm-index-main,
  .forabg,
  .forumbg,
  .stelsm-card { min-width: 0; max-width: 100%; box-sizing: border-box; }

  .stelsm-hero__inner { width: calc(100% - var(--mobile-pad) * 2); }
  .stelsm-hero__content { min-width: 0; max-width: 58%; }
  .stelsm-hero__title {
    max-width: 100%;
    font-size: clamp(30px, 8.5vw, 36px);
    overflow: visible;
  }

  .stelsm-stats__list {
    grid-auto-flow: row;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }
  .stelsm-stat { min-width: 0; padding-inline: var(--space-2); }
  .stelsm-stat__num,
  .stelsm-stat__label { max-width: 100%; overflow: hidden; text-overflow: ellipsis; }

  nav.stelsm-tabs.stelsm-mobile-only {
    display: flex !important;
    width: 100%;
    box-sizing: border-box;
  }
  .stelsm-tab { min-width: 0; padding-inline: var(--space-1); overflow: hidden; text-overflow: ellipsis; }

  .stelsm-recent-item,
  .stelsm-event { min-width: 0; box-sizing: border-box; }
  .stelsm-recent-item__title,
  .stelsm-recent-item__meta { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
}

/* ========================================================================
   20. RESIDUAL VIEWFORUM POLISH — DEF-13-2 / OBS-13-2 / OBS-4
   ======================================================================== */

/* The desktop last-post cell is 250px including its avatar. Give the copy an
   explicit shrinkable track so a long subject receives a real ellipsis box. */
@media (min-width: 1280px) {
  ul.topiclist.forums dd.lastpost .stelsm-forum-lastpost-copy {
    flex: 1 1 0;
    width: 0;
    max-width: 100%;
  }

  ul.topiclist.forums dd.lastpost .lastsubject {
    display: block;
    width: 100%;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  ul.topiclist.forums dd.lastpost .lastsubject + br { display: none; }
}

@media (min-width: 701px) and (max-width: 1279px) {
  /* Reuse phpBB's native author, replies and last-post nodes. One coordinated
     compact layout owns the whole second 24px line and keeps the 66px row. */
  .forumbg ul.topiclist.topics li.row dl.row-item {
    --topic-meta-bg: transparent;
    --topic-meta-color: var(--text-secondary);
    --topic-meta-padding-x: 0px;
    --topic-meta-radius: 0px;
    --topic-meta-posts-width: 50px;
    --topic-meta-lastpost-offset: 110px;
    position: relative;
  }

  .forumbg ul.topiclist.topics .topic-poster {
    position: absolute;
    top: 32px;
    left: 52px;
    display: flex !important;
    align-items: center;
    width: clamp(185px, 30%, 280px);
    height: 24px;
    margin: 0;
    padding: 0 var(--topic-meta-padding-x);
    float: none;
    gap: var(--space-1);
    min-width: 0;
    overflow: hidden;
    font-size: 11px;
    line-height: 24px;
    color: var(--topic-meta-color);
    background-color: var(--topic-meta-bg);
    border-radius: var(--topic-meta-radius);
    box-sizing: border-box;
    white-space: nowrap;
  }

  .forumbg ul.topiclist.topics .topic-poster .username,
  .forumbg ul.topiclist.topics .topic-poster .username-coloured {
    flex: 0 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .forumbg ul.topiclist.topics .topic-poster time { flex: 0 0 auto; }
  .forumbg ul.topiclist.topics .topic-poster > .icon { display: none; }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.posts,
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost {
    position: absolute;
    top: 32px;
    display: flex !important;
    align-items: center;
    width: auto;
    height: 24px;
    min-height: 24px;
    max-height: 24px;
    margin: 0;
    padding: 0 var(--topic-meta-padding-x);
    border: 0;
    box-sizing: border-box;
    overflow: hidden;
    font-size: 11px;
    line-height: 24px;
    color: var(--topic-meta-color);
    background-color: var(--topic-meta-bg);
    border-radius: var(--topic-meta-radius);
    white-space: nowrap;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.posts {
    left: calc(56px + clamp(185px, 30%, 280px));
    z-index: 1;
    width: var(--topic-meta-posts-width);
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.posts dfn {
    display: inline;
    position: static;
    order: -1;
    width: auto;
    height: auto;
    clip: auto;
    overflow: visible;
    font-style: normal;
    white-space: nowrap;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.posts dfn::after { content: ": "; white-space: pre; }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost {
    left: calc(var(--topic-meta-lastpost-offset) + clamp(185px, 30%, 280px));
    right: 8px;
    min-width: 0;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost > span {
    display: flex;
    align-items: center;
    gap: var(--space-1);
    width: 100%;
    min-width: 0;
    overflow: hidden;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost .username,
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost .username-coloured {
    flex: 0 1 auto;
    min-width: 1ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost dfn {
    display: inline-flex;
    position: static;
    flex: 0 0 auto;
    width: auto;
    height: auto;
    clip: auto;
    overflow: visible;
    font-style: normal;
    white-space: nowrap;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost dfn::after { content: ":"; }
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost br { display: none; }
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost time { flex: 0 0 auto; }
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost time::before { content: "• "; }
}

/* At the narrow edge the three metadata groups become high-contrast chips.
   Only custom properties are changed here: the 701-1279 layout remains the
   single owner of geometry, so the two media ranges do not fight each other. */
@media (min-width: 701px) and (max-width: 767px) {
  .forumbg ul.topiclist.topics li.row dl.row-item {
    --topic-meta-bg: var(--text-secondary);
    --topic-meta-color: var(--bg-surface);
    --topic-meta-padding-x: 3px;
    --topic-meta-radius: var(--radius-xs);
    --topic-meta-posts-width: 56px;
    --topic-meta-lastpost-offset: 116px;
    --topic-meta-poster-left: 52px;
    --topic-meta-posts-left: 228px;
    --topic-meta-lastpost-left: 285px;
  }

  /* QA #16: chips hug their contents instead of painting the old layout
     tracks. The explicit left anchors preserve the single 24px metadata row;
     max-width only acts as an ellipsis guard for unusually long names. */
  .forumbg ul.topiclist.topics .topic-poster {
    left: var(--topic-meta-poster-left);
    width: max-content;
    max-width: 172px;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.posts {
    left: var(--topic-meta-posts-left);
    width: max-content;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost {
    left: var(--topic-meta-lastpost-left);
    right: auto;
    width: max-content;
    max-width: calc(100% - var(--topic-meta-lastpost-left) - 8px);
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost > span {
    width: max-content;
    max-width: 100%;
  }

  .forumbg ul.topiclist.topics .topic-poster a,
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost a,
  .forumbg ul.topiclist.topics .topic-poster .username,
  .forumbg ul.topiclist.topics .topic-poster .username-coloured,
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost .username,
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost .username-coloured {
    color: var(--topic-meta-color) !important;
  }

  /* Font Awesome's icon-lightgray class otherwise overrides the chip link's
     inherited colour (QA D-16-1). This yields the same >= AA contrast as the
     chip text in both palettes. */
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost a .icon {
    color: var(--topic-meta-color) !important;
  }

  /* The global translucent orange focus shadow is lost on the chip fill.
     Draw a solid inset ring in the chip foreground colour instead. */
  .forumbg ul.topiclist.topics .topic-poster a:focus-visible,
  body .forumbg ul.topiclist.topics li.row dl.row-item dd.lastpost a:focus-visible {
    outline: 2px solid var(--topic-meta-color) !important;
    outline-offset: -2px;
    box-shadow: none;
    border-radius: 3px;
  }
}

@media (max-width: 479px) {
  .site-description {
    padding: 0 44px;
  }

  .site-description h1 {
    font-size: var(--text-lg);
  }
}

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

/* ==========================================================================
   11. STICKY SITE HEADER (§12, §19) — D7
   --------------------------------------------------------------------------
   One 68px row: brand + club nav + search + theme toggle + user/auth.
   The header sits outside .wrap (see overall_header.html) so it is
   full-bleed, sticky, translucent and blurred. Breadcrumbs are rendered in
   the page body (stelsm_breadcrumbs.html), so .headerbar + .navbar heights
   add up to the §12 budget instead of 171px.
   ========================================================================== */

#page-header {
  position: sticky;
  top: 0;
  z-index: var(--z-nav);
  padding-top: env(safe-area-inset-top);
  background: var(--header-bg);
  border-bottom: 1px solid var(--header-border);
  -webkit-backdrop-filter: blur(var(--header-blur));
  backdrop-filter: blur(var(--header-blur));
}

#page-header .headerbar {
  display: flex;
  align-items: center;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
  background: transparent;
  background-image: none;
  color: var(--text-primary);
}

#page-header .headerbar .inner {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex: 1 1 auto;
  min-width: 0;
  width: 100%;
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-gutter);
  height: var(--header-h);
}

#page-header .stelsm-burger { flex: 0 0 auto; }

/* --- Brand (§12) -------------------------------------------------------- */
#page-header .site-description {
  float: none;
  width: auto;
  flex: 0 1 auto;
  min-width: 0;
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  grid-template-rows: auto auto;
  column-gap: var(--space-3);
  align-items: center;
  order: 1;
}

#page-header .site-description .logo {
  grid-column: 1;
  grid-row: 1 / span 2;
  display: inline-flex;
  float: none;
  padding: 0;
}

#page-header .site-description .site_logo {
  width: 46px;
  height: 46px;
}

#page-header .site-description h1 {
  grid-column: 2;
  grid-row: 1;
  margin: 0;
  font-family: var(--font-sans);
  /* B3: the old 25px / 220px + ellipsis cut the brand to "StelsM Club ⋯".
     A fluid size and a plain-length cap let the flex box size to the real
     text width; if a long board name still does not fit, it wraps instead
     of being truncated. */
  font-size: clamp(24px, 1.8vw, 28px);
  font-weight: var(--weight-heavy);
  letter-spacing: -0.5px;
  line-height: 1.05;
  white-space: normal;
  overflow-wrap: break-word;
  max-width: 340px;
  overflow: visible;
}

#page-header .site-description > p:not(.skiplink) {
  grid-column: 2;
  grid-row: 2;
  margin: 3px 0 0;
  font-size: 10px;
  font-weight: var(--weight-semibold);
  letter-spacing: var(--tracking-wider);
  text-transform: uppercase;
  color: var(--text-tertiary);
  white-space: nowrap;
}

/* --- Club navigation (§12) --------------------------------------------- */
/* NOTE: prosilver styles `ul.linklist` / `ul.linklist > li` (specificity
   beats a bare class), so every structural rule below is scoped with
   #page-header to actually win. */
#page-header .navbar { display: contents; }
#page-header .navbar > .inner { display: contents; }

#page-header .stelsm-clubnav {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  /* B3: tightened from --space-1/4px so the 68px row can carry the full §12
     nav set AND a readable brand at 1440 without wrapping. */
  gap: 2px;
  order: 2;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

#page-header .stelsm-clubnav > li {
  display: block;
  float: none;
  margin: 0;
  padding: 0;
  width: auto;
  font-size: var(--text-base);
  line-height: normal;
}

#page-header .stelsm-clubnav__link,
#page-header .stelsm-clubnav > li > a {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  height: var(--nav-link-h);
  padding: 0 3px;
  border-radius: var(--radius-sm);
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
  color: var(--text-secondary);
  white-space: nowrap;
  text-decoration: none;
  transition: background-color var(--dur-hover) ease, color var(--dur-hover) ease;
}

#page-header .stelsm-clubnav__link:hover,
#page-header .stelsm-clubnav__link:focus,
#page-header .stelsm-clubnav > li > a:hover,
#page-header .stelsm-clubnav > li > a:focus {
  background-color: var(--bg-surface-muted);
  color: var(--text-primary);
  text-decoration: none;
}

#page-header .stelsm-clubnav__link[aria-current="page"] {
  background-color: var(--accent-soft);
  color: var(--accent-on-soft);
}

#page-header .stelsm-clubnav__link--icon {
  width: var(--nav-link-h);
  padding: 0;
  justify-content: center;
}

/* mChat injects <li class="mchat-nav"> through overall_header_navigation_append.
   In the header it is reduced to its icon so the 68px row keeps the §12 set. */
#page-header .stelsm-clubnav > li.mchat-nav .mchat-nav-link,
#page-header .stelsm-clubnav > li.mchat-nav .mchat-nav-caret { display: none; }

#page-header .stelsm-clubnav > li.mchat-nav a.mchat-nav-link-title,
#page-header .stelsm-clubnav > li.mchat-nav > .mchat-nav-container > a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-1);
  min-width: var(--nav-link-h);
  height: var(--nav-link-h);
  padding: 0 4px;
  border-radius: var(--radius-sm);
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
  color: var(--text-secondary);
  white-space: nowrap;
}

#page-header .stelsm-clubnav > li.mchat-nav a.mchat-nav-link-title:hover,
#page-header .stelsm-clubnav > li.mchat-nav > .mchat-nav-container > a:hover {
  background-color: var(--bg-surface-muted);
  color: var(--text-primary);
}

/* --- Header search (§28: 260–330 × 40) ---------------------------------- */
#page-header .search-box.search-header {
  order: 3;
  float: none;
  display: block;
  margin: 0 0 0 auto;
  border-radius: 0;
}

#page-header .search-box fieldset { display: flex; align-items: stretch; }

#page-header .search-box .inputbox,
#page-header .search-box .inputbox:hover,
#page-header .search-box .inputbox:focus {
  float: none;
  width: 260px;
  height: 40px;
  padding: 0 var(--space-3);
  border: 1px solid var(--border-default);
  border-right-width: 0;
  border-radius: var(--radius-sm) 0 0 var(--radius-sm);
  font-size: var(--text-base);
  box-sizing: border-box;
}

#page-header .search-box .button-search,
#page-header .search-box .button-search-end {
  float: none;
  height: 40px;
  min-height: 40px;
  width: auto;
  min-width: 40px;
  padding: 0 var(--space-2);
  border-radius: 0;
}

/* Single-field search (§28): the advanced search stays reachable through the
   quick-links dropdown and the dedicated search page. */
#page-header .search-box .button-search-end { display: none; }
#page-header .search-box .button-search { border-radius: 0 var(--radius-sm) var(--radius-sm) 0; }

/* --- Header theme toggle / mobile search -------------------------------- */
#page-header .stelsm-theme-toggle {
  position: static;
  order: 4;
  width: var(--touch-target);
  height: var(--touch-target);
  margin: 0;
}

.stelsm-header-search {
  display: none;
  order: 5;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  width: var(--touch-target);
  height: var(--touch-target);
  border-radius: var(--radius-sm);
  color: var(--icon-secondary);
  text-decoration: none;
}

.stelsm-header-search:hover { background-color: var(--bg-surface-muted); color: var(--accent-text); }

/* --- User / auth controls (§12) ----------------------------------------- */
#page-header .stelsm-usernav {
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: var(--space-1);
  order: 6;
  flex: 0 0 auto;
  margin: 0;
  padding: 0;
  list-style: none;
}

#page-header .stelsm-usernav > li {
  display: block;
  float: none;
  margin: 0;
  padding: 0;
  width: auto;
  font-size: var(--text-base);
  line-height: normal;
}

#page-header .stelsm-usernav > li > a,
#page-header .stelsm-usernav > li > .header-profile > .header-avatar,
#page-header .stelsm-usernav > li > .dropdown-container > a {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  min-height: var(--nav-link-h);
  padding: 0 6px;
  border-radius: var(--radius-sm);
  font-size: var(--text-base);
  font-weight: var(--weight-medium);
  color: var(--text-secondary);
  white-space: nowrap;
  text-decoration: none;
}

#page-header .stelsm-usernav > li > a:hover,
#page-header .stelsm-usernav > li > .header-profile > .header-avatar:hover,
#page-header .stelsm-usernav > li > .dropdown-container > a:hover {
  background-color: var(--bg-surface-muted);
  color: var(--accent-text);
  text-decoration: none;
}

#page-header .stelsm-usernav .header-avatar img {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  object-fit: cover;
}

#page-header .stelsm-usernav__name {
  max-width: 110px;
  overflow: hidden;
  text-overflow: ellipsis;
}

#page-header .stelsm-usernav .badge { margin-left: var(--space-1); }

/* Anchors must not hide behind the sticky header. */
#top,
#start_here,
.anchor,
.post:target { scroll-margin-top: calc(var(--header-h) + var(--space-2)); }

/* The empty anchor above #page-header must not create a line box, and the
   prosilver body padding (12px) must not push the sticky header down. */
.top-anchor { display: block; height: 0; line-height: 0; font-size: 0; }
body { padding-top: 0; }

/* ==========================================================================
   12. BREADCRUMBS STRIP (§29, §67) — page body, not part of the header
   ========================================================================== */
.stelsm-breadcrumbs { margin: 0 0 var(--space-3); }

.stelsm-breadcrumbs .nav-breadcrumbs {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2);
  margin: 0;
  padding: var(--space-2) 0;
  border-top: 0;
  list-style: none;
}

.stelsm-breadcrumbs .breadcrumbs {
  float: none;
  margin: 0;
  font-size: var(--text-sm);
  line-height: 1.4;
}

.stelsm-breadcrumbs .crumb { color: var(--text-secondary); font-weight: var(--weight-medium); }
.stelsm-breadcrumbs .crumb a { color: var(--text-secondary); }
.stelsm-breadcrumbs .crumb a:hover { color: var(--accent-text); }

/* ==========================================================================
   13. POST CARD (§30) + reading column (§72) — D9, D10
   ========================================================================== */
.post {
  padding: var(--space-5) var(--space-6);
}

.post .inner {
  max-width: var(--reading-max);
  margin-inline: auto;
}

.post-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-4);
  padding-bottom: var(--space-3);
  margin-bottom: var(--space-4);
  border-bottom: 1px solid var(--border-soft);
}

.post-head .postprofile {
  float: none;
  width: auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-1) var(--space-3);
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  color: var(--text-secondary);
}

.post-head .postprofile dt {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  margin: 0;
  line-height: 1.2;
}

.post-head .postprofile dt .avatar-container { margin: 0; overflow: visible; }
.post-head .postprofile dt .avatar-container:after { clear: none; }
.post-head .postprofile dt .avatar { display: inline-flex; float: none; margin: 0; flex: 0 0 auto; }

/* DEF-2 (wave 7): prosilver `content.css` declares
   `.postprofile .avatar img { height: auto !important; max-width: 100% }`
   (and, at <=700px, `responsive.css` adds `width: auto !important;
   height: auto !important; max-height: 32px`). A plain 44px/36px height lost
   that !important fight, so a real uploaded 40x46 avatar rendered as a
   44x50.59 ellipse on desktop and 27.81x31.98 on mobile. The declaration now
   carries `!important` (same origin, higher specificity 0,4,2 > 0,2,1) and
   clears the max-* clamps, so the box is a true square and `object-fit: cover`
   crops the source. The fallback is a <span class="stelsm-avatar">, not an
   <img>, and is untouched by this rule. */
.post-head .postprofile dt .avatar img {
  display: block;
  width: 44px !important;
  height: 44px !important;
  max-width: none;
  max-height: none;
  border-radius: 50%;
  object-fit: cover;
}

.post-head .postprofile dt a,
.post-head .postprofile dt strong {
  font-size: var(--text-md);
  font-weight: var(--weight-semibold);
  color: var(--text-primary);
}

.post-head .postprofile dt a:hover { color: var(--accent-text); }

.post-head .postprofile dd {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  font-size: var(--text-xs);
  line-height: 1.3;
  color: var(--text-secondary);
}

.post-head .postprofile dd strong { font-weight: var(--weight-medium); color: var(--text-tertiary); }
.post-head .postprofile dd.profile-rank { color: var(--accent-on-soft); }
.post-head .postprofile dd.profile-warnings { color: var(--danger); }
.post-head .postprofile .profile-rank img { max-height: 22px; width: auto; }

.post-head__meta {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  margin-left: auto;
  font-size: var(--text-xs);
  color: var(--text-tertiary);
  white-space: nowrap;
}

.post-head__meta .icon { color: var(--icon-secondary); }
.post-head__num { font-family: var(--font-mono); }

.post .postbody {
  float: none;
  width: auto;
  max-width: none;
  margin: 0;
}

.has-profile .postbody h3 { margin-right: 0 !important; }
.has-profile .postbody h3.first { font-size: var(--text-xl); }

.postbody .content {
  max-width: var(--reading-max);
  font-size: 15.5px;
  line-height: var(--leading-relaxed);
}

/* Post actions live at the bottom of the card (§30). */
.post-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: var(--space-4);
  padding-top: var(--space-3);
  border-top: 1px solid var(--border-soft);
}

.post .post-actions .post-buttons {
  float: none;
  position: static;
  display: flex;
  align-items: center;
  gap: var(--space-1);
  max-width: none;
  margin: 0;
}

.post-actions .post-buttons > li { float: none; margin: 0; }
.post-actions .post-buttons .button { padding: 0; }
.post-actions .post-buttons .button span { font-size: 0; }

/* ==========================================================================
   14. BUTTONS (§27) — D13 (prosilver 26–28px → 40px desktop / 44 mobile)
   ========================================================================== */
.button,
a.button1,
a.button2,
input.button1,
input.button2 {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  padding: 0 var(--space-4);
  border-radius: var(--radius-sm);
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
  line-height: 1;
}

/* Keep compact controls compact: editor toolbar / dropdown carets. */
.format-buttons .button,
.button-caret { min-height: 0; padding: 2px 5px; }

.button-icon-only { min-width: 40px; padding-left: 0; padding-right: 0; }

/* ==========================================================================
   15. FOOTER (§35) — D13
   ========================================================================== */
.page-footer {
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  margin-top: var(--space-12);
  background: var(--bg-surface);
  border-top: 1px solid var(--border-soft);
}

.stelsm-footer { padding: var(--space-3) 0; }

.stelsm-footer__inner,
.stelsm-footer > .footer-row,
.stelsm-footer .mchat-copyright {
  max-width: var(--container-max);
  margin-inline: auto;
  padding-inline: var(--container-gutter);
}

.stelsm-footer__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: var(--space-4);
  min-height: 40px;
}

.stelsm-footer__brand { display: flex; align-items: center; gap: var(--space-3); }

.stelsm-footer__logo {
  width: 40px;
  height: 40px;
  flex-shrink: 0;
  background-color: var(--text-primary);
  -webkit-mask: url("./images/logo-mark.svg") center / contain no-repeat;
  mask: url("./images/logo-mark.svg") center / contain no-repeat;
}

.stelsm-footer__brand-text { display: flex; flex-direction: column; line-height: 1.25; }
.stelsm-footer__name { font-size: var(--text-md); font-weight: var(--weight-bold); color: var(--text-primary); }
.stelsm-footer__copy { font-size: var(--text-xs); color: var(--text-tertiary); }

.stelsm-footer__nav {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--space-2) var(--space-5);
}

.stelsm-footer__nav a {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  font-size: var(--text-sm);
  color: var(--text-secondary);
}

.stelsm-footer__nav a:hover { color: var(--accent-text); }

.stelsm-footer__tz { font-size: var(--text-xs); color: var(--text-tertiary); }

.stelsm-footer__social { display: flex; gap: var(--space-2); }

.stelsm-footer__social-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-sm);
  color: var(--icon-secondary);
  text-decoration: none;
  transition: border-color var(--dur-hover) ease, color var(--dur-hover) ease;
}

.stelsm-footer__social-link:hover { border-color: var(--accent); color: var(--accent-text); }
.stelsm-footer__social-link svg { width: 20px; height: 20px; }

.stelsm-footer > .footer-row,
.stelsm-footer .mchat-copyright {
  margin: var(--space-1) 0 0;
  font-size: var(--text-xs);
  line-height: 1.35;
  color: var(--text-tertiary);
}

.stelsm-footer .mchat-copyright { margin-top: var(--space-2); }

/* ==========================================================================
   16. RESPONSIVE HEADER (§19, §55) + TOUCH TARGETS (§41) — D11
   ========================================================================== */
@media (max-width: 1439px) {
  #page-header .site-description > p:not(.skiplink) { display: none; }
}

@media (max-width: 1279px) {
  #page-header .stelsm-clubnav > li.mchat-nav { display: none; }
}

/* Compact desktop / tablet: the 260px search field would squeeze the brand
   (and the §12 nav) out of the 68px row, so it collapses to the §19 search
   icon below the primary desktop target; the field returns at >=1440px. */
@media (max-width: 1439px) {
  #page-header .search-box.search-header { display: none; }
  .stelsm-header-search { display: inline-flex; }
}

@media (max-width: 1100px) {
  #page-header .stelsm-clubnav > li > a.stelsm-clubnav__link--secondary { display: none; }
}

@media (max-width: 1023px) {
  #page-header .stelsm-clubnav { display: none; }
}

@media (max-width: 767px) {
  #page-header .headerbar .inner {
    height: var(--header-h-mobile);
    gap: var(--space-2);
    padding-inline: var(--mobile-pad);
  }

  #page-header .site-description {
    flex: 1 1 auto;
    min-width: 0;
    /* Reset the legacy centred-header padding (<=700px/<=479px rules) so the
       brand column gets the full width back. */
    padding: 0;
    text-align: left;
  }
  #page-header .site-description .logo {
    min-width: var(--touch-target);
    min-height: var(--touch-target);
    align-items: center;
    justify-content: center;
  }
  #page-header .site-description .site_logo { width: 38px; height: 38px; }
  /* Mobile keeps the §12 minimum while allowing a two-line board name. */
  #page-header .site-description h1 {
    font-size: clamp(24px, 6.2vw, 26px);
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
    overflow-wrap: anywhere;
    line-height: 1.05;
    max-width: 100%;
  }

  #page-header .stelsm-usernav { display: none; }

  /* §19 mobile header is [burger][logo][search][theme] */
  .stelsm-header-search { order: 3; }
  #page-header .stelsm-theme-toggle { order: 4; }

  /* §41 touch targets ≥44px */
  .button,
  a.button1,
  a.button2,
  input.button1,
  input.button2,
  .stelsm-btn { min-height: var(--touch-target); }

  .button-icon-only,
  .post .post-actions .post-buttons .button,
  .format-buttons .button {
    min-width: var(--touch-target);
    min-height: var(--touch-target);
  }

  .stelsm-footer__nav a {
    min-height: var(--touch-target);
    padding-inline: var(--space-3);
    margin-inline: calc(var(--space-3) * -1);
  }
  .stelsm-footer__social-link { width: var(--touch-target); height: var(--touch-target); }

  /* Post card (§30) on mobile: compact header */
  .post { padding: var(--space-4); }
  .post-head { gap: var(--space-2); }
  .post-head .postprofile dt .avatar img {
    width: 36px !important;
    height: 36px !important;
    max-height: none;
  }
  .post-head .postprofile dd { display: none; }
  .post-head .postprofile dd.profile-rank { display: inline-flex; }
  .post-head__meta { margin-left: 0; }

  /* Keep the last content above the fixed bottom navigation (§21). */
  .wrap { padding-bottom: calc(var(--bottom-nav-h) + var(--space-6)); }
}

/* Touch targets of the club blocks provided by ext/stelsm/theme (mobile). */
@media (max-width: 767px) {
  .stelsm-card__link,
  .stelsm-promo__link,
  .stelsm-drawer__link,
  .stelsm-sheet__item { min-height: var(--touch-target); }
  .stelsm-card__link,
  .stelsm-promo__link { display: inline-flex; align-items: center; }
  .stelsm-card__link {
    padding-inline: var(--space-3);
    margin-inline: calc(var(--space-3) * -1);
  }
  .stelsm-bottom-nav__item { min-height: var(--touch-target); }
}

/* ==========================================================================
   17. POLISH PASS — QA report #2 (B1, B4, B6, §17, §34)
   --------------------------------------------------------------------------
   ext/stelsm/theme/stelsm-blocks.css is loaded AFTER this file, so every rule
   that has to beat it is scoped with a second class or an extra element.
   ========================================================================== */

/* --- B1 (§27): compact buttons must reach >= 40px on desktop ------------ */
/* ext ships .stelsm-btn--sm { height: 34px }; a min-height with higher
   specificity (0,2,0) wins over both the 34px desktop and 44px mobile rules. */
.stelsm-btn.stelsm-btn--sm { min-height: 40px; }

/* --- B4 (§15, §69): index meta line (prosilver "current time") ---------- */
/* prosilver prints <p class="right responsive-center time"> as the first child
   of #page-body and it kept body typography (15.4px, text colour, right/center
   aligned). Turn it into a quiet, left-aligned meta row. */
.page-body > p.time {
  margin: 0 0 var(--space-3);
  padding: 0;
  font-size: var(--text-xs);
  font-weight: var(--weight-medium);
  line-height: 1.4;
  color: var(--text-tertiary);
  text-align: left;
}

/* --- B6 (§41): dark-safe coloured usernames (WCAG AA >= 4.5:1) ---------- */
/* Group/user colours arrive as an inline style from the DB
   (style="color: #AA0000"), so only !important can re-map them. Known phpBB
   group colours get an accessible dark variant; any other custom colour falls
   back to the accent, which is AA-safe on dark surfaces. Light theme untouched. */
[data-theme="dark"] .username-coloured {
  color: var(--username-safe-default) !important;
}
[data-theme="dark"] .username-coloured[style*="#AA0000"],
[data-theme="dark"] .username-coloured[style*="#aa0000"] {
  color: var(--username-safe-admin) !important;
}
[data-theme="dark"] .username-coloured[style*="#00AA00"],
[data-theme="dark"] .username-coloured[style*="#00aa00"] {
  color: var(--username-safe-mod) !important;
}
[data-theme="dark"] .username-coloured[style*="#9E8DA7"],
[data-theme="dark"] .username-coloured[style*="#9e8da7"] {
  color: var(--username-safe-bot) !important;
}

/* --- §17: forum rows as designed tiles (48x48 accent tile, 60-68px row) -- */
/* A standalone section heading keeps the category title and the all-forums
   affordance outside the bordered forum card. */
.stelsm-forum-section-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  margin: var(--space-6) 0 var(--space-3);
}

.stelsm-forum-section-head h2 {
  margin: 0;
  font-family: var(--font-sans);
  font-size: 18px;
  font-weight: var(--weight-semibold);
  line-height: var(--leading-tight);
  color: var(--text-primary);
}

.stelsm-forum-section-head__all {
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: var(--weight-medium);
  color: var(--accent-text);
}

/* Replaces the prosilver folder GIF on the forum list only (index); topic
   lists in viewforum keep their own prosilver icons. */
ul.topiclist.forums dl.row-item {
  background-image: none;
  min-height: 60px;
}

ul.topiclist.forums dl.row-item dt,
ul.topiclist.forums dl.row-item dd {
  min-height: 60px;
}

ul.topiclist.forums dl.row-item dt .list-inner { padding-left: 60px; }

/* The category label shares the forum-title left edge. */
ul.topiclist li.header dt .stelsm-forum-category-title {
  padding-left: 60px;
  text-align: left;
}

/* Tile + Lucide icon (icon is a mask so it follows the theme tokens). */
ul.topiclist.forums dl.row-item::before,
ul.topiclist.forums dl.row-item::after {
  content: "";
  position: absolute;
  left: 8px;
  top: 50%;
  width: 48px;
  height: 48px;
  margin-top: -24px;
  pointer-events: none;
}

ul.topiclist.forums dl.row-item::before {
  border-radius: var(--radius-md);
  background-color: var(--accent-strong);
}

ul.topiclist.forums dl.row-item::after {
  background-color: var(--on-accent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M21%2015a2%202%200%200%201-2%202H7l-4%204V5a2%202%200%200%201%202-2h14a2%202%200%200%201%202%202z'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M21%2015a2%202%200%200%201-2%202H7l-4%204V5a2%202%200%200%201%202-2h14a2%202%200%200%201%202%202z'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
}

/* All rows use the same solid tile; unread state is a separate dot. */
ul.topiclist.forums dl.row-item.forum_unread::before,
ul.topiclist.forums dl.row-item.forum_unread_locked::before,
ul.topiclist.forums dl.row-item.forum_unread_subforum::before {
  background-color: var(--accent-strong);
}

ul.topiclist.forums dl.row-item.forum_unread::after,
ul.topiclist.forums dl.row-item.forum_unread_locked::after,
ul.topiclist.forums dl.row-item.forum_unread_subforum::after {
  background-color: var(--on-accent);
}

.stelsm-forum-unread-dot {
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: var(--space-2);
  border-radius: 50%;
  background-color: var(--accent-strong);
  vertical-align: 2px;
}

/* Locked forums: lock glyph. */
ul.topiclist.forums dl.row-item.forum_read_locked::after,
ul.topiclist.forums dl.row-item.forum_unread_locked::after {
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20width='18'%20height='11'%20x='3'%20y='11'%20rx='2'%20ry='2'/%3E%3Cpath%20d='M7%2011V7a5%205%200%200%201%2010%200v4'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Crect%20width='18'%20height='11'%20x='3'%20y='11'%20rx='2'%20ry='2'/%3E%3Cpath%20d='M7%2011V7a5%205%200%200%201%2010%200v4'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
}

/* Link forums keep the common solid tile and use an external-link glyph. */
ul.topiclist.forums dl.row-item.forum_link::before {
  background-color: var(--accent-strong);
}

ul.topiclist.forums dl.row-item.forum_link::after {
  background-color: var(--on-accent);
  -webkit-mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M15%203h6v6'/%3E%3Cpath%20d='M10%2014%2021%203'/%3E%3Cpath%20d='M18%2013v6a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V8a2%202%200%200%201%202-2h6'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%20fill='none'%20stroke='%23000'%20stroke-width='2'%20stroke-linecap='round'%20stroke-linejoin='round'%3E%3Cpath%20d='M15%203h6v6'/%3E%3Cpath%20d='M10%2014%2021%203'/%3E%3Cpath%20d='M18%2013v6a2%202%200%200%201-2%202H5a2%202%200%200%201-2-2V8a2%202%200%200%201%202-2h6'/%3E%3C/svg%3E") center / 24px 24px no-repeat;
}

/* Keep the counts and the last-post block compact so the row lands at 60-68px
   without touching the functionality (topics / posts / last post / subject). */
ul.topiclist.forums dd.topics,
ul.topiclist.forums dd.posts {
  font-size: var(--text-md);
  line-height: 1.2;
}

ul.topiclist.forums dd.lastpost {
  align-items: center;
  gap: var(--space-2);
  font-size: var(--text-xs);
  line-height: 1.4;
}

/* prosilver removes every topic-list column and its .list-inner reservation at
   <=700px.  Do not resurrect lastpost at 551px: without the matching reserve it
   is laid over the forum description. */
@media (min-width: 701px) {
  ul.topiclist.forums dd.lastpost { display: flex; }
}

/* At 1024–1279px the club sidebar leaves the index forum card only about
   532–771px wide.  prosilver still selects its >950px, 440px-reserve layout
   because its media queries follow the viewport rather than this narrower
   content column.  Use prosilver's own compact contract here: hide all three
   columns and release both negative/positive reserves together. */
@media (min-width: 1024px) and (max-width: 1279px) {
  .forabg ul.topiclist li.header dd.topics,
  .forabg ul.topiclist li.header dd.posts,
  .forabg ul.topiclist li.header dd.lastpost,
  .forabg ul.topiclist.forums dd.topics,
  .forabg ul.topiclist.forums dd.posts,
  .forabg ul.topiclist.forums dd.lastpost {
    display: none !important;
  }

  .forabg ul.topiclist li.header dt,
  .forabg ul.topiclist li.header dt .list-inner,
  .forabg ul.topiclist.forums dt,
  .forabg ul.topiclist.forums dt .list-inner {
    margin-right: 0 !important;
  }
}

/* Dedicated §23 counter; unlike prosilver's `.responsive-show`, it is outside
   the clamped description flow and remains available in compact desktop. */
.stelsm-forum-description { display: block; }
.stelsm-forum-compact-meta { display: none; }

@media (min-width: 1024px) and (max-width: 1279px) {
  ul.topiclist.forums dt .list-inner {
    position: relative;
    padding-right: 92px;
  }

  .stelsm-forum-compact-meta {
    position: absolute;
    top: 50%;
    right: 10px;
    display: inline-flex;
    align-items: center;
    gap: var(--space-2);
    transform: translateY(-50%);
    font-size: var(--text-sm);
    font-weight: var(--weight-semibold);
    color: var(--text-secondary);
    white-space: nowrap;
  }

  .stelsm-forum-description {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .stelsm-forum-details { display: none; }
}

.stelsm-forum-chevron {
  font-size: 22px;
  line-height: 1;
  color: var(--icon-secondary);
}

/* D-1 (wave 6): prosilver content.css `dd.lastpost > span { display:block;
   padding-left:5px }` (0,1,1) beats the single-class `display:inline-flex`
   of .stelsm-avatar / .stelsm-avatar--fallback (0,1,0). With display:block the
   align-items/justify-content were inert and the inline SVG sat in the top-left
   corner of the 32x32 disc (ink centre offset ~(-6,-6)px, up to 12px of ink
   outside the circle). This 0,4,2 selector restores the flex centring. */
ul.topiclist.forums dd.lastpost .stelsm-forum-lastpost-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex: 0 0 32px;
  padding: 0;
  box-sizing: border-box;
}

ul.topiclist.forums dd.lastpost .stelsm-forum-lastpost-avatar .stelsm-avatar__icon {
  width: 20px;
  height: 20px;
}

ul.topiclist.forums dd.lastpost .stelsm-forum-lastpost-copy {
  min-width: 0;
  padding-left: 0;
}

ul.topiclist.forums dd.lastpost .lastsubject { font-size: var(--text-sm); }

/* --- §34: avatar fallback (silhouette) + sizes (post 44px / lists 32px) -- */
.stelsm-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  border-radius: 50%;
  background-color: var(--accent-soft);
  color: var(--accent-on-soft);
}

/* §34 — the fallback must read as an AVATAR in both palettes, not as an empty
   hole.  The extension (stelsm-blocks.css) ships .stelsm-avatar--fallback with
   --bg-surface-muted / --icon-secondary and is loaded after this file; that
   disc measured only 1.11:1 (light) / 1.13:1 (dark) against the row surface
   and in dark mode it also dropped the accent pair for plain grey.
   The leading `html` keeps specificity above the extension's 0-1-0 rule
   whatever the cascade order, and the colours resolve per palette through the
   tokens:
     light  #B83D00 on #FFF0E6                    = 5.09:1
     dark   #FF5A0A on rgba(255,90,10,.15)/#131A20 = 4.71:1
   The 1px inset ring (currentColor) gives the 32px disc a defined edge so the
   circle itself is visible: ring vs surface = 5.67:1 (light) / 6.07:1 (dark).
   NB: the mobile "recent topics" fallback is emitted by the extension with the
   modifier class only (no .stelsm-avatar), hence the single-class selector. */
html .stelsm-avatar--fallback {
  background: var(--accent-soft);
  color: var(--accent-on-soft);
  box-shadow: inset 0 0 0 1px currentColor;
}

/* Same glyph size/weight for every fallback context (list 32px, recent 32px,
   post 44px).  CSS overrides the SVG stroke-width presentation attribute, so
   the extension's 18px/1.8px glyph is normalised to 20px/2.2 too. */
html .stelsm-avatar--fallback svg {
  width: 20px;
  height: 20px;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* The extension defines the same fallback class later for 32px recent-list
   avatars. The post-card variant is deliberately more specific: §34 requires
   44px in a desktop post while recent lists stay at 32px. */
.post-head .stelsm-avatar.stelsm-avatar--fallback {
  width: 44px;
  height: 44px;
  background-color: var(--accent-soft);
  color: var(--accent-on-soft);
}

.stelsm-avatar.stelsm-avatar--fallback .stelsm-avatar__icon {
  width: 22px;
  height: 22px;
}

.stelsm-avatar--sm,
body.section-search .postprofile .stelsm-avatar {
  width: 32px;
  height: 32px;
}

.stelsm-avatar--sm .stelsm-avatar__icon,
body.section-search .postprofile .stelsm-avatar .stelsm-avatar__icon {
  width: 16px;
  height: 16px;
}

/* Lists (§34): avatars in search results / narrow profiles are 32px.
   DEF-2 (wave 7): same prosilver `height: auto !important` clamp as the post
   card, so these need the !important + square box + cover crop as well. */
body.section-search .postprofile .avatar img {
  width: 32px !important;
  height: 32px !important;
  max-width: none;
  max-height: none;
  object-fit: cover;
}

/* Mobile adjustments for the polish blocks. */
@media (max-width: 767px) {
  /* §17 (§23): 40px tile and a deterministic 66px outer row.  The row has
     two 1px borders, so its margin-free content box is 64px.  All desktop
     columns are removed together, including the 701-767px prosilver reserve. */
  .forabg ul.topiclist.forums li.row {
    height: 66px;
    box-sizing: border-box;
  }

  ul.topiclist.forums dl.row-item,
  ul.topiclist.forums dl.row-item dt {
    height: 64px;
    min-height: 64px;
    max-height: 64px;
  }

  ul.topiclist.forums li.row dl.row-item {
    margin-top: 0;
    margin-bottom: 0;
  }

  .forabg ul.topiclist li.header dd.topics,
  .forabg ul.topiclist li.header dd.posts,
  .forabg ul.topiclist li.header dd.lastpost,
  .forabg ul.topiclist.forums dd.topics,
  .forabg ul.topiclist.forums dd.posts,
  .forabg ul.topiclist.forums dd.lastpost,
  .forabg ul.topiclist.forums dd.redirect { display: none !important; }

  .forabg ul.topiclist li.header dt,
  .forabg ul.topiclist li.header dt .list-inner,
  .forabg ul.topiclist.forums dt,
  .forabg ul.topiclist.forums dt .list-inner {
    margin-right: 0 !important;
  }

  ul.topiclist.forums dl.row-item dt .list-inner {
    position: relative;
    height: 64px;
    min-height: 64px;
    padding: 8px 128px 8px 52px;
    box-sizing: border-box;
    overflow: hidden;
  }
  ul.topiclist li.header dt .stelsm-forum-category-title {
    padding-left: 52px;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: normal;
    word-break: normal;
    white-space: nowrap;
  }

  .stelsm-forum-copy { min-width: 0; }

  .stelsm-forum-title-line {
    display: flex;
    align-items: center;
    min-width: 0;
    height: 25px;
  }

  ul.topiclist.forums .stelsm-forum-title-line .forumtitle {
    display: block;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: normal;
    word-break: normal;
    white-space: nowrap;
  }

  .stelsm-forum-description {
    display: block;
    height: 21px;
    overflow: hidden;
    text-overflow: ellipsis;
    overflow-wrap: normal;
    word-break: normal;
    white-space: nowrap;
    font-size: var(--text-xs);
    line-height: 21px;
    color: var(--text-secondary);
  }

  .stelsm-forum-details,
  ul.topiclist.forums .responsive-show { display: none !important; }

  .stelsm-forum-compact-meta {
    position: absolute;
    top: 50%;
    right: 8px;
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    max-width: none;
    transform: translateY(-50%);
    overflow: visible;
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    color: var(--text-secondary);
    white-space: nowrap;
  }

  ul.topiclist.forums dl.row-item::before,
  ul.topiclist.forums dl.row-item::after {
    left: 6px;
    width: 40px;
    height: 40px;
    margin-top: -20px;
  }

  ul.topiclist.forums dl.row-item::after {
    -webkit-mask-size: 24px 24px;
    mask-size: 24px 24px;
  }

  /* §34: mobile post avatar 36px. */
  .post-head .postprofile dt .stelsm-avatar { width: 36px; height: 36px; }
  .post-head .postprofile dt .stelsm-avatar .stelsm-avatar__icon { width: 18px; height: 18px; }
}

/* ==========================================================================
   18. FINAL FORUM-ROW LAYOUT — QA #8
   --------------------------------------------------------------------------
   The index uses one compact contract through 1279px.  The native prosilver
   columns return only at the design-system desktop breakpoint (1280px).
   Every forum row has a deterministic 66px outer height; variable copy is
   ellipsized inside that box instead of changing the row geometry.
   ========================================================================== */

/* Category names must never force the column header taller or break inside a
   word. The complete name remains in the link text/title for assistive and
   pointer access. */
.forabg ul.topiclist li.header .stelsm-forum-category-title {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  word-break: normal;
  white-space: nowrap;
}

/* §17/§23/§43: 64px content plus the row's two one-pixel borders. */
.forabg ul.topiclist.forums li.row {
  height: 66px;
  box-sizing: border-box;
  overflow: hidden;
}

.forabg ul.topiclist.forums li.row dl.row-item,
.forabg ul.topiclist.forums li.row dl.row-item dt,
.forabg ul.topiclist.forums li.row dl.row-item dd {
  height: 64px;
  min-height: 64px;
  max-height: 64px;
  box-sizing: border-box;
}

.forabg ul.topiclist.forums li.row dl.row-item {
  margin-top: 0;
  margin-bottom: 0;
  overflow: hidden;
}

.forabg ul.topiclist.forums li.row dl.row-item dd {
  margin-bottom: 0;
  padding-top: 8px;
  padding-bottom: 8px;
  overflow: hidden;
}

/* Keep the last-post avatar clear of the column divider in both themes. */
.forabg ul.topiclist.forums li.row dl.row-item dd.lastpost {
  padding-left: 10px;
}

.forabg ul.topiclist.forums li.row dt .list-inner {
  height: 64px;
  min-height: 64px;
  padding-top: 8px;
  padding-bottom: 8px;
  box-sizing: border-box;
  overflow: hidden;
}

.stelsm-forum-copy { min-width: 0; overflow: hidden; }

.stelsm-forum-title-line {
  display: flex;
  align-items: center;
  min-width: 0;
  height: 25px;
  overflow: hidden;
}

ul.topiclist.forums .stelsm-forum-title-line .forumtitle,
ul.topiclist.forums .stelsm-forum-description {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  word-break: normal;
  white-space: nowrap;
}

ul.topiclist.forums .stelsm-forum-title-line .forumtitle {
  line-height: 23px;
}

ul.topiclist.forums .stelsm-forum-description {
  height: 21px;
  font-size: var(--text-xs);
  line-height: 21px;
  color: var(--text-secondary);
}

/* Keep subject, author and date inside the fixed row. The subject must remain
   inline: making it a block adds an empty line before the template's <br>. */
ul.topiclist.forums dd.lastpost .stelsm-forum-lastpost-copy {
  display: block;
  min-width: 0;
  max-height: 48px;
  overflow: hidden;
  line-height: 16px;
}

ul.topiclist.forums dd.lastpost .lastsubject {
  display: inline;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  word-break: normal;
  white-space: nowrap;
}

/* Mobile, tablet and compact desktop all use the same no-column contract.
   This intentionally overrides prosilver's 701–950px 80px column rule. */
@media (max-width: 1279px) {
  .forabg ul.topiclist li.header dd.topics,
  .forabg ul.topiclist li.header dd.posts,
  .forabg ul.topiclist li.header dd.lastpost,
  .forabg ul.topiclist.forums dd.topics,
  .forabg ul.topiclist.forums dd.posts,
  .forabg ul.topiclist.forums dd.lastpost,
  .forabg ul.topiclist.forums dd.redirect {
    display: none !important;
  }

  .forabg ul.topiclist li.header dt,
  .forabg ul.topiclist li.header dt .list-inner,
  .forabg ul.topiclist.forums dt,
  .forabg ul.topiclist.forums dt .list-inner {
    margin-right: 0 !important;
  }

  .forabg ul.topiclist li.header dt .stelsm-forum-category-title {
    padding-right: var(--space-2);
  }

  .forabg ul.topiclist.forums dt .list-inner {
    position: relative;
    padding-right: 128px;
  }

  .stelsm-forum-compact-meta {
    position: absolute;
    top: 50%;
    right: 8px;
    display: inline-flex;
    align-items: center;
    gap: var(--space-1);
    max-width: 120px;
    transform: translateY(-50%);
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: var(--text-xs);
    font-weight: var(--weight-semibold);
    color: var(--text-secondary);
    white-space: nowrap;
  }

  .stelsm-forum-compact-meta > span:first-child {
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .stelsm-forum-chevron { flex: 0 0 auto; }
  .stelsm-forum-details,
  ul.topiclist.forums .responsive-show { display: none !important; }
}

/* Full desktop: preserve all native columns and give their labels a small,
   explicit inset so POSTS and LAST_POST cannot visually run together. */
@media (min-width: 1280px) {
  .forabg ul.topiclist li.header dd.topics,
  .forabg ul.topiclist li.header dd.posts {
    padding-left: 0;
    padding-right: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .forabg ul.topiclist li.header dd.lastpost {
    padding-left: 8px;
    padding-right: 8px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .forabg ul.topiclist li.header dd.lastpost > span {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .forabg ul.topiclist.forums dd.topics,
  .forabg ul.topiclist.forums dd.posts {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}

/* QA #9: topic-list rows use the same deterministic height as forum rows. */
.forumbg ul.topiclist.topics li.row {
  height: 66px;
  box-sizing: border-box;
  overflow: hidden;
}

.forumbg ul.topiclist.topics li.row dl.row-item,
.forumbg ul.topiclist.topics li.row dl.row-item dt,
.forumbg ul.topiclist.topics li.row dl.row-item dd {
  height: 64px;
  min-height: 64px;
  max-height: 64px;
  box-sizing: border-box;
  overflow: hidden;
}

.forumbg ul.topiclist.topics li.row dl.row-item {
  margin-top: 0;
  margin-bottom: 0;
}

.forumbg ul.topiclist.topics li.row dt .list-inner {
  height: 64px;
  min-height: 64px;
  padding-top: 8px;
  padding-bottom: 8px;
  box-sizing: border-box;
  overflow: hidden;
}

/* A topic title and its author/date metadata share the 48px content area.
   Suppress the now-redundant template <br> after the block ellipsis title. */
.forumbg ul.topiclist.topics li.row dt .list-inner > a.topictitle {
  display: block;
  max-width: 100%;
  line-height: 24px;
  overflow: hidden;
  text-overflow: ellipsis;
  overflow-wrap: normal;
  word-break: normal;
  white-space: nowrap;
}

.forumbg ul.topiclist.topics li.row dt .list-inner > a.topictitle + br {
  display: none;
}

/* At compact widths, topic lists must not retain prosilver's narrow 80px
   counter columns: Russian labels otherwise break inside a word. */
@media (max-width: 1279px) {
  .forumbg ul.topiclist li.header dd.posts,
  .forumbg ul.topiclist li.header dd.views,
  .forumbg ul.topiclist li.header dd.lastpost,
  .forumbg ul.topiclist.topics dd.posts,
  .forumbg ul.topiclist.topics dd.views,
  .forumbg ul.topiclist.topics dd.lastpost {
    display: none !important;
  }

  .forumbg ul.topiclist li.header dt,
  .forumbg ul.topiclist li.header dt .list-inner,
  .forumbg ul.topiclist.topics dt,
  .forumbg ul.topiclist.topics dt .list-inner {
    margin-right: 0 !important;
  }

  .forumbg ul.topiclist li.header dt .list-inner {
    overflow: hidden;
    overflow-wrap: normal;
    word-break: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
}

/* ========================================================================
   19. PRODUCTION POLISH — QA #11 (DEF-5, DEF-6)
   ======================================================================== */

/* A real inline formatting box cannot apply overflow or text-overflow.
   Keep the template's following <br> behavior, but give long subjects a
   measurable box so they ellipsize instead of escaping the last-post cell. */
ul.topiclist.forums dd.lastpost .lastsubject {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: top;
  white-space: nowrap;
}

/* At the prosilver phone breakpoint the topic metadata is rendered inside
   dt (.responsive-show), not in the hidden dd columns. It needs three text
   lines at minimum: title, last post/date and replies. Forum-index rows are
   intentionally excluded and retain their fixed 66px contract. */
@media (max-width: 700px) {
  .forumbg ul.topiclist.topics li.row {
    height: auto;
    min-height: 66px;
    overflow: visible;
  }

  .forumbg ul.topiclist.topics li.row dl.row-item,
  .forumbg ul.topiclist.topics li.row dl.row-item dt,
  .forumbg ul.topiclist.topics li.row dl.row-item dd {
    height: auto;
    min-height: 64px;
    max-height: none;
    overflow: visible;
  }

  .forumbg ul.topiclist.topics li.row dt .list-inner {
    height: auto;
    min-height: 64px;
    max-height: none;
    overflow: hidden;
  }
}

/* DEF-1: keep per-topic pagination on the title track at compact desktop
   widths. The last-post date owns the 24px metadata track below it. Reserving
   the widest pagination seen on the real forum also keeps the title from
   painting underneath the absolutely positioned controls. `white-space:
   nowrap` additionally pins the chips to that single title line, so an
   unexpectedly wide pagination can never wrap down onto the date track.
   D-3 (wave 6): the two-line compact row layout lives up to 1279px (see the
   701-1279 metadata block above), so this reservation and the absolute chip
   position must cover the whole compact range. At 1024-1279 the pagination
   used to stay static and fell onto the absolutely positioned dd.lastpost
   (box overlap up to 175.5 x 21px). */
@media (min-width: 701px) and (max-width: 1279px) {
  .forumbg ul.topiclist.topics li.row dt .list-inner {
    padding-right: 196px;
  }

  .forumbg ul.topiclist.topics li.row .pagination {
    position: absolute;
    top: 4px;
    right: 8px;
    float: none;
    margin: 0;
    white-space: nowrap;
  }
}

/* D-4 (wave 6): the DEF-1 title-line geometry stopped at 1279px, so from
   1280px the pagination stayed in prosilver's float flow and dropped onto the
   metadata line (36..60px from the row top) instead of the title line (9..33px).
   Anchor it to the title track (.list-inner, whose right edge is the left edge
   of the 250px last-post column) so the chips can never cross dd.lastpost, and
   reserve the same 196px on the title so it cannot paint underneath them. */
@media (min-width: 1280px) {
  .forumbg ul.topiclist.topics li.row dt .list-inner {
    position: relative;
    padding-right: 196px;
  }

  .forumbg ul.topiclist.topics li.row .pagination {
    position: absolute;
    top: 4px;
    right: 8px;
    float: none;
    margin: 0;
    white-space: nowrap;
  }
}

/* Wave 2 cascade lock: these geometry rules intentionally live last because
   the historical QA sections above also own forum/header dimensions. */
@media (min-width: 1280px) {
  .forabg ul.topiclist.forums li.row,
  .forabg ul.topiclist.forums li.row dl.row-item,
  .forabg ul.topiclist.forums li.row dl.row-item dt,
  .forabg ul.topiclist.forums li.row dl.row-item dd,
  .forabg ul.topiclist.forums li.row dt .list-inner {
    height: auto;
    max-height: none;
  }
  .forabg ul.topiclist.forums li.row { min-height: 66px; }
  .forabg ul.topiclist.forums li.row dl.row-item,
  .forabg ul.topiclist.forums li.row dl.row-item dt,
  .forabg ul.topiclist.forums li.row dl.row-item dd,
  .forabg ul.topiclist.forums li.row dt .list-inner { min-height: 64px; }

  .forumbg.announcement ul.topiclist.topics li.row,
  .forumbg ul.topiclist.topics li.row.sticky,
  .forumbg ul.topiclist.topics li.row.announce,
  .forumbg ul.topiclist.topics li.row.global-announce,
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item,
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item dt,
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item dd,
  .forumbg.announcement ul.topiclist.topics li.row dt .list-inner,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item dt,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.sticky dt .list-inner,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item dt,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.announce dt .list-inner {
    height: auto;
    max-height: none;
    overflow: visible;
  }

  /* Type rows receive one spacing step more than ordinary 66px rows. Keep
     every native desktop column on the same track; only ordinary rows remain
     at 66px. */
  .forumbg.announcement ul.topiclist.topics li.row,
  .forumbg ul.topiclist.topics li.row.sticky,
  .forumbg ul.topiclist.topics li.row.announce,
  .forumbg ul.topiclist.topics li.row.global-announce {
    height: 74px;
    min-height: 74px;
    overflow: hidden;
  }
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item,
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item dt,
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item dd,
  .forumbg.announcement ul.topiclist.topics li.row dt .list-inner,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item dt,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.sticky dt .list-inner,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item dt,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.announce dt .list-inner,
  .forumbg ul.topiclist.topics li.row.global-announce dl.row-item,
  .forumbg ul.topiclist.topics li.row.global-announce dl.row-item dt,
  .forumbg ul.topiclist.topics li.row.global-announce dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.global-announce dt .list-inner {
    height: 72px;
    min-height: 72px;
    max-height: 72px;
    overflow: hidden;
  }
  .forumbg.announcement ul.topiclist.topics li.row dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.sticky dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.announce dl.row-item dd,
  .forumbg ul.topiclist.topics li.row.global-announce dl.row-item dd {
    margin-bottom: 0;
    padding-top: 8px;
    padding-bottom: 8px;
  }
}

#page-header .stelsm-usernav > li.responsive-menu.hidden { display: none; }

@media (max-width: 767px) {
  #page-header .stelsm-burger {
    position: absolute;
    left: var(--mobile-pad);
    top: 50%;
    z-index: 1;
    transform: translateY(-50%);
  }
  #page-header .headerbar .inner {
    width: 100%;
    min-width: 0;
    padding-left: calc(var(--mobile-pad) + var(--touch-target) + var(--space-2));
  }
  #page-header .site-description { column-gap: var(--space-2); }
  #page-header .site-description .logo { min-width: 32px; min-height: 32px; }
  #page-header .site-description .site_logo { width: 32px; height: 32px; }
  #page-header .site-description h1 {
    font-size: var(--text-lg);
    line-height: 1.05;
    overflow-wrap: normal;
    word-break: normal;
  }
  #page-header .stelsm-theme-toggle { display: none; }

  body .stelsm-hero__inner { width: calc(100% - var(--mobile-pad) * 2); }
  body .stelsm-hero__content { min-width: 0; max-width: 58%; }
  body .stelsm-hero__title { max-width: 100%; font-size: clamp(30px, 8.5vw, 36px); overflow: visible; }

  body .stelsm-stats__list {
    grid-auto-flow: row;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    width: 100%;
  }
  body .stelsm-stat { min-width: 0; padding-inline: var(--space-2); }
  body .stelsm-tab { min-width: 0; padding-inline: var(--space-1); overflow: hidden; text-overflow: ellipsis; }
}

/* ========================================================================
   22. PRODUCTION FIXES — wave 3 (D1-D5)
   ======================================================================== */
@media (min-width: 701px) and (max-width: 1279px) {
  /* Reply labels are content-sized; the following last-post track starts
     after the widest observed Russian counter instead of the old 50px box. */
  .forumbg ul.topiclist.topics li.row dl.row-item {
    --topic-meta-lastpost-offset: 124px;
  }

  body .forumbg ul.topiclist.topics li.row dl.row-item dd.posts {
    width: max-content;
    min-width: max-content;
  }

  /* Type rows append “in forum …” to the author/date string. Keep that
     intrinsic string intact and move the two following tracks after it. */
  .forumbg.announcement ul.topiclist.topics .topic-poster,
  .forumbg ul.topiclist.topics li.row.sticky .topic-poster,
  .forumbg ul.topiclist.topics li.row.announce .topic-poster,
  .forumbg ul.topiclist.topics li.row.global-announce .topic-poster {
    width: max-content;
    max-width: none;
    overflow: visible;
  }

  .forumbg.announcement ul.topiclist.topics .topic-poster a,
  .forumbg.announcement ul.topiclist.topics .topic-poster .username,
  .forumbg.announcement ul.topiclist.topics .topic-poster .username-coloured,
  .forumbg ul.topiclist.topics li.row.sticky .topic-poster a,
  .forumbg ul.topiclist.topics li.row.sticky .topic-poster .username,
  .forumbg ul.topiclist.topics li.row.sticky .topic-poster .username-coloured,
  .forumbg ul.topiclist.topics li.row.announce .topic-poster a,
  .forumbg ul.topiclist.topics li.row.announce .topic-poster .username,
  .forumbg ul.topiclist.topics li.row.announce .topic-poster .username-coloured,
  .forumbg ul.topiclist.topics li.row.global-announce .topic-poster a,
  .forumbg ul.topiclist.topics li.row.global-announce .topic-poster .username,
  .forumbg ul.topiclist.topics li.row.global-announce .topic-poster .username-coloured {
    flex: 0 0 auto;
    min-width: max-content;
    overflow: visible;
    text-overflow: clip;
  }

  body .forumbg.announcement ul.topiclist.topics li.row dl.row-item dd.posts,
  body .forumbg ul.topiclist.topics li.row.sticky dl.row-item dd.posts,
  body .forumbg ul.topiclist.topics li.row.announce dl.row-item dd.posts,
  body .forumbg ul.topiclist.topics li.row.global-announce dl.row-item dd.posts {
    left: 345px;
  }

  body .forumbg.announcement ul.topiclist.topics li.row dl.row-item dd.lastpost,
  body .forumbg ul.topiclist.topics li.row.sticky dl.row-item dd.lastpost,
  body .forumbg ul.topiclist.topics li.row.announce dl.row-item dd.lastpost,
  body .forumbg ul.topiclist.topics li.row.global-announce dl.row-item dd.lastpost {
    left: 413px;
  }

  /* Pagination belongs to the title line. Reserve its width there so it never
     drops onto the second-line date at compact desktop widths. */
  .forumbg.announcement ul.topiclist.topics li.row dt .list-inner,
  .forumbg ul.topiclist.topics li.row.sticky dt .list-inner,
  .forumbg ul.topiclist.topics li.row.announce dt .list-inner,
  .forumbg ul.topiclist.topics li.row.global-announce dt .list-inner {
    margin-right: 0 !important;
    padding-right: 198px;
  }

  .forumbg.announcement ul.topiclist.topics li.row dt .list-inner > .pagination,
  .forumbg ul.topiclist.topics li.row.sticky dt .list-inner > .pagination,
  .forumbg ul.topiclist.topics li.row.announce dt .list-inner > .pagination,
  .forumbg ul.topiclist.topics li.row.global-announce dt .list-inner > .pagination {
    position: absolute;
    top: 4px;
    right: 8px;
    margin: 0;
  }

  body .forumbg.announcement ul.topiclist.topics li.row dl.row-item dd.lastpost dfn,
  body .forumbg ul.topiclist.topics li.row.sticky dl.row-item dd.lastpost dfn,
  body .forumbg ul.topiclist.topics li.row.announce dl.row-item dd.lastpost dfn,
  body .forumbg ul.topiclist.topics li.row.global-announce dl.row-item dd.lastpost dfn {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }
}

@media (max-width: 479px) {
  #page-header .site-description {
    max-height: none;
    overflow: visible;
  }

  #page-header .site-description h1 {
    display: block;
    max-height: none;
    overflow: visible;
    font-size: 16px;
    line-height: 18px;
    overflow-wrap: normal;
    word-break: normal;
    -webkit-box-orient: initial;
    -webkit-line-clamp: unset;
  }

  #page-header .headerbar .inner {
    height: auto;
    min-height: var(--header-h-mobile);
    padding-top: var(--space-2);
    padding-bottom: var(--space-2);
    box-sizing: border-box;
  }
}

@media (max-width: 700px) {
  /* Forum descriptions can contain long profile/member links. Mobile rows
     grow with wrapped copy instead of clipping that content to one line. */
  .forabg ul.topiclist.forums li.row,
  .forabg ul.topiclist.forums li.row dl.row-item,
  .forabg ul.topiclist.forums li.row dl.row-item dt,
  .forabg ul.topiclist.forums li.row dt .list-inner {
    height: auto;
    max-height: none;
  }

  .forabg ul.topiclist.forums li.row {
    min-height: 66px;
  }

  .forabg ul.topiclist.forums li.row dl.row-item,
  .forabg ul.topiclist.forums li.row dl.row-item dt,
  .forabg ul.topiclist.forums li.row dt .list-inner {
    min-height: 64px;
  }

  ul.topiclist.forums .stelsm-forum-description {
    height: auto;
    overflow: visible;
    text-overflow: clip;
    overflow-wrap: anywhere;
    word-break: normal;
    white-space: normal;
  }

  ul.topiclist.forums .stelsm-forum-description a {
    overflow-wrap: anywhere;
    word-break: break-word;
  }
}

/* ========================================================================
   WAVE 7 — DEF-1: six-chip topic pagination on a single line at the narrow edge
   ------------------------------------------------------------------------
   At <=429px the per-topic pagination is a right float inside the topic
   `.list-inner`.  That track is `viewport - 97px` wide (prosilver's 52px
   folder-icon padding-left + 5px padding-right), i.e. 293px at 390 and 263px
   at 360, while one chip is 44px min-width + 3px + 3px padding + 1px + 1px
   border = 52px.  Six chips therefore need 312px, so the sixth (and sometimes
   the fifth) wrapped onto a second line: measured at 320-414px all ten 6-chip
   rows on two chip lines, pagination 119.11px high, row 236.44px.

   Fix, in this order:
   1. lay the list out as one `nowrap` flex line, which also removes the
      ~4.2px inline-block word gaps between chips.  `overflow-x: auto`
      (scrollbar hidden) is the safety net: a pagination that still cannot fit
      scrolls inside the row instead of overlapping the folder icon;
   2. reclaim the 5px right inset so the chip track is `viewport - 92px`;
   3. turn the chip into a 44x44 border-box - the 3px horizontal padding moves
      inside the touch target, so the target stays exactly 44x44 and never
      drops below the 44px minimum.
   Six chips are then exactly 264px and fit at 360 (268px) and 390 (298px).
   Below ~356px six 44px targets cannot physically fit, so the container
   scrolls (36px at 320, 12px at 344) with no overlap; `margin-left: auto` on
   the first chip keeps the line flush right whenever it does fit.

   Scoped to <=429px on purpose.  Extending the flex line to 430-479px was
   measured and rejected: it removes the residual one-row wrap there but drops
   the `fa-clone` icon onto its own line, making those rows 23px taller
   (pagination 48 -> 71.11px, row 165.33 -> 188.44px).  That residual wrap is
   a separate, pre-existing cosmetic issue, reported as OBS-W7-1.
   ======================================================================== */
@media (max-width: 429px) {
  .forumbg ul.topiclist.topics li.row dt .list-inner { padding-right: 0; }

  .forumbg ul.topiclist.topics li.row .pagination {
    max-width: 100%;
    overflow-x: auto;
    overflow-y: hidden;
    scrollbar-width: none;
  }

  .forumbg ul.topiclist.topics li.row .pagination::-webkit-scrollbar { display: none; }

  .forumbg ul.topiclist.topics li.row .pagination > ul {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    margin: 0;
    width: max-content;
  }

  .forumbg ul.topiclist.topics li.row .pagination > ul > li { flex: 0 0 auto; }
  .forumbg ul.topiclist.topics li.row .pagination > ul > li:first-child { margin-left: auto; }

  .forumbg ul.topiclist.topics li.row .pagination li a,
  .forumbg ul.topiclist.topics li.row .pagination li span {
    box-sizing: border-box;
    min-width: 44px;
    min-height: 44px;
    padding-left: 0;
    padding-right: 0;
  }
}


/* stelsm-light/header.css */
/* STELSM header v1 — canonical component shared by light and dark styles. */

#page-header {
  --stelsm-header-ink: var(--text-primary);
  --stelsm-header-muted: var(--text-secondary);
  isolation: isolate;
  box-shadow: var(--shadow-sm);
}

[data-theme="dark"] #page-header {
  --stelsm-header-ink: #F9FBFC;
  --stelsm-header-muted: #C9D0D6;
  background: rgba(6, 10, 14, .98);
  border-bottom-color: rgba(255, 90, 10, .38);
  box-shadow: 0 10px 32px rgba(0, 0, 0, .42);
}

#page-header::after {
  content: "";
  position: absolute;
  inset: auto 0 -1px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent 0, var(--accent) 18%, transparent 54%);
  opacity: .55;
}

#page-header .headerbar .inner {
  gap: clamp(10px, 1.35vw, 20px);
}

#page-header .site-description {
  display: block;
  flex: 0 1 auto;
}

#page-header .site-description .logo {
  display: inline-flex;
  align-items: center;
  gap: 11px;
  min-width: 0;
  color: var(--stelsm-header-ink);
  text-decoration: none;
}

#page-header .site-description .site_logo {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  filter: drop-shadow(0 5px 10px rgba(255, 90, 10, .16));
}

.stelsm-brand {
  display: grid;
  min-width: 0;
  line-height: 1;
}

.stelsm-brand__name {
  max-width: 340px;
  overflow: hidden;
  color: var(--stelsm-header-ink);
  font-family: var(--font-sans);
  font-size: clamp(20px, 1.55vw, 25px);
  font-weight: var(--weight-heavy);
  letter-spacing: -.035em;
  line-height: 1.05;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.stelsm-brand__name::after {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 6px;
  border-radius: 50%;
  background: var(--accent);
  box-shadow: 0 0 0 4px var(--accent-soft);
  vertical-align: .12em;
}

.stelsm-brand__tagline {
  margin-top: 0;
  overflow: hidden;
  color: var(--stelsm-header-muted);
  font-size: 10px;
  font-weight: var(--weight-semibold);
  letter-spacing: .105em;
  line-height: 1.1;
  text-overflow: ellipsis;
  text-transform: uppercase;
  white-space: nowrap;
}

#page-header .stelsm-clubnav__link,
#page-header .stelsm-clubnav > li > a,
#page-header .stelsm-usernav > li > a {
  position: relative;
  border-radius: 0;
  color: var(--stelsm-header-muted);
}

[data-theme="dark"] #page-header .stelsm-clubnav__link:hover,
[data-theme="dark"] #page-header .stelsm-clubnav__link:focus-visible,
[data-theme="dark"] #page-header .stelsm-clubnav__link[aria-current="page"],
[data-theme="dark"] #page-header .stelsm-usernav > li > a:hover,
[data-theme="dark"] #page-header .stelsm-usernav > li > a:focus-visible {
  color: var(--stelsm-header-ink);
}

#page-header .stelsm-clubnav__link::after,
#page-header .stelsm-clubnav > li > a::after {
  content: "";
  position: absolute;
  right: 10px;
  bottom: 3px;
  left: 10px;
  height: 2px;
  border-radius: var(--radius-pill);
  background: var(--accent);
  opacity: 0;
  transform: scaleX(.35);
  transition: opacity var(--dur-hover) var(--ease-standard), transform var(--dur-hover) var(--ease-standard);
}

#page-header .stelsm-clubnav__link:hover::after,
#page-header .stelsm-clubnav__link:focus-visible::after,
#page-header .stelsm-clubnav__link[aria-current="page"]::after,
#page-header .stelsm-clubnav > li > a:hover::after,
#page-header .stelsm-clubnav > li > a:focus-visible::after {
  opacity: 1;
  transform: scaleX(1);
}

#page-header .stelsm-clubnav__link[aria-current="page"] {
  background: transparent;
  color: var(--stelsm-header-ink);
}

[data-theme="dark"] #page-header .stelsm-theme-toggle,
[data-theme="dark"] #page-header .stelsm-header-search {
  border-color: rgba(255, 255, 255, .14);
  background: #151C23;
  color: #F9FBFC;
}

#page-header :is(a, button, input):focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 3px;
  box-shadow: none;
}

@media (max-width: 767px) {
  #page-header .site-description { flex: 1 1 auto; }
  #page-header .site-description .logo { gap: 8px; min-height: var(--touch-target); }
  #page-header .site-description .site_logo { width: 32px; height: 32px; }
  .stelsm-brand { min-width: 0; }
  .stelsm-brand__tagline { max-width: min(43vw, 190px); font-size: 8px; line-height: 1.15; white-space: normal; }
  .stelsm-brand__name { max-width: min(46vw, 220px); font-size: 17px; }
  .stelsm-brand__name::after { width: 5px; height: 5px; margin-left: 4px; box-shadow: 0 0 0 3px var(--accent-soft); }
}

@media (max-width: 429px) {
  .stelsm-brand__name { max-width: 40vw; font-size: 15px; letter-spacing: -.025em; }
}

@media (prefers-reduced-motion: reduce) {
  #page-header *, #page-header *::before, #page-header *::after { transition-duration: .01ms !important; }
}