/*************************************************
 ** NOT-RO homepage styles (hero, cards, tools). **
 *************************************************/

/* hero: taller + CTA row */
#notro-hero {
	min-height: 300px;
	background:
		linear-gradient(180deg, rgba(6,11,28,.55) 0%, rgba(6,11,28,.25) 45%, rgba(6,11,28,.88) 100%),
		linear-gradient(90deg, rgba(6,11,28,.85) 0%, rgba(6,11,28,.35) 55%, rgba(6,11,28,.05) 100%),
		url(../img/banner.jpg) center 25% / cover no-repeat,
		var(--bg1);
}

#notro-brand {
	padding: 26px 30px 10px 30px;
}

#notro-logo {
	width: 110px;
	height: 110px;
}

#notro-title {
	font-size: 52px;
}

#notro-cta {
	display: flex;
	gap: 14px;
	padding: 6px 30px 24px 30px;
	flex-wrap: wrap;
}

.cta-btn {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 8px 20px 8px 10px;
	background: rgba(8, 15, 36, .82);
	border: 1px solid var(--line);
	border-radius: 12px;
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.cta-btn:hover {
	text-decoration: none;
	transform: translateY(-2px);
}

.cta-btn img {
	width: 58px;
	height: 58px;
	border-radius: 50%;
	border: 2px solid var(--line);
	object-fit: cover;
	background: #0d1730;
}

.cta-btn span {
	display: flex;
	flex-direction: column;
}

.cta-btn strong {
	font-size: 13pt;
	color: #fff;
	line-height: 1.2;
}

.cta-btn small {
	font-size: 8pt;
	color: var(--muted);
	letter-spacing: 1px;
	text-transform: uppercase;
}

.cta-register {
	border-color: var(--blue-dark);
	box-shadow: 0 0 14px rgba(47, 127, 224, .35);
}

.cta-register:hover {
	border-color: var(--blue);
	box-shadow: 0 0 22px rgba(77, 163, 255, .6);
}

.cta-download {
	border-color: #8a6a24;
	box-shadow: 0 0 14px rgba(232, 182, 76, .25);
}

.cta-download:hover {
	border-color: var(--gold);
	box-shadow: 0 0 22px rgba(232, 182, 76, .5);
}

/* slim topbar for inner pages */
#notro-topbar {
	margin: 14px 0;
	padding: 8px 16px;
	background: linear-gradient(90deg, #0d1730, #101b38);
	border: 1px solid var(--line);
	border-radius: 10px;
}

#notro-minibrand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	text-decoration: none;
}

#notro-minibrand:hover {
	text-decoration: none;
}

#notro-minibrand img {
	width: 34px;
	height: 34px;
}

#notro-minibrand span {
	font-family: Georgia, "Palatino Linotype", serif;
	font-size: 18px;
	font-weight: bold;
	letter-spacing: 3px;
	color: var(--gold-light);
}

/* stat cards */
.stat-cards {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 10px;
	margin: 2px 0 18px 0;
}

.stat-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 12px 6px;
	background: linear-gradient(#121e3d, #0d1730);
	border: 1px solid var(--line);
	border-radius: 8px;
}

.stat-value {
	font-size: 17pt;
	font-weight: bold;
	color: var(--gold-light);
}

.stat-label {
	margin-top: 4px;
	font-size: 7.5pt;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: var(--muted);
	text-align: center;
}

/* section headings */
.home-h {
	display: flex;
	align-items: baseline;
	justify-content: space-between;
	margin: 20px 0 10px 0;
	color: var(--gold-light);
	font-size: 14pt;
	border-bottom: 1px solid var(--line);
	padding-bottom: 6px;
}

.home-more {
	font-size: 9pt;
	font-weight: normal;
}

/* tools grid */
.tools-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 66px 16px;
	margin-top: 42px;
	margin-bottom: 34px;
}

.tool-card {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 10px 16px 10px calc(min(34%, 192px) + 24px);
	min-height: 64px;
	background-color: var(--panel2);
	border: 1px solid var(--line-soft);
	border-radius: 14px;
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

.tool-card:hover {
	text-decoration: none;
	transform: translateY(-3px);
	border-color: var(--blue-dark);
	box-shadow: 0 6px 20px rgba(47, 127, 224, .3);
}

.tool-card img {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	width: min(34%, 192px);
	height: 150px;
	object-fit: contain;
	background: none;
	border: none;
	border-radius: 0;
	box-shadow: none;
	filter: drop-shadow(0 10px 14px rgba(0, 0, 0, .55));
	margin: 0;
	transition: transform .15s ease;
}

.tool-card:hover img {
	transform: translateY(-50%) scale(1.05);
}

.tool-num {
	position: absolute;
	right: 12px;
	top: 8px;
	font-size: 9pt;
	font-weight: bold;
	color: #fff;
	text-shadow: 0 1px 3px #000;
}

.tool-card strong {
	padding: 10px 14px 0 14px;
	font-size: 11pt;
	color: #fff;
	margin-bottom: 3px;
}

.tool-card small {
	padding: 2px 14px 0 14px;
	font-size: 8.5pt;
	color: var(--muted);
	line-height: 1.35;
}

/* responsive */
@media (max-width: 1020px) {
	.stat-cards {
		grid-template-columns: repeat(3, 1fr);
	}
	.tools-grid {
		grid-template-columns: 1fr;
	}
	#notro-title {
		font-size: 36px;
	}
}

@media (max-width: 600px) {
	.stat-cards {
		grid-template-columns: repeat(2, 1fr);
	}
	.tools-grid {
		grid-template-columns: 1fr;
		gap: 46px 0;
		margin-top: 30px;
		margin-bottom: 24px;
	}
	.tool-card {
		min-height: 56px;
	}
	.tool-card img {
		height: 116px;
	}
	#notro-cta {
		padding: 6px 16px 20px 16px;
	}
	.cta-btn {
		flex: 1 1 100%;
	}
}

/* LIVE hero status pills */
#notro-live {
	display: flex;
	gap: 10px;
	justify-content: center;
	flex-wrap: wrap;
	padding: 4px 16px 22px 16px;
}

.live-pill {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 7px 18px;
	background: rgba(8, 15, 36, .72);
	border: 1px solid var(--line-soft);
	border-radius: 999px;
	color: #d8e4f7;
	font-size: 10.5pt;
	text-decoration: none;
	transition: border-color .15s ease, transform .15s ease;
}

a.live-pill:hover {
	text-decoration: none;
	border-color: var(--blue-dark);
	transform: translateY(-2px);
}

.live-dot {
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #8a93a8;
	flex-shrink: 0;
}

.live-dot.on {
	background: #3ddc74;
	box-shadow: 0 0 10px #3ddc74;
	animation: livepulse 1.6s ease-in-out infinite;
}

.live-dot.off {
	background: #ff5d5d;
	box-shadow: 0 0 10px #ff5d5d;
}

.live-num {
	font-weight: bold;
	color: #e8b64c;
	font-size: 12pt;
}

@keyframes livepulse {
	0%, 100% { opacity: 1; }
	50% { opacity: .4; }
}

@media (max-width: 600px) {
	.live-pill {
		font-size: 9.5pt;
		padding: 6px 13px;
	}
}

/* Top-left banner menu (mini CTA + dropdown) */
#notro-nav {
	position: absolute;
	top: 12px;
	left: 14px;
	z-index: 6;
}

#notro-menubtn {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 4px 14px 4px 5px;
	background: rgba(8, 15, 36, .82);
	border: 1px solid var(--line);
	border-radius: 12px;
	box-shadow: 0 0 10px rgba(47, 127, 224, .25);
	color: #fff;
	font-size: 10pt;
	font-weight: bold;
	font-family: inherit;
	cursor: pointer;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

#notro-menubtn:hover {
	transform: translateY(-2px);
	border-color: var(--blue-dark);
	box-shadow: 0 0 16px rgba(77, 163, 255, .45);
}

#notro-menubtn img {
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: 2px solid var(--line);
	object-fit: cover;
	background: #0d1730;
}

.menu-arrow {
	font-size: 8pt;
	color: #9db1d4;
}

#notro-menu {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	margin-top: 8px;
	min-width: 240px;
	background: rgba(10, 18, 40, .97);
	border: 1px solid var(--line);
	border-radius: 12px;
	box-shadow: 0 12px 30px rgba(0, 0, 0, .6);
	padding: 6px;
}

#notro-menu.open {
	display: block;
}

#notro-menu a {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 7px 10px;
	border-radius: 8px;
	color: #d8e4f7;
	font-size: 10pt;
	font-weight: bold;
	text-decoration: none;
}

#notro-menu a:hover {
	background: rgba(47, 127, 224, .18);
	text-decoration: none;
	color: #fff;
}

#notro-menu img {
	width: 42px;
	height: 42px;
	object-fit: contain;
	flex-shrink: 0;
	filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .5));
}

#notro-menu a:not(:has(img)) {
	padding-left: 62px;
}

@media (max-width: 600px) {
	#notro-nav {
		top: 8px;
		left: 8px;
	}
	#notro-menubtn {
		padding: 3px 10px 3px 4px;
		font-size: 8.5pt;
	}
	#notro-menubtn img {
		width: 28px;
		height: 28px;
	}
	#notro-menu {
		min-width: 210px;
	}
	#notro-menu img {
		width: 36px;
		height: 36px;
	}
}

/* Floating hero stats (bottom-right, no boxes) */
#notro-herostats {
	position: absolute;
	right: 18px;
	bottom: 14px;
	display: flex;
	flex-direction: column;
	gap: 3px;
	z-index: 5;
}

#notro-herostats div {
	display: flex;
	justify-content: flex-end;
	align-items: baseline;
	gap: 10px;
	text-shadow: 0 1px 5px #000, 0 0 12px rgba(0, 0, 0, .8);
}

#notro-herostats span {
	font-size: 8pt;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #9db1d4;
}

#notro-herostats strong {
	font-size: 11pt;
	color: #ffd97a;
	min-width: 64px;
	text-align: right;
}

@media (max-width: 600px) {
	#notro-herostats {
		right: 10px;
		bottom: 10px;
		gap: 1px;
	}
	#notro-herostats span {
		font-size: 7pt;
	}
	#notro-herostats strong {
		font-size: 9pt;
		min-width: 48px;
	}
}

/* Homepage news (Official Stories) */
.news-shell {
	margin-top: 18px;
}

.news-top {
	display: flex;
	justify-content: space-between;
	align-items: center;
	background: #101b38;
	border: 1px solid var(--line-soft);
	border-radius: 14px;
	padding: 10px 14px;
	margin-bottom: 12px;
}

.news-brand {
	display: flex;
	align-items: center;
	gap: 10px;
}

.news-brand img {
	width: 42px;
	height: 42px;
	object-fit: contain;
}

.news-kicker {
	display: block;
	font-size: 8pt;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: #e8b64c;
	font-weight: bold;
}

.news-brand strong {
	font-size: 15pt;
	color: #fff;
	line-height: 1.1;
}

.news-viewall {
	padding: 8px 22px;
	background: linear-gradient(180deg, #3f8ff0, #2f7fe0);
	border-radius: 999px;
	color: #fff;
	font-weight: bold;
	font-size: 10pt;
	text-decoration: none;
	white-space: nowrap;
	box-shadow: 0 4px 14px rgba(47, 127, 224, .4);
	transition: filter .15s ease, transform .15s ease;
}

a.news-viewall:hover {
	text-decoration: none;
	color: #fff;
	filter: brightness(1.12);
	transform: translateY(-1px);
}

.news-card {
	background: #101b38;
	border: 1px solid var(--line-soft);
	border-radius: 14px;
	overflow: hidden;
}

.news-img img {
	width: 100%;
	height: 280px;
	object-fit: cover;
	display: block;
}

.news-body {
	padding: 14px 18px 16px 18px;
}

.news-feat {
	color: #4da3ff;
	font-size: 9pt;
	font-weight: bold;
}

.news-title {
	display: block;
	color: #4da3ff;
	font-size: 14pt;
	font-weight: bold;
	margin: 2px 0 6px 0;
	text-decoration: none;
}

a.news-title:hover {
	text-decoration: underline;
}

.news-ex {
	color: #9db1d4;
	font-size: 10pt;
	margin: 0 0 8px 0;
}

.news-date {
	color: #4da3ff;
	font-size: 9pt;
}

.news-row {
	display: flex;
	gap: 12px;
	align-items: baseline;
	padding: 10px 16px;
	background: #0d1730;
	border: 1px solid var(--line-soft);
	border-radius: 10px;
	margin-top: 8px;
	text-decoration: none;
	color: #d8e4f7;
	transition: border-color .15s ease;
}

a.news-row:hover {
	text-decoration: none;
	border-color: var(--blue-dark);
}

.news-rowdate {
	color: #4da3ff;
	font-size: 9pt;
	white-space: nowrap;
}

.news-rowtitle {
	font-weight: bold;
	font-size: 10pt;
}

@media (max-width: 600px) {
	.news-img img {
		height: 170px;
	}
	.news-brand strong {
		font-size: 12pt;
	}
	.news-brand img {
		width: 34px;
		height: 34px;
	}
	.news-viewall {
		padding: 7px 16px;
		font-size: 9pt;
	}
	.news-title {
		font-size: 11pt;
	}
}

/* News columns: Server Event + Development Log */
.news-cols {
	display: grid;
	grid-template-columns: 1.15fr 1fr;
	gap: 14px;
	margin-top: 18px;
}

.news-cols .news-shell {
	margin-top: 0;
}

.news-cols .news-img img {
	height: 240px;
}

.devlog-list {
	max-height: 472px;
	overflow-y: auto;
	padding-right: 2px;
}

.devlog-list::-webkit-scrollbar {
	width: 8px;
}

.devlog-list::-webkit-scrollbar-track {
	background: transparent;
}

.devlog-list::-webkit-scrollbar-thumb {
	background: #2c4472;
	border-radius: 8px;
}

.dev-row {
	display: flex;
	gap: 12px;
	align-items: center;
	background: #0d1730;
	border: 1px solid var(--line-soft);
	border-radius: 12px;
	padding: 8px 12px 8px 8px;
	margin-top: 8px;
	text-decoration: none;
}

.dev-row:first-child {
	margin-top: 0;
}

a.dev-row:hover {
	border-color: var(--blue-dark);
	text-decoration: none;
}

.dev-row img {
	width: 64px;
	height: 64px;
	border-radius: 8px;
	object-fit: cover;
	flex-shrink: 0;
	background: #060b1c;
}

.dev-rowtxt {
	display: flex;
	flex-direction: column;
	gap: 2px;
	min-width: 0;
}

.dev-rowdate {
	color: #4da3ff;
	font-size: 8.5pt;
}

.dev-rowtitle {
	color: #fff;
	font-weight: bold;
	font-size: 10.5pt;
	line-height: 1.3;
}

.devlog-empty {
	padding: 18px;
	text-align: center;
	color: #9db1d4;
	font-size: 10pt;
	background: #0d1730;
	border: 1px dashed var(--line-soft);
	border-radius: 12px;
}

@media (max-width: 900px) {
	.news-cols {
		grid-template-columns: 1fr;
	}
	.devlog-list {
		max-height: 320px;
	}
}

/* Frozen banner: centered brand + top-right live stack */
#notro-brand {
	justify-content: center;
	text-align: center;
	cursor: default;
}

#notro-titlewrap {
	align-items: center;
}

#notro-cta {
	justify-content: center;
}

#notro-statbox {
	display: flex;
	justify-content: center;
	gap: 12px;
	flex-wrap: wrap;
	padding: 6px 16px 22px 16px;
}

.statbox {
	flex: 0 1 180px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	padding: 12px 10px;
	background: linear-gradient(180deg, rgba(16, 27, 56, .92), rgba(8, 15, 36, .92));
	border: 1px solid var(--line);
	border-radius: 12px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .45);
	text-decoration: none;
	transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}

a.statbox:hover {
	text-decoration: none;
	transform: translateY(-2px);
	border-color: var(--blue-dark);
	box-shadow: 0 0 18px rgba(77, 163, 255, .35);
}

.statbox-label {
	font-size: 8pt;
	letter-spacing: 2px;
	text-transform: uppercase;
	color: #9db1d4;
}

.statbox-value {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 14pt;
	font-weight: bold;
	color: #fff;
}

.statbox-value.live-num {
	color: #ffd97a;
}

@media (max-width: 600px) {
	.statbox {
		flex-basis: 150px;
		padding: 10px 8px;
	}
	.statbox-value {
		font-size: 12pt;
	}
}

/* Footer */
.notro-footer {
	background: linear-gradient(180deg, #0b1327, #060b1c);
	border: 1px solid var(--line);
	border-radius: 14px;
	padding: 22px 24px 14px 24px;
	margin-top: 18px;
}

.notro-fgrid {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1fr;
	gap: 20px;
}

.notro-fbrand img {
	width: 46px;
	height: 46px;
	float: left;
	margin-right: 10px;
	filter: drop-shadow(0 0 10px rgba(77, 163, 255, .5));
}

.notro-fbrand strong {
	display: block;
	color: #fff;
	font-size: 13pt;
}

.notro-fbrand span {
	display: block;
	color: #9db1d4;
	font-size: 8pt;
	letter-spacing: 1px;
	text-transform: uppercase;
}

.notro-fbrand p {
	clear: both;
	color: #9db1d4;
	font-size: 9pt;
	margin: 10px 0 0 0;
	line-height: 1.5;
}

.notro-fcol h5 {
	margin: 0 0 10px 0;
	color: #e8b64c;
	font-size: 9pt;
	letter-spacing: 2px;
	text-transform: uppercase;
}

.notro-fcol a {
	display: block;
	color: #9db1d4;
	font-size: 10pt;
	text-decoration: none;
	padding: 3px 0;
}

.notro-fcol a:hover {
	color: #fff;
	text-decoration: none;
}

.notro-fbottom {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 8px;
	margin-top: 18px;
	padding-top: 12px;
	border-top: 1px solid var(--line-soft);
	color: #9db1d4;
	font-size: 8.5pt;
}

.notro-fbottom a {
	color: #4da3ff;
	text-decoration: none;
}

.notro-fmeta select {
	background: #0b1327;
	border: 1px solid var(--line-soft);
	color: #d8e4f7;
	border-radius: 6px;
	padding: 2px 6px;
	font-size: 8.5pt;
}

@media (max-width: 700px) {
	.notro-fgrid {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 480px) {
	.notro-fgrid {
		grid-template-columns: 1fr;
	}
	.notro-footer {
		padding: 18px 16px 12px 16px;
	}
}

/* Event mini cards */
.ev-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
	margin-top: 12px;
}

.ev-card {
	background: #101b38;
	border: 1px solid var(--line-soft);
	border-radius: 12px;
	overflow: hidden;
}

.ev-img img {
	width: 100%;
	height: 140px;
	object-fit: cover;
	display: block;
}

.ev-body {
	padding: 10px 12px 12px 12px;
}

.ev-title {
	display: block;
	color: #fff;
	font-size: 10.5pt;
	font-weight: bold;
	text-decoration: none;
	line-height: 1.35;
}

a.ev-title:hover {
	color: #4da3ff;
	text-decoration: none;
}

.ev-ex {
	color: #9db1d4;
	font-size: 9pt;
	margin: 4px 0 6px 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	max-height: 2.7em;
}

.ev-date {
	color: #4da3ff;
	font-size: 8.5pt;
}

@media (max-width: 520px) {
	.ev-grid {
		grid-template-columns: 1fr;
	}
}

/* Admin info box (news add/edit) */
.notro-adminfo {
	background: rgba(47, 127, 224, .12);
	border: 1px solid var(--blue-dark);
	border-radius: 10px;
	padding: 10px 14px;
	margin: 0 0 14px 0;
	font-size: 9.5pt;
	color: #d8e4f7;
	line-height: 1.5;
}

.notro-adminfo strong {
	color: #ffd97a;
}

.notro-adminfo a {
	color: #4da3ff;
}

/* Top-right live boxes (icon + value + label) */
#notro-status {
	position: absolute;
	top: 12px;
	right: 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	z-index: 5;
}

.live-pill {
	display: flex;
	align-items: center;
	gap: 10px;
	min-width: 172px;
	padding: 8px 14px;
	background: linear-gradient(180deg, rgba(16, 27, 56, .94), rgba(8, 15, 36, .94));
	border: 1px solid var(--line);
	border-radius: 12px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .45);
}

a.live-pill:hover {
	transform: translateY(-2px);
	border-color: var(--blue-dark);
	box-shadow: 0 0 18px rgba(77, 163, 255, .35);
}

.live-pill img {
	width: 32px;
	height: 32px;
	object-fit: contain;
	flex-shrink: 0;
	filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .5));
}

.live-txt {
	display: flex;
	flex-direction: column;
	line-height: 1.25;
}

.live-val {
	font-size: 15pt;
	font-weight: bold;
	color: #d8e4f7;
}

.live-val.up {
	color: #3ddc74;
}

.live-val.down {
	color: #ff5d5d;
}

.live-val.num {
	color: #ffd97a;
}

.live-lab {
	font-size: 7.5pt;
	letter-spacing: 1.5px;
	color: #9db1d4;
	text-transform: uppercase;
}

/* News section boxes (equal height) */
.news-cols {
	align-items: stretch;
}

.news-shell {
	background: #0b1327;
	border: 1px solid var(--line-soft);
	border-radius: 16px;
	padding: 14px;
	display: flex;
	flex-direction: column;
}

.devlog-list {
	flex: 1 1 auto;
	min-height: 0;
	max-height: none;
}

@media (max-width: 900px) {
	.devlog-list {
		max-height: 320px;
	}
}

@media (max-width: 600px) {
	#notro-status {
		top: 8px;
		right: 8px;
	}
	.live-pill {
		min-width: 150px;
		padding: 6px 10px;
	}
	.live-pill img {
		width: 26px;
		height: 26px;
	}
	.live-val {
		font-size: 12pt;
	}
}

/* Footer tweaks: brand block + right link columns */
.notro-fgrid {
	grid-template-columns: 1.6fr auto auto auto auto;
}

.notro-fbrand {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.notro-fbrand img {
	float: none;
	margin: 0 10px 0 0;
}

.notro-fbrand div {
	flex: 1 1 auto;
}

.notro-fbrand p {
	flex-basis: 100%;
	clear: none;
}

.notro-fcol {
	border-left: 1px solid var(--line-soft);
	padding-left: 16px;
	white-space: nowrap;
}

.notro-credit {
	color: #e8b64c;
	font-weight: bold;
}

@media (max-width: 700px) {
	.notro-fgrid {
		grid-template-columns: 1fr 1fr;
	}
	.notro-fcol {
		border-left: none;
		padding-left: 0;
		white-space: normal;
	}
}

@media (max-width: 480px) {
	.notro-fgrid {
		grid-template-columns: 1fr;
	}
}

/* Compact stat cards under banner */
.stat-cards {
	gap: 10px;
	margin: 16px 0 4px 0;
}

.stat-card {
	padding: 8px 6px;
}

.stat-value {
	font-size: 13pt;
}

.stat-label {
	font-size: 7.5pt;
}

/* Single status box (top-right) */
#notro-status {
	background: linear-gradient(180deg, rgba(16, 27, 56, .94), rgba(8, 15, 36, .94));
	border: 1px solid var(--line);
	border-radius: 12px;
	box-shadow: 0 6px 18px rgba(0, 0, 0, .45);
	padding: 6px 0;
	gap: 0;
	min-width: 196px;
}

.nstat {
	display: flex;
	align-items: center;
	padding: 6px 14px;
	text-decoration: none;
}

a.nstat:hover {
	text-decoration: none;
	background: rgba(47, 127, 224, .12);
}

.nstat + .nstat {
	border-top: 1px solid var(--line-soft);
}

.nstat-val {
	width: 56px;
	flex-shrink: 0;
	font-size: 13pt;
	font-weight: bold;
	color: #ffd97a;
	display: flex;
	align-items: center;
}

.nstat-val .live-dot {
	margin: 0 auto;
}

.nstat-lab {
	border-left: 1px solid var(--line-soft);
	padding-left: 10px;
	margin-left: 2px;
	color: #d8e4f7;
	font-size: 9.5pt;
	display: flex;
	flex-direction: column;
}

.nstat-lab strong {
	font-size: 11pt;
	color: #fff;
}

.nstat-lab small {
	font-size: 7.5pt;
	letter-spacing: 1px;
	text-transform: uppercase;
	color: #9db1d4;
}

@media (max-width: 600px) {
	.nstat-val {
		width: 48px;
		font-size: 11pt;
	}
	.nstat-lab {
		font-size: 8.5pt;
	}
}

/* Top ladders */
.ladder-row {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 14px;
	margin-top: 14px;
}

.ladder {
	background: #0b1327;
	border: 1px solid var(--line-soft);
	border-radius: 16px;
	padding: 14px;
}

.ladder h4 {
	margin: 0 0 10px 0;
	color: #fff;
	font-size: 13pt;
}

.ladder-top {
	display: flex;
	gap: 10px;
	align-items: center;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--line-soft);
}

.ladder-rank1 {
	color: #ffd97a;
	font-size: 17pt;
	font-weight: bold;
}

.ladder-top img {
	width: 62px;
	height: 62px;
	object-fit: contain;
	flex-shrink: 0;
	filter: drop-shadow(0 4px 8px rgba(0, 0, 0, .5));
}

.ladder-info {
	display: flex;
	flex-direction: column;
	gap: 1px;
	font-size: 9pt;
	color: #d8e4f7;
	min-width: 0;
}

.ladder-info span {
	color: #9db1d4;
	margin-right: 6px;
}

.ladder-info strong {
	color: #fff;
}

.lad-head, .lad-row {
	display: grid;
	grid-template-columns: 34px 1fr auto;
	gap: 8px;
	align-items: baseline;
}

.lad-head {
	color: #e8b64c;
	font-size: 8pt;
	font-weight: bold;
	letter-spacing: 1px;
	padding: 8px 2px 4px 2px;
}

.lad-row {
	color: #d8e4f7;
	font-size: 9.5pt;
	padding: 5px 2px;
	border-top: 1px solid rgba(44, 68, 114, .4);
}

.lad-row span:first-child {
	color: #9db1d4;
}

.lad-row span:last-child, .lad-head span:last-child {
	text-align: right;
}

.ladder-more {
	display: inline-block;
	margin-top: 8px;
	color: #e8b64c;
	font-size: 9pt;
	font-weight: bold;
	text-decoration: none;
}

a.ladder-more:hover {
	color: #ffd97a;
	text-decoration: none;
}

@media (max-width: 1000px) {
	.ladder-row {
		grid-template-columns: 1fr 1fr;
	}
}

@media (max-width: 560px) {
	.ladder-row {
		grid-template-columns: 1fr;
	}
}

/* NOT-RO v20: world map */
.wmap-sub { color: #9fb0c8; margin: -6px 0 12px; }
.wmap-search { display: flex; gap: 8px; margin: 0 0 10px; }
.wmap-search input { flex: 1; background: #101a2c; border: 1px solid #2a3a55; color: #e8eef7; padding: 8px 12px; border-radius: 8px; }
.wmap-search button { background: linear-gradient(180deg,#e8b64c,#b97a1e); border: 1px solid #7a5210; color: #1a1206; font-weight: 700; padding: 8px 18px; border-radius: 8px; cursor: pointer; }
.wmap-meta { color: #8fa0b8; font-size: 12px; margin: 0 0 12px; }
.wmap-empty { background: #131e33; border: 1px solid #2a3a55; padding: 16px; border-radius: 10px; }
.wmap-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.wmap-card { background: #111b30; border: 1px solid #2a3a55; border-radius: 10px; overflow: hidden; }
.wmap-tile { background: linear-gradient(135deg, #1b2a4a, #101a2c); color: #ffd479; font-weight: 700; padding: 18px 12px; text-align: center; letter-spacing: 1px; }
.wmap-thumb { width: 100%; display: block; }
.wmap-head { display: flex; justify-content: space-between; align-items: center; padding: 8px 10px; border-bottom: 1px solid #22314d; }
.wmap-head strong { color: #ffd479; }
.wmap-head span { color: #8fa0b8; font-size: 11px; }
.wmap-mobs { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 10px 10px; }
.wmap-mob { display: inline-flex; align-items: center; gap: 5px; background: #0d1626; border: 1px solid #2a3a55; border-radius: 20px; padding: 3px 9px 3px 4px; font-size: 11px; color: #dbe4f0; text-decoration: none; }
.wmap-mob img { width: 22px; height: 22px; object-fit: contain; }
.wmap-mob:hover { border-color: #e8b64c; }
.wmap-lv { color: #8fa0b8; font-size: 10px; }
.wmap-mob.mvp { border-color: #b54a4a; }
.wmap-mvp { background: #b54a4a; color: #fff; font-size: 9px; font-weight: 700; border-radius: 4px; padding: 1px 4px; }
.wmap-nomob { padding: 8px 10px 10px; color: #5f7191; font-size: 12px; }
@media (max-width: 600px) { .wmap-grid { grid-template-columns: 1fr 1fr; } }

/* NOT-RO v21: woe rankings */
.woe-hero { text-align: center; background: linear-gradient(180deg,#1b2a4a,#101a2c); border: 1px solid #2a3a55; border-radius: 12px; padding: 22px 16px; margin-bottom: 12px; }
.woe-kicker { color: #e8b64c; letter-spacing: 3px; text-transform: uppercase; font-size: 11px; }
.woe-hero h2 { margin: 4px 0 6px; color: #ffd479; }
.woe-hero p { color: #9fb0c8; margin: 0 0 6px; }
.woe-sched { color: #e8b64c !important; font-weight: 700; }
.woe-notice { background: #131e33; border-left: 3px solid #e8b64c; border-radius: 0 10px 10px 0; padding: 10px 14px; margin-bottom: 14px; }
.woe-notice strong { color: #ffd479; font-size: 12px; }
.woe-notice p { margin: 4px 0 0; color: #9fb0c8; font-size: 12px; }
.woe-castles { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; margin-bottom: 16px; }
.woe-castle { background: #111b30; border: 1px solid #2a3a55; border-radius: 10px; padding: 12px; display: flex; flex-direction: column; gap: 4px; }
.woe-agit { color: #8fa0b8; font-size: 10px; text-transform: uppercase; letter-spacing: 2px; }
.woe-castle strong { color: #ffd479; font-size: 15px; }
.woe-owner { display: flex; align-items: center; gap: 6px; color: #dbe4f0; font-weight: 700; }
.woe-owner img { width: 24px; height: 24px; }
.woe-owner.none { color: #5f7191; font-weight: 400; font-style: italic; }
.woe-econ { color: #8fa0b8; font-size: 11px; }
table.woe-rank-table { width: 100%; border-collapse: collapse; background: #111b30; border: 1px solid #2a3a55; }
table.woe-rank-table th { background: #1b2a4a; color: #ffd479; padding: 8px 10px; text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: 1px; }
table.woe-rank-table td { padding: 8px 10px; border-top: 1px solid #22314d; color: #dbe4f0; }
.woe-rank { font-weight: 700; color: #e8b64c; white-space: nowrap; }
tr.woe-top1 td { background: #2a2410; }
tr.woe-top2 td { background: #1c2233; }
tr.woe-top3 td { background: #241a10; }
.woe-glv { color: #8fa0b8; font-size: 10px; }
.woe-pts { font-weight: 700; color: #ffd479; }

/* NOT-RO v22: dropdown unclip + compact + sections */
#notro-hero, #notro-nav { overflow: visible; }
#notro-nav { position: relative; z-index: 50; }
#notro-menu { max-height: 72vh; overflow-y: auto; min-width: 230px; }
#notro-menu a { padding: 6px 10px; font-size: 12px; }
#notro-menu a img { width: 20px; height: 20px; }
.menu-sec { display: block; padding: 8px 10px 3px; font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: #e8b64c; border-bottom: 1px solid #22314d; margin-top: 4px; }
.menu-sec:first-child { margin-top: 0; }
/* NOT-RO v22: news editor (no TinyMCE) */
.notro-ebar { margin: 0 0 6px; display: flex; gap: 6px; }
.notro-ebar button { background: #1b2a4a; border: 1px solid #2a3a55; color: #dbe4f0; border-radius: 6px; padding: 4px 12px; cursor: pointer; font-weight: 700; }
.notro-ebar button:hover { border-color: #e8b64c; color: #ffd479; }
textarea[name="news_body"] { width: 100%; min-height: 220px; background: #0d1626; border: 1px solid #2a3a55; color: #e8eef7; border-radius: 8px; padding: 10px; font-family: monospace; font-size: 12px; }
.notro-upbox { background: #131e33; border: 1px solid #2a3a55; border-radius: 10px; padding: 10px 12px; margin: 0 0 12px; }
.notro-upbox strong { color: #ffd479; font-size: 12px; }
.notro-upbox iframe { width: 100%; height: 290px; border: 1px solid #22314d; border-radius: 8px; background: #060b1c; margin-top: 8px; }