/* ============================================================
   DSTVAGIMMO Forum Theme — global.css
   A MyBB stylesheet that reskins the Default theme to match the
   dstvagimmo.com web app design system (dark steel/graphite,
   glassy blurred panels, silver/gold accents, technical fonts,
   blueprint-schematic background).

   HOW TO INSTALL
   1. Admin CP -> Templates & Themes -> Themes.
   2. Duplicate the "Default" theme (Actions -> Duplicate), name it
      "DSTVAGIMMO" (keeps your original theme safe as a fallback).
   3. Open the new theme -> Stylesheets -> click "global.css".
   4. Select ALL the existing content and REPLACE it with everything
      in this file. Save.
   5. (Optional but recommended) In the theme's "Edit Theme" ->
      General tab, set the Logo Image URL to the DSTVAGIMMO logo
      once it's uploaded to /images/ (see the instructions doc).
   6. Set this theme as the board default under Theme properties,
      or let users pick it from the footer theme selector.
   ============================================================ */

@import url(https://fonts.googleapis.com/css2?family=Orbitron:wght@500;600;700;800&family=Rajdhani:wght@400;500;600;700&display=swap);

:root{
	--bg:#1b2024;
	--panel:rgba(43,49,54,.90);
	--panel-strong:rgba(54,61,67,.95);
	--panel-soft:rgba(43,49,54,.65);
	--border:rgba(209,216,222,.28);
	--border-strong:rgba(236,241,245,.55);
	--accent:#d7dde2;
	--accent-soft:#aab4bd;
	--gold:#e7b85b;
	--gold-soft:rgba(231,184,91,.35);
	--text:#f2f5f7;
	--muted:#c9d1d8;
	--danger:#f87171;
	--success:#8fe6ab;
	--shadow:rgba(0,0,0,.5);
	--font-ui:'Rajdhani','Segoe UI',Tahoma,Verdana,Arial,sans-serif;
	--font-display:'Orbitron','Rajdhani',Arial,sans-serif;
}

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

* { box-sizing: border-box; }

html { height: 100%; }

body {
	position: relative;
	background: #14181b;
	background:
		radial-gradient(ellipse at 46% 10%, rgba(238,244,248,.14), transparent 24%),
		radial-gradient(ellipse at 18% 80%, rgba(154,166,176,.12), transparent 28%),
		linear-gradient(135deg, #262d32 0%, #171c20 48%, #0f1417 100%);
	background-attachment: fixed;
	color: var(--text);
	text-align: center;
	line-height: 1.4;
	margin: 0;
	font-family: var(--font-ui);
	font-size: 14px;
	overflow-x: hidden;
	overflow-y: scroll;
	/* sticky footer: MyBB's header/footer templates open and close #container
	   around the whole page, so making body a flex column and letting
	   #footer's margin-top:auto (below) soak up any leftover space pins the
	   footer to the bottom of the viewport on short pages instead of it
	   floating right under the content. */
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

body::before,
body::after{
	content:"";
	position:fixed;
	inset:0;
	pointer-events:none;
	z-index:0;
}

body::before{
	opacity:.32;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='260' viewBox='0 0 360 260'%3E%3Cg fill='none' stroke='%23d8dee4' stroke-opacity='.22' stroke-width='1'%3E%3Cpath d='M34 18l18 10v20L34 58 16 48V28zM70 18l18 10v20L70 58 52 48V28zM106 18l18 10v20l-18 10-18-10V28zM142 18l18 10v20l-18 10-18-10V28zM178 18l18 10v20l-18 10-18-10V28zM52 49l18 10v20L52 89 34 79V59zM88 49l18 10v20L88 89 70 79V59zM124 49l18 10v20l-18 10-18-10V59zM160 49l18 10v20l-18 10-18-10V59zM196 49l18 10v20l-18 10-18-10V59zM34 80l18 10v20l-18 10-18-10V90zM70 80l18 10v20l-18 10-18-10V90zM106 80l18 10v20l-18 10-18-10V90zM142 80l18 10v20l-18 10-18-10V90z'/%3E%3Cpath d='M0 90h16M214 59h44M142 152h36M196 120h64' stroke-opacity='.14'/%3E%3C/g%3E%3C/svg%3E"),
		repeating-linear-gradient(135deg, transparent 0 18px, rgba(224,231,236,.045) 19px, transparent 21px);
	background-repeat: no-repeat, repeat;
	background-size: 300px 216px, 96px 96px;
	background-position: right -40px top -22px, center;
}

body::after{
	opacity:.20;
	background:
		linear-gradient(90deg, transparent 0 2.4%, rgba(232,238,243,.30) 2.5%, rgba(232,238,243,.30) 64%, transparent 64.2%) left 38px top 38px/100% 1px no-repeat,
		repeating-linear-gradient(135deg, rgba(232,238,243,.10) 0 6px, transparent 6px 12px) left 42px top 56px/88px 12px no-repeat,
		linear-gradient(180deg, rgba(255,255,255,.04), transparent 34%, rgba(0,0,0,.22));
}

a:link, a:visited { color: var(--accent); text-decoration: none; }
a:hover, a:active { color: #fff; text-decoration: underline; }

#container {
	position: relative;
	z-index: 1;
	color: var(--text);
	text-align: left;
	line-height: 1.4;
	margin: 0;
	font-family: var(--font-ui);
	font-size: 14px;
	min-width: 990px;
	/* sticky footer, part 2 — see body{} above */
	display: flex;
	flex-direction: column;
	flex: 1 0 auto;
	width: 100%;
}

.wrapper {
	width: 88%;
	min-width: 970px;
	max-width: 1500px;
	margin: auto auto;
}

/* ---------- header / logo / panel ---------- */

#logo {
	position: relative;
	background: linear-gradient(180deg, rgba(53,60,66,.92), rgba(27,32,36,.84));
	backdrop-filter: blur(18px) saturate(120%);
	padding: 9px 0;
	border-bottom: 1px solid var(--border);
	box-shadow: 0 12px 34px rgba(0,0,0,.28);
}

/* premium top accent line */
#logo::before{
	content:"";
	position:absolute;
	top:0; left:0; right:0;
	height:2px;
	background: linear-gradient(90deg, transparent, var(--accent-soft) 20%, var(--gold) 50%, var(--accent-soft) 80%, transparent);
	opacity:.75;
}

#logo img {
	max-height: 56px;
	width: auto;
	filter: brightness(1.15) contrast(1.05) drop-shadow(0 3px 10px rgba(0,0,0,.45));
}

#content {
	background: transparent;
	width: auto !important;
	padding: 24px 10px;
	overflow: hidden;
}

#header ul.menu { margin: 0; padding: 0; list-style: none; }
#header ul.menu li { margin: 0 7px; display: inline; }

#header ul.menu li a {
	padding-left: 20px;
	background-image: url(/images/headerlinks_sprite.png);
	background-repeat: no-repeat;
	display: inline-block;
	line-height: 16px;
	color: var(--accent-soft);
	opacity: .92;
	font-family: var(--font-ui);
	font-weight: 600;
	letter-spacing: .3px;
}

#header ul.menu li a:hover { opacity: 1; color: #fff; }

#logo ul.top_links {
	font-weight: 700;
	text-align: right;
	margin: -10px 5px 0 0;
	font-family: var(--font-display);
	letter-spacing: .5px;
}

#logo ul.top_links a.search { background-position: 0 0; }
#logo ul.top_links a.memberlist { background-position: 0 -20px; }
#logo ul.top_links a.calendar { background-position: 0 -40px; }
#logo ul.top_links a.help { background-position: 0 -60px; }
#logo ul.top_links a.portal { background-position: 0 -180px; }

#panel .upper a.logout {
	font-weight: 700;
	color: #fff;
	background: url(/images/headerlinks_sprite.png) right -80px no-repeat;
	padding-right: 20px;
	margin-left: 10px;
}

#panel .upper a.login,
#panel .upper a.lost_password {
	color: #fff;
	background: url(/images/headerlinks_sprite.png) 0 -100px no-repeat;
	padding-left: 20px;
	margin-left: 10px;
	font-weight: 700;
}

#panel .upper a.register {
	color: #fff;
	background: url(/images/headerlinks_sprite.png) right -80px no-repeat;
	padding-right: 20px;
	margin-left: 10px;
	font-weight: 700;
}

#panel .lower ul.panel_links { float: left; }
#panel .lower ul.panel_links a.usercp { background-position: 0 -120px; }
#panel .lower ul.panel_links a.modcp { background-position: 0 -140px; }
#panel .lower ul.panel_links a.admincp { background-position: 0 -160px; }
#panel .lower ul.user_links { float: right; }
#panel .lower ul.user_links li a { padding: 0; background-image: none; }

#panel .upper {
	background: linear-gradient(180deg, rgba(46,53,58,.94), rgba(20,24,27,.94));
	color: #fff;
	border-top: 1px solid var(--border);
	border-bottom: 1px solid rgba(0,0,0,.6);
	padding: 8px;
	clear: both;
}

#panel .upper a:link, #panel .upper a:visited, #panel .upper a:hover, #panel .upper a:active { color: #fff; }

#panel .lower {
	background: rgba(20,24,27,.86);
	color: var(--muted);
	border-top: 1px solid rgba(255,255,255,.06);
	border-bottom: 1px solid var(--border);
	padding: 6px;
}

#panel .lower a:link, #panel .lower a:visited, #panel .lower a:hover, #panel .lower a:active { color: var(--accent-soft); }

#search { border: 0; padding: 0; margin: 0; float: right; vertical-align: middle; }

#search input.button, #search input.textbox { border-color: var(--border); }

#search input.button {
	background: linear-gradient(180deg, rgba(72,80,87,.9), rgba(34,40,45,.9));
	color: #fff;
}

#search input { margin: -3px 0; }

#quick_login .remember_me input { vertical-align: middle; margin: -3px 0 0 5px; }

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

#footer {
	clear: both;
	/* sticky footer, part 3 — pins to the bottom of the viewport on short
	   pages; on tall pages it simply sits after the content as normal. */
	margin-top: auto;
	width: 100%;
}
#footer ul.menu { margin: 0; padding: 0; list-style: none; }
#footer ul.menu li { margin: 0 5px; display: inline; }

#footer .upper {
	background: linear-gradient(180deg, rgba(30,36,40,.94), rgba(15,19,22,.98));
	border-top: 1px solid var(--border);
	border-bottom: 1px solid var(--border);
	padding: 8px;
	font-size: 12px;
	overflow: hidden;
}

#footer a:link, #footer a:visited, #footer a:hover, #footer a:active { color: var(--muted); }
#footer .upper .language { float: right; margin: -1px; margin-left: 15px; }
#footer .upper .language select { border-color: var(--border); }
/* Hides the theme-switcher control once someone IS on DSTVAGIMMO, so they
   can't accidentally hop back to Default from here. This alone doesn't stop
   someone from switching in the first place if Default is still reachable —
   that's a permissions setting, not CSS, see the install guide's "locking
   the theme" section. */
#footer .upper .theme { display: none; }
#footer .upper .theme select { border-color: var(--border); }
#footer .upper ul.bottom_links { float: left; margin: 4px 0 0 0; }

#footer .lower {
	background: rgba(10,13,15,.96);
	color: var(--muted);
	padding: 8px 6px 14px 6px;
	overflow: hidden;
	font-size: 11px;
}

#footer .lower a:link, #footer .lower a:visited { color: var(--accent-soft); font-weight: 700; }
#footer .lower a:hover, #footer .lower a:active { color: #fff; text-decoration: underline; font-weight: 700; }
#footer .lower #current_time { float: right; color: var(--muted); }

/* Query/debug stats footer bit — not something visitors should see.
   Better fix: Admin CP -> Configuration -> Server and Optimization Options
   -> turn off the query/debug stats display for your usergroup. This CSS
   hides it regardless, as a guaranteed fallback. */
#debug { display: none !important; }

.scaleimages img { max-width: 100%; }

/* status/forum icons */
.forum_status {
	height: 30px;
	width: 30px;
	background: url(/images/forum_icon_sprite.png) no-repeat 0 0;
	display: inline-block;
	vertical-align: middle;
}

.forum_on { background-position: 0 0; }
.forum_off { background-position: 0 -30px; }
.forum_offclose { background-position: 0 -60px; }
.forum_offlink { background-position: 0 -90px; }

.subforumicon {
	height: 10px;
	width: 10px;
	display: inline-block;
	margin: 0 5px;
	background: url(/images/mini_status_sprite.png) no-repeat 0 0;
}

.subforum_minion { background-position: 0 0; }
.subforum_minioff { background-position: 0 -10px; }
.subforum_minioffclose { background-position: 0 -20px; }
.subforum_miniofflink { background-position: 0 -30px; }

.forum_status,
.subforumicon { filter: brightness(1.4) saturate(0); opacity: .9; }

/* ---------- tables / cards ---------- */

table { color: var(--text); font-size: 14px; }

.tborder {
	background: linear-gradient(145deg, rgba(255,255,255,.06), transparent 34%), var(--panel);
	width: 100%;
	margin: auto auto;
	border: 1px solid var(--border);
	border-radius: 12px;
	padding: 1px;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 42px var(--shadow);
	backdrop-filter: blur(14px) saturate(116%);
	overflow: hidden;
}

.tfixed { table-layout: fixed; word-wrap: break-word; }

.thead {
	background: linear-gradient(180deg, rgba(72,80,87,.95), rgba(38,44,49,.95));
	color: var(--text);
	border-bottom: 1px solid var(--border);
	padding: 7px 10px;
	font-family: var(--font-display);
	font-weight: 700;
	letter-spacing: .6px;
	text-transform: uppercase;
	font-size: 12px;
}

.thead a:link, .thead a:visited { color: var(--text); text-decoration: none; }
.thead a:hover, .thead a:active { color: #fff; text-decoration: underline; }

.tcat {
	background: linear-gradient(180deg, rgba(30,35,39,.96), rgba(10,13,15,.98));
	color: var(--accent);
	border-top: 1px solid var(--border);
	border-bottom: 1px solid rgba(0,0,0,.5);
	padding: 5px 10px;
	font-size: 11px;
	font-family: var(--font-display);
	font-weight: 600;
	letter-spacing: .5px;
}

.tcat a:link, .tcat a:visited, .tcat a:hover, .tcat a:active { color: var(--accent); }

.trow1, .trow2 { padding: 8px 10px; }
.trow1 { background: rgba(46,52,58,.86); border: 1px solid; border-color: rgba(255,255,255,.06) rgba(0,0,0,.35) rgba(0,0,0,.35) rgba(255,255,255,.06); }
.trow2 { background: rgba(32,37,41,.86); border: 1px solid; border-color: rgba(255,255,255,.06) rgba(0,0,0,.35) rgba(0,0,0,.35) rgba(255,255,255,.06); }

.trow1:hover, .trow2:hover { background: rgba(70,78,86,.4); transition: background .12s ease; }

.trow_shaded { background: rgba(248,113,113,.14); border: 1px solid; border-color: rgba(255,255,255,.08) rgba(248,113,113,.4) rgba(248,113,113,.4) rgba(255,255,255,.08); }

.no_bottom_border { border-bottom: 0; }

.post.unapproved_post { background: rgba(248,113,113,.12); }
.thread_start_datetime { color: var(--muted); }
.post.unapproved_post .post_author { border-bottom-color: rgba(248,113,113,.4); }
.post.classic.unapproved_post .post_author { border-color: rgba(248,113,113,.4); }
.post.unapproved_post .post_controls { border-top-color: rgba(248,113,113,.4); }

.trow_deleted, .post.deleted_post { background: rgba(120,90,220,.14); }

.trow_selected, tr.trow_selected td {
	background: var(--gold-soft);
	color: var(--text);
	border-right-color: var(--gold);
	border-bottom-color: var(--gold);
}

.trow_selected a:link, .trow_selected a:visited, .trow_selected a:hover, .trow_selected a:active { color: var(--text); }

.trow_sep {
	background: rgba(20,24,27,.85);
	color: var(--accent);
	border-bottom: 1px solid var(--border);
	padding: 5px 10px;
	font-size: 11px;
	font-weight: 700;
	font-family: var(--font-display);
	letter-spacing: .5px;
}

.tfoot { border-top: 1px solid var(--border); padding: 7px; background: rgba(20,24,27,.85); color: var(--muted); }
.tfoot a:link, .tfoot a:visited { color: var(--accent-soft); text-decoration: none; }
.tfoot a:hover, .tfoot a:active { color: #fff; text-decoration: underline; }

.thead input.textbox, .thead select { border: 1px solid var(--border); }

.bottommenu {
	background: var(--panel);
	color: var(--text);
	border: 1px solid var(--border);
	border-radius: 10px;
	padding: 12px;
}

.navigation { color: var(--muted); font-size: 12px; }
.navigation a:link, .navigation a:visited { text-decoration: none; color: var(--accent-soft); }
.navigation a:hover, .navigation a:active { text-decoration: underline; color: #fff; }
.navigation .active { color: var(--text); font-size: small; font-weight: 700; }

.smalltext { font-size: 11px; color: var(--muted); }
.largetext { font-size: 17px; font-weight: 700; font-family: var(--font-display); }

/* ---------- forms ---------- */

fieldset { padding: 14px; border: 1px solid var(--border); border-radius: 8px; margin: 0; }
fieldset.trow1, fieldset.trow2 { border-color: var(--border); }
fieldset.align_right { text-align: right; }
legend { color: var(--accent); font-family: var(--font-display); font-weight: 700; letter-spacing: .3px; }

input.textbox, textarea, select {
	background: rgba(15,18,20,.75);
	color: var(--text);
	border: 1px solid var(--border);
	border-radius: 6px;
	padding: 6px 8px;
	outline: 0;
	font-size: 14px;
	font-family: var(--font-ui);
}

input.textbox:focus, textarea:focus, select:focus { border-color: var(--border-strong); box-shadow: 0 0 0 3px rgba(215,221,226,.12); }

input.textbox.portal_search { width: 68%; }

button, input.button {
	position: relative;
	overflow: hidden;
	padding: 8px 16px;
	cursor: pointer;
	font-family: var(--font-ui);
	font-weight: 700;
	font-size: 13px;
	letter-spacing: .3px;
	background: linear-gradient(180deg, rgba(72,80,87,.9), rgba(34,40,45,.9));
	border: 1px solid var(--border);
	border-radius: 8px;
	color: #fff;
	outline: 0;
	transition: transform .18s ease, background .18s ease, color .18s ease, border-color .18s ease;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 8px 18px rgba(0,0,0,.2);
}

button:hover, input.button:hover {
	background: linear-gradient(180deg, #edf2f6, #aeb8c1);
	color: #11171a;
	border-color: var(--border-strong);
	transform: translateY(-2px);
}

form { margin: 0; padding: 0; }

input.error, textarea.error, select.error { border: 1px solid var(--danger); color: var(--danger); }
input.valid, textarea.valid, select.valid { border: 1px solid var(--success); }

label.error { color: var(--danger); margin: 5px; padding: 0; display: block; font-weight: 700; font-size: 11px; }

form #message { width: 500px; }

.editor { background: rgba(15,18,20,.6); border: 1px solid var(--border); border-radius: 8px; }
.editor_control_bar { background: rgba(30,35,39,.8); border: 1px solid var(--border); }
.post .editor_control_bar { background: rgba(30,35,39,.6); }

.popup_menu {
	background: var(--panel-strong);
	border: 1px solid var(--border);
	border-radius: 8px;
	box-shadow: 0 12px 30px var(--shadow);
	backdrop-filter: blur(12px);
}

.popup_menu .popup_item { background: transparent; color: var(--text); }
.popup_menu .popup_item:hover { background: var(--accent); color: #11171a; }

.trow_reputation_positive { background: rgba(143,230,171,.14); }
.trow_reputation_negative { background: rgba(248,113,113,.14); }
.reputation_positive { color: var(--success); }
.reputation_neutral { color: var(--muted); }
.reputation_negative { color: var(--danger); }

.repbox { font-size: 16px; font-weight: 700; padding: 5px 7px; }
._neutral { background-color: rgba(183,192,200,.12); color: var(--muted); border: 1px solid var(--border); }
._minus { background-color: rgba(248,113,113,.14); color: var(--danger); border: 1px solid var(--danger); }
._plus { background-color: rgba(143,230,171,.14); color: var(--success); border: 1px solid var(--success); }

img { border: none; }
img.attachment { border: 1px solid var(--border); padding: 2px; border-radius: 4px; background: rgba(0,0,0,.2); }

hr { background-color: var(--border); color: var(--border); height: 1px; border: 0; }

.clear { clear: both; }
.float_left { float: left; }
.float_right { float: right; }
.hidden { display: none; float: none; width: 1%; }
.hiddenrow { display: none; }

.selectall { background: var(--gold-soft); border-bottom: 1px solid var(--gold); color: var(--text); text-align: center; }

.expcolimage { float: right; width: auto; vertical-align: middle; margin-top: 3px; filter: brightness(1.4) saturate(0); }
.tcat_menu > .expcolimage { margin-top: 0; }

blockquote { border: 1px solid var(--border); border-radius: 8px; margin: 0; background: rgba(15,18,20,.55); padding: 10px; }
blockquote cite { font-weight: 700; border-bottom: 1px solid var(--border); font-style: normal; display: block; padding-bottom: 3px; margin: 0 0 10px 0; color: var(--accent); }
blockquote cite > span { float: right; font-weight: normal; font-size: 12px; color: var(--muted); }
blockquote cite span.highlight { float: none; font-weight: 700; padding-bottom: 0; }

.codeblock { background: rgba(10,13,15,.75); border: 1px solid var(--border); border-radius: 8px; padding: 10px; }
.codeblock .title { border-bottom: 1px solid var(--border); font-weight: 700; padding-bottom: 3px; margin: 0 0 10px 0; color: var(--accent); }
.codeblock code { overflow: auto; height: auto; max-height: 200px; display: block; font-family: 'JetBrains Mono', Consolas, Monaco, Courier, monospace; font-size: 13px; white-space: pre; tab-size: 4; color: var(--text); }

.smilie { vertical-align: middle; }
.smilie_pointer { cursor: pointer; }
.separator { margin: 5px; padding: 0; height: 0; font-size: 1px; list-style-type: none; }

.popup_menu .popup_item_container { margin: 1px; text-align: left; }
.popup_menu .popup_item { display: block; padding: 6px 8px; white-space: nowrap; text-decoration: none; }
.popup_menu a.popup_item:hover { text-decoration: none; }

.subject_new { font-weight: 700; color: var(--accent); }
.highlight { background: var(--gold-soft); padding-top: 3px; padding-bottom: 3px; }

.pm_alert { background: var(--gold-soft); border: 1px solid var(--gold); color: var(--text); text-align: center; padding: 6px 20px; margin-bottom: 15px; font-size: 11px; border-radius: 6px; }

.red_alert {
	background: rgba(248,113,113,.14);
	border: 1px solid var(--danger);
	color: #ffb4b4;
	text-align: center;
	padding: 6px 20px;
	margin-bottom: 15px;
	font-size: 11px;
	word-wrap: break-word;
	border-radius: 6px;
}

.red_alert a:link, .red_alert a:visited, .red_alert a:hover, .red_alert a:active { color: #ffb4b4; }

.high_warning { color: #ff8080; }
.moderate_warning { color: #ffab6b; }
.low_warning { color: #e0b366; }
.imminent_banned { color: #ff6b6b; }
.high_banned { color: #ff6b6b; }
.moderate_banned { color: #ffab6b; }
.low_banned { color: var(--success); }
.online { color: var(--success); }
.offline { color: var(--muted); }

div.error { padding: 6px 10px; border: 1px solid var(--gold); background: var(--gold-soft); font-size: 12px; border-radius: 6px; }
div.error p { margin: 0; color: var(--text); font-weight: normal; }
div.error p em { font-style: normal; font-weight: 700; padding-left: 24px; display: block; color: var(--danger); background: url(/images/error.png) no-repeat 0; }
div.error ul { margin-left: 24px; }

/* ---------- pagination ---------- */

.pagination { font-size: 11px; padding-top: 10px; margin-bottom: 5px; }
.tfoot .pagination, .tcat .pagination { padding-top: 0; }
.pagination .pages { font-weight: 700; color: var(--accent); }

.pagination .pagination_current, .pagination a { padding: 4px 8px; margin-bottom: 3px; border-radius: 5px; }

.pagination a { background: rgba(43,49,54,.6); border: 1px solid var(--border); color: var(--accent-soft); }
.pagination .pagination_current { background: var(--accent); color: #11171a; border: none; font-weight: 700; }
.pagination a:hover { background: var(--accent); color: #11171a; border-color: var(--border-strong); text-decoration: none; }

.pagination .go_page img { margin-bottom: -4px; }
.drop_go_page { background: rgba(43,49,54,.6); padding: 4px; border-radius: 5px; }

.pagination_breadcrumb {
	background-color: rgba(20,24,27,.7);
	border: 1px solid var(--border);
	outline: none;
	padding: 6px;
	margin-top: 5px;
	font-weight: normal;
	border-radius: 6px;
	color: var(--muted);
}

.pagination_breadcrumb a { color: var(--accent-soft); }
.pagination_breadcrumb_link { vertical-align: middle; cursor: pointer; }

.thread_legend, .thread_legend dd { margin: 0; padding: 0; }
.thread_legend dd { padding-bottom: 4px; margin-right: 15px; color: var(--muted); }
.thread_legend img { margin-right: 4px; vertical-align: bottom; }

.forum_legend, .forum_legend dt, .forum_legend dd { margin: 0; padding: 0; }
.forum_legend dd { float: left; margin-right: 10px; margin-top: 7px; color: var(--muted); }
.forum_legend dt { margin-right: 10px; float: left; }

.success_message { color: var(--success); font-weight: 700; font-size: 11px; margin-bottom: 10px; }
.error_message { color: var(--danger); font-weight: 700; font-size: 11px; margin-bottom: 10px; }

/* ---------- posts / postbit ---------- */

#posts_container { padding: 0; }

.ignored_post { border-top: 2px solid var(--border); padding: 15px; }
.ignored_post .show_ignored_post { margin-top: -15px; }
.deleted_post_hidden { border-top: 2px solid var(--border); padding: 15px; }
.deleted_post_collapsed { border-top: 2px solid var(--border); padding: 15px; }
.deleted_post_collapsed .show_deleted_post { margin-top: -15px; }

.post { overflow: hidden; }
.post.classic { padding-top: 15px; }

.post .post_author {
	border-bottom: 1px solid var(--border);
	border-top: 2px solid var(--accent);
	background: rgba(20,24,27,.55);
	padding: 6px;
	overflow: hidden;
}

.post.classic .post_author { border: 1px solid var(--border); float: left; width: 15%; margin: 0 1% 15px 0; border-left: 0; border-radius: 0 8px 8px 0; padding: 8px 1%; }

.post .post_author .buddy_status { vertical-align: middle; margin-top: -4px; }
.post .post_author div.author_avatar { float: left; margin-right: 6px; }
.post.classic .post_author div.author_avatar { float: none; text-align: center; margin-bottom: 8px; }
.post .post_author div.author_avatar img { padding: 4px; border: 1px solid var(--border); background: rgba(0,0,0,.25); border-radius: 6px; }
.post .post_author div.author_information { float: left; padding: 6px 8px; }
.post.classic .post_author div.author_information { float: none; padding: 0; text-align: center; }

.post .post_author div.author_statistics { float: right; font-size: 11px; padding: 3px 10px 3px 5px; color: var(--muted); line-height: 1.3; }
.post.classic .post_author div.author_statistics { border-top: 1px dotted var(--border); margin: 6px 0 0 0; padding: 6px 6px 3px 6px; float: none; }

.post .post_head { font-size: 11px; padding-bottom: 4px; border-bottom: 1px dotted var(--border); margin-bottom: 4px; color: var(--muted); }
.post .post_head span.post_date { color: var(--muted); }
.post .post_head span.edited_post { font-size: 10px; color: var(--muted); }
.post .post_head span.edited_post a { color: var(--accent-soft); }

.post_body { font-size: 15px; padding: 12px 0; color: var(--text); }
.post.classic .post_content { float: left; width: 79%; padding: 0 1% 5px 1%; }
.post_content { padding: 9px 10px 5px 10px; }
.post_content .signature { margin-top: 5px; border-top: 1px dotted var(--border); padding: 10px 0 4px 0; color: var(--muted); }

.post .post_meta { margin: 4px 0; font-size: 11px; color: var(--muted); }
.post .post_meta a:link, .post .post_meta a:visited, .post .post_meta a:hover, .post .post_meta a:active { color: var(--accent-soft); }

.post_controls { clear: both; background: rgba(20,24,27,.55); border-bottom: 1px solid var(--border); padding: 6px; overflow: hidden; }

.postbit_buttons > a:link, .postbit_buttons > a:hover, .postbit_buttons > a:visited, .postbit_buttons > a:active {
	display: inline-block;
	padding: 3px 6px;
	margin: 2px;
	font-size: 11px;
	background: rgba(43,49,54,.7);
	border: 1px solid var(--border);
	border-radius: 5px;
	color: var(--accent-soft);
}

.postbit_buttons > a:hover { border-color: var(--border-strong); color: #fff; }
.postbit_buttons a span { padding-left: 20px; display: inline-block; height: 16px; color: var(--accent-soft); background-image: url(/images/buttons_sprite.png); background-repeat: no-repeat; }

/* postbit action icon positions (find/reply/quote/edit/delete/report/etc — restored
   from stock so each button shows its correct sprite frame instead of all
   sharing the default) */
.postbit_buttons a.postbit_find span  { background-position: 0 0; }

.postbit_buttons a.postbit_reputation_add span  { background-position: 0 -20px; }

.postbit_buttons a.postbit_email span  { background-position: 0 -40px; }

.postbit_buttons a.postbit_website span  { background-position: 0 -60px; }

.postbit_buttons a.postbit_pm span  { background-position: 0 -80px; }

.postbit_buttons a.postbit_quote span  { background-position: 0 -100px; }

.postbit_buttons a.postbit_multiquote span  { background-position: 0 -120px; }

.postbit_buttons a.postbit_multiquote_on span  { background-position: 0 -140px; }

.postbit_buttons a.postbit_edit span  { background-position: 0 -160px; }

.postbit_buttons a.postbit_qdelete span  { background-position: 0 -180px; }

.postbit_buttons a.postbit_qrestore span  { background-position: 0 -200px; }

.postbit_buttons a.postbit_report span  { background-position: 0 -220px; }

.postbit_buttons a.postbit_warn span  { background-position: 0 -240px; }

.postbit_buttons a.postbit_purgespammer span  { background-position: 0 -540px; }

.postbit_buttons a.postbit_reply_pm span  { background-position: 0 -260px; }

.postbit_buttons a.postbit_reply_all span  { background-position: 0 -280px; }

.postbit_buttons a.postbit_forward_pm span  { background-position: 0 -300px; }

.postbit_buttons a.postbit_delete_pm span  { background-position: 0 -320px; }

.ignored_post .show_ignored_post a.button span  { background-position: 0 -400px; }

.deleted_post_collapsed .show_deleted_post a.button span  { background-position: 0 -400px; }

.post:not(.deleted_post) .postbit_qrestore,
.post:not(.deleted_post) .status_type,
.post.deleted_post .postbit_mirage { display: none; }

a.button:link, a.button:hover, a.button:visited, a.button:active {
	position: relative;
	overflow: hidden;
	background: linear-gradient(180deg, rgba(72,80,87,.92), rgba(34,40,45,.92));
	color: #fff;
	display: inline-block;
	padding: 6px 12px;
	margin: 2px 2px 6px 2px;
	border: 1px solid var(--border);
	border-radius: 7px;
	font-size: 14px;
	font-weight: 600;
	transition: transform .18s ease, background .18s ease, color .18s ease;
}

a.button:hover { background: linear-gradient(180deg, #edf2f6, #aeb8c1); color: #11171a; transform: translateY(-1px); }
a.button.small_button { font-size: 13px; margin: 0; padding: 4px 8px; }
a.button span { padding-left: 20px; display: inline-block; background-image: url(/images/buttons_sprite.png); background-repeat: no-repeat; }

/* a.button icon positions (new thread/new reply/closed/rate/buddy/ignore/report) */
a.button.new_thread_button span  { background-position: 0 -340px; }

a.button.new_reply_button span  { background-position: 0 -360px; }

a.button.closed_button span  { background-position: 0 -380px; }

a.button.rate_user_button span  { background-position: 0 -400px; }

a.button.add_buddy_button span  { background-position: 0 -440px; }

a.button.remove_buddy_button span  { background-position: 0 -480px; }

a.button.add_ignore_button span  { background-position: 0 -460px; }

a.button.remove_ignore_button span  { background-position: 0 -500px; }

a.button.report_user_button span  { background-position: 0 -520px; }

.quick_jump { background: url(/images/jump.png) no-repeat 0; filter: invert(1) brightness(1.6); width: 13px; height: 13px; padding-left: 13px; margin-top: -3px; border: none; }

.pollbar { background: linear-gradient(90deg, var(--accent-soft), var(--accent)); border: 1px solid var(--border); border-radius: 4px; height: 10px; }
.pollbar .percent { display: none; }
.poll_votedfor { background: rgba(43,49,54,.5); border: 1px solid; border-color: rgba(255,255,255,.06) var(--border) var(--border) rgba(255,255,255,.06); }

.posticons_label { white-space: nowrap; color: var(--muted); }

/* ---------- headings inherit display font ---------- */

h1, h2, h3, .largetext, #logo .title, #logo h1 {
	font-family: var(--font-display);
	letter-spacing: .3px;
}

/* ---------- jGrowl / modal / Impromptu (jqi) — stock structural CSS ----------
   These power interactive bits (toast notifications, delete-confirm
   dialogs, rating popups). Kept verbatim from MyBB's stock global.css so
   positioning/sizing/display logic the JS depends on isn't broken; theme
   colors are re-applied afterward in the override block below. */

/** jGrowl Styling **/
.jGrowl {
	z-index: 9999;
	color: #ffffff;
	font-size: 12px;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	position: fixed;
}
.jGrowl.top-left {
	left: 0px;
	top: 0px;
}
.jGrowl.top-right {
	right: 0px;
	top: 0px;
}
.jGrowl.bottom-left {
	left: 0px;
	bottom: 0px;
}
.jGrowl.bottom-right {
	right: 0px;
	bottom: 0px;
}
.jGrowl.center {
	top: 0px;
	width: 50%;
	left: 25%;
}

/** Cross Browser Styling **/

.jGrowl.center .jGrowl-notification,
.jGrowl.center .jGrowl-closer {
	margin-left: auto;
	margin-right: auto;
}
.jGrowl-notification {
	background-color: transparent;
	opacity: 0.9;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=(0.9*100));
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=(0.9*100));
	transform: scale(1);
	width: 250px;
	padding: 10px;
	margin: 10px;
	text-align: left;
	display: none;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
	word-break: break-all;
}
.jGrowl .jGrowl-notification {
	min-height: 40px;
}
.jGrowl-notification .ui-state-highlight,
.jGrowl-notification .ui-widget-content .ui-state-highlight,
.jGrowl-notification .ui-widget-header .ui-state-highlight {
	border: 1px solid #000;
	background: #000;
	color: #fff;
}
.jGrowl-notification .jGrowl-header {
	font-weight: bold;
	font-size: .85em;
}
.jGrowl-notification .jGrowl-close {
	background-color: transparent;
	color: inherit;
	border: none;
	z-index: 99;
	float: right;
	font-weight: bold;
	font-size: 1em;
	cursor: pointer;
}
.jGrowl-closer {
	background-color: #000000;
	opacity: 0.9;
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=(0.9*100));
	-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=(0.9*100));
	transform: scale(1);
	width: 250px;
	padding: 10px;
	margin: 10px;
	text-align: left;
	display: none;
	border-radius: 5px;
	word-break: break-all;
	padding-top: 4px;
	padding-bottom: 4px;
	cursor: pointer;
	font-size: .9em;
	font-weight: bold;
	text-align: center;
}
.jGrowl-closer .ui-state-highlight,
.jGrowl-closer .ui-widget-content .ui-state-highlight,
.jGrowl-closer .ui-widget-header .ui-state-highlight {
	border: 1px solid #000;
	background: #000;
	color: #fff;
}

.jGrowl .jGrowl-notification.jgrowl_success {
    background: lightgreen;
    border: 1px solid lightgreen;
    color: #333;
}

.jGrowl .jGrowl-notification.jgrowl_error {
    background: red;
    border: 1px solid red;
    color: #333;
}

.jGrowl .jGrowl-notification.jgrowl_process, .jGrowl .jGrowl-closer {
    background: yellow;
    border: 1px solid yellow;
	color: #333;
}

/** Hide jGrowl when printing **/
@media print {
	.jGrowl {
		display: none;
	}
}

/** jGrowl End **/

/** Modal Start **/

.blocker {
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	z-index: 9999;
	padding: 20px;
	box-sizing: border-box;
	background-color: rgb(0,0,0);
	background-color: rgba(0,0,0,0.75);
	text-align: center;
}

.blocker:before{
	content: "";
	display: inline-block;
	height: 100%;
	vertical-align: middle;
	margin-right: -0.05em;
}

.blocker.behind {
	background-color: transparent;
}

.modal {
	width: 400px;
	text-align: left;
	background: #fff;
	display: inline-block;
	vertical-align: middle;
	position: relative;
	z-index: 2;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-o-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
	-webkit-box-shadow: 0 0 10px #000;
	-moz-box-shadow: 0 0 10px #000;
	-o-box-shadow: 0 0 10px #000;
	-ms-box-shadow: 0 0 10px #000;
	box-shadow: 0 0 10px #000;
}

.modal a.close-modal {
	position: absolute;
	top: -12.5px;
	right: -12.5px;
	display: block;
	width: 30px;
	height: 30px;
	text-indent: -9999px;
	background: url(/images/close.png) no-repeat 0 0;
	z-index: 2;
}

.modal-spinner {
	display: none;
	width: 64px;
	height: 64px;
	position: fixed;
	top: 50%;
	left: 50%;
	margin-right: -32px;
	margin-top: -32px;
	background: url(/images/spinner_big.gif) no-repeat center center;
	-webkit-border-radius: 8px;
	-moz-border-radius: 8px;
	-o-border-radius: 8px;
	-ms-border-radius: 8px;
	border-radius: 8px;
}

/** Modal End **/

/** Impromptu Start **/

/*! jQuery-Impromptu - v6.2.3 - 2016-04-23
* http://trentrichardson.com/Impromptu
* Copyright (c) 2016 Trent Richardson; Licensed MIT */

.jqifade{
	position: absolute;
	background-color: #777777;
}
iframe.jqifade{
	display:block;
	z-index:-1;
}
div.jqi{
	width: 400px;
	max-width:90%;
	font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
	position: absolute;
	background-color: #ffffff;
	font-size: 11px;
	text-align: left;
	border: solid 1px #eeeeee;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	padding: 7px;
}
div.jqi .jqicontainer{
}
div.jqi .jqiclose{
	position: absolute;
	top: 4px; right: -2px;
	width: 18px;
	cursor: default;
	color: #bbbbbb;
	font-weight: bold;
}
div.jqi .jqistate{
	background-color: #fff;
}
div.jqi .jqititle{
	padding: 5px 10px;
	font-size: 16px;
	line-height: 20px;
	border-bottom: solid 1px #eeeeee;
}
div.jqi .jqimessage{
	padding: 10px;
	line-height: 20px;
	color: #444444;
	overflow: auto;
}
div.jqi .jqibuttonshide{
	display: none;
}
div.jqi .jqibuttons{
	text-align: right;
	margin: 0 -7px -7px -7px;
	border-top: solid 1px #e4e4e4;
	background-color: #f4f4f4;
	border-radius: 0 0 6px 6px;
	-moz-border-radius: 0 0 6px 6px;
	-webkit-border-radius: 0 0 6px 6px;
}
div.jqi .jqibuttons button{
	margin: 0;
	padding: 15px 20px;
	background-color: transparent;
	font-weight: normal;
	border: none;
	border-left: solid 1px #e4e4e4;
	color: #777;
	font-weight: bold;
	font-size: 12px;
}
div.jqi .jqibuttons button.jqidefaultbutton{
	color: #489afe;
}
div.jqi .jqibuttons button:hover,
div.jqi .jqibuttons button:focus{
	color: #287ade;
	outline: none;
}
div.jqi .jqibuttons button[disabled]{
	color: #aaa;
}
.jqiwarning .jqi .jqibuttons{
	background-color: #b95656;
}

/* sub states */
div.jqi .jqiparentstate::after{
	background-color: #777;
	opacity: 0.6;
	filter: alpha(opacity=60);
	content: '';
	position: absolute;
	top:0;left:0;bottom:0;right:0;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}
div.jqi .jqisubstate{
	position: absolute;
	top:0;
	left: 20%;
	width: 60%;
	padding: 7px;
	border: solid 1px #eeeeee;
	border-top: none;
	border-radius: 0 0 6px 6px;
	-moz-border-radius: 0 0 6px 6px;
	-webkit-border-radius: 0 0 6px 6px;
}
div.jqi .jqisubstate .jqibuttons button{
	padding: 10px 18px;
}

/* arrows for tooltips/tours */
.jqi .jqiarrow{ position: absolute; height: 0; width:0; line-height: 0; font-size: 0; border: solid 10px transparent;}

.jqi .jqiarrowtl{ left: 10px; top: -20px; border-bottom-color: #ffffff; }
.jqi .jqiarrowtc{ left: 50%; top: -20px; border-bottom-color: #ffffff; margin-left: -10px; }
.jqi .jqiarrowtr{ right: 10px; top: -20px; border-bottom-color: #ffffff; }

.jqi .jqiarrowbl{ left: 10px; bottom: -20px; border-top-color: #ffffff; }
.jqi .jqiarrowbc{ left: 50%; bottom: -20px; border-top-color: #ffffff; margin-left: -10px; }
.jqi .jqiarrowbr{ right: 10px; bottom: -20px; border-top-color: #ffffff; }

.jqi .jqiarrowlt{ left: -20px; top: 10px; border-right-color: #ffffff; }
.jqi .jqiarrowlm{ left: -20px; top: 50%; border-right-color: #ffffff; margin-top: -10px; }
.jqi .jqiarrowlb{ left: -20px; bottom: 10px; border-right-color: #ffffff; }

.jqi .jqiarrowrt{ right: -20px; top: 10px; border-left-color: #ffffff; }
.jqi .jqiarrowrm{ right: -20px; top: 50%; border-left-color: #ffffff; margin-top: -10px; }
.jqi .jqiarrowrb{ right: -20px; bottom: 10px; border-left-color: #ffffff; }

/** Impromptu End */

/* ---------- jGrowl / modal / Impromptu — DSTVAGIMMO color overrides ---------- */

.jGrowl-notification {
	background-color: var(--panel-strong) !important;
	border: 1px solid var(--border) !important;
	color: var(--text) !important;
	border-radius: 8px !important;
	backdrop-filter: blur(10px);
}

.jGrowl .jGrowl-notification.jgrowl_success { background: rgba(143,230,171,.18) !important; border-color: var(--success) !important; color: var(--text) !important; }
.jGrowl .jGrowl-notification.jgrowl_error { background: rgba(248,113,113,.18) !important; border-color: var(--danger) !important; color: var(--text) !important; }
.jGrowl .jGrowl-notification.jgrowl_process, .jGrowl .jGrowl-closer { background: var(--gold-soft) !important; border-color: var(--gold) !important; color: var(--text) !important; }

.blocker { background-color: rgba(10,13,15,.82) !important; }
.blocker.behind { background-color: transparent !important; }

.modal {
	background: var(--panel-strong);
	border: 1px solid var(--border);
	border-radius: 12px;
	box-shadow: 0 20px 60px var(--shadow);
	color: var(--text);
	backdrop-filter: blur(16px);
}

.modal a.close-modal { filter: invert(1) brightness(1.6); }
.modal-spinner { filter: invert(1) brightness(1.4); }

div.jqi {
	background-color: var(--panel-strong);
	color: var(--text);
	border: 1px solid var(--border);
	border-radius: 10px;
	font-family: var(--font-ui);
	box-shadow: 0 20px 60px var(--shadow);
}

div.jqi .jqistate { background-color: transparent; }
div.jqi .jqititle { border-bottom: 1px solid var(--border); color: var(--accent); font-family: var(--font-display); }
div.jqi .jqimessage { color: var(--text); }
div.jqi .jqibuttons { background-color: rgba(20,24,27,.7); border-top: 1px solid var(--border); }
div.jqi .jqibuttons button { color: var(--muted); border-left: 1px solid var(--border); }
div.jqi .jqibuttons button.jqidefaultbutton { color: var(--accent); }
div.jqi .jqibuttons button:hover, div.jqi .jqibuttons button:focus { color: #fff; }
div.jqi .jqiparentstate::after { background-color: rgba(10,13,15,.7); }
div.jqi .jqisubstate { background-color: var(--panel-strong); border-color: var(--border); }
.jqifade { background-color: rgba(10,13,15,.6); }

/* ============================================================
   PREMIUM / COMPACT POLISH — v2
   Tighter density + small "expensive UI" details: custom
   scrollbar, text selection color, breadcrumb accent, status
   icon glow, slightly smaller controls.
   ============================================================ */

::selection { background: var(--gold-soft); color: #fff; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #0c0f11; }
::-webkit-scrollbar-thumb {
	background: linear-gradient(180deg, rgba(96,105,113,.9), rgba(46,53,58,.9));
	border-radius: 6px;
	border: 2px solid #0c0f11;
}
::-webkit-scrollbar-thumb:hover { background: var(--accent-soft); }
html { scrollbar-color: #5a636b #0c0f11; scrollbar-width: thin; }

/* tighter, denser controls */
button, input.button {
	padding: 6px 13px;
	font-size: 12px;
}

a.button:link, a.button:hover, a.button:visited, a.button:active {
	padding: 5px 11px;
	font-size: 13px;
}

a.button.small_button { padding: 3px 7px; font-size: 12px; }

.pagination .pagination_current, .pagination a { padding: 3px 7px; font-size: 11px; }

/* breadcrumb: small accent chevron + tighter spacing */
.navigation { padding: 2px 0; }

.pagination_breadcrumb { padding: 5px 8px; font-size: 11.5px; }

/* Default forum status icon (folder sprite) gets a proper badge plate so it
   reads as a real icon rather than a small flat sprite. Once you upload a
   custom per-forum icon in Admin CP -> Forums & Posts -> Management (see
   the icons/ folder in this package), MyBB swaps in that <img> instead and
   this plate no longer applies (style the custom icon file itself, since
   the badge look is already baked into those PNGs). */
.forum_status {
	box-sizing: border-box;
	background-color: rgba(20,24,27,.6);
	border: 1px solid var(--border);
	border-radius: 8px;
	box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 4px 10px rgba(0,0,0,.35);
}

/* The stock sprite's folder glyph is drawn in dark grey/blue, meant to sit on
   MyBB's light default background. Brightness/saturate alone weren't enough
   to lift it off this dark plate (it read as an empty circle). Inverting the
   icon turns the glyph light/white so it's clearly visible against the dark
   plate; there's no text in this element so invert is safe here (unlike the
   header/login links, where invert was reverted because it also inverted
   visible text). */
.forum_status.forum_on { filter: invert(1) brightness(1.7) drop-shadow(0 0 3px rgba(143,230,171,.7)); border-color: rgba(143,230,171,.4); }
.forum_status.forum_off,
.forum_status.forum_offclose,
.forum_status.forum_offlink { filter: invert(1) brightness(1.3) opacity(.8); }

/* denser post spacing */
.post.classic { padding-top: 10px; }
.post_body { padding: 8px 0; }
.post_content { padding: 6px 10px 4px 10px; }

/* tighten vertical rhythm between stacked panels */
.wrapper br { line-height: 10px; }

/* smaller, tighter user/panel top bar text */
#panel .upper, #panel .lower { font-size: 11px; }

/* subtle card lift on hover for clickable thead/tcat rows that act as links */
.thead:has(a):hover, .tcat:has(a):hover { filter: brightness(1.08); }