/*********************************************
	 ** Stylesheet file for default Flux theme. **
	 *********************************************/

.loginbox-admin-menu {
	padding-top: 5px;
	color: #94b4d5;
}

body {
	margin: 0 0 20px 0;
	padding: 0;
	font-family: "Lucida Grande", "Lucida Sans", Verdana, Tahoma, sans-serif;
	font-size: 9pt;
	color: #000;
	background-color: #fff;
}

table {
	font-family: "Lucida Grande", "Lucida Sans", Verdana, Tahoma, sans-serif;
	font-size: 9pt;
}

tr, td, th {
	vertical-align: top;
}

.horizontal-table tr, .vertical-table tr, .generic-form-table tr,
.horizontal-table td, .vertical-table td, .generic-form-table td {
	vertical-align: middle;
}

.horizontal-table th, .vertical-table th, .generic-form-table th {
	vertical-align: top;
}

h2 {
	color: #444;
	letter-spacing: -1px;
}

h3 {
	/*font-style: italic;*/
	font-weight: normal;
	font-size: 120%;
	color: #444;
	border-bottom: 1px dotted #ddd;
	text-transform: uppercase;
}

h3:first-letter {
	font-weight: bold;
}

p {
	margin: 4px 0 8px 0;
	padding: 0;
}

a img {
	border: 0;
}

a {
	color: #4083c6;
	text-decoration: none;
}

input[type=text], input[type=password], input[type=file], textarea {
	font-family: "Lucida Grande", "Lucida Sans", Verdana, Tahoma, sans-serif;
	padding: 4px;
	font-size: 10pt;
	color: #444;
	border: 1px solid #ddd;
	outline-width: 0;
}

label:hover {
	cursor: pointer;
}

/*input[type=text]:hover, input[type=password]:hover, textarea:hover {
	color: #46a;
	background-color: #dee;
	border: 1px solid #8ac;
}*/

.module-name {
	font-weight: bold;
	font-size: 12pt;
}

.message {
	display: block;
	padding: 10px;
	font-weight: bold;
	font-size: 120%;
	color: #fff;
	background-color: #333;
}

.notice {
	display: block;
	padding: 10px;
	font-weight: normal;
	font-size: 120%;
	color: #204a87;
	background-color: #F0FFFF;
	border: 1px solid #87CEEB;
}

.center {
	text-align: center;
}

#admin_sidebar, #sidebar {
	margin-bottom: 10px;
	border-collapse: collapse;
	border-spacing: 0;
}

#admin_sidebar img, #sidebar img {
	display: block;
}

#admin_sidebar td, #sidebar td {
	padding: 0;
}

#admin_sidebar td.menuitem, #admin_sidebar th.menuitem {
	display: block;
	font-size: 10pt;
	border-width: 0 13px 0 11px;
	border-style: solid;
	border-color: #8b8b8b;
}

#admin_sidebar th.menuitem {
	background-color: #303030;
}

#admin_sidebar th.menuitem strong {
	display: block;
	margin: 0 12px;
	padding: 10px 0 2px 0;
	font-size: 100%;
	text-align: center;
	color: #fff;
	border-bottom: 1px solid #555;
}

#admin_sidebar td.menuitem a {
	margin: 0 auto;
	display: block;
	padding: 2px 5px 4px 18px;
	color: #fff;
	background-color: #303030;
	text-align: left;
	text-shadow: #000 1pt 1pt;
	text-decoration: none;
}

#admin_sidebar td.menuitem a:hover {
	color: #fff;
	background-color: #4a5259;
	text-shadow: #4a5259 1pt 1pt;
}

#admin_sidebar td.menuitem a span {
	/*display: block;*/
}

#sidebar td.sidebar-left, #sidebar td.sidebar-right {
	background-color: #e6f0fa;
}

#sidebar td.menuitem, #sidebar th.menuitem {
	display: block;
	font-size: 10pt;
	border-width: 0 13px 0 11px;
	border-style: solid;
	border-color: #c4d9ee;
}


#sidebar th.menuitem {
	background-color: #94b4d5;
}

#sidebar th.menuitem strong {
	display: block;
	margin: 0 12px;
	padding: 10px 0 2px 0;
	font-size: 100%;
	text-align: center;
	color: #fff;
	border-bottom: 1px solid #c4d9ee;
}

#sidebar td.menuitem a {
	margin: 0 auto;
	display: block;
	padding: 2px 5px 4px 18px;
	color: #fff;
	background-color: #94b4d5;
	text-align: left;
	text-shadow: #708fae 1pt 1pt;
	text-decoration: none;
}

#sidebar td.menuitem a:hover {
	color: #fff;
	background-color: #708fae;
	text-shadow: #708fae 1pt 1pt;
}

#sidebar td.menuitem a span {
	display: block;
}

.request, .fs-path {
	display: inline-block;
	padding: 2px;
	font-family: Monaco, "Lucida Console", "Bitsteam Vera Sans Mono", monospace;
	font-size: 8pt;
	background-color: #fff;
	border: 1px solid #eee;
}

.keyword {
	color: #ffba00;
	font-style: italic;
}

.red {
	display: block;
	padding: 10px;
	font-weight: bold;
	font-size: 120%;
	color: #fff;
	background-color: #f00;
}

.green {
	display: block;
	padding: 10px;
	font-weight: bold;
	font-size: 120%;
	color: #fff;
	background-color: #0c0;
}

.note {
	padding: 5px;
	color: #444;
	background-color: #eaeaea;
	font-style: italic;
}

.up {
	font-weight: bold;
	color: #0f0;
	text-transform: uppercase;
}

.down {
	color: #f00;
	text-transform: uppercase;
}

.submit_button {
	display: block;
	margin: 10px;
	padding: 5px;
	background-color: #eee;
	border: 1px solid #ccc;
}

.submit_button:hover {
	color: #fff;
	background-color: #333;
	border: 1px solid #111;
	cursor: pointer;
}

.install_table th, .install_table td {
	padding: 5px 10px;
	border: 1px solid #ddd;
}

.install_table th {
	background-color: #eef;
}

.install_table td {
	width: 180px;
	text-align: center;
}

.created {
	color: green;
	width: 80px;
}

.missing {
	color: red;
	width: 80px;
}

.pages {
	margin-top: 20px;
	padding-top: 10px;
	color: #ccc;
	text-align: center;
	border-top: 1px solid #ddd;
}

.pages .page-prev, .pages .page-next {
	color: #94b4d5;
}

.pages .page-num {
	padding: 0 5px;
}

.pages .current-page {
	color: #000000;
	font-weight: bold;
}

.horizontal-table {
	border-spacing: 0;
	border-collapse: collapse;
	width: 100%;
}

.horizontal-table th {
	padding: 5px 10px;
	background-color: #eee;
}

.horizontal-table td {
	padding: 5px 10px;
	background-color: #fff;
}

.horizontal-table th, .horizontal-table td {
	font-size: 9pt;
	border: 1px solid #ddd;
}

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

.vertical-table th {
	padding: 5px 10px;
	background-color: #eee;
}

.vertical-table td {
	padding: 5px 12px;
	background-color: #fff;
}

.vertical-table th, .vertical-table td {
	font-size: 9pt;
	border: 1px solid #ddd;
}

.vertical-table label {
	display: block;
	padding: 5px;
}

.current-sub-menu {
	font-weight: bold;
}

.td-checkbox {
	text-align: center;
}

.td-action {
	color: #ccc;
	text-align: center;
}

.vertical-table .td-action {
	text-align: right;
}

.vertical-table form {
	margin: 0;
	padding: 0;
}

.not-applicable {
	font-style: italic;
	color: #bbb;
}

.state-pending {
	color: orange;
}

.state-banned {
	color: red;
}

.state-permanently-banned {
	font-weight: bold;
	color: red;
}

.raw-txn-log {
	padding: 10px;
	font-family: "Monaco", "Lucida Console", "Courier New", monospace;
	background-color: #fff;
	border: 1px solid #ddd;
	width: 96%;
	overflow: scroll;
}

.online {
	color: #000;
}

.offline {
	color: #aaa;
}

.info-text-total {
	font-weight: bold;
}

.info-text-results {
	font-weight: bold;
}

.info-text {
	margin-bottom: 6px;
	padding: 5px;
	color: #666;
	background-color: #fff;
	border: 1px solid #ccc;
	text-align: center;
}

.toggler {
	font-weight: bold;
	font-style: italic;
}

.toggler a {
	color: #26a;
}

.search-form, search-form2 {
	display: none;
	margin: 0 0 10px 0;
	padding: 0;
	border-top: 1px solid #ddd;
}

.search-form p, .search-form2 p {
	margin: 0;
	padding: 5px;
	color: #aaa;
	text-align: left;
	border-bottom: 1px solid #ddd;
}

.search-form label, .search-form2 label {
	display: inline-block;
	margin: 0 0 3px 0;
	font-size: 8pt;
	font-style: italic;
	color: #222;
}

.search-form input[type=text], .search-form2 input[type=text] {
	display: inline-block;
	margin: 0 0 2px 0;
	padding: 2px;
	font-size: 8pt;
	width: 80px;
}

.search-form input[type=submit], .search-form2 input[type=submit] {
	display: inline-block;
	margin: 0 0 2px 0;
	font-size: 8pt;
	font-weight: bold;
}

.search-form input[type=button], .search-form input[type=reset],
.search-form2 input[type=button], .search-form2 input[type=reset] {
	display: inline-block;
	margin: 0 0 2px 0;
	font-size: 8pt;
}

.search-form input[type=checkbox], .search-form2 input[type=checkbox] {
	display: inline-block;
	margin: 0 0 2px 0;
}

.search-form select, .search-form2 select {
	display: inline-block;
	margin: 2px 0;
}

#submenu {
	color: #bbb;
}

#pagemenu {
	margin-top: 5px;
	padding: 5px 0;
	font-size: 8pt;
	color: #888;
	border-width: 1px 0;
	border-style: dotted;
	border-color: #ddd;
}

#pagemenu a {
	color: #777974;
	text-decoration: underline;
}

#pagemenu a:hover {
	color: #729fcf;
}

#loginbox {
	margin-bottom: 10px;
	color: #555;
}

#content {
	color: #555;
}

#register_form table td, #login_form table td {
	padding: 1px;
}

#register_form table th label, #login_form table th label {
	display: block;
	padding: 5px;
	text-align: center;
}

#register_form input[type=text], #register_form input[type=password], #login_form input[type=text], #login_form input[type=password] {
	width: 140px;
}

#register_form select, #login_form select {
	width: 147px;
}

#server_status th, #server_status td {
	padding: 8px 12px 8px 12px;
	text-align: left;
	border-bottom: 1px solid #ddd;	
}

#server_status {
	border-spacing: 0;
	border-collapse: collapse;
	background-color: #fff;
	border: 1px solid #ddd;
}

#server_status .server {
	color: #222;
}

#server_status .status {
	text-align: center;
}

#copyright p {
	margin-top: 5px;
	margin-bottom: 0px;
	font-style: italic;
	font-size: 8pt;
	color: #ccc;
	text-align: right;
}

#info p {
	margin-top: 5px;
	margin-bottom: 0px;
	font-style: italic;
	font-size: 8pt;
	color: #aaa;
	text-align: right;
}

.sortable {
	color: #444;
	text-decoration: underline;
}

.sortable:hover {
	color: #000;
}

.character-stats {
	border-spacing: 0;
	border-collapse: collapse;
	color: #ccc;
}

.character-stats td {
	padding: 0px 10px 5px 0;
	border: 0;
	text-align: center;
}

.character-stats .stat-name {
	color: #666;
}

.character-stats .stat-value {
	color: #000;
}

.credit-balance {
	float: right;
	display: inline-block;
	padding: 10px;
	color: #000;
	background-color: #eee;
	border: 1px dotted #ddd;
}

.credit-balance .balance-text {
	display: inline-block;
	margin-right: 5px;
	color: #bbb;
	text-transform: uppercase;
}

.credit-balance .balance-amount {
	font-weight: bold;
}

.emblem-server {
	margin: 0 0 2px 0;
	padding: 0 0 2px 0;
	font-size: 120%;
	border-bottom: 1px solid #ddd;
}

.emblem-server label {
	display: block;
}

.emblem-server label:hover {
	cursor: pointer;
}

.block {
	display: block;
	width: 80%;
	height: 40px;
}

.script-line {
	font-family: Monaco, "Lucida Console", monospace;
}

.script-line-num {
	display: inline-block;
	margin: 0;
	padding: 5px;
	background-color: #eee;
	border-right: 1px solid #ddd;
}

.script-line-code {
	display: inline-block;
	margin: 0;
	padding: 5px;
}

.shop-table {
	width: 100%;
	color: #000;
	border-spacing: 0 10px;
	border-collapse: separate;
}

.shop-table td {
	padding: 10px;
	background-color: #fff;
	border: 1px solid #ddd;
}

.shop-item-image {
	width: 75px;
	height: 100px;
	text-align: center;
}

.shop-item-name {
	margin: 0 0 5px 0;
	padding: 0 0 2px 0;
	font-size: 140%;
	color: #222;
	border-bottom: 1px solid #eee;
}

.shop-item-cost-qty {
	width: 150px;
	color: #aaa;
	text-align: center;
}

.cost {
	color: #000;
	font-size: 120%;
	font-weight: bold;
	text-transform: uppercase;
}

.qty {
	color: #000;
}

.shop-item-action {
	color: #ddd;
}

.shop-item-action a {
	color: #80a2c8;
	border-bottom: 1px solid #eee;
}

.shop-item-action a:hover {
	border-bottom: 1px solid #80a2c8;
}

.short {
	width: 40px;
}

.shop-server-name {
	color: #333;
}

.shop-item-info {
	text-align: justify;
}

textarea {
	width: 320px;
	height: 120px;
}

.cart-items-text {
	margin: 0 0 5px 0;
	padding: 5px;
	color: #ddd;
	background-color: #888;
	border: 5px solid #777;
}

.cart-info-text {
	margin: 0 0 5px 0;
	padding: 0;
}

.cart-total-text {
	margin: 0;
	padding: 0;
}

.cart-item-name {
	color: #fff;
	border-bottom: 1px dotted #aaa;
}

.cart-item-count {
	font-size: 120%;
	font-weight: bold;
	color: #000;
}

.cart-sub-total {
	color: #000;
}

.cart {
	width: 100%;
}

.cart label {
	display: block;
}

.cart h4 {
	margin: 10px 0 2px 0;
	font-size: 140%;
}

.remove-from-cart {
	width: 100%;
	text-align: right;
}

.checkout-text {
	font-size: 120%;
	font-weight: bold;
}

.checkout-text a {
	border-bottom: 1px dotted #ccc;
}

.checkout-text a:hover {
	color: #000;
	border-bottom: 1px solid #aaa;
}

.enter-donation-amount {
	margin: 0;
	padding: 0 0 5px 0;
	font-size: 120%;
}

.donation-amount-text {
	margin: 0;
	padding: 0;
	font-size: 120%;
	text-align: center;
}

.credit-amount-text {
	font-size: 8pt;
	text-transform: uppercase;
	color: #bbb;
	text-align: center;
	letter-spacing: 1px;
}

.donation-amount {
	font-weight: bold;
	color: #000;
}

.credit-amount {
	color: #555;
}

.reset-amount-text {
	margin: 0;
	padding: 0;
	font-size: 8pt;
	text-align: center;
}

.checkout-info-text {
	margin: 0 0 5px 0;
	padding: 0;
}

.remaining-balance {
	color: #000;
}

.exchange-rate {
	font-size: 120%;
	font-weight: bold;
	color: #000;
}

.important {
	font-size: 120%;
	color: #000;
}

.important .server-name {
	font-weight: bold;
}

.generic-form {
	padding: 10px;
	background-color: #fff;
	border: 1px solid #ddd;
	width: auto;
}

.generic-form-div {
	padding: 10px;
	background-color: #fff;
	border: 1px solid #ddd;
	width: auto;
}
.generic-form-table th label {
	display: block;
	padding: 6px;
}

.generic-form-table td div {
	display: block;
	padding: 6px 0;
}

.generic-form-table th {
	text-align: right;
}

.generic-form-table td input[type=checkbox] {
	display: inline-block;
	margin-top: 6px;
}

.generic-form-table td p {
	margin: 6px 5px;
	color: #000;
}

.security-code {
	margin: 5px 0;
	text-align: left;
	width: 145px;
	height: 50px;
}

.action {
	color: #ddd;
}

.action a, .action span.anchor {
	color: #80a2c8;
	border-bottom: 1px solid #eee;
	cursor: pointer;
}

.block-link {
	display: block;
	padding: 3px;
	color: #80a2c8;
	border-bottom: 1px solid #eee;
}

.button-action {
	padding: 5px 0;
	text-align: left;
}

.woe-table {
	border-spacing: 0;
	border-collapse: collapse;
	background-color: #fff;
	border: 1px solid #ddd;
}

.woe-table th, .woe-table td {
	padding: 5px 10px;
}

.woe-table th {
	font-weight: normal;
	border-bottom: 1px solid #ddd;
}

.woe-table td {
	font-size: 120%;
}

.woe-table .server {
	font-weight: bold;
}

.woe-table .time {
	font-style: italic;
	color: #333;
}

.script {
	width: 98%;
}

.multi-select {
	width: 100%;
}

.jump-to-page {
	margin-top: 8px;
	font-size: 8pt;
	text-align: center;
}

.jump-to-page input {
	padding: 2px;
	font-size: 8pt;
}

.top-ranked td {
	font-weight: bold;
	color: #000;
	background-color: #FFF8DC;
}

.top-ranked a {
	color: #000;
	border-bottom: 1px dotted #666;
}

.empty-row {
	visibility: hidden;
}

.item-drop-mvp td {
	color: #000;
	background-color: #F8F8FF;
}

.item-drop-card td {
	color: #000;
	background-color: #F0FFFF;
}

.mvp {
	font-size: xx-small;
	font-weight: bold;
	color: #ff0000;
	vertical-align: top;
}

.monster-mode {
	margin: 0;
	padding: 0;
	list-style: square inside;
}

.monster-mode li {
	padding: 1px;
	border-bottom: 1px dotted #eee;
}

.equipped td {
	background-color: #f1ffff;
}

.job-classes {
	border-spacing: 0;
}

.job-classes td {
	padding-right: 10px;
	border-right: 1px solid #eee;
}

.current-shop-category {
	font-weight: bold;
}

.normalslotted .equipped {
	color: #25292b;
}

.overslotted1 {
	color: #32cd32;
}

.overslotted2 {
	color: #00bfff;
}

.overslotted3 {
	color: #ffa500;
}

.overslotted4 {
	color: #9932cc;
}

.hold-hours {
	color: #ffba00;
	font-style: italic;
}

/* Aincrad website look-and-feel for bootstrap theme */
:root {
	--ain-bg-deep: #05060a;
	--ain-bg-mid: #080c14;
	--ain-panel: rgba(6, 9, 18, 0.88);
	--ain-gold: #c9a84c;
	--ain-gold-light: #f0d080;
	--ain-gold-dim: #7a6230;
	--ain-gold-glow: rgba(201,168,76,0.35);
	--ain-gold-soft: rgba(201, 168, 76, 0.3);
	--ain-text: #e8dfc4;
	--ain-muted: #8a7d5c;
	--ain-danger: #8a1c1c;
	--ain-green: #2ecc71;
}

body.aincrad-bootstrap-theme {
	margin: 0 !important;
	padding: 0;
	font-family: "Crimson Text", Georgia, serif;
	font-size: clamp(19px, 0.45vw + 12px, 28px);
	line-height: 1.6;
	color: var(--ain-text);
	background:
		radial-gradient(ellipse 120% 60% at 50% 0%, #1a1005 0%, #080c14 50%),
		radial-gradient(ellipse 100% 80% at 50% 100%, #00030c 0%, #080c14 60%);
	background-color: #080c14;
	min-height: 100vh;
	display: flex;
	flex-direction: column;
	margin-bottom: 0 !important;
	overflow-x: hidden;
}

/* Scanline overlay */
body.aincrad-bootstrap-theme::after {
	content: '';
	position: fixed;
	inset: 0;
	background: repeating-linear-gradient(
		0deg,
		transparent,
		transparent 3px,
		rgba(0,0,0,0.06) 3px,
		rgba(0,0,0,0.06) 4px
	);
	pointer-events: none;
	z-index: 999;
}

.aincrad-backdrop,
.aincrad-character-render {
	position: fixed;
	pointer-events: none;
	z-index: 0;
}

.aincrad-backdrop {
	inset: 0;
	z-index: 1;
	opacity: 0.45;
	background-image: url('../../../../bg2.png');
	background-size: cover;
	background-position: center;
	mix-blend-mode: normal;
}

.aincrad-scene-overlay {
	position: fixed;
	inset: 0;
	z-index: 3;
	pointer-events: none;
	background:
		radial-gradient(ellipse 100% 40% at 50% 0%,   rgba(8,12,20,0.82) 0%, transparent 100%),
		radial-gradient(ellipse 100% 50% at 50% 100%, rgba(4,6,14,0.90) 0%, transparent 100%),
		radial-gradient(ellipse 90%  90% at 50% 50%,  transparent 35%,   rgba(0,0,0,0.55) 100%);
}

.aincrad-character-render {
	right: 0;
	bottom: 0;
	top: auto;
	height: clamp(400px, 70vh, 780px);
	display: flex;
	align-items: flex-end;
	z-index: 2;
}

.aincrad-character-render img {
	height: 100%;
	width: auto;
	object-fit: contain;
	filter: drop-shadow(-4px 0 24px rgba(201,168,76,0.22)) drop-shadow(0 -2px 18px rgba(120,160,255,0.18));
	animation: chibiFloat 5s ease-in-out infinite;
	transform-origin: bottom center;
}

@keyframes chibiFloat {
	0%, 100% { transform: translateY(0px) rotate(0deg); filter: drop-shadow(-4px 0 24px rgba(201,168,76,0.22)) drop-shadow(0 -2px 18px rgba(120,160,255,0.18)); }
	30%       { transform: translateY(-10px) rotate(0.4deg); filter: drop-shadow(-4px 0 32px rgba(201,168,76,0.32)) drop-shadow(0 -4px 24px rgba(120,160,255,0.25)); }
	60%       { transform: translateY(-6px) rotate(-0.3deg); filter: drop-shadow(-4px 0 28px rgba(201,168,76,0.27)) drop-shadow(0 -3px 20px rgba(120,160,255,0.2)); }
}

.navbar.navbar-inverse {
	background: linear-gradient(180deg, rgba(0,0,0,0.85) 0%, rgba(0,0,0,0.6) 100%);
	border-bottom: 1px solid var(--ain-gold-soft);
	border-top: 0;
	backdrop-filter: blur(8px);
	border-radius: 0;
}

.navbar.navbar-inverse::after {
	content: '';
	position: absolute;
	bottom: 0; left: 0; right: 0;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--ain-gold), transparent);
}

.navbar-inverse .navbar-brand {
	font-family: "Cinzel Decorative", Georgia, serif;
	color: var(--ain-gold);
	letter-spacing: 2px;
	text-transform: uppercase;
	font-size: 24px;
	text-shadow: 0 0 18px rgba(212, 175, 55, 0.35);
}

.navbar-inverse .navbar-nav > li > a {
	font-family: 'Cinzel', serif;
	color: var(--ain-muted);
	text-transform: uppercase;
	letter-spacing: 0.15em;
	font-size: clamp(12px, 0.65vw, 15px);
	font-weight: 600;
	white-space: nowrap;
}

.navbar-inverse .navbar-nav > li > a:hover,
.navbar-inverse .navbar-nav > .open > a,
.navbar-inverse .navbar-nav > .open > a:hover {
	color: var(--ain-gold-light);
	background: rgba(212, 175, 55, 0.12);
	text-shadow: 0 0 12px var(--ain-gold-glow);
}

.dropdown-menu {
	background: rgba(8, 10, 14, 0.96);
	border: 1px solid var(--ain-gold-soft);
}

.dropdown-menu > li > a {
	color: #cfd5e2;
}

.dropdown-menu > li > a:hover {
	color: var(--ain-gold);
	background: rgba(212, 175, 55, 0.1);
}

.aincrad-main-shell {
	position: relative;
	z-index: 10;
	max-width: 1260px;
	margin: 0 auto;
	padding: 0 2rem 32px;
}

.aincrad-hero {
	position: relative;
	z-index: 10;
	text-align: center;
	padding: 5rem 2rem 3rem;
	margin-top: 50px;
}

.aincrad-hero-pre {
	font-family: 'Cinzel', serif;
	font-size: 0.65rem;
	letter-spacing: 0.5em;
	color: var(--ain-gold-dim);
	text-transform: uppercase;
	margin-bottom: 1.2rem;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1rem;
}

.aincrad-hero-pre::before,
.aincrad-hero-pre::after {
	content: '';
	flex: 1;
	max-width: 120px;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--ain-gold-dim));
}

.aincrad-hero-pre::after {
	background: linear-gradient(90deg, var(--ain-gold-dim), transparent);
}

.aincrad-hero-title {
	font-family: 'Cinzel Decorative', serif;
	font-size: clamp(2.8rem, 7vw, 6rem);
	font-weight: 700;
	color: var(--ain-gold);
	letter-spacing: 0.06em;
	text-shadow:
		0 0 30px rgba(201,168,76,0.5),
		0 0 80px rgba(201,168,76,0.2),
		0 2px 4px rgba(0,0,0,0.8);
	line-height: 1.1;
	margin-bottom: 0.5rem;
	animation: aincradTitleGlow 4s ease-in-out infinite;
	-webkit-text-stroke: 0;
	background: none;
	-webkit-background-clip: unset;
}

.aincrad-hero-sub {
	font-family: 'Cinzel', serif;
	font-size: clamp(0.7rem, 2vw, 0.95rem);
	letter-spacing: 0.6em;
	color: var(--ain-muted);
	text-transform: uppercase;
	margin-bottom: 3rem;
}

/* Decorative divider */
.aincrad-divider {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.8rem;
	margin: 0.5rem auto 2.5rem;
}

.aincrad-divider-line {
	height: 1px;
	width: 100%;
	max-width: 200px;
	background: linear-gradient(90deg, transparent, var(--ain-gold-dim));
}

.aincrad-divider-line.right {
	background: linear-gradient(90deg, var(--ain-gold-dim), transparent);
}

.aincrad-divider-diamond {
	width: 10px; height: 10px;
	background: var(--ain-gold-dim);
	transform: rotate(45deg);
	flex-shrink: 0;
}

.aincrad-divider-diamond-sm {
	width: 5px; height: 5px;
	background: var(--ain-gold-dim);
	transform: rotate(45deg);
	flex-shrink: 0;
	opacity: 0.5;
}

@keyframes aincradTitleGlow {
	0%, 100% { text-shadow: 0 0 30px rgba(201,168,76,0.5), 0 0 80px rgba(201,168,76,0.2), 0 2px 4px rgba(0,0,0,0.8); }
	50% { text-shadow: 0 0 50px rgba(201,168,76,0.7), 0 0 120px rgba(201,168,76,0.35), 0 2px 4px rgba(0,0,0,0.8); }
}

.main-grid {
	position: relative;
	z-index: 10;
	max-width: 1260px;
	margin: 0 auto;
	padding: 0 2rem 3rem;
	display: grid;
	gap: 1.35rem;
}

.panel {
	background: var(--ain-panel);
	border: 1px solid var(--ain-gold-soft);
	backdrop-filter: blur(12px);
	position: relative;
	border-radius: 0;
	box-shadow: none;
}

.panel::before {
	content: '';
	position: absolute;
	inset: -1px;
	border: 1px solid transparent;
	background: linear-gradient(135deg, rgba(201, 168, 76, 0.25), transparent 40%, transparent 60%, rgba(201, 168, 76, 0.15)) border-box;
	-webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0);
	-webkit-mask-composite: destination-out;
	mask-composite: exclude;
	pointer-events: none;
}

.panel > .panel-heading,
.panel > .panel-body,
.panel > .panel-footer {
	background: transparent;
	border-color: var(--ain-gold-soft);
}

.panel-corners::after {
	content: '';
	position: absolute;
	inset: -2px;
	background:
		linear-gradient(#7a6230, #7a6230) top left / 12px 1px no-repeat,
		linear-gradient(#7a6230, #7a6230) top left / 1px 12px no-repeat,
		linear-gradient(#7a6230, #7a6230) top right / 12px 1px no-repeat,
		linear-gradient(#7a6230, #7a6230) top right / 1px 12px no-repeat,
		linear-gradient(#7a6230, #7a6230) bottom left / 12px 1px no-repeat,
		linear-gradient(#7a6230, #7a6230) bottom left / 1px 12px no-repeat,
		linear-gradient(#7a6230, #7a6230) bottom right / 12px 1px no-repeat,
		linear-gradient(#7a6230, #7a6230) bottom right / 1px 12px no-repeat;
	pointer-events: none;
}

.main-grid .panel {
	margin-bottom: 0;
}

.status-row {
	display: grid !important;
	grid-template-columns: repeat(3, 1fr) !important;
	gap: 1rem;
}

.status-card {
	padding: 1.2rem 1.5rem;
	text-align: center;
}

.status-indicator {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	margin-bottom: 0.45rem;
}

.status-dot {
	width: 8px;
	height: 8px;
	border-radius: 50%;
	background: #c0392b;
	box-shadow: 0 0 8px #c0392b;
	flex-shrink: 0;
}

.status-dot.online {
	background: var(--ain-green);
	box-shadow: 0 0 8px var(--ain-green);
	animation: pulseGreen 2s infinite;
}

.status-dot.offline {
	background: #c0392b;
	box-shadow: 0 0 8px #c0392b;
}

@keyframes pulseGreen {
	0%, 100% { opacity: 1; box-shadow: 0 0 8px var(--ain-green); }
	50% { opacity: 0.6; box-shadow: 0 0 16px var(--ain-green); }
}

.status-ping {
	font-family: 'Cinzel', serif;
	font-size: clamp(12px, 0.6vw, 14px);
	letter-spacing: 0.1em;
	color: var(--ain-green);
	margin-top: 0.3rem;
}

.status-server-name {
	font-family: 'Cinzel', serif;
	font-size: clamp(12px, 0.65vw, 15px);
	letter-spacing: 0.15em;
	text-transform: uppercase;
	color: #f0d080;
}

.status-desc {
	font-size: clamp(14px, 0.75vw, 17px);
	color: #8a7d5c;
	font-style: italic;
}

.welcome-banner {
	padding: 2.2rem 2.3rem;
}

.banner-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 1rem;
}

.banner-label {
	font-family: 'Cinzel', serif;
	font-size: clamp(11px, 0.6vw, 14px);
	letter-spacing: 0.35em;
	color: #7a6230;
	text-transform: uppercase;
	margin-bottom: 0.5rem;
}

.banner-title {
	font-family: 'Cinzel', serif;
	font-size: clamp(1.4rem, 3vw, 2rem);
	font-weight: 700;
	color: var(--ain-gold-light);
	text-shadow: 0 0 20px var(--ain-gold-glow);
	letter-spacing: 0.04em;
}

.banner-desc {
	color: #8a7d5c;
	font-style: italic;
	margin-top: 0.45rem;
}

.server-stats {
	display: flex;
	gap: 1.5rem;
	flex-wrap: wrap;
}

.stat-block {
	text-align: center;
}

.stat-value {
	font-family: 'Cinzel', serif;
	font-size: 1.6rem;
	color: #c9a84c;
	line-height: 1;
	display: block;
}

.stat-label {
	font-family: 'Cinzel', serif;
	font-size: clamp(10px, 0.55vw, 13px);
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: #8a7d5c;
}

.stat-sep {
	width: 1px;
	background: rgba(201, 168, 76, 0.3);
}

.actions-grid {
	display: grid !important;
	grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
	gap: 1rem;
}

.action-card {
	padding: 0;
	margin-bottom: 0 !important;
}

.action-card-link {
	padding: 1.5rem 1.8rem;
	cursor: pointer;
	display: flex !important;
	flex-direction: row !important;
	align-items: center !important;
	gap: 1.2rem;
	text-decoration: none !important;
	color: inherit;
	transition: all 0.25s;
}

.action-card-link:hover,
.action-card-link:focus {
	background: rgba(201, 168, 76, 0.07);
	transform: translateY(-2px);
	box-shadow: 0 8px 32px rgba(0,0,0,0.5), 0 0 20px rgba(201,168,76,0.1);
	color: inherit;
	text-decoration: none;
}

.action-card:hover,
.action-card:focus-within {
	border-color: var(--ain-gold);
}

.action-card-link:hover .action-arrow {
	transform: translateX(4px);
	color: var(--ain-gold);
}

.action-icon-wrap {
	width: 52px !important;
	height: 52px !important;
	min-width: 52px;
	max-width: 52px;
	flex-shrink: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	border: 1px solid var(--ain-gold-soft);
	position: relative;
	background: rgba(201,168,76,0.05);
}

.action-icon-wrap svg {
	width: 26px !important;
	height: 26px !important;
	stroke: var(--ain-gold-dim);
	fill: none;
	stroke-width: 1.5;
	transition: stroke 0.2s;
}

.action-card-link:hover .action-icon-wrap svg {
	stroke: var(--ain-gold);
}

.action-icon-wrap::before {
	content: '';
	position: absolute;
	top: -1px; left: -1px;
	width: 8px; height: 8px;
	border-top: 1px solid var(--ain-gold-dim);
	border-left: 1px solid var(--ain-gold-dim);
}

.action-icon-wrap::after {
	content: '';
	position: absolute;
	bottom: -1px; right: -1px;
	width: 8px; height: 8px;
	border-bottom: 1px solid var(--ain-gold-dim);
	border-right: 1px solid var(--ain-gold-dim);
}

.action-content { flex: 1; }

.action-name {
	font-family: 'Cinzel', serif;
	font-size: clamp(16px, 0.9vw, 20px);
	letter-spacing: 0.1em;
	color: #f0d080;
	text-transform: uppercase;
	display: block;
	margin-bottom: 0.3rem;
}

.action-desc {
	font-size: clamp(14px, 0.8vw, 18px);
	color: #8a7d5c;
	font-style: italic;
}

.action-arrow {
	font-size: 1.2rem;
	color: var(--ain-gold-dim);
	transition: transform 0.2s, color 0.2s;
	flex-shrink: 0;
}

.bottom-row {
	display: grid !important;
	grid-template-columns: minmax(0, 1fr) minmax(300px, 360px) !important;
	gap: 1rem;
	align-items: start;
}

.panel-title {
	font-family: 'Cinzel', serif;
	font-size: clamp(12px, 0.65vw, 15px);
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--ain-gold-dim);
	padding: 1rem 1.8rem;
	border-bottom: 1px solid var(--ain-gold-soft);
	display: flex;
	align-items: center;
	gap: 0.8rem;
	border-top: 0;
	background: transparent;
}

.panel-title::before {
	content: '';
	display: inline-block;
	width: 6px; height: 6px;
	background: var(--ain-gold-dim);
	transform: rotate(45deg);
}

.news-list {
	padding: 0.5rem 0;
}

.news-item {
	padding: 1.2rem 1.8rem;
	border-bottom: 1px solid rgba(201, 168, 76, 0.08);
	transition: background 0.2s;
	cursor: pointer;
}

.news-item:last-child {
	border-bottom: none;
}

.news-item:hover {
	background: rgba(201, 168, 76, 0.04);
}

.news-tag {
	font-family: 'Cinzel', serif;
	font-size: clamp(10px, 0.55vw, 13px);
	letter-spacing: 0.25em;
	text-transform: uppercase;
	color: #7a6230;
	border: 1px solid #7a6230;
	padding: 1px 6px;
	display: inline-block;
	margin-bottom: 0.4rem;
}

.news-title-text {
	font-family: 'Cinzel', serif;
	font-size: clamp(16px, 0.9vw, 20px);
	color: #f0d080;
	display: block;
	margin-bottom: 0.25rem;
}

.news-preview {
	font-size: clamp(14px, 0.8vw, 18px);
	color: #8a7d5c;
	font-style: italic;
}

.news-meta {
	font-family: 'Cinzel', serif;
	font-size: clamp(11px, 0.55vw, 14px);
	letter-spacing: 0.12em;
	color: #7a6230;
	margin-top: 0.55rem;
}

.quick-link-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.9rem 1.5rem;
	border-bottom: 1px solid rgba(201, 168, 76, 0.08);
	cursor: pointer;
	transition: background 0.2s;
	text-decoration: none;
	color: inherit;
}

.quick-link-item:last-child {
	border-bottom: none;
}

.quick-link-item:hover {
	background: rgba(201, 168, 76, 0.06);
}

.quick-link-name {
	font-family: 'Cinzel', serif;
	font-size: clamp(13px, 0.7vw, 16px);
	letter-spacing: 0.12em;
	color: #e8dfc4;
	text-transform: uppercase;
}

.quick-link-badge {
	font-family: 'Cinzel', serif;
	font-size: clamp(10px, 0.55vw, 13px);
	color: #7a6230;
	border: 1px solid rgba(201, 168, 76, 0.3);
	padding: 1px 6px;
}

/* ── Module page headings ── */
h2, h3, .module-name {
	font-family: "Cinzel", Georgia, serif;
	color: var(--ain-gold);
	letter-spacing: 1px;
	border-color: rgba(201,168,76,0.35);
}

h2 {
	font-size: 1.6rem;
	font-weight: 700;
	margin-bottom: 0.8rem;
	text-shadow: 0 0 14px var(--ain-gold-glow);
}

h3 {
	font-size: 1.15rem;
	font-weight: 600;
	color: var(--ain-gold-light);
	border-bottom: 1px solid rgba(201,168,76,0.2);
	padding-bottom: 0.4rem;
	margin-bottom: 0.8rem;
}

.module-name {
	font-size: 1.15rem;
}

#content {
	color: var(--ain-text);
}

/* ── Submenu / Pagemenu ── */
#submenu {
	font-family: 'Cinzel', serif;
	font-size: 0.82rem;
	letter-spacing: 0.08em;
	color: var(--ain-muted);
	padding: 0.8rem 0;
	margin-bottom: 0.5rem;
	border-bottom: 1px solid rgba(201,168,76,0.15);
}

#submenu a {
	color: var(--ain-muted);
	text-decoration: none;
	transition: color 0.2s;
}

#submenu a:hover,
#submenu a.current-sub-menu {
	color: var(--ain-gold-light);
	text-shadow: 0 0 8px var(--ain-gold-glow);
}

#pagemenu {
	font-family: 'Cinzel', serif;
	font-size: 0.78rem;
	letter-spacing: 0.08em;
	color: var(--ain-muted);
	padding: 0.5rem 0;
	margin-bottom: 1rem;
	border-color: rgba(201,168,76,0.2);
}

#pagemenu a {
	color: var(--ain-gold);
}

#pagemenu a:hover {
	color: var(--ain-gold-light);
}

/* ── Links ── */
a {
	color: var(--ain-gold);
}

a:hover {
	color: var(--ain-gold-light);
}

/* ── Tables (rankings, etc.) ── */
table {
	color: var(--ain-text);
	width: 100%;
}

.horizontal-table,
.vertical-table {
	background: var(--ain-panel);
	border: 1px solid rgba(201,168,76,0.2);
	border-collapse: collapse;
}

.horizontal-table th,
.vertical-table th {
	font-family: 'Cinzel', serif;
	font-size: 0.75rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ain-gold-dim);
	background: rgba(201,168,76,0.06);
	border-bottom: 1px solid rgba(201,168,76,0.25);
	padding: 0.7rem 0.8rem;
	text-align: left;
}

.horizontal-table td,
.vertical-table td {
	padding: 0.6rem 0.8rem;
	border-bottom: 1px solid rgba(201,168,76,0.08);
	font-size: 0.92rem;
}

.horizontal-table tr:hover td,
.vertical-table tr:hover td {
	background: rgba(201,168,76,0.04);
}

.horizontal-table tr:nth-child(even) td {
	background: rgba(0,0,0,0.15);
}

.horizontal-table tr:nth-child(even):hover td {
	background: rgba(201,168,76,0.06);
}

/* ── Ranking module legibility and color cleanup ── */
#content .search-form2 {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.8rem;
	padding: 1rem 1.2rem;
	margin: 0 0 1rem;
	background: rgba(6, 9, 18, 0.88);
	border: 1px solid rgba(201,168,76,0.22);
}

#content .search-form2 p {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.7rem;
	margin: 0;
	color: var(--ain-text);
}

#content .search-form2 label {
	font-family: 'Cinzel', serif;
	font-size: clamp(13px, 0.7vw, 17px);
	letter-spacing: 0.08em;
	color: var(--ain-gold-light);
}

#content .search-form2 select,
#content .search-form2 input[type=submit],
#content .search-form2 input[type=button] {
	font-size: clamp(13px, 0.7vw, 17px);
}

#content .horizontal-table th {
	font-size: clamp(12px, 0.7vw, 16px);
	color: var(--ain-gold-light);
}

#content .horizontal-table td {
	font-size: clamp(14px, 0.75vw, 18px);
	color: var(--ain-text);
}

#content .horizontal-table tr.top-ranked td {
	background: rgba(201,168,76,0.1);
	color: #f3e6bc;
}

#content .horizontal-table tr.empty-row td {
	color: rgba(232,223,196,0.45);
}

#content .not-applicable {
	color: #b9a67a;
	font-style: italic;
}

/* ── Forms ── */
.generic-form,
.generic-form-div {
	background: var(--ain-panel);
	border: 1px solid rgba(201,168,76,0.28);
	border-radius: 0;
	max-width: 620px;
	padding: 1.5rem;
}

.generic-form-table th label,
.generic-form-table td div,
.generic-form-table td p {
	color: var(--ain-text);
}

.generic-form-table th {
	font-family: 'Cinzel', serif;
	font-size: 0.78rem;
	letter-spacing: 0.06em;
	color: var(--ain-gold-dim);
	padding: 0.5rem 0.8rem;
}

.generic-form-table td {
	padding: 0.5rem 0.8rem;
}

/* ── Inputs ── */
input[type=text], input[type=password], input[type=file], textarea, select {
	background: rgba(0, 0, 0, 0.34);
	border: 1px solid rgba(201,168,76,0.25);
	color: var(--ain-text);
	border-radius: 0;
	padding: 0.4rem 0.6rem;
	font-family: 'Crimson Text', Georgia, serif;
	font-size: 0.95rem;
	transition: border-color 0.2s, box-shadow 0.2s;
}

input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus {
	border-color: var(--ain-gold);
	box-shadow: 0 0 8px var(--ain-gold-glow);
	outline: none;
}

select {
	appearance: auto;
}

input[type=submit], input[type=button], button, .submit_button {
	font-family: 'Cinzel', serif;
	font-size: 0.72rem;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	background: rgba(201,168,76,0.1);
	border: 1px solid rgba(201,168,76,0.45);
	color: var(--ain-gold);
	border-radius: 0;
	padding: 0.45rem 1.2rem;
	cursor: pointer;
	transition: all 0.2s;
}

input[type=submit]:hover, input[type=button]:hover, button:hover, .submit_button:hover {
	background: rgba(201,168,76,0.22);
	color: var(--ain-gold-light);
	border-color: var(--ain-gold);
	box-shadow: 0 0 12px var(--ain-gold-glow);
}

/* ── Alerts ── */
.message, .notice, .green, .red {
	border-radius: 0;
	border: 1px solid rgba(201,168,76,0.2);
	padding: 0.8rem 1.2rem;
	margin-bottom: 1rem;
}

.message {
	background: rgba(201,168,76,0.15);
	color: var(--ain-gold-light);
}

.notice {
	background: rgba(59, 130, 246, 0.12);
	color: #93b5e8;
	border-color: rgba(59,130,246,0.3);
}

.red {
	background: rgba(138, 28, 28, 0.35);
	color: #f0a0a0;
}

.green {
	background: rgba(34, 197, 94, 0.2);
	color: #7ee8a8;
}

/* ── Bootstrap overrides for module pages ── */
.aincrad-bootstrap-theme .table {
	color: var(--ain-text);
	background: transparent;
}

.aincrad-bootstrap-theme .table > thead > tr > th {
	font-family: 'Cinzel', serif;
	font-size: 0.75rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--ain-gold-dim);
	background: rgba(201,168,76,0.06);
	border-bottom: 2px solid rgba(201,168,76,0.25);
	padding: 0.7rem 0.8rem;
}

.aincrad-bootstrap-theme .table > tbody > tr > td {
	border-top: 1px solid rgba(201,168,76,0.08);
	padding: 0.6rem 0.8rem;
}

.aincrad-bootstrap-theme .table > tbody > tr:hover > td {
	background: rgba(201,168,76,0.04);
}

.aincrad-bootstrap-theme .table-striped > tbody > tr:nth-of-type(odd) {
	background: rgba(0,0,0,0.15);
}

.aincrad-bootstrap-theme .well {
	background: var(--ain-panel);
	border: 1px solid rgba(201,168,76,0.2);
	border-radius: 0;
	box-shadow: none;
	color: var(--ain-text);
}

.aincrad-bootstrap-theme .form-control {
	background: rgba(0,0,0,0.34);
	border: 1px solid rgba(201,168,76,0.25);
	color: var(--ain-text);
	border-radius: 0;
	box-shadow: none;
}

.aincrad-bootstrap-theme .form-control:focus {
	border-color: var(--ain-gold);
	box-shadow: 0 0 8px var(--ain-gold-glow);
}

.aincrad-bootstrap-theme .btn-default {
	background: rgba(201,168,76,0.1);
	border: 1px solid rgba(201,168,76,0.4);
	color: var(--ain-gold);
}

.aincrad-bootstrap-theme .btn-default:hover {
	background: rgba(201,168,76,0.2);
	border-color: var(--ain-gold);
	color: var(--ain-gold-light);
}

.aincrad-bootstrap-theme .btn-primary {
	background: rgba(201,168,76,0.18);
	border: 1px solid var(--ain-gold);
	color: var(--ain-gold-light);
}

.aincrad-bootstrap-theme .btn-primary:hover {
	background: rgba(201,168,76,0.3);
	color: #fff;
}

.aincrad-bootstrap-theme .pagination > li > a,
.aincrad-bootstrap-theme .pagination > li > span {
	background: var(--ain-panel);
	border-color: rgba(201,168,76,0.2);
	color: var(--ain-gold);
}

.aincrad-bootstrap-theme .pagination > li > a:hover {
	background: rgba(201,168,76,0.12);
	border-color: var(--ain-gold);
	color: var(--ain-gold-light);
}

.aincrad-bootstrap-theme .pagination > .active > a,
.aincrad-bootstrap-theme .pagination > .active > span {
	background: rgba(201,168,76,0.22);
	border-color: var(--ain-gold);
	color: var(--ain-gold-light);
}

.aincrad-bootstrap-theme .label {
	font-family: 'Cinzel', serif;
	font-size: 0.6rem;
	letter-spacing: 0.1em;
}

.aincrad-bootstrap-theme .alert {
	background: var(--ain-panel);
	border: 1px solid rgba(201,168,76,0.2);
	color: var(--ain-text);
	border-radius: 0;
}

.aincrad-bootstrap-theme .alert-success {
	background: rgba(34,197,94,0.15);
	border-color: rgba(34,197,94,0.3);
	color: #7ee8a8;
}

.aincrad-bootstrap-theme .alert-danger {
	background: rgba(138,28,28,0.3);
	border-color: rgba(138,28,28,0.5);
	color: #f0a0a0;
}

.aincrad-bootstrap-theme .alert-warning {
	background: rgba(201,168,76,0.15);
	border-color: rgba(201,168,76,0.3);
	color: var(--ain-gold-light);
}

.aincrad-bootstrap-theme .alert-info {
	background: rgba(59,130,246,0.12);
	border-color: rgba(59,130,246,0.3);
	color: #93b5e8;
}

/* Fade in on load */
.fade-in {
	opacity: 0;
	transform: translateY(16px);
	animation: fadeUp 0.6s ease forwards;
}

.fade-in:nth-child(1) { animation-delay: 0.1s; }
.fade-in:nth-child(2) { animation-delay: 0.2s; }
.fade-in:nth-child(3) { animation-delay: 0.3s; }
.fade-in:nth-child(4) { animation-delay: 0.4s; }
.fade-in:nth-child(5) { animation-delay: 0.5s; }

@keyframes fadeUp {
	to { opacity: 1; transform: translateY(0); }
}

/* Footer links */
.aincrad-footer-links {
	display: flex;
	justify-content: center;
	gap: 2rem;
	list-style: none;
	margin-bottom: 1rem;
	padding: 0;
}

.aincrad-footer-links a {
	font-family: 'Cinzel', serif;
	font-size: 0.6rem;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--ain-gold-dim);
	text-decoration: none;
	transition: color 0.2s;
}

.aincrad-footer-links a:hover {
	color: var(--ain-gold);
}

.aincrad-footer-copy {
	font-size: 0.78rem;
	color: var(--ain-muted);
	font-style: italic;
}

#footer.aincrad-footer {
	position: relative;
	z-index: 10;
	text-align: center;
	padding: 2rem;
	border-top: 1px solid var(--ain-gold-soft);
	background: rgba(0,0,0,0.5);
	backdrop-filter: blur(4px);
	margin-top: auto;
	bottom: auto;
	height: auto;
	min-height: 0;
}

#footer.aincrad-footer::before {
	content: '';
	display: block;
	width: 100%;
	height: 1px;
	background: linear-gradient(90deg, transparent, var(--ain-gold-dim), transparent);
	margin-bottom: 1.5rem;
}

.aincrad-footer .container {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.aincrad-footer .text-muted {
	color: #c0c8d8;
	margin: 0;
	font-size: 13px;
	line-height: 1.45;
}

.aincrad-footer .text-muted strong {
	color: #d5dbea;
}

.aincrad-footer a {
	color: #c7a84b;
}

.aincrad-footer a:hover {
	color: #f5dc8f;
}

.aincrad-footer select {
	margin-left: 5px;
	background: rgba(10, 14, 22, 0.8);
	color: #d9e1ef;
	border: 1px solid rgba(212, 175, 55, 0.28);
	border-radius: 4px;
	padding: 2px 8px;
}

.aincrad-footer-controls {
	display: flex;
	align-items: center;
	gap: 18px;
	flex-wrap: wrap;
}

.aincrad-footer-controls span {
	display: inline-flex;
	align-items: center;
	font-size: 13px;
	color: #b5bdcd;
}

@media (max-width: 767px) {
	.aincrad-footer {
		padding: 10px 0 12px;
	}

	.aincrad-footer .text-muted,
	.aincrad-footer-controls span {
		font-size: 12px;
	}
}

@media (max-width: 1100px) {
	.actions-grid,
	.status-row,
	.bottom-row {
		grid-template-columns: 1fr !important;
	}

	.aincrad-character-render {
		display: none;
	}

	.aincrad-main-shell {
		margin-top: 8px;
		padding: 0 0 20px;
	}

	.aincrad-hero {
		padding-top: 3rem;
	}

	.aincrad-nav-btn {
		display: none !important;
	}

	.aincrad-online-badge {
		display: none !important;
	}
}


@media (max-width: 620px) {
	.actions-grid { grid-template-columns: 1fr !important; }
}

#aincrad-particle-canvas {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
	pointer-events: none;
}

.navbar-inverse .navbar-nav > li {
	position: relative;
}

.navbar-inverse .navbar-nav > li > a::after {
	content: "";
	position: absolute;
	left: 15px;
	right: 15px;
	bottom: 7px;
	height: 1px;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.25s ease;
	background: var(--ain-gold);
}

.navbar-inverse .navbar-nav > li:hover > a::after,
.navbar-inverse .navbar-nav > li.open > a::after,
.navbar-inverse .navbar-nav > li.aincrad-active > a::after {
	transform: scaleX(1);
}

.aincrad-nav-right {
	margin-right: 0;
	display: flex;
	align-items: center;
	gap: 1rem;
}

@media (min-width: 768px) {
	.aincrad-navbar-shell {
		position: relative;
		width: 100%;
		max-width: none;
		padding-left: 24px;
		padding-right: 24px;
	}

	.navbar-inverse .navbar-header {
		position: relative;
		z-index: 2;
	}

	.aincrad-navbar-collapse {
		position: relative;
		display: flex !important;
		align-items: center;
		justify-content: center;
		min-height: 64px;
	}

	.aincrad-nav-menu {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		float: none !important;
		display: flex;
		align-items: center;
	}

	.aincrad-nav-right {
		position: absolute;
		right: 24px;
		top: 50%;
		transform: translateY(-50%);
	}
}

@media (max-width: 767px) {
	.aincrad-navbar-shell {
		padding-left: 15px;
		padding-right: 15px;
	}

	.aincrad-nav-menu {
		float: none !important;
	}

	.aincrad-nav-right {
		position: static;
		transform: none;
	}
}

/* Online badge in navbar */
.aincrad-online-badge {
	display: inline-flex;
	align-items: center;
	gap: 0.6rem;
	font-family: 'Cinzel', serif;
	font-size: clamp(14px, 0.75vw, 18px);
	letter-spacing: 0.1em;
	color: var(--ain-muted);
	text-transform: uppercase;
	white-space: nowrap;
}

#nav-online-count {
	font-size: inherit;
	font-weight: 600;
	color: var(--ain-gold-light);
}

.aincrad-online-dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: var(--ain-green);
	box-shadow: 0 0 8px var(--ain-green);
	animation: pulseGreen 2s infinite;
	display: inline-block;
}

/* Login / Register nav buttons */
.aincrad-nav-btn {
	font-family: 'Cinzel', serif;
	font-size: 0.68rem;
	letter-spacing: 0.12em;
	color: var(--ain-gold) !important;
	border: 1px solid var(--ain-gold-dim);
	background: rgba(201,168,76,0.08) !important;
	padding: 0.4rem 1.1rem;
	cursor: pointer;
	transition: all 0.2s;
	text-transform: uppercase;
	text-decoration: none !important;
	display: inline-block;
	line-height: 1.4;
}

.aincrad-nav-btn:hover {
	background: rgba(201,168,76,0.18) !important;
	border-color: var(--ain-gold);
	box-shadow: 0 0 16px var(--ain-gold-glow);
	color: var(--ain-gold) !important;
}

.aincrad-nav-right .dropdown-menu {
	right: 0;
	left: auto;
}

@media (min-width: 768px) {
	.aincrad-nav-right .dropdown:hover .dropdown-menu {
		display: block;
		margin-top: 0;
	}
}

@media (max-width: 1199px) {
	.aincrad-online-badge {
		display: none;
	}
}

/* Global typography normalization for all bootstrap theme pages */
body.aincrad-bootstrap-theme {
	--ain-base-size: clamp(17px, 0.35vw + 12px, 24px);
	--ain-copy-size: clamp(16px, 0.3vw + 11px, 21px);
	--ain-ui-size: clamp(15px, 0.28vw + 10px, 20px);
}

body.aincrad-bootstrap-theme,
body.aincrad-bootstrap-theme a,
body.aincrad-bootstrap-theme p,
body.aincrad-bootstrap-theme li,
body.aincrad-bootstrap-theme td,
body.aincrad-bootstrap-theme th,
body.aincrad-bootstrap-theme label,
body.aincrad-bootstrap-theme input,
body.aincrad-bootstrap-theme select,
body.aincrad-bootstrap-theme textarea,
body.aincrad-bootstrap-theme button {
	font-size: var(--ain-copy-size);
}

body.aincrad-bootstrap-theme .navbar-inverse .navbar-brand,
body.aincrad-bootstrap-theme h1,
body.aincrad-bootstrap-theme h2,
body.aincrad-bootstrap-theme h3,
body.aincrad-bootstrap-theme .module-name {
	font-family: "Cinzel", Georgia, serif;
}

body.aincrad-bootstrap-theme .module-name,
body.aincrad-bootstrap-theme h3 {
	font-size: clamp(20px, 0.9vw, 28px);
}

body.aincrad-bootstrap-theme h2 {
	font-size: clamp(24px, 1.3vw, 38px);
}

body.aincrad-bootstrap-theme .table,
body.aincrad-bootstrap-theme .horizontal-table,
body.aincrad-bootstrap-theme .vertical-table,
body.aincrad-bootstrap-theme .generic-form-table {
	font-size: var(--ain-copy-size);
}

body.aincrad-bootstrap-theme .small,
body.aincrad-bootstrap-theme small,
body.aincrad-bootstrap-theme .text-muted {
	font-size: var(--ain-ui-size);
}

body.aincrad-bootstrap-theme .navbar-inverse .navbar-nav > li > a,
body.aincrad-bootstrap-theme .dropdown-menu > li > a,
body.aincrad-bootstrap-theme .panel-title,
body.aincrad-bootstrap-theme .action-name,
body.aincrad-bootstrap-theme .quick-link-name {
	font-size: var(--ain-ui-size);
}

/* ── Rankings module redesign (bootstrap theme) ───────────────────────────── */
.aincrad-ranking-page {
	position: relative;
	z-index: 5;
	max-width: 1140px;
	margin: 0 auto;
	padding: 0 1.5rem 3rem;
}

.aincrad-ranking-hero {
	text-align: center;
	margin-bottom: 1.8rem;
}

.aincrad-ranking-eyebrow {
	font-family: 'Cinzel', serif;
	font-size: 0.72em;
	letter-spacing: 0.35em;
	text-transform: uppercase;
	color: var(--ain-gold-dim);
}

.aincrad-ranking-title {
	font-family: 'Cinzel Decorative', serif;
	font-size: clamp(2.1rem, 5vw, 3.8rem);
	color: var(--ain-gold);
	margin: 0.2rem 0;
	text-shadow: 0 0 28px rgba(201, 168, 76, 0.4);
}

.aincrad-ranking-subtitle {
	font-family: 'Cinzel', serif;
	font-size: 0.8em;
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: var(--ain-text-muted);
}

.aincrad-ranking-tabs {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	overflow: hidden;
	margin-bottom: 1.4rem;
}

.aincrad-ranking-tab {
	display: block;
	text-align: center;
	padding: 0.9rem 0.4rem;
	font-family: 'Cinzel', serif;
	font-size: 0.72em;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ain-text-muted);
	border-right: 1px solid var(--ain-panel-border);
	background: rgba(4, 6, 14, 0.7);
	text-decoration: none !important;
}

.aincrad-ranking-tab:last-child {
	border-right: 0;
}

.aincrad-ranking-tab:hover,
.aincrad-ranking-tab.active {
	color: var(--ain-gold-light);
	background: rgba(201, 168, 76, 0.1);
}

.aincrad-podium-grid {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1rem;
	margin-bottom: 1.3rem;
}

.aincrad-podium-card {
	padding: 1.3rem 1rem;
	text-align: center;
	position: relative;
}

.aincrad-podium-card.gold { border-color: rgba(240, 208, 128, 0.55); }
.aincrad-podium-card.silver { border-color: rgba(192, 200, 216, 0.45); }
.aincrad-podium-card.bronze { border-color: rgba(205, 142, 90, 0.45); }

.aincrad-rank-badge {
	position: absolute;
	top: 0.5rem;
	right: 0.65rem;
	font-family: 'Cinzel', serif;
	font-size: 0.72em;
	color: var(--ain-gold-dim);
}

.aincrad-podium-name,
.aincrad-podium-name a {
	font-family: 'Cinzel', serif;
	font-size: 1.05em;
	color: var(--ain-gold-light) !important;
	text-decoration: none !important;
}

.aincrad-podium-job {
	font-family: 'Cinzel', serif;
	font-size: 0.67em;
	text-transform: uppercase;
	letter-spacing: 0.14em;
	color: var(--ain-text-muted);
}

.aincrad-podium-stat {
	font-family: 'Cinzel', serif;
	font-size: 1.45em;
	margin-top: 0.35rem;
	color: var(--ain-gold);
}

.aincrad-podium-label {
	font-family: 'Cinzel', serif;
	font-size: 0.62em;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--ain-text-muted);
}

.aincrad-ranking-filter {
	padding: 1rem 1.2rem;
	margin-bottom: 1rem;
}

.aincrad-filter-row {
	display: flex;
	align-items: center;
	gap: 0.7rem;
	flex-wrap: wrap;
}

.aincrad-filter-row label {
	font-family: 'Cinzel', serif;
	font-size: 0.68em;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ain-gold-dim);
	margin: 0;
}

.aincrad-filter-row select {
	min-width: 220px;
}

.aincrad-ranking-table-wrap {
	overflow-x: auto;
}

.table.aincrad-ranking-table {
	margin-bottom: 0;
}

.table.aincrad-ranking-table > thead > tr > th {
	font-family: 'Cinzel', serif;
	font-size: 0.64em;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--ain-gold-dim);
	border-bottom-color: var(--ain-panel-border);
}

.table.aincrad-ranking-table > tbody > tr > td {
	font-family: 'Cinzel', serif;
	font-size: 0.8em;
	color: var(--ain-text-primary);
	border-top-color: rgba(201, 168, 76, 0.08);
	vertical-align: middle;
}

.table.aincrad-ranking-table > tbody > tr:hover > td {
	background: rgba(201, 168, 76, 0.05);
}

.table.aincrad-ranking-table a {
	color: var(--ain-gold-light);
	text-decoration: none;
}

.table.aincrad-ranking-table a:hover {
	color: var(--ain-gold);
}

.aincrad-rank-num {
	font-weight: 700;
	color: var(--ain-gold);
}

.aincrad-zeny-cell {
	color: var(--ain-gold) !important;
	font-weight: 700;
}

@media (max-width: 991px) {
	.aincrad-podium-grid {
		grid-template-columns: 1fr;
	}

	.aincrad-ranking-tabs {
		grid-template-columns: repeat(2, 1fr);
	}
}

/* ── Rankings module redesign v2 (full-width + hall styling parity) ───────── */
.aincrad-main-shell .aincrad-ranking-page {
	position: relative;
	left: 50%;
	right: 50%;
	margin-left: -37.5vw;
	margin-right: -37.5vw;
	max-width: 75vw;
	width: 75vw;
	min-height: 0;
	height: auto;
	padding: 0 clamp(14px, 3.8vw, 52px) 3.2rem;
}

.aincrad-main-shell .aincrad-ranking-hero {
	padding: 0.2rem 0 2rem;
	margin-bottom: 0.6rem;
}

.aincrad-main-shell .aincrad-ranking-tabs {
	display: flex;
	margin-bottom: 1.4rem;
}

.aincrad-main-shell .aincrad-ranking-tab {
	flex: 1;
	font-size: 0.68em;
	letter-spacing: 0.2em;
	padding: 0.9rem 0.8rem;
}

.aincrad-main-shell .aincrad-podium-grid {
	grid-template-columns: 1fr 1.15fr 1fr;
	align-items: end;
}

.aincrad-main-shell .aincrad-podium-card {
	padding: 1.8rem 1.2rem 1.4rem;
	overflow: hidden;
}

.aincrad-main-shell .aincrad-podium-card.gold::before {
	content: '';
	position: absolute;
	inset: 0;
	background: radial-gradient(ellipse 80% 60% at 50% 0%, rgba(240, 208, 128, 0.08) 0%, transparent 70%);
	pointer-events: none;
}

.aincrad-main-shell .aincrad-rank-badge {
	position: static;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	margin: 0 auto 0.7rem;
	background: rgba(201, 168, 76, 0.16);
	border: 1px solid var(--ain-panel-border);
}

.aincrad-main-shell .aincrad-podium-avatar {
	width: 72px;
	height: 72px;
	margin: 0 auto 0.8rem;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: 'Cinzel', serif;
	font-size: 1.35em;
	font-weight: 700;
	position: relative;
}

.aincrad-main-shell .aincrad-podium-card.gold .aincrad-podium-avatar {
	background: radial-gradient(135deg, #3a2a08 0%, #1a1205 100%);
	border: 2px solid #f0d080;
	color: #f0d080;
	box-shadow: 0 0 20px rgba(240, 208, 128, 0.3);
}

.aincrad-main-shell .aincrad-podium-card.silver .aincrad-podium-avatar {
	background: radial-gradient(135deg, #1a2030 0%, #0a1020 100%);
	border: 2px solid #c0c8d8;
	color: #c0c8d8;
}

.aincrad-main-shell .aincrad-podium-card.bronze .aincrad-podium-avatar {
	background: radial-gradient(135deg, #2a1808 0%, #150c04 100%);
	border: 2px solid #cd8e5a;
	color: #cd8e5a;
}

.aincrad-main-shell .aincrad-ranking-table-wrap {
	background: rgba(6, 9, 18, 0.9);
	overflow: visible;
}

.aincrad-main-shell .aincrad-ranking-table > tbody > tr > td,
.aincrad-main-shell .aincrad-ranking-table > thead > tr > th {
	padding: 0.88rem 1rem;
}

.aincrad-main-shell .aincrad-ranking-layout {
	display: grid;
	grid-template-columns: 1fr 280px;
	gap: 1.2rem;
	align-items: start;
}

.aincrad-main-shell .aincrad-side-stack {
	display: flex;
	flex-direction: column;
	gap: 1.2rem;
}

.aincrad-main-shell .aincrad-side-title {
	font-family: 'Cinzel', serif;
	font-size: 0.65em;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--ain-gold-dim);
	padding: 1rem 1.5rem;
	border-bottom: 1px solid var(--ain-panel-border);
}

.aincrad-main-shell .aincrad-side-body {
	padding: 1.2rem 1.5rem;
}

@media (max-width: 990px) {
	.aincrad-main-shell .aincrad-ranking-page {
		left: 50%;
		right: 50%;
		margin-left: -46vw;
		margin-right: -46vw;
		max-width: 92vw;
		width: 92vw;
	}

	.aincrad-main-shell .aincrad-ranking-layout {
		grid-template-columns: 1fr;
	}
	.aincrad-main-shell .aincrad-podium-grid {
		grid-template-columns: 1fr;
	}
}

/* --- Aincrad account redesign (bootstrap theme) --- */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@400;600;700;900&family=Cinzel+Decorative:wght@400;700&family=Crimson+Text:ital,wght@0,400;0,600;1,400&display=swap');
.account-cinematic, .account-cinematic * { box-sizing: border-box; margin: 0; padding: 0; }
.account-cinematic {
  --gold:#c9a84c; --gold-light:#f0d080; --gold-dim:#7a6230; --gold-glow:rgba(201,168,76,0.35);
  --deep:#05060a; --panel-bg:rgba(6,9,18,0.90); --panel-border:rgba(201,168,76,0.28);
  --text-primary:#e8dfc4; --text-muted:#8a7d5c; --online-green:#2ecc71; --warn-red:rgba(160,40,40,0.85); --warn-border:rgba(200,60,60,0.45);
  color: var(--text-primary); font-family: 'Crimson Text', Georgia, serif; font-size: 17px; line-height: 1.6;
  width: 100%; overflow-x: hidden; position: relative; padding-bottom: 1rem;
}
.account-cinematic .content-limit { width: min(75vw, 1200px); margin: 0 auto; position: relative; z-index: 10; }
@media (max-width: 1200px){ .account-cinematic .content-limit { width: min(94vw, 1200px); } }

.account-cinematic .navbar { position: relative; z-index: 100; display: flex; align-items: center; justify-content: space-between; padding: 0 2.5rem; height: 64px; background: linear-gradient(180deg, rgba(0,0,0,0.88), rgba(0,0,0,0.65)); border-bottom: 1px solid var(--panel-border); backdrop-filter: blur(10px); }
.account-cinematic .navbar::after { content: ''; position: absolute; bottom: 0; left: 0; right: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--gold), transparent); }
.account-cinematic .nav-logo { font-family: 'Cinzel Decorative', serif; font-size: 1.3rem; color: var(--gold); letter-spacing: .1em; text-shadow: 0 0 20px var(--gold-glow); text-decoration: none; }
.account-cinematic .nav-links { display: flex; gap: 1.5rem; list-style: none; }
.account-cinematic .nav-links a { font-family: 'Cinzel', serif; font-size: .64rem; letter-spacing: .13em; color: var(--text-muted); text-decoration: none; text-transform: uppercase; }
.account-cinematic .nav-links a:hover, .account-cinematic .nav-links a.active { color: var(--gold-light); text-shadow: 0 0 12px var(--gold-glow); }
.account-cinematic .nav-right { display: flex; align-items: center; gap: 1rem; }
.account-cinematic .online-badge { display:flex; align-items:center; gap:.45rem; font-family:'Cinzel',serif; font-size:.62rem; letter-spacing:.1em; color:var(--text-muted); }
.account-cinematic .online-dot { width:8px; height:8px; border-radius:50%; background:var(--online-green); box-shadow:0 0 8px var(--online-green); animation:pulse 2s infinite; }
.account-cinematic .nav-btn { font-family:'Cinzel',serif; font-size:.66rem; letter-spacing:.12em; color:var(--gold); border:1px solid var(--gold-dim); background:rgba(201,168,76,.08); padding:.38rem 1rem; text-decoration:none; text-transform:uppercase; }
.account-cinematic .page-hero { text-align: center; padding: 3.5rem 2rem 2rem; }
.account-cinematic .hero-eyebrow { font-family:'Cinzel',serif; font-size:.62rem; letter-spacing:.5em; color:var(--gold-dim); text-transform:uppercase; margin-bottom:.8rem; display:flex; align-items:center; justify-content:center; gap:1rem; }
.account-cinematic .hero-eyebrow::before,.account-cinematic .hero-eyebrow::after { content:''; flex:1; max-width:90px; height:1px; }
.account-cinematic .hero-eyebrow::before { background:linear-gradient(90deg,transparent,var(--gold-dim)); }
.account-cinematic .hero-eyebrow::after { background:linear-gradient(90deg,var(--gold-dim),transparent); }
.account-cinematic .page-title { font-family:'Cinzel Decorative',serif; font-size:clamp(1.8rem,4vw,3rem); color:var(--gold); letter-spacing:.06em; text-shadow:0 0 30px rgba(201,168,76,.5),0 2px 4px rgba(0,0,0,.8); }
.account-cinematic .page-subtitle { font-family:'Cinzel',serif; font-size:.7rem; letter-spacing:.4em; color:var(--text-muted); text-transform:uppercase; margin-top:.3rem; }
.account-cinematic .divider { display:flex; align-items:center; justify-content:center; gap:.8rem; margin:1.2rem auto 0; }
.account-cinematic .divider-line { height:1px; width:100%; max-width:120px; background:linear-gradient(90deg,transparent,var(--gold-dim)); }
.account-cinematic .divider-line.r { background:linear-gradient(90deg,var(--gold-dim),transparent); }
.account-cinematic .divider-diamond,.account-cinematic .divider-diamond-sm { transform:rotate(45deg); flex-shrink:0; background:var(--gold-dim); }
.account-cinematic .divider-diamond { width:8px; height:8px; }
.account-cinematic .divider-diamond-sm { width:4px; height:4px; opacity:.5; }
.account-cinematic .sub-nav { padding: 0 1.5rem 1.2rem; display:flex; flex-wrap:wrap; gap:.3rem 0; }
.account-cinematic .sub-nav-item { font-family:'Cinzel',serif; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); text-decoration:none; padding:.35rem .9rem; border:1px solid transparent; white-space:nowrap; }
.account-cinematic .sub-nav-item:hover { color:var(--gold-light); border-color:var(--panel-border); background:rgba(201,168,76,.06); }
.account-cinematic .sub-nav-item.active { color:var(--gold); border-color:var(--gold-dim); background:rgba(201,168,76,.1); }
.account-cinematic .sub-nav-sep { color:var(--gold-dim); font-size:.7rem; align-self:center; opacity:.4; }
.account-cinematic .main-wrap { padding: 0 1.5rem 3.5rem; display:grid; gap:1.2rem; }
.account-cinematic .panel { background:var(--panel-bg); border:1px solid var(--panel-border); backdrop-filter: blur(12px); position:relative; }
.account-cinematic .panel-corners::after { content:''; position:absolute; top:-2px; left:-2px; right:-2px; bottom:-2px; background: linear-gradient(var(--gold-dim),var(--gold-dim)) top left/12px 1px no-repeat, linear-gradient(var(--gold-dim),var(--gold-dim)) top left/1px 12px no-repeat, linear-gradient(var(--gold-dim),var(--gold-dim)) top right/12px 1px no-repeat, linear-gradient(var(--gold-dim),var(--gold-dim)) top right/1px 12px no-repeat, linear-gradient(var(--gold-dim),var(--gold-dim)) bottom left/12px 1px no-repeat, linear-gradient(var(--gold-dim),var(--gold-dim)) bottom left/1px 12px no-repeat, linear-gradient(var(--gold-dim),var(--gold-dim)) bottom right/12px 1px no-repeat, linear-gradient(var(--gold-dim),var(--gold-dim)) bottom right/1px 12px no-repeat; pointer-events:none; }
.account-cinematic .panel-title { font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-dim); padding:1rem 1.6rem; border-bottom:1px solid var(--panel-border); display:flex; gap:.8rem; align-items:center; }
.account-cinematic .panel-title::before { content:''; width:6px; height:6px; background:var(--gold-dim); transform:rotate(45deg); }
.account-cinematic .alert-banner { padding:.9rem 1.6rem; background:var(--warn-red); border:1px solid var(--warn-border); display:flex; gap:1rem; align-items:center; font-family:'Cinzel',serif; font-size:.72rem; letter-spacing:.06em; color:#f0b0b0; }
.account-cinematic .alert-banner::before { content:'⚠'; }
.account-cinematic .quick-actions { display:grid; grid-template-columns:repeat(auto-fit,minmax(160px,1fr)); gap:1px; background:var(--panel-border); border:1px solid var(--panel-border); }
.account-cinematic .quick-action-btn { background:var(--panel-bg); padding:1rem 1.2rem; display:flex; flex-direction:column; align-items:center; gap:.4rem; text-decoration:none; }
.account-cinematic .qa-icon { font-size:1.3rem; }
.account-cinematic .qa-label { font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); }
.account-cinematic .top-row { display:grid; grid-template-columns:auto 1fr; gap:1.2rem; align-items:start; }
.account-cinematic .avatar-card { padding:2rem 1.8rem; text-align:center; min-width:200px; }
.account-cinematic .avatar-ring { width:90px; height:90px; border-radius:50%; margin:0 auto 1rem; background:radial-gradient(135deg,#2a1e08 0%,#0e0a04 100%); border:2px solid var(--gold-dim); box-shadow:0 0 24px rgba(201,168,76,.2),inset 0 0 16px rgba(0,0,0,.5); display:flex; align-items:center; justify-content:center; font-family:'Cinzel Decorative',serif; font-size:2rem; color:var(--gold); }
.account-cinematic .avatar-name { font-family:'Cinzel',serif; font-size:1.15rem; color:var(--gold-light); display:block; }
.account-cinematic .avatar-id { font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.2em; color:var(--text-muted); text-transform:uppercase; display:block; margin-bottom:1rem; }
.account-cinematic .status-pill { display:inline-flex; align-items:center; gap:.35rem; font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.12em; text-transform:uppercase; border:1px solid; padding:3px 10px; }
.account-cinematic .status-pill.normal { color:#6ed48a; border-color:rgba(110,212,138,.4); background:rgba(110,212,138,.08); }
.account-cinematic .status-pill.vip { color:var(--gold); border-color:var(--gold-dim); background:rgba(201,168,76,.1); }
.account-cinematic .avatar-meta { margin-top:1rem; display:flex; flex-direction:column; gap:.4rem; }
.account-cinematic .meta-row { display:flex; justify-content:space-between; padding:.35rem 0; border-bottom:1px solid rgba(201,168,76,.08); }
.account-cinematic .meta-label { font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.14em; text-transform:uppercase; color:var(--text-muted); }
.account-cinematic .meta-val { font-family:'Cinzel',serif; font-size:.72rem; }
.account-cinematic .info-grid { display:grid; grid-template-columns:1fr 1fr; }
.account-cinematic .info-col { padding:1.4rem 1.6rem; }
.account-cinematic .info-col + .info-col { border-left:1px solid var(--panel-border); }
.account-cinematic .info-col-title { font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-dim); margin-bottom:1rem; display:flex; align-items:center; gap:.6rem; }
.account-cinematic .info-col-title::after { content:''; flex:1; height:1px; background:linear-gradient(90deg,var(--panel-border),transparent); }
.account-cinematic .info-field { margin-bottom:.9rem; }
.account-cinematic .field-label { font-family:'Cinzel',serif; font-size:.57rem; letter-spacing:.2em; text-transform:uppercase; color:var(--text-muted); display:block; margin-bottom:.2rem; }
.account-cinematic .field-val { font-family:'Cinzel',serif; font-size:.88rem; color:var(--text-primary); display:block; }
.account-cinematic .highlight { color:var(--gold-light); } .account-cinematic .success{ color:#6ed48a; }
.account-cinematic .field-link { color:#7ab3d4; text-decoration:underline; text-underline-offset:3px; }
.account-cinematic .credit-balance { display:flex; align-items:center; gap:.8rem; } .account-cinematic .credit-val { font-family:'Cinzel',serif; font-size:1.4rem; color:var(--gold); }
.account-cinematic .credit-donate-btn { font-family:'Cinzel',serif; font-size:.58rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold); border:1px solid var(--gold-dim); background:rgba(201,168,76,.08); padding:3px 10px; text-decoration:none; }
.account-cinematic .chars-header { display:flex; justify-content:space-between; align-items:center; padding:1rem 1.6rem; border-bottom:1px solid var(--panel-border); }
.account-cinematic .chars-title-wrap { font-family:'Cinzel',serif; font-size:.65rem; letter-spacing:.3em; text-transform:uppercase; color:var(--gold-dim); display:flex; align-items:center; gap:.8rem; }
.account-cinematic .chars-title-wrap::before { content:''; width:6px; height:6px; background:var(--gold-dim); transform:rotate(45deg); }
.account-cinematic .zeny-total { font-family:'Cinzel',serif; font-size:.72rem; color:var(--gold); letter-spacing:.08em; }
.account-cinematic .zeny-total span { color:var(--text-muted); font-size:.6rem; letter-spacing:.15em; text-transform:uppercase; margin-right:.4rem; }
.account-cinematic .char-table { width:100%; border-collapse:collapse; }
.account-cinematic .char-table th { font-family:'Cinzel',serif; font-size:.57rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-dim); padding:.7rem 1.2rem; text-align:left; border-bottom:1px solid var(--panel-border); background:rgba(201,168,76,.03); }
.account-cinematic .char-table td { padding:1rem 1.2rem; border-bottom:1px solid rgba(201,168,76,.07); }
.account-cinematic .slot-num { font-family:'Cinzel',serif; font-size:.75rem; color:var(--text-muted); }
.account-cinematic .char-name-cell { display:flex; align-items:center; gap:.8rem; }
.account-cinematic .char-avatar { width:40px; height:40px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:'Cinzel',serif; border:1px solid var(--panel-border); background:rgba(201,168,76,.06); }
.account-cinematic .char-name { font-family:'Cinzel',serif; font-size:.9rem; color:var(--gold-light); display:block; }
.account-cinematic .char-class-badge { display:inline-block; padding:2px 7px; margin-top:2px; font-family:'Cinzel',serif; font-size:.52rem; letter-spacing:.1em; text-transform:uppercase; border:1px solid; }
.account-cinematic .level-display,.account-cinematic .zeny-cell,.account-cinematic .guild-cell,.account-cinematic .action-link { font-family:'Cinzel',serif; }
.account-cinematic .guild-cell { font-size:.75rem; color:var(--text-muted); font-style:italic; }
.account-cinematic .offline-pill,.account-cinematic .online-pill { display:inline-flex; align-items:center; gap:5px; font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; }
.account-cinematic .offline-pill{ color:var(--text-muted);} .account-cinematic .online-pill{ color:var(--online-green); }
.account-cinematic .action-link { font-size:.6rem; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-dim); text-decoration:none; border:1px solid rgba(201,168,76,.2); padding:3px 8px; display:inline-block; }
.account-cinematic .action-links { display:flex; gap:.4rem; flex-wrap:wrap; }
.account-cinematic .storage-empty { padding:2.5rem 1.6rem; text-align:center; font-style:italic; color:var(--text-muted); }
.account-cinematic .footer { text-align:center; padding:2rem; border-top:1px solid var(--panel-border); background:rgba(0,0,0,.5); }
.account-cinematic .footer-links { display:flex; justify-content:center; gap:2rem; list-style:none; margin-bottom:1rem; }
.account-cinematic .footer-links a { font-family:'Cinzel',serif; font-size:.6rem; letter-spacing:.2em; text-transform:uppercase; color:var(--gold-dim); text-decoration:none; }
.account-cinematic .footer-copy { font-size:.78rem; color:var(--text-muted); font-style:italic; }
.account-cinematic .fade-in { opacity:0; transform:translateY(12px); animation:fadeUp .5s ease forwards; }
.account-cinematic .fade-in:nth-child(1){animation-delay:.05s}.account-cinematic .fade-in:nth-child(2){animation-delay:.13s}.account-cinematic .fade-in:nth-child(3){animation-delay:.21s}.account-cinematic .fade-in:nth-child(4){animation-delay:.29s}
@keyframes fadeUp { to { opacity:1; transform:translateY(0); } }
@keyframes pulse { 0%,100%{opacity:1;box-shadow:0 0 8px var(--online-green);}50%{opacity:.6;box-shadow:0 0 16px var(--online-green);} }
@media (max-width: 860px){ .account-cinematic .nav-links{ display:none; } .account-cinematic .top-row{ grid-template-columns:1fr; } .account-cinematic .info-grid{ grid-template-columns:1fr; } .account-cinematic .info-col + .info-col { border-left:none; border-top:1px solid var(--panel-border);} }

/* readability bump for this module (avoid tiny text) */
.account-cinematic .hero-eyebrow,
.account-cinematic .page-subtitle,
.account-cinematic .sub-nav-item,
.account-cinematic .panel-title,
.account-cinematic .meta-label,
.account-cinematic .field-label,
.account-cinematic .qa-label,
.account-cinematic .chars-title-wrap,
.account-cinematic .char-table th,
.account-cinematic .status-pill,
.account-cinematic .action-link,
.account-cinematic .char-class-badge {
  font-size: 0.78rem;
}
.account-cinematic .nav-links a { font-size: 0.82rem; }
.account-cinematic .field-val,
.account-cinematic .meta-val,
.account-cinematic .char-name,
.account-cinematic .level-display,
.account-cinematic .zeny-cell,
.account-cinematic .guild-cell { font-size: 0.95rem; }
.account-cinematic .avatar-name { font-size: 1.35rem; }
/* --- Bootstrap server info module styles --- */
  .server-info-page *, .server-info-page *::before, .server-info-page *::after { box-sizing: border-box; margin: 0; padding: 0; }

  .server-info-page {
    --gold:         #c9a84c;
    --gold-light:   #f0d080;
    --gold-dim:     #7a6230;
    --gold-glow:    rgba(201,168,76,0.35);
    --deep:         #05060a;
    --panel-bg:     rgba(6,9,18,0.90);
    --panel-border: rgba(201,168,76,0.28);
    --text-primary: #e8dfc4;
    --text-muted:   #8a7d5c;
    --online-green: #2ecc71;

    position: relative;
    width: 85vw;
    max-width: 85vw;
    margin: 0 0 2.5rem;
    left: 50%;
    transform: translateX(-50%);
    color: var(--text-primary);
    font-family: 'Crimson Text', Georgia, serif;
    font-size: 19px;
    line-height: 1.6;
    overflow: hidden;
    border: none;
    background: transparent;
  }

  @media (max-width: 1200px) {
    .server-info-page {
      width: 94vw;
      max-width: 94vw;
      left: 50%;
      transform: translateX(-50%);
    }
  }

  .server-info-page .particles-canvas { position:absolute; inset:0; pointer-events:none; z-index:3; }

  .server-info-page .content-root { position: relative; z-index: 10; }

  .server-info-page .sub-nav { max-width: 1320px; margin: 0 auto; padding: 0.9rem 1.5rem 1rem; display:flex; flex-wrap:wrap; gap:0.3rem 0; }
  .server-info-page .sub-nav-item { font-family:'Cinzel',serif; font-size:0.74rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-muted); text-decoration:none; padding:0.35rem 0.9rem; border:1px solid transparent; transition:all 0.2s; }
  .server-info-page .sub-nav-item:hover { color:var(--gold-light); border-color:var(--panel-border); background:rgba(201,168,76,0.06); }
  .server-info-page .sub-nav-item.active { color:var(--gold); border-color:var(--gold-dim); background:rgba(201,168,76,0.1); }
  .server-info-page .sub-nav-sep { color:var(--gold-dim); font-size:0.8rem; align-self:center; opacity:.4; padding: 0 0.2rem; }

  .server-info-page .page-hero { text-align:center; padding:2.4rem 2rem 1.5rem; }
  .server-info-page .hero-eyebrow { font-family:'Cinzel',serif; font-size:0.62rem; letter-spacing:0.5em; color:var(--gold-dim); text-transform:uppercase; margin-bottom:0.8rem; display:flex; align-items:center; justify-content:center; gap:1rem; }
  .server-info-page .hero-eyebrow::before { content:''; flex:1; max-width:90px; height:1px; background:linear-gradient(90deg,transparent,var(--gold-dim)); }
  .server-info-page .hero-eyebrow::after  { content:''; flex:1; max-width:90px; height:1px; background:linear-gradient(90deg,var(--gold-dim),transparent); }
  .server-info-page .page-title { font-family:'Cinzel Decorative',serif; font-size:clamp(1.8rem,4vw,3rem); font-weight:700; color:var(--gold); letter-spacing:0.06em; text-shadow:0 0 30px rgba(201,168,76,0.5), 0 2px 4px rgba(0,0,0,0.8); animation:title-glow 4s ease-in-out infinite; }
  @keyframes title-glow { 0%,100%{text-shadow:0 0 30px rgba(201,168,76,.5),0 2px 4px rgba(0,0,0,.8);}50%{text-shadow:0 0 55px rgba(201,168,76,.75),0 0 120px rgba(201,168,76,.3),0 2px 4px rgba(0,0,0,.8);} }
  .server-info-page .page-subtitle { font-family:'Cinzel',serif; font-size:0.7rem; letter-spacing:0.4em; color:var(--text-muted); text-transform:uppercase; margin-top:0.3rem; }

  .server-info-page .main-wrap { max-width: 1320px; margin: 0 auto; padding: 0 1.5rem 3.2rem; display:grid; gap:1.2rem; }

  .server-info-page .panel { background:var(--panel-bg); border:1px solid var(--panel-border); backdrop-filter:blur(12px); position:relative; }
  .server-info-page .panel-corners::after {
    content:''; position:absolute; top:-2px; left:-2px; right:-2px; bottom:-2px;
    background:
      linear-gradient(var(--gold-dim),var(--gold-dim)) top left/12px 1px no-repeat,
      linear-gradient(var(--gold-dim),var(--gold-dim)) top left/1px 12px no-repeat,
      linear-gradient(var(--gold-dim),var(--gold-dim)) top right/12px 1px no-repeat,
      linear-gradient(var(--gold-dim),var(--gold-dim)) top right/1px 12px no-repeat,
      linear-gradient(var(--gold-dim),var(--gold-dim)) bottom left/12px 1px no-repeat,
      linear-gradient(var(--gold-dim),var(--gold-dim)) bottom left/1px 12px no-repeat,
      linear-gradient(var(--gold-dim),var(--gold-dim)) bottom right/12px 1px no-repeat,
      linear-gradient(var(--gold-dim),var(--gold-dim)) bottom right/1px 12px no-repeat;
    pointer-events:none;
  }

  .server-info-page .status-strip { display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:1.2rem; }
  @media(max-width:700px){ .server-info-page .status-strip{grid-template-columns:1fr;} }

  .server-info-page .status-card { padding:1.4rem 1.2rem; text-align:center; }
  .server-info-page .status-icon { font-size:1.8rem; margin-bottom:0.4rem; display:block; line-height:1; }
  .server-info-page .status-server-name { font-family:'Cinzel',serif; font-size:0.95rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--gold-light); display:block; margin-bottom:0.35rem; }
  .server-info-page .status-indicator { display:flex; align-items:center; justify-content:center; gap:0.5rem; margin-bottom:0.3rem; }
  .server-info-page .status-dot { width:9px; height:9px; border-radius:50%; flex-shrink:0; }
  .server-info-page .status-dot.on  { background:var(--online-green); box-shadow:0 0 10px var(--online-green); animation:pulse 2s infinite; }
  .server-info-page .status-dot.off { background:#c0392b; box-shadow:0 0 8px #c0392b; }
  .server-info-page .status-label { font-family:'Cinzel',serif; font-size:0.8rem; letter-spacing:0.12em; text-transform:uppercase; }
  .server-info-page .status-label.on { color:var(--online-green); }
  .server-info-page .status-label.off { color:#e07070; }
  .server-info-page .status-ping { font-family:'Cinzel',serif; font-size:0.72rem; letter-spacing:0.1em; color:var(--text-muted); }

  .server-info-page .panel-title { font-family:'Cinzel',serif; font-size:0.82rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--gold-dim); padding:1rem 1.6rem; border-bottom:1px solid var(--panel-border); display:flex; align-items:center; gap:0.8rem; }
  .server-info-page .panel-title::before { content:''; display:inline-block; width:6px; height:6px; background:var(--gold-dim); transform:rotate(45deg); flex-shrink:0; }
  .server-info-page .stats-grid { display:grid !important; grid-template-columns:repeat(5,minmax(0,1fr)) !important; gap:1px; background:var(--panel-border); }
  @media(max-width:800px){ .server-info-page .stats-grid{grid-template-columns:repeat(2,1fr);} }
  .server-info-page .stat-cell { background:var(--panel-bg); padding:1.2rem 1rem; text-align:center; position:relative; transition:background 0.2s; }
  .server-info-page .stat-cell:hover { background:rgba(201,168,76,0.05); }
  .server-info-page .stat-cell::after { content:''; position:absolute; bottom:0; left:20%; right:20%; height:1px; background:linear-gradient(90deg,transparent,rgba(201,168,76,0.15),transparent); }
  .server-info-page .stat-icon { font-size:1.4rem; display:block; line-height:1; }
  .server-info-page .stat-value { font-family:'Cinzel',serif; font-size:clamp(1.6rem,2.6vw,2.2rem); font-weight:700; color:var(--gold); line-height:1; display:block; margin-top:0.4rem; }
  .server-info-page .stat-label { font-family:'Cinzel',serif; font-size:0.7rem; letter-spacing:0.2em; text-transform:uppercase; color:var(--text-muted); margin-top:0.28rem; display:block; }

  .server-info-page .content-split { display:grid !important; grid-template-columns:minmax(0,1fr) 360px !important; gap:1.2rem; align-items:start; }
  @media(max-width:960px){ .server-info-page .content-split{grid-template-columns:1fr;} }

  .server-info-page .job-category-header { font-family:'Cinzel',serif; font-size:0.72rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--gold-dim); padding:0.7rem 1.4rem; background:rgba(201,168,76,0.04); border-bottom:1px solid rgba(201,168,76,0.12); display:flex; align-items:center; gap:0.6rem; }
  .server-info-page .job-category-header::before { content:''; width:4px; height:4px; background:var(--gold-dim); transform:rotate(45deg); flex-shrink:0; }
  .server-info-page .job-row { display:grid !important; grid-template-columns:repeat(4,minmax(0,1fr)) !important; gap:1px; background:rgba(201,168,76,0.07); border-bottom:1px solid rgba(201,168,76,0.07); }
  @media(max-width:660px){ .server-info-page .job-row { grid-template-columns:1fr 1fr; } }
  .server-info-page .job-cell { background:var(--panel-bg); padding:0.7rem 0.9rem; display:flex; align-items:center; justify-content:space-between; }
  .server-info-page .job-cell.empty { opacity:0; pointer-events:none; }
  .server-info-page .job-name { font-family:'Cinzel',serif; font-size:0.88rem; letter-spacing:0.04em; color:var(--text-primary); }
  .server-info-page .job-name.advanced { color:var(--gold-light); }
  .server-info-page .job-name.trans { color:#b48ae0; }
  .server-info-page .job-name.third { color:#7ab3d4; }
  .server-info-page .job-count { font-family:'Cinzel',serif; font-size:1.22rem; font-weight:700; min-width:24px; text-align:right; }
  .server-info-page .job-count.zero { color:var(--text-muted); opacity:0.4; }
  .server-info-page .job-count.low { color:var(--gold-dim); }
  .server-info-page .job-count.mid { color:var(--gold); }
  .server-info-page .job-count.high { color:var(--gold-light); text-shadow:0 0 10px rgba(240,208,128,0.4); }

  .server-info-page .sidebar { display:flex; flex-direction:column; gap:1.2rem; }
  .server-info-page .uptime-row { display:flex; align-items:center; justify-content:space-between; padding:0.64rem 1.2rem; border-bottom:1px solid rgba(201,168,76,0.07); }
  .server-info-page .uptime-label { font-family:'Cinzel',serif; font-size:0.78rem; letter-spacing:0.1em; color:var(--text-muted); text-transform:uppercase; }
  .server-info-page .uptime-val { font-family:'Cinzel',serif; font-size:0.92rem; color:var(--gold); }
  .server-info-page .uptime-bar-wrap { padding:0.5rem 1.2rem 1rem; }
  .server-info-page .uptime-pct { font-family:'Cinzel',serif; font-size:0.58rem; color:var(--text-muted); text-align:right; margin-bottom:0.3rem; }
  .server-info-page .uptime-track { height:5px; background:rgba(255,255,255,0.06); position:relative; }
  .server-info-page .uptime-fill { position:absolute; left:0; top:0; height:100%; background:linear-gradient(90deg,var(--gold-dim),var(--gold)); }

  .server-info-page .rates-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--panel-border); }
  .server-info-page .rate-cell { background:var(--panel-bg); padding:0.9rem 1rem; text-align:center; }
  .server-info-page .rate-val { font-family:'Cinzel',serif; font-size:1.45rem; font-weight:700; color:var(--gold); display:block; line-height:1; }
  .server-info-page .rate-label { font-family:'Cinzel',serif; font-size:0.68rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted); margin-top:0.25rem; display:block; }

  .server-info-page .pop-chart { padding:1.1rem 1.2rem; }
  .server-info-page .pop-chart-label { font-family:'Cinzel',serif; font-size:0.72rem; letter-spacing:0.16em; text-transform:uppercase; color:var(--text-muted); margin-bottom:0.7rem; }
  .server-info-page .pop-bars { display:flex; align-items:flex-end; gap:4px; height:60px; }
  .server-info-page .pop-bar-col { flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; }
  .server-info-page .pop-bar { width:100%; background:linear-gradient(0deg,var(--gold-dim),var(--gold)); min-height:2px; transition:height 0.6s ease; }
  .server-info-page .pop-bar-time { font-family:'Cinzel',serif; font-size:0.45rem; color:var(--text-muted); white-space:nowrap; }


  @supports not (display: grid) {
    .server-info-page .status-strip,
    .server-info-page .stats-grid,
    .server-info-page .content-split,
    .server-info-page .job-row { display:flex !important; flex-wrap:wrap; }
    .server-info-page .status-strip > * { width: calc(33.333% - 0.8rem); }
    .server-info-page .stats-grid > * { width: 20%; }
    .server-info-page .content-split > :first-child { width: calc(100% - 320px); }
    .server-info-page .content-split > :last-child { width: 300px; }
    .server-info-page .job-row > * { width: 25%; }
  }

  @keyframes pulse { 0%,100%{opacity:1;box-shadow:0 0 8px var(--online-green);}50%{opacity:.6;box-shadow:0 0 16px var(--online-green);} }
  @keyframes fadeUp { to{opacity:1;transform:translateY(0);} }
  .server-info-page .fade-in { opacity:0; transform:translateY(12px); animation:fadeUp 0.5s ease forwards; }
  .server-info-page .fade-in:nth-child(1){animation-delay:.05s}.server-info-page .fade-in:nth-child(2){animation-delay:.13s}
  .server-info-page .fade-in:nth-child(3){animation-delay:.21s}.server-info-page .fade-in:nth-child(4){animation-delay:.29s}