/*
	Los Santos Stories forum skin (on top of Marina by PixelGoose).
	Same family as the UCP and the in-game UI (dark base, gold, white titles), with its own nuance:
	a warmer gold, an amber highlight and Los Santos sunset tones in the header.
*/

:root {
	--lss-bg: #0f1012;
	--lss-bg-2: #131417;
	--lss-panel: #18191d;
	--lss-card: #1d1e23;
	--lss-card-2: #23252b;
	--lss-line: #2a2c32;
	--lss-line-2: #34363d;

	--lss-gold: #d4a94f;
	--lss-gold-hi: #f0cf86;
	--lss-gold-lo: #a8843f;
	--lss-amber: #f2a93b;
	--lss-gold-soft: rgba(212, 169, 79, .13);
	--lss-gold-line: rgba(212, 169, 79, .38);
	--lss-wine: #3b1a2c;

	--lss-text: #eef0f3;
	--lss-text-2: #c4c7cf;
	--lss-muted: #8a8e98;
	--lss-faint: #5f636c;
	--lss-green: #4ade80;
	--lss-red: #f05252;

	--lss-radius: 12px;
	--lss-radius-sm: 8px;
	--lss-font: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--lss-head: "Outfit", "Inter", system-ui, sans-serif;
}

/* ------------------------------------------------------------ base */

html, body.lss { background: var(--lss-bg); }
body.lss {
	color: var(--lss-text-2);
	font-family: var(--lss-font);
	font-size: 13.5px;
	-webkit-font-smoothing: antialiased;
}
.lss h1, .lss h2, .lss h3, .lss h4 { font-family: var(--lss-head); color: var(--lss-text); }
.lss a { color: var(--lss-gold-hi); }
.lss a:hover { color: #fff; }
.lss ::selection { background: var(--lss-gold); color: #17140e; }

.lss .wrap { max-width: none; padding: 0; border: 0; background: transparent; }
.lss #page-body { max-width: 1180px; padding: 22px 20px 30px; }
.lss-container { max-width: 1180px; margin: 0 auto; padding: 0 20px; box-sizing: border-box; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-thumb { background: #2b2c31; border-radius: 10px; border: 2px solid var(--lss-bg); }
::-webkit-scrollbar-thumb:hover { background: var(--lss-gold-lo); }

/* ------------------------------------------------------------ hero (header banner) */

.lss-header { background: transparent; }
.lss-hero {
	position: relative;
	min-height: 108px;
	background:
		linear-gradient(90deg, rgba(10, 8, 12, .92) 0%, rgba(10, 8, 12, .55) 38%, rgba(10, 8, 12, .2) 62%, rgba(10, 8, 12, .7) 100%),
		url("./images/lss-skyline.svg") center bottom / cover no-repeat,
		var(--lss-wine);
	border-bottom: 1px solid rgba(240, 207, 134, .18);
}
.lss-hero::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
	background: linear-gradient(90deg, transparent, var(--lss-gold) 20%, var(--lss-amber) 50%, var(--lss-gold) 80%, transparent);
	opacity: .7;
}
.lss-hero-inner {
	position: relative; z-index: 1;
	display: flex; align-items: center; gap: 22px;
	min-height: 108px;
}

.lss-logo { display: flex; align-items: center; gap: 12px; text-decoration: none !important; flex: 0 0 auto; }
.lss-logo img { width: 64px; height: 64px; object-fit: contain; filter: drop-shadow(0 6px 16px rgba(0, 0, 0, .6)); }
.lss-logo-text { display: flex; flex-direction: column; line-height: 1.05; }
.lss-logo-text b { font: 800 22px var(--lss-head); color: #fff; letter-spacing: .4px; text-transform: uppercase; text-shadow: 0 2px 12px rgba(0, 0, 0, .6); }
.lss-logo-text em { font: 700 10.5px var(--lss-font); color: var(--lss-gold-hi); font-style: normal; letter-spacing: 2.4px; text-transform: uppercase; margin-top: 4px; }

.lss-server {
	display: flex; flex-direction: column; gap: 4px;
	padding: 9px 14px;
	border-radius: var(--lss-radius-sm);
	background: rgba(8, 8, 10, .78);
	border: 1px solid rgba(255, 255, 255, .08);
	backdrop-filter: blur(4px);
	color: #fff; font-size: 12px; font-weight: 500;
}
.lss-server-row { display: flex; align-items: center; gap: 8px; white-space: nowrap; }
.lss-server-row .icon { color: var(--lss-gold); font-size: 12px; width: 10px; text-align: center; }
.lss-server b { color: var(--lss-gold-hi); }
.lss-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--lss-green); box-shadow: 0 0 0 3px rgba(74, 222, 128, .18); margin: 0 1px; }
.lss-server.is-offline .lss-dot { background: var(--lss-red); box-shadow: 0 0 0 3px rgba(240, 82, 82, .18); }

.lss-user { margin-left: auto; }
.lss .lss-user .navbar-marina-outer, .lss .lss-user .navbar.navbar-marina { background: transparent; padding: 0; max-width: none; border: 0; box-shadow: none; }
.lss .lss-user #nav-main-top { margin: 0; display: flex; align-items: center; gap: 6px; flex-direction: row-reverse; }
.lss .lss-user #nav-main-top > li { float: none; margin: 0; padding: 0; }
.lss .lss-user #nav-main-top > li > a,
.lss .lss-user .header-avatar { color: #fff; font-weight: 600; font-size: 13px; text-decoration: none; }
.lss .lss-user #nav-main-top > li > a:hover { color: var(--lss-gold-hi); }
.lss .lss-user #nav-main-top > li > a > .icon { color: var(--lss-gold-hi); }
.lss .lss-muted { color: #c9c2b4; font-weight: 500; }
.lss .lss-signin a.login-window { padding: 8px 10px; }
.lss .lss-signin .fa-caret-down { color: #fff !important; font-size: 11px; }
.lss .lss-user .header-avatar img { border-radius: 50%; border: 2px solid var(--lss-gold); width: 30px; height: 30px; margin-right: 6px; vertical-align: middle; }
.lss .lss-user .badge { background: var(--lss-red); color: #fff; border-radius: 10px; }
.lss .login-responsive-link { display: none; }

.lss-btn-gold, .lss a.lss-btn-gold, .lss .lss-user a.lss-btn-gold {
	display: inline-flex; align-items: center; justify-content: center; gap: 7px;
	padding: 10px 20px; border-radius: var(--lss-radius-sm);
	background: linear-gradient(180deg, var(--lss-amber), var(--lss-gold)); color: #1b1408 !important;
	font: 700 13px var(--lss-font); text-decoration: none !important; white-space: nowrap;
	box-shadow: 0 6px 18px rgba(212, 169, 79, .25);
	transition: filter .15s, transform .05s;
}
.lss-btn-gold:hover { filter: brightness(1.08); color: #1b1408 !important; }
.lss-btn-gold:active { transform: translateY(1px); }
.lss-btn-gold .icon { color: inherit !important; }

.lss-btn-ghost, .lss a.lss-btn-ghost {
	display: inline-flex; align-items: center; gap: 7px;
	padding: 9px 16px; border-radius: var(--lss-radius-sm);
	border: 1px solid var(--lss-line-2); background: var(--lss-panel);
	color: var(--lss-text) !important; font: 600 13px var(--lss-font); text-decoration: none !important;
}
.lss-btn-ghost:hover { border-color: var(--lss-gold-line); color: var(--lss-gold-hi) !important; }

/* ------------------------------------------------------------ navigation strip */

.lss .navbar.lss-nav {
	max-width: none; padding: 0; margin: 0;
	background: linear-gradient(180deg, #1a1b1f, #16171a);
	border: 0; border-bottom: 1px solid var(--lss-line); border-radius: 0;
}
.lss-nav-inner { display: flex; align-items: center; gap: 16px; min-height: 58px; }
.lss .lss-nav ul#nav-main { display: flex; align-items: stretch; flex-wrap: wrap; margin: 0; padding: 0; border: 0; flex: 1 1 auto; min-width: 0; }
.lss .lss-nav ul#nav-main > li { float: none; margin: 0; padding: 0; border: 0; display: flex; }
.lss .lss-nav ul#nav-main > li:before { display: none; }
.lss .lss-nav ul#nav-main > li > a {
	position: relative; display: flex; align-items: center; gap: 7px;
	padding: 0 13px; min-height: 58px;
	color: #e7e8ec; font: 600 13px var(--lss-font); text-decoration: none;
	transition: color .15s, background .15s;
}
.lss .lss-nav ul#nav-main > li > a > .icon { color: var(--lss-muted); font-size: 14px; transition: color .15s; }
.lss .lss-nav ul#nav-main > li > a:hover { color: #fff; background: rgba(255, 255, 255, .03); }
.lss .lss-nav ul#nav-main > li > a:hover > .icon { color: var(--lss-gold-hi); }
.lss .lss-nav ul#nav-main > li.is-active > a { color: var(--lss-gold-hi); }
.lss .lss-nav ul#nav-main > li.is-active > a > .icon { color: var(--lss-amber); }
.lss .lss-nav ul#nav-main > li.is-active > a::after {
	content: ""; position: absolute; left: 10px; right: 10px; bottom: -1px; height: 3px; border-radius: 3px 3px 0 0;
	background: linear-gradient(90deg, var(--lss-gold), var(--lss-amber));
}
.lss .lss-nav #quick-links > a > span { display: none; }
.lss .lss-nav #quick-links { order: 99; }

.lss .lss-search { float: none; margin: 0 0 0 auto; flex: 0 0 300px; }
.lss .lss-search fieldset { display: flex; position: relative; }
.lss .lss-search .inputbox.search {
	width: 100%; height: 38px; box-sizing: border-box;
	padding: 0 40px 0 14px; border-radius: var(--lss-radius-sm) !important;
	background: #0f1013; border: 1px solid var(--lss-line-2); color: var(--lss-text);
	font: 13px var(--lss-font); box-shadow: none;
}
.lss .lss-search .inputbox.search:focus { border-color: var(--lss-gold-line); box-shadow: 0 0 0 3px var(--lss-gold-soft); outline: 0; }
.lss .lss-search .button-search {
	position: absolute; right: 4px; top: 4px; height: 30px; width: 32px; padding: 0;
	background: transparent !important; border: 0 !important; box-shadow: none !important; color: var(--lss-muted);
}
.lss .lss-search .button-search:hover .icon { color: var(--lss-gold-hi); }

.lss-crumbs { border-bottom: 1px solid rgba(255, 255, 255, .03); }
.lss .lss-crumbs #nav-breadcrumbs { margin: 0; padding: 12px 0; border: 0; display: flex; align-items: center; }
.lss .lss-crumbs .breadcrumbs { flex: 1; }
.lss .lss-crumbs .crumb a { color: var(--lss-text-2); font-weight: 600; font-size: 12.5px; }
.lss .lss-crumbs .crumb a:hover { color: var(--lss-gold-hi); }
.lss .lss-crumbs .crumb:before { color: var(--lss-faint); }
.lss .lss-crumbs .icon { color: var(--lss-muted); }
.lss .lss-crumb-activity a { color: var(--lss-text-2) !important; font-weight: 600; font-size: 12.5px; display: inline-flex; gap: 6px; align-items: center; }
.lss .lss-crumb-activity a:hover { color: var(--lss-gold-hi) !important; }

/* ------------------------------------------------------------ index layout */

.lss-index { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 22px; align-items: start; }
.lss-main { min-width: 0; }

.lss-page-head { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin: 4px 0 18px; flex-wrap: wrap; }
.lss .lss-page-title {
	margin: 0; padding: 0; border: 0;
	font: 800 22px var(--lss-head); text-transform: uppercase; letter-spacing: .6px;
	background: linear-gradient(90deg, var(--lss-gold-hi), var(--lss-amber)); -webkit-background-clip: text; background-clip: text; color: transparent;
}
.lss-page-actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* ------------------------------------------------------------ category cards */

.lss .lss-cat {
	background: var(--lss-panel); border: 1px solid var(--lss-line); border-radius: var(--lss-radius);
	margin: 0 0 18px; padding: 0; overflow: hidden; box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
}
.lss-cat-head {
	display: flex; align-items: center; gap: 12px;
	padding: 15px 18px; border-bottom: 1px solid var(--lss-line);
	background: linear-gradient(90deg, rgba(212, 169, 79, .08), transparent 55%);
}
.lss .lss-cat-title { margin: 0; padding: 0; border: 0; font: 700 16.5px var(--lss-head); text-transform: none; flex: 1; }
.lss .lss-cat-title a { color: #fff !important; text-decoration: none; }
.lss .lss-cat-title a:hover { color: var(--lss-gold-hi) !important; }
.lss-cat-head::before { content: ""; width: 4px; height: 18px; border-radius: 2px; background: linear-gradient(180deg, var(--lss-amber), var(--lss-gold)); }
.lss-cat-toggle {
	width: 30px; height: 30px; border-radius: 8px; border: 1px solid transparent; background: transparent;
	color: var(--lss-muted); cursor: pointer; display: flex; align-items: center; justify-content: center;
}
.lss-cat-toggle:hover { border-color: var(--lss-line-2); color: var(--lss-gold-hi); }
.lss-cat-toggle .icon { transition: transform .2s; font-size: 12px; }
.lss-cat.is-collapsed .lss-cat-body { display: none; }
.lss-cat.is-collapsed .lss-cat-head { border-bottom: 0; }
.lss-cat.is-collapsed .lss-cat-toggle .icon { transform: rotate(-90deg); }

.lss ul.lss-forums { margin: 0; padding: 0; list-style: none; border: 0; background: transparent; }
.lss .lss-forums li.lss-forum {
	display: grid; grid-template-columns: 46px minmax(0, 1fr) 90px 250px; gap: 16px; align-items: center;
	padding: 16px 18px; margin: 0; border: 0; border-bottom: 1px solid var(--lss-line);
	background: transparent !important; transition: background .15s;
}
.lss .lss-forums li.lss-forum:last-child { border-bottom: 0; }
.lss .lss-forums li.lss-forum:hover { background: rgba(255, 255, 255, .018) !important; }

.lss .lss-forum-icon {
	width: 44px; height: 44px; border-radius: 11px; position: relative;
	background-color: var(--lss-card) !important; background-position: center !important; background-size: 30px !important; background-repeat: no-repeat !important;
	border: 1px solid var(--lss-line-2); opacity: .75;
}
.lss .lss-forum.is-unread .lss-forum-icon { opacity: 1; border-color: var(--lss-gold-line); box-shadow: 0 0 0 3px var(--lss-gold-soft); }
.lss .lss-forum.is-unread .lss-forum-icon::after {
	content: ""; position: absolute; top: -3px; right: -3px; width: 10px; height: 10px; border-radius: 50%;
	background: var(--lss-amber); border: 2px solid var(--lss-panel);
}
.lss .lss-forum-icon .forum-image img { width: 44px; height: 44px; border-radius: 11px; object-fit: cover; }

.lss .lss-forum-main a.forumtitle { font: 700 15px var(--lss-head); color: #fff; text-decoration: none; }
.lss .lss-forum-main a.forumtitle:hover { color: var(--lss-gold-hi); }
.lss-forum-desc { color: var(--lss-muted); font-size: 12.5px; margin-top: 3px; line-height: 1.5; }
.lss-subforums { margin-top: 6px; font-size: 12px; display: flex; flex-wrap: wrap; gap: 4px 8px; }
.lss .lss-subforums a.subforum { color: var(--lss-text-2); font-weight: 600; text-decoration: none; }
.lss .lss-subforums a.subforum::before { content: "\f0da"; font-family: FontAwesome; color: var(--lss-gold); margin-right: 4px; font-size: 10px; }
.lss .lss-subforums a.subforum.unread { color: var(--lss-gold-hi); }
.lss-forum-mods { font-size: 12px; color: var(--lss-faint); margin-top: 4px; }

.lss-forum-count { text-align: right; line-height: 1.2; }
.lss-forum-count b { display: block; color: #fff; font: 700 16px var(--lss-head); }
.lss-forum-count span { color: var(--lss-muted); font-size: 11px; text-transform: lowercase; }

.lss-forum-last { display: flex; align-items: center; gap: 10px; min-width: 0; }
.lss-forum-last-text { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.lss .lss-forum-last a.lastsubject { color: var(--lss-text) !important; font-weight: 600; font-size: 12.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; text-decoration: none; }
.lss .lss-forum-last a.lastsubject:hover { color: var(--lss-gold-hi) !important; }
.lss .lss-unapproved .icon { color: var(--lss-amber); }

.lss-avatar {
	flex: 0 0 auto; width: 34px; height: 34px; border-radius: 9px;
	display: inline-flex; align-items: center; justify-content: center;
	background: linear-gradient(145deg, #2f2a20, #1c1a16); border: 1px solid var(--lss-gold-line);
	color: var(--lss-gold-hi); font: 700 14px var(--lss-head);
}
.lss-timeline-meta { color: var(--lss-muted); font-size: 11.5px; line-height: 1.45; }
.lss-timeline-meta a { font-weight: 600; }

/* ------------------------------------------------------------ sidebar widgets */

.lss-sidebar { display: flex; flex-direction: column; gap: 18px; position: sticky; top: 16px; }
.lss-widget {
	background: var(--lss-panel); border: 1px solid var(--lss-line); border-radius: var(--lss-radius);
	overflow: hidden; position: relative;
}
.lss-widget::before {
	content: ""; position: absolute; left: 16px; top: 0; width: 80px; height: 2px;
	background: linear-gradient(90deg, var(--lss-amber), var(--lss-gold), transparent);
}
.lss .lss-widget-title {
	margin: 0; padding: 15px 16px 13px; border: 0; border-bottom: 1px solid var(--lss-line);
	font: 600 14px var(--lss-head); color: #fff; text-transform: none; display: flex; align-items: center; gap: 8px;
}
.lss .lss-widget-title .icon { color: var(--lss-amber); }
.lss .lss-widget-title a { color: #fff; }
.lss-widget-body { padding: 14px 16px; font-size: 12.5px; }

.lss-timeline { list-style: none; margin: 0; padding: 14px 16px 6px; position: relative; }
.lss-timeline::before { content: ""; position: absolute; left: 29px; top: 26px; bottom: 26px; width: 2px; background: linear-gradient(180deg, var(--lss-gold-lo), transparent); opacity: .5; }
.lss-timeline li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: start; padding: 0 0 16px; position: relative; }
.lss-timeline-dot {
	width: 28px; height: 28px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
	background: var(--lss-panel); border: 2px solid var(--lss-gold); color: var(--lss-gold); font-size: 11px; z-index: 1;
}
.lss-timeline-body { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.lss .lss-timeline-title { color: #fff !important; font-weight: 700; font-size: 13px; line-height: 1.35; text-decoration: none; word-break: break-word; }
.lss .lss-timeline-title:hover { color: var(--lss-gold-hi) !important; }
.lss-count {
	min-width: 30px; height: 26px; padding: 0 8px; border-radius: 13px; box-sizing: border-box;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--lss-card-2); border: 1px solid var(--lss-line-2); color: #fff; font-size: 11.5px; font-weight: 700;
}

.lss-stats { margin: 0; padding: 4px 16px; }
.lss-stats > div { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 10px 0; border-bottom: 1px solid var(--lss-line); }
.lss-stats dt { color: var(--lss-muted); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .6px; margin: 0; }
.lss-stats dd { margin: 0; color: #fff; font: 700 16px var(--lss-head); text-align: right; }
.lss-stats dd small { display: block; color: var(--lss-muted); font: 500 11px var(--lss-font); }
.lss-newest { display: flex; align-items: center; gap: 12px; padding: 14px 16px; }
.lss-newest .lss-avatar { width: 42px; height: 42px; border-radius: 50%; font-size: 17px; }
.lss-label { display: block; color: var(--lss-muted); font-size: 10.5px; font-weight: 700; letter-spacing: .8px; text-transform: uppercase; }
.lss-newest strong { display: block; font-size: 14px; }
.lss-online-list { margin: 0 0 8px; line-height: 1.8; font-weight: 600; }
.lss-online p { margin: 0 0 6px; }
.lss-legend { color: var(--lss-faint); font-size: 11.5px; }

/* ------------------------------------------------------------ phpBB components (viewforum, viewtopic, ucp, posting) */

.lss .panel, .lss .forumbg, .lss .forabg:not(.lss-cat), .lss .post, .lss .stat-block, .lss .cp-main .panel {
	background: var(--lss-panel) !important; border: 1px solid var(--lss-line); border-radius: var(--lss-radius) !important; color: var(--lss-text-2);
}
.lss .forumbg, .lss .forabg:not(.lss-cat) { padding: 0; overflow: hidden; }
.lss ul.topiclist li.header {
	background: linear-gradient(90deg, rgba(212, 169, 79, .1), transparent 60%) !important; border-bottom: 1px solid var(--lss-line);
}
.lss ul.topiclist li.header dt, .lss ul.topiclist li.header dd { color: #fff !important; font: 600 13px var(--lss-head); text-transform: none; }
.lss ul.topiclist li.row { border-top: 1px solid var(--lss-line); border-bottom: 0; }
.lss .bg1, .lss .bg2, .lss .bg3 { background-color: transparent !important; }
.lss ul.topiclist li.row:hover { background: rgba(255, 255, 255, .02) !important; }
.lss a.topictitle { color: #fff; font: 600 14px var(--lss-head); }
.lss a.topictitle:hover { color: var(--lss-gold-hi); }
.lss ul.topiclist dd { border-left-color: var(--lss-line) !important; }
.lss .topic-poster, .lss .responsive-hide, .lss dd.posts, .lss dd.views, .lss dd.topics { color: var(--lss-muted); }

.lss .post { margin-bottom: 14px; padding: 18px 20px; }
.lss .postprofile { border-color: var(--lss-line) !important; color: var(--lss-muted); }
.lss .postprofile .avatar img { border-radius: 12px; border: 2px solid var(--lss-gold-line); }
.lss .postbody h3, .lss .postbody h3 a { color: #fff; font-family: var(--lss-head); }
.lss .content { color: var(--lss-text-2); font-family: var(--lss-font); font-size: 14px; line-height: 1.7; }
.lss .content a.postlink { color: var(--lss-gold-hi); border-bottom: 1px solid var(--lss-gold-line); }
.lss .signature { border-top-color: var(--lss-line); color: var(--lss-muted); }
.lss blockquote { background: var(--lss-card) !important; border: 1px solid var(--lss-line) !important; border-left: 3px solid var(--lss-gold) !important; border-radius: var(--lss-radius-sm); }
.lss blockquote cite { color: var(--lss-gold-hi); }
.lss .codebox { background: #0c0d0f !important; border: 1px solid var(--lss-line) !important; border-radius: var(--lss-radius-sm); }
.lss .codebox p { border-bottom-color: var(--lss-line); color: var(--lss-muted); }
.lss .codebox code { color: #f3d9a2; }

.lss .button, .lss input.button1, .lss input.button2, .lss a.button1, .lss a.button2, .lss .button2, .lss .button1 {
	background: var(--lss-card) !important; border: 1px solid var(--lss-line-2) !important; color: var(--lss-text) !important;
	border-radius: var(--lss-radius-sm) !important; box-shadow: none !important; text-shadow: none !important; font-family: var(--lss-font); font-weight: 600;
}
.lss .button:hover, .lss input.button2:hover, .lss input.button1:hover { border-color: var(--lss-gold-line) !important; color: var(--lss-gold-hi) !important; }
.lss .button .icon { color: inherit; }
.lss input.button1, .lss .button1, .lss .action-bar .button[title="Post a reply"], .lss .action-bar .button[title="Post a new topic"] {
	background: linear-gradient(180deg, var(--lss-amber), var(--lss-gold)) !important; border-color: transparent !important; color: #1b1408 !important;
}

.lss .inputbox, .lss input.inputbox, .lss textarea.inputbox, .lss select, .lss input[type="text"], .lss input[type="password"], .lss input[type="email"], .lss input[type="number"], .lss textarea {
	background: #0f1013 !important; border: 1px solid var(--lss-line-2) !important; color: var(--lss-text) !important; border-radius: var(--lss-radius-sm);
}
.lss .inputbox:focus, .lss textarea:focus, .lss select:focus { border-color: var(--lss-gold-line) !important; box-shadow: 0 0 0 3px var(--lss-gold-soft); outline: 0; }
.lss fieldset dt label, .lss label { color: var(--lss-text-2); }

.lss .dropdown .dropdown-contents { background: var(--lss-card) !important; border: 1px solid var(--lss-line-2) !important; border-radius: var(--lss-radius-sm); box-shadow: 0 14px 40px rgba(0, 0, 0, .5); }
.lss .dropdown .pointer, .lss .dropdown .pointer-inner { border-color: var(--lss-line-2) transparent; }
.lss .dropdown li { border-color: var(--lss-line) !important; }
.lss .dropdown-contents a { color: var(--lss-text-2) !important; }
.lss .dropdown-contents a:hover { color: #fff !important; background: rgba(255, 255, 255, .04); }
.lss .dropdown-contents .icon { color: var(--lss-gold); }
.lss .dropdown li.separator { border-top-color: var(--lss-line) !important; }

.lss .pagination li a, .lss .pagination li span { background: var(--lss-card) !important; border: 1px solid var(--lss-line-2) !important; color: var(--lss-text-2) !important; border-radius: 7px; }
.lss .pagination li.active span { background: var(--lss-gold) !important; border-color: var(--lss-gold) !important; color: #1b1408 !important; }
.lss .pagination li a:hover { border-color: var(--lss-gold-line) !important; color: var(--lss-gold-hi) !important; }

.lss .tabs .tab > a, .lss #tabs a, .lss #minitabs a { background: var(--lss-card) !important; border-color: var(--lss-line-2) !important; color: var(--lss-text-2) !important; }
.lss .tabs .activetab > a, .lss #tabs .activetab a { background: var(--lss-panel) !important; color: var(--lss-gold-hi) !important; border-bottom-color: var(--lss-panel) !important; }
.lss #cp-menu .navigation a, .lss .cp-menu .navigation a { background: var(--lss-card) !important; color: var(--lss-text-2) !important; border-radius: 7px; }
.lss #cp-menu .navigation .active-subsection a, .lss .navigation .active-subsection a { background: var(--lss-gold-soft) !important; color: var(--lss-gold-hi) !important; }
.lss #cp-main .panel, .lss .cp-main .panel { background: var(--lss-panel) !important; }

.lss .action-bar { color: var(--lss-muted); }
.lss .jumpbox .dropdown-trigger, .lss .jumpbox-return { color: var(--lss-text-2) !important; }
.lss .error { color: var(--lss-red); }
.lss .successbox, .lss .errorbox { border-radius: var(--lss-radius-sm); }
.lss .rules, .lss .announcement { background: var(--lss-gold-soft) !important; border: 1px solid var(--lss-gold-line); color: var(--lss-text); border-radius: var(--lss-radius-sm); }
.lss .phpbb_alert { background: var(--lss-card) !important; border: 1px solid var(--lss-line-2) !important; border-radius: var(--lss-radius); color: var(--lss-text-2); }
.lss .phpbb_alert h3 { background: transparent !important; border-bottom: 1px solid var(--lss-line); }
.lss .badge { background: var(--lss-gold) !important; color: #1b1408 !important; }
.lss .icon-red, .lss .icon.icon-red { color: var(--lss-amber) !important; }

/* login popup (Marina) */
.lss .login-popup { background: var(--lss-panel) !important; border: 1px solid var(--lss-line-2); border-radius: var(--lss-radius); box-shadow: 0 30px 60px rgba(0, 0, 0, .6) !important; padding: 26px 24px 0 !important; }
.lss .login-popup::before { content: "Log in with your master account"; display: block; font: 700 17px var(--lss-head); color: #fff; margin-bottom: 14px; }
.lss .login-popup label { color: var(--lss-text-2); font-weight: 600; }
.lss .login-popup .inputbox { width: 100% !important; height: 40px; box-sizing: border-box; margin: 6px 0 12px; }
.lss .login-popup input.button2 { width: 100%; height: 40px; background: linear-gradient(180deg, var(--lss-amber), var(--lss-gold)) !important; color: #1b1408 !important; border: 0 !important; }
.lss .login-popup .login-footer { background: var(--lss-card); border-top: 1px solid var(--lss-line); margin: 16px -24px 0; padding: 12px 24px; border-radius: 0 0 var(--lss-radius) var(--lss-radius); }
.lss .login-popup .login-footer a { color: var(--lss-gold-hi); font-weight: 600; }
.lss #mask { background: #050506; opacity: .75; }

/* ------------------------------------------------------------ footer */

.lss .page-footer { background: #0c0d0f; border-top: 1px solid var(--lss-line); margin-top: 10px; }
.lss .page-footer .copyright { color: var(--lss-faint); padding: 26px 20px; max-width: 1180px; }
.lss .page-footer .copyright a { color: var(--lss-text-2); }
.lss .page-footer .navbar { background: transparent; border: 0; }

/* ------------------------------------------------------------ responsive */

@media (max-width: 1100px) {
	.lss .lss-forums li.lss-forum { grid-template-columns: 46px minmax(0, 1fr) 80px 200px; }
	.lss .lss-search { flex-basis: 220px; }
}
@media (max-width: 900px) {
	.lss-index { grid-template-columns: minmax(0, 1fr); }
	.lss-sidebar { position: static; }
	.lss-server { display: none; }
	.lss .lss-forums li.lss-forum { grid-template-columns: 40px minmax(0, 1fr); }
	.lss-forum-count, .lss-forum-last { display: none; }
	.lss-nav-inner { flex-wrap: wrap; padding-bottom: 10px; }
	.lss .lss-search { flex: 1 1 100%; }
}
@media (max-width: 640px) {
	.lss-hero-inner { min-height: 84px; gap: 12px; }
	.lss-logo img { width: 46px; height: 46px; }
	.lss-logo-text b { font-size: 16px; }
	.lss-logo-text em { font-size: 9px; letter-spacing: 1.6px; }
	.lss .lss-signin .lss-muted { display: none; }
	.lss .lss-signin a.login-window { display: none; }
	.lss .login-responsive-link { display: inline-flex !important; align-items: center; gap: 4px; }
	.lss .lss-btn-gold { padding: 8px 12px; }
	.lss #page-body { padding: 16px 12px 24px; }
	.lss .lss-nav ul#nav-main > li > a { padding: 0 10px; min-height: 48px; }
}

/* phpBB clearfix pseudo elements must not become grid cells */
.lss .lss-forums li.lss-forum::before, .lss .lss-forums li.lss-forum::after { display: none !important; content: none !important; }

/* Marina paints the nav list itself */
.lss .lss-nav ul#nav-main, .lss .lss-nav .linklist { background: transparent !important; box-shadow: none !important; }
.lss .lss-forum-icon { opacity: .9; }

/* Announcement / sticky lists: a gold accent instead of a gold wash */
.lss .forumbg.announcement, .lss .forumbg { background: var(--lss-panel) !important; }
.lss ul.topiclist li.row.global-announce, .lss ul.topiclist li.row.announce, .lss ul.topiclist li.row.sticky { background: linear-gradient(90deg, rgba(212, 169, 79, .07), transparent 40%) !important; box-shadow: inset 3px 0 0 var(--lss-gold); }
.lss ul.topiclist li.header dl.row-item dt, .lss ul.topiclist li.header dl.row-item dd { padding-top: 12px; padding-bottom: 12px; line-height: 1.3; }
.lss .postbody h3 { font-weight: 600; letter-spacing: 0; font-size: 17px; }
.lss h2.topic-title, .lss h2.forum-title { font: 700 26px var(--lss-head); }
.lss h2.topic-title a, .lss h2.forum-title a { color: var(--lss-gold-hi); }

/* ------------------------------------------------------------ logged in user area: icon buttons + avatar */
.lss .lss-user #nav-main-top > li:not(.lss-signin):not(.lss-signup) > a:not(.header-avatar) > span { display: none; }
.lss .lss-user #nav-main-top > li:not(.lss-signin):not(.lss-signup) > a:not(.header-avatar) {
	position: relative; width: 38px; height: 38px; display: inline-flex; align-items: center; justify-content: center;
	border-radius: 10px; background: rgba(8, 8, 10, .6); border: 1px solid rgba(255, 255, 255, .08);
}
.lss .lss-user #nav-main-top > li > a:not(.header-avatar):hover { border-color: var(--lss-gold-line); }
.lss .lss-user #nav-main-top .badge {
	position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; box-sizing: border-box;
	border-radius: 9px; font-size: 10.5px; line-height: 18px; text-align: center; border: 2px solid #120d12;
	background: var(--lss-red) !important; color: #fff !important;
}
.lss .lss-user #nav-main-top .badge.hidden { display: none; }
.lss .lss-user .header-avatar {
	display: inline-flex !important; align-items: center; gap: 8px;
	padding: 4px 10px 4px 4px; border-radius: 22px; background: rgba(8, 8, 10, .6); border: 1px solid rgba(255, 255, 255, .08);
}
.lss .lss-user .header-avatar:hover { border-color: var(--lss-gold-line); }
.lss .lss-user .header-avatar .icon { color: var(--lss-muted) !important; font-size: 11px; }
.lss .lss-avatar-sm { width: 30px; height: 30px; border-radius: 50%; font-size: 13px; }
.lss .lss-username { font-weight: 700; }
.lss .lss-user #nav-main-top > li { margin-left: 4px; }

/* MCP / ACP as icons in the nav */
.lss .lss-nav .lss-nav-icon > a > span { display: none; }
.lss .lss-nav .lss-nav-icon > a { padding: 0 10px; }

/* ------------------------------------------------------------ control panels: menu left, content right */
.lss .panel.bg3 > .inner > div[style] { display: flex; gap: 22px; align-items: flex-start; }
.lss #cp-menu { float: none; width: 230px; flex: 0 0 230px; margin: 0; }
.lss #cp-main { float: none; width: auto; flex: 1 1 auto; min-width: 0; }
.lss .navigation ul { margin: 0; padding: 0; }
.lss .navigation li { margin: 0 0 6px; list-style: none; }
.lss .navigation a { display: block; padding: 10px 12px !important; font-weight: 600; text-decoration: none; }
@media (max-width: 900px) {
	.lss .panel.bg3 > .inner > div[style] { flex-direction: column; }
	.lss #cp-menu { width: 100%; flex-basis: auto; }
}

/* phpBB adds a caret after every span in .header-avatar; we draw our own */
.lss .header-avatar span:after, .lss .header-avatar span::after { content: none !important; display: none !important; }
.lss .lss-nav ul#nav-main > li > a { padding: 0 11px; }
.lss .lss-search { flex-basis: 250px; }
.lss .lss-nav ul#nav-main { flex-wrap: nowrap; }
@media (max-width: 1180px) { .lss .lss-nav ul#nav-main > li > a > span { font-size: 12.5px; } .lss .lss-nav ul#nav-main > li > a { padding: 0 8px; } }

/* ------------------------------------------------------------ phones */
.lss .lss-nav ul#nav-main > li > a span { white-space: nowrap; }
@media (max-width: 900px) {
	.lss .lss-nav ul#nav-main { overflow-x: auto; overflow-y: hidden; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
	.lss .lss-nav ul#nav-main::-webkit-scrollbar { display: none; }
	.lss .lss-nav ul#nav-main > li { flex: 0 0 auto; }
	.lss .lss-nav #quick-links { display: none !important; }
}
@media (max-width: 640px) {
	.lss-hero-inner { padding: 0 14px; }
	.lss-logo-text { display: none; }
	.lss-user { min-width: 0; }
	.lss .lss-user #nav-main-top { gap: 4px; }
	.lss .lss-signin a.login-responsive-link { padding: 8px 6px; color: #fff; font-weight: 600; }
	.lss .lss-username { display: none; }
	.lss .lss-nav-inner { padding: 0 8px 10px; }
	.lss .lss-crumbs .lss-container { padding: 0 14px; }
}