/* =============================================================
   Ragnarok Legacy — mat3osz theme
   Slate / mist / stone design system
   Deduplicated: 2024 — removed duplicate selectors
   ============================================================= */

:root{
	--navy-900:#111827;
	--navy-800:#182235;
	--navy-700:#223149;
	--navy-600:#2c415e;
	--navy-500:#3b5578;
	--navy-line:#44566c;

	--gold-50:#f6f8fb;
	--gold-100:#dde6f0;
	--gold-200:#bccadd;
	--gold-300:#93a6bd;
	--gold-400:#6a7d92;
	--gold-500:#4b5e73;

	--cream-50:#fbfcfe;
	--cream-100:#f3f6fa;
	--cream-200:#e8edf3;
	--cream-300:#d8e0ea;
	--cream-bg:#e7edf4;
	--cream-bg-soft:#eef2f7;

	--ink:#1b2230;
	--ink-soft:#445064;
	--ink-mute:#6b7788;

	--o-faint:.08;
	--o-soft:.18;
	--o-mute:.45;
	--o-strong:.72;

	--font-display:"Cinzel", "Cormorant Garamond", "Noto Serif", Georgia, serif;
	--font-serif:"Cormorant Garamond", "Noto Serif", Georgia, serif;
	--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

	--shadow-card:0 12px 28px -14px rgba(11,20,38,.32), 0 2px 6px -2px rgba(11,20,38,.18);
	--shadow-deep:0 24px 60px -20px rgba(11,20,38,.55);

	--radius-card:14px;
	--radius-pill:999px;
}

*,*::before,*::after{box-sizing:border-box}

html,body{margin:0;padding:0}
html,body{max-width:100%;overflow-x:hidden}
body{
	font-family:var(--font-sans);
	font-size:14px;
	line-height:1.55;
	color:var(--ink);
	background:
		radial-gradient(1200px 600px at 50% -10%, #ffffff 0%, transparent 60%),
		radial-gradient(900px 500px at 90% 40%, #edf2f8 0%, transparent 70%),
		linear-gradient(180deg, #eef3f8 0%, #dfe6ee 100%);
	min-height:100vh;
	-webkit-font-smoothing:antialiased;
	text-rendering:optimizeLegibility;
}

a{color:var(--gold-500);text-decoration:none;transition:color .15s ease}
a:hover{color:var(--gold-300)}

img{max-width:100%;height:auto;display:block}

h1,h2,h3,h4,h5{font-family:var(--font-display);letter-spacing:.02em;color:var(--ink);font-weight:600;margin:0 0 .5em}

.skip-link{position:absolute;left:-9999px;top:0}
.skip-link:focus{left:1rem;top:1rem;background:var(--navy-900);color:var(--gold-100);padding:.5rem .75rem;border-radius:6px;z-index:9999}

/* ---------- TOPBAR ---------- */
.site-topbar{
	position:relative;
	background:linear-gradient(180deg, var(--navy-900) 0%, var(--navy-800) 100%);
	color:var(--cream-50);
	border-bottom:1px solid rgba(147,166,189,.28);
}
.topbar-trim{display:none}
.topbar-inner{
	max-width:1320px;margin:0 auto;
	display:flex;align-items:center;gap:24px;
	padding:14px 28px;
}
.topbar-brand{display:flex;align-items:center;gap:10px;text-decoration:none;flex-shrink:0}
.topbar-brand:hover{opacity:.92}
.topbar-logo{display:block;height:46px;width:auto;object-fit:contain;filter:drop-shadow(0 2px 6px rgba(0,0,0,.45))}
.topbar-panel{flex:1;display:flex;align-items:center;gap:24px;min-width:0}
.mobile-menu-toggle{
	display:none;
	align-items:center;
	gap:10px;
	padding:9px 14px;
	border:1px solid rgba(147,166,189,.34);
	border-radius:3px;
	background:rgba(17,24,39,.52);
	color:#e4ebf5;
	font-family:var(--font-display);
	font-size:10px;
	font-weight:700;
	letter-spacing:.18em;
	text-transform:uppercase;
	cursor:pointer;
	transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.mobile-menu-toggle:hover{background:rgba(17,24,39,.72);color:#f8fbff}
.mobile-menu-toggle-box{
	display:inline-flex;
	flex-direction:column;
	justify-content:center;
	gap:4px;
	width:16px;
}
.mobile-menu-toggle-box span{
	display:block;
	width:16px;
	height:1px;
	background:currentColor;
	transform-origin:center;
	transition:transform .18s ease, opacity .18s ease;
}
.mobile-menu-toggle[aria-expanded="true"] .mobile-menu-toggle-box span:nth-child(1){transform:translateY(5px) rotate(45deg)}
.mobile-menu-toggle[aria-expanded="true"] .mobile-menu-toggle-box span:nth-child(2){opacity:0}
.mobile-menu-toggle[aria-expanded="true"] .mobile-menu-toggle-box span:nth-child(3){transform:translateY(-5px) rotate(-45deg)}

.topbar-nav{flex:1;display:flex;justify-content:center}
.topbar-nav ul{list-style:none;display:flex;gap:4px;margin:0;padding:0}
.topbar-nav > ul > li{position:relative}
.topbar-nav > ul > li > a{
	display:block;padding:10px 16px;
	font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;
	color:rgba(228,235,245,.8);
	border-radius:2px;
	transition:color .15s ease, background .15s ease, box-shadow .15s ease;
}
.topbar-nav > ul > li > a:hover{color:#f8fbff;background:rgba(248,251,255,.06)}
.topbar-nav > ul > li.is-active > a{
	background:transparent;
	color:#f8fbff;
	box-shadow:inset 0 -2px 0 var(--gold-300);
}
.topbar-nav li.has-children > a{padding-right:42px;position:relative}
.topbar-nav li.has-children > a::after{
	content:"";
	position:absolute;
	right:13px;
	top:50%;
	width:6px;
	height:6px;
	margin-top:-4px;
	border-right:1px solid currentColor;
	border-bottom:1px solid currentColor;
	transform:rotate(45deg);
	opacity:.8;
}
.topbar-subnav{
	position:absolute;
	top:calc(100% - 1px);
	left:0;
	min-width:240px;
	display:none !important;
	flex-direction:column;
	gap:0;
	padding:9px;
	background:linear-gradient(180deg, rgba(17,24,39,.98) 0%, rgba(24,34,53,.98) 100%);
	border:1px solid rgba(147,166,189,.28);
	border-radius:4px;
	box-shadow:0 20px 38px -22px rgba(0,0,0,.78);
	z-index:30;
	backdrop-filter:blur(12px);
}
.topbar-nav li.has-children:hover .topbar-subnav,
.topbar-nav li.has-children:focus-within .topbar-subnav{display:flex !important}
.topbar-subnav li{width:100%}
.topbar-subnav li a{
	display:block;
	padding:10px 12px;
	font-size:11px;
	letter-spacing:.12em;
	border-radius:3px;
	white-space:nowrap;
	color:#e4ebf5;
	background:transparent;
	box-shadow:none;
	transition:background .15s ease, color .15s ease, border-color .15s ease;
}
.topbar-subnav li a:hover,
.topbar-subnav li a:focus{
	color:#f8fbff;
	background:rgba(147,166,189,.14);
}
.is-home .topbar-subnav{
	background:linear-gradient(180deg, rgba(14,22,36,.96) 0%, rgba(20,31,48,.96) 100%);
	border-color:rgba(188,202,221,.34);
	box-shadow:0 22px 42px -22px rgba(0,0,0,.82);
}
.is-home .topbar-subnav li a{
	color:#eef3f8;
}
.is-home .topbar-subnav li a:hover,
.is-home .topbar-subnav li a:focus{
	background:rgba(221,230,240,.14);
	color:#ffffff;
}

.topbar-account{display:flex;align-items:center;gap:8px}
.account-pill{
	display:inline-flex;align-items:center;gap:8px;
	padding:8px 16px 8px 8px;
	background:rgba(17,24,39,.45);
	color:#e4ebf5;
	border-radius:2px;
	font-weight:600;font-size:12px;letter-spacing:.06em;
	border:1px solid rgba(147,166,189,.45);
	transition:background .15s ease, color .15s ease;
}
.account-pill:hover{background:rgba(17,24,39,.7);color:#f8fbff}
.account-avatar{width:24px;height:24px;border-radius:50%;background:var(--navy-800);color:var(--gold-200);display:inline-flex;align-items:center;justify-content:center;font-size:13px}
.account-cta{
	padding:9px 18px;
	background:linear-gradient(180deg, #edf2f8, #93a6bd);
	color:#122033;
	border:1px solid #51657d;
	border-radius:2px;
	font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.45);
	transition:filter .15s ease;
}
.account-cta:hover{filter:brightness(1.06);color:#122033}
.account-logout{
	width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;
	border-radius:2px;border:1px solid rgba(147,166,189,.35);color:var(--gold-200);font-size:14px;
}
.account-logout:hover{background:rgba(147,166,189,.12)}

/* ---------- HERO (image-backed) ---------- */
.site-hero{
	position:relative;overflow:hidden;
	min-height:640px;
	background-color:#0b1426;
	background-position:center 30%;
	background-size:cover;
	background-repeat:no-repeat;
	color:#e4ebf5;
}
.hero-scrim{
	position:absolute;inset:0;pointer-events:none;
	background:
		linear-gradient(180deg, rgba(8,14,28,.55) 0%, rgba(8,14,28,.05) 28%, rgba(8,14,28,.15) 60%, rgba(8,14,28,.85) 100%),
		radial-gradient(ellipse at 50% 80%, rgba(8,14,28,.55), transparent 60%);
}
.hero-stage{
	position:relative;z-index:2;
	max-width:1100px;margin:0 auto;
	padding:160px 24px 96px;
	display:flex;flex-direction:column;align-items:center;text-align:center;gap:22px;
}
.hero-title{max-width:820px;margin:0 auto;display:flex;flex-direction:column;align-items:center}
.hero-logo{
	display:block;
	width:auto;height:auto;
	max-height:280px;
	margin:14px auto 10px;
	filter:drop-shadow(0 6px 24px rgba(0,0,0,.55)) drop-shadow(0 2px 4px rgba(0,0,0,.4));
}
.hero-tagline{
	font-family:var(--font-serif);font-style:italic;
	font-size:16px;letter-spacing:.06em;
	color:#dbe4ef;
	text-shadow:0 1px 8px rgba(0,0,0,.6);
	margin:0;
}

.hero-cta{
	display:inline-flex;flex-direction:column;align-items:center;gap:8px;
	margin-top:10px;text-decoration:none;
}
.hero-cta-row{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:12px;
	margin-top:4px;
}
.hero-cta-row .hero-cta{margin-top:0}
.hero-cta .cta-text{
	display:inline-block;
	padding:16px 56px;
	font-family:var(--font-display);
	font-size:18px;font-weight:700;
	letter-spacing:.22em;text-transform:uppercase;
	color:#122033;
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);
	border:1px solid #4d6178;
	border-radius:4px;
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.55),
		inset 0 -1px 0 rgba(0,0,0,.25),
		0 12px 28px -10px rgba(0,0,0,.65);
	transition:transform .15s ease, box-shadow .15s ease, filter .15s ease;
}
.hero-cta-secondary .cta-text{
	background:rgba(17,24,39,.62);
	color:#e4ebf5;
	border-color:rgba(147,166,189,.45);
	box-shadow:0 12px 28px -14px rgba(0,0,0,.65);
}
.hero-cta:hover .cta-text{
	transform:translateY(-1px);
	filter:brightness(1.06);
	box-shadow:
		inset 0 1px 0 rgba(255,255,255,.65),
		inset 0 -1px 0 rgba(0,0,0,.25),
		0 16px 36px -12px rgba(0,0,0,.7);
}
.hero-cta .cta-sub{
	font-family:var(--font-serif);font-style:italic;
	font-size:12px;letter-spacing:.16em;text-transform:uppercase;
	color:rgba(228,235,245,.82);
	text-shadow:0 1px 6px rgba(0,0,0,.6);
}

.hero-quickbar{
	display:flex;flex-wrap:wrap;justify-content:center;gap:8px;
	margin-top:18px;
}
.qb-pill{
	display:inline-flex;align-items:center;
	padding:10px 20px;
	background:rgba(17,24,39,.55);
	border:1px solid rgba(147,166,189,.35);
	border-radius:2px;
	color:#e4ebf5;
	font-family:var(--font-display);
	font-size:11px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
	backdrop-filter:blur(6px);
	transition:background .2s ease, border-color .2s ease, color .2s ease;
}
.qb-pill:hover{background:rgba(17,24,39,.78);border-color:rgba(221,230,240,.7);color:#f8fbff}
.qb-label{display:inline-block}

/* ---------- SUBHEAD (inner pages — thin breadcrumb bar) ---------- */
.site-subhead{
	background:linear-gradient(180deg, rgba(11,20,38,.55) 0%, rgba(11,20,38,.35) 100%);
	border-top:1px solid rgba(147,166,189,.18);
	border-bottom:1px solid rgba(147,166,189,.18);
	color:#e4ebf5;
}
.subhead-inner{max-width:1320px;margin:0 auto;padding:10px 28px;display:flex;align-items:center;justify-content:flex-start;gap:20px;min-height:36px}
.subhead-crumbs{font-size:11px;color:rgba(228,235,245,.72);font-family:var(--font-display);letter-spacing:.18em;text-transform:uppercase}
.subhead-crumbs a{color:rgba(228,235,245,.72)}
.subhead-crumbs a:hover{color:#f8fbff}
.subhead-crumbs .sep{margin:0 10px;color:var(--gold-300)}
.subhead-crumbs .current{color:#f8fbff;font-weight:600}

/* ---------- SHELL ---------- */
.site-shell{padding:36px 24px 64px}
.shell-inner{max-width:1320px;margin:0 auto}
.shell-inner-page{
	display:grid;
	grid-template-columns:230px minmax(0,1fr);
	gap:22px;
	align-items:start;
}
.sidebar-menu-toggle{margin:0}
.page-sidebar{display:flex;flex-direction:column;gap:14px;min-width:0;position:sticky;top:18px}
.page-content{
	background:var(--cream-50);
	border:1px solid rgba(147,166,189,.4);
	border-radius:4px;
	padding:24px 28px;
	box-shadow:0 8px 22px -16px rgba(11,20,38,.35);
	min-width:0;
	position:relative;
}
.page-content::before{display:none}

/* ---------- PORTAL GRID ---------- */
.portal-grid{
	display:grid;
	grid-template-columns:300px minmax(0,1fr) 320px;
	gap:24px;
	align-items:start;
}
.portal-col{display:flex;flex-direction:column;gap:20px;min-width:0}

/* ---------- CARD BASE ---------- */
.card{
	background:linear-gradient(180deg, var(--cream-50) 0%, var(--cream-100) 100%);
	border:1px solid rgba(100,121,145,.35);
	border-radius:var(--radius-card);
	box-shadow:var(--shadow-card);
	overflow:hidden;
	position:relative;
}
.card::before{
	content:"";position:absolute;inset:0;pointer-events:none;
	border-radius:inherit;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.7), inset 0 0 0 1px rgba(147,166,189,.16);
}

.card-head{
	display:flex;align-items:center;justify-content:space-between;gap:12px;
	padding:13px 18px;
	position:relative;
}
.card-head-cream{
	background:linear-gradient(180deg, #f7f9fc 0%, #e7edf4 100%);
	border-bottom:1px solid rgba(100,121,145,.3);
}
.card-head-dark{
	background:linear-gradient(180deg, var(--navy-800) 0%, var(--navy-900) 100%);
	color:var(--gold-100);
	border-bottom:1px solid rgba(147,166,189,.32);
}
.head-title{font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;margin:0;flex:1;text-align:left}
.card-head-cream .head-title{color:var(--navy-900)}
.card-head-dark .head-title{color:var(--gold-100)}
.head-orn{display:none}
.head-link{font-size:11px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-mute);font-family:var(--font-display);font-weight:600}
.head-link:hover{color:var(--gold-500)}

.card-body{padding:18px}
.card-body-dark{background:linear-gradient(180deg, var(--navy-700) 0%, var(--navy-800) 100%);color:#d7e0ea}

/* ---------- BUTTONS ---------- */
.btn{
	display:inline-flex;align-items:center;justify-content:center;gap:8px;
	padding:11px 22px;font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
	border:1px solid transparent;border-radius:2px;cursor:pointer;
	transition:filter .15s ease, background .15s ease, color .15s ease, transform .15s ease;text-decoration:none;
}
.btn-block{width:100%;display:flex}
.btn-md{padding:12px 22px;font-size:12px}
.btn-lg{padding:14px 26px;font-size:13px}

.btn-gold{
	color:#122033;
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);
	border-color:#4d6178;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(0,0,0,.2);
}
.btn-gold:hover{filter:brightness(1.06);color:#122033}

.btn-ghost{
	color:var(--gold-100);background:transparent;
	border-color:rgba(147,166,189,.45);
}
.btn-ghost:hover{background:rgba(147,166,189,.1);color:var(--gold-50)}

.btn-ghost-dark{
	color:var(--navy-700);background:transparent;
	border-color:rgba(11,20,38,.25);
}
.btn-ghost-dark:hover{background:rgba(11,20,38,.06);color:var(--navy-900)}

.btn-dark{
	color:var(--gold-100);
	background:linear-gradient(180deg, var(--navy-700), var(--navy-900));
	border-color:var(--navy-900);
}
.btn-dark:hover{color:var(--gold-50);filter:brightness(1.1)}

.itemmall-admin-panel{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	margin:14px 0 18px;
	padding:16px 18px;
	background:linear-gradient(180deg, #f7f9fc, #e7edf4);
	border:1px solid rgba(100,121,145,.35);
	border-radius:4px;
	box-shadow:0 8px 22px -16px rgba(11,20,38,.3);
}
.itemmall-admin-panel h3{margin:0 0 4px}
.itemmall-admin-panel p{margin:0;color:var(--ink-soft);font-size:13px}
.itemmall-admin-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}

.admin-action-panel{
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:16px;
	margin:14px 0 18px;
	padding:16px 18px;
	background:linear-gradient(180deg, #f7f9fc, #e7edf4);
	border:1px solid rgba(100,121,145,.35);
	border-left:3px solid var(--gold-300);
	border-radius:4px;
	box-shadow:0 8px 22px -16px rgba(11,20,38,.3);
}
.admin-action-panel h3{margin:0 0 4px}
.admin-action-panel p{margin:0;color:var(--ink-soft);font-size:13px}
.admin-action-links{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.account-actions{display:flex;flex-wrap:wrap;gap:6px;min-width:160px}
.account-actions a{
	display:inline-flex;
	align-items:center;
	padding:5px 8px;
	border:1px solid rgba(100,121,145,.28);
	border-radius:3px;
	background:rgba(251,252,254,.8);
	text-decoration:none;
	font-size:11px;
	white-space:nowrap;
}
.mall-credit-field input{
	border-color:rgba(68,140,92,.45) !important;
	background:#fbfffb !important;
	font-weight:700;
}
.private-hub-grid{
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:10px;
}
.private-hub-item{
	display:flex;
	flex-direction:column;
	gap:4px;
	padding:14px;
	border:1px solid rgba(100,121,145,.3);
	border-radius:4px;
	background:linear-gradient(180deg, #fbfcfe, #eef3f8);
	text-decoration:none;
}
.private-hub-item strong{
	font-family:var(--font-display);
	font-size:12px;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:var(--navy-900);
}
.private-hub-item span{font-size:12px;color:var(--ink-soft);line-height:1.45}
.private-hub-item:hover{background:#fff;border-color:rgba(100,121,145,.5)}

/* ---------- LOGIN PANEL ---------- */
.login-panel .login-form .field{margin-bottom:12px}
.login-form label{display:block;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-200);margin-bottom:6px;font-weight:600}
.login-form input[type=text],.login-form input[type=password]{
	width:100%;padding:11px 14px;
	background:rgba(11,20,38,.55);
	border:1px solid rgba(147,166,189,.32);
	border-radius:10px;
	color:var(--cream-50);font-size:14px;font-family:var(--font-sans);
	transition:all .2s ease;
}
.login-form input:focus{outline:none;border-color:var(--gold-300);background:rgba(11,20,38,.7);box-shadow:0 0 0 3px rgba(147,166,189,.15)}
.login-form input::placeholder{color:rgba(208,217,229,.45)}

.login-actions.stacked{display:flex;flex-direction:column;gap:8px}

.login-links{margin:14px 0 6px;text-align:center;font-size:12px;color:rgba(208,217,229,.72)}
.login-links a{color:var(--gold-200);font-weight:600}
.login-links a:hover{color:var(--gold-100)}
.login-links .divider{margin:0 10px;opacity:.5}

.welcome-block{display:flex;align-items:center;gap:12px;margin-bottom:16px;padding:12px;background:rgba(17,24,39,.4);border-radius:3px;border:1px solid rgba(147,166,189,.22)}
.welcome-avatar{width:38px;height:38px;border-radius:3px;background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);border:1px solid #4d6178;color:#122033;display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-weight:700;font-size:16px;flex-shrink:0;box-shadow:inset 0 1px 0 rgba(255,255,255,.4)}
.welcome-meta{display:flex;flex-direction:column;gap:2px;min-width:0}
.welcome-hi{font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:rgba(208,217,229,.7)}
.welcome-name{font-family:var(--font-display);font-size:16px;color:var(--gold-100)}
.welcome-server{font-size:11px;color:rgba(208,217,229,.5);font-style:italic}

/* ---------- LOGGED-IN LOGINBOX ---------- */
.loginbox-card{margin:12px 0 18px}
.loginbox-greeting{margin:0 0 12px;font-size:13px;line-height:1.5;color:var(--ink)}
.loginbox-greeting a{font-weight:600}
.loginbox-server-select{margin-bottom:12px}
.loginbox-server-select label{display:block;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:6px;font-weight:600;font-family:var(--font-display)}
.loginbox-server-select select{width:100%;padding:8px 12px;border:1px solid rgba(100,121,145,.35);border-radius:3px;background:var(--cream-50);color:var(--ink);font-size:13px;font-family:var(--font-sans)}
.loginbox-admin-menu{margin-top:12px;padding-top:12px;border-top:1px solid rgba(100,121,145,.18);font-size:12px;color:var(--ink-soft)}
.loginbox-admin-menu a{color:var(--gold-500);font-weight:500}
.loginbox-admin-menu a:hover{color:var(--gold-400)}

/* ---------- FORM STYLES ---------- */
.account-form .form-group{margin-bottom:16px}
.form-group{margin-bottom:14px}
.form-group label{display:block;font-family:var(--font-sans);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:6px}
.form-group input.field,.form-group select.field,.form-group textarea.field{
	width:100%;padding:11px 14px;
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.35);
	border-radius:3px;
	color:var(--ink);font-size:13px;font-family:var(--font-sans);
	transition:all .2s ease;
	box-sizing:border-box;
}
.form-group input.field:focus,.form-group select.field:focus,.form-group textarea.field:focus{
	outline:none;border-color:var(--gold-400);
	box-shadow:0 0 0 3px rgba(147,166,189,.15);
}
.form-radio-group{display:flex;gap:16px;align-items:center}
.form-radio-group label{font-size:13px;text-transform:none;letter-spacing:normal;margin:0;display:flex;align-items:center;gap:6px}
.form-error{padding:12px 16px;background:rgba(210,95,95,.12);border:1px solid rgba(210,95,95,.3);border-radius:3px;color:#a83030;font-size:13px;margin-bottom:16px}
.form-help{font-size:12px;color:var(--ink-mute);margin:6px 0 0;font-style:italic}
.form-help a{color:var(--gold-500);font-weight:500}
.form-help a:hover{color:var(--gold-400)}
.form-actions{margin-top:20px}

/* Password rules collapsible */
.password-rules{
	margin:16px 0;
	padding:14px 16px;
	background:rgba(147,166,189,.08);
	border:1px solid rgba(100,121,145,.22);
	border-radius:3px;
}
.password-rules summary{
	cursor:pointer;
	font-family:var(--font-display);
	font-size:12px;
	font-weight:700;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:var(--navy-900);
	user-select:none;
	list-style:none;
}
.password-rules summary::-webkit-details-marker{display:none}
.password-rules summary::before{content:"▸ ";display:inline-block;width:1em;transition:transform .2s ease}
.password-rules[open] summary::before{transform:rotate(90deg)}
.password-rules ul{margin:12px 0 0;padding-left:20px;font-size:12px;line-height:1.6;color:var(--ink-soft)}
.password-rules li{margin-bottom:4px}

/* ---------- SEARCH FORMS ---------- */
.search-grid{
	display:grid;
	grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
	gap:12px;
	margin-bottom:16px;
}
.search-field label{
	display:block;
	font-family:var(--font-sans);
	font-size:11px;
	font-weight:600;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:var(--ink-mute);
	margin-bottom:6px;
}
.search-field input[type=text],.search-field select{
	width:100%;
	padding:9px 12px;
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.35);
	border-radius:3px;
	color:var(--ink);
	font-size:13px;
	font-family:var(--font-sans);
	box-sizing:border-box;
}
.search-field input:focus,.search-field select:focus{
	outline:none;
	border-color:var(--gold-400);
	box-shadow:0 0 0 3px rgba(147,166,189,.15);
}
.search-field-range > div{display:flex;gap:6px}
.search-field-range select{flex:0 0 140px}
.search-field-range input{flex:1;min-width:0}
.search-actions{
	display:flex;
	gap:10px;
	margin-top:16px;
}
@media (max-width: 480px){
	.search-grid{grid-template-columns:1fr}
	.search-actions{flex-direction:column}
	.search-actions .btn{width:100%}
}

/* ---------- PROMO CARD (item mall) ---------- */
.promo-card{
	display:flex;align-items:center;gap:14px;padding:16px 18px;
	background:linear-gradient(135deg, var(--navy-800) 0%, var(--navy-700) 100%);
	color:var(--gold-100);text-decoration:none;
	position:relative;overflow:hidden;
}
.promo-card::after{
	content:"";position:absolute;top:-50%;right:-30%;width:200px;height:200px;border-radius:50%;
	background:radial-gradient(circle, rgba(221,230,240,.18) 0%, transparent 70%);
}
.promo-text{flex:1;display:flex;flex-direction:column;gap:2px;z-index:1}
.promo-text strong{font-family:var(--font-display);font-size:14px;letter-spacing:.1em;text-transform:uppercase;color:var(--gold-100)}
.promo-text span{font-size:12px;color:rgba(208,217,229,.72)}
.promo-arrow{font-size:24px;color:var(--gold-300);z-index:1}
.promo-card:hover{color:var(--gold-100)}
.promo-card:hover .promo-arrow{transform:translateX(4px);transition:transform .2s ease}

/* ---------- GUIDE / DATABASE CARD ---------- */
.gc-glyph{font-size:22px;color:var(--gold-400)}

/* ---------- NEWS CARD (homepage) - duplicate rules removed, kept final definitions below ---------- */

/* ---------- QUICK LINKS (duplicate removed, kept final definition below) ---------- */
.ql-text{display:flex;flex-direction:column;line-height:1.2;min-width:0}
.ql-text strong{font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--navy-900)}
.ql-text em{font-style:normal;font-size:11px;color:var(--ink-mute);margin-top:2px}

/* ---------- STATUS CARD (duplicate removed, kept final definition below) ---------- */
.status-rates{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:10px;
	margin:0 0 14px;
}
.status-rate-box{
	position:relative;
	padding:14px 12px 12px;
	background:linear-gradient(180deg, rgba(17,24,39,.96) 0%, rgba(34,47,69,.96) 100%);
	border:1px solid rgba(147,166,189,.3);
	border-radius:4px;
	box-shadow:0 12px 26px -20px rgba(11,20,38,.72);
	overflow:hidden;
}
.status-rate-box::before{
	content:"";
	position:absolute;
	inset:0 auto auto 0;
	width:100%;
	height:2px;
	background:linear-gradient(90deg, rgba(221,230,240,.9), rgba(147,166,189,.2));
}
.status-rate-label{
	display:block;
	margin-bottom:6px;
	font-size:10px;
	font-weight:700;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:rgba(208,217,229,.72);
}
.status-rate-value{
	display:block;
	font-family:var(--font-display);
	font-size:26px;
	font-weight:700;
	letter-spacing:.04em;
	line-height:1;
	color:var(--gold-100);
	text-shadow:0 3px 14px rgba(0,0,0,.28);
}

/* ---------- MASCOT CARD ---------- */
.mascot-card{
	display:flex;align-items:center;gap:14px;
	padding:16px;
	background:linear-gradient(135deg, #fbfcfe 0%, #dbe3ec 100%);
	color:var(--ink);text-decoration:none;
	border:1px solid rgba(100,121,145,.3);
}
.mascot-card:hover{color:var(--ink);transform:translateY(-1px);box-shadow:0 12px 28px -14px rgba(11,20,38,.4)}
.mascot-figure{position:relative;width:60px;height:60px;flex-shrink:0;display:flex;align-items:center;justify-content:center}
.mascot-body{font-size:36px;color:var(--navy-700);text-shadow:0 4px 8px rgba(11,20,38,.2)}
.mascot-bubble{
	position:absolute;top:-6px;right:-8px;
	width:26px;height:26px;border-radius:50%;
	background:linear-gradient(180deg, #f7faff, var(--gold-300));
	color:var(--navy-900);font-family:var(--font-display);font-weight:700;
	display:flex;align-items:center;justify-content:center;
	box-shadow:0 4px 10px -4px rgba(147,166,189,.45);
	border:1px solid var(--gold-400);
	animation:bubble 3s ease-in-out infinite;
}
@keyframes bubble{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
.mascot-text{display:flex;flex-direction:column;gap:2px}
.mascot-text strong{font-family:var(--font-display);font-size:14px;color:var(--navy-900);letter-spacing:.04em}
.mascot-text span{font-size:12px;color:var(--ink-soft);font-style:italic;font-family:var(--font-serif)}

/* ---------- FOOTER ---------- */
.site-footer{
	margin-top:60px;
	background:linear-gradient(180deg, var(--navy-800) 0%, var(--navy-900) 100%);
	color:rgba(208,217,229,.76);
	position:relative;
}
.footer-ornament{
	height:1px;
	background:rgba(147,166,189,.35);
}
.footer-inner{
	max-width:1320px;margin:0 auto;padding:48px 24px 32px;
	display:grid;grid-template-columns:1.2fr 2fr 1fr;gap:40px;
}
.footer-extra{display:flex;flex-direction:column;gap:18px}
.footer-mark{display:flex;align-items:center;margin-bottom:14px}
.footer-mark img.footer-logo{height:auto;width:auto;max-height:120px;max-width:280px;object-fit:contain;filter:drop-shadow(0 4px 14px rgba(0,0,0,.5))}
.footer-mark-text{display:flex;flex-direction:column}
.footer-mark-text strong{font-family:var(--font-display);font-size:16px;color:var(--gold-100);letter-spacing:.1em;text-transform:uppercase}
.footer-mark-text span{font-size:11px;color:rgba(208,217,229,.5);font-style:italic;font-family:var(--font-serif)}
.footer-blurb{font-family:var(--font-serif);font-size:13px;line-height:1.6;color:rgba(208,217,229,.6);max-width:340px;margin:0}

.footer-cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.footer-col h5{font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-200);margin:0 0 14px;padding-bottom:8px;border-bottom:1px solid rgba(147,166,189,.2)}
.footer-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.footer-col li a{color:rgba(208,217,229,.76);font-size:13px;transition:color .15s ease}
.footer-col li a:hover{color:var(--gold-100)}

.footer-extra h5{font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--gold-200);margin:0 0 12px;padding-bottom:8px;border-bottom:1px solid rgba(147,166,189,.2)}
.footer-pref{display:flex;flex-direction:column;gap:6px}
.footer-pref label{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-200);font-weight:600}
.footer-pref select{background:rgba(17,24,39,.5);color:var(--cream-50);border:1px solid rgba(147,166,189,.3);border-radius:3px;padding:8px 10px;font-size:12px}

.footer-meta{
	border-top:1px solid rgba(147,166,189,.18);
	background:var(--navy-900);
}
.footer-meta-inner{
	max-width:1320px;margin:0 auto;padding:14px 24px;
	display:flex;flex-wrap:wrap;justify-content:center;gap:6px;
	font-size:11px;letter-spacing:.06em;color:rgba(208,217,229,.56);
}
.footer-meta-inner .dot{color:var(--gold-400)}

/* ---------- LEGACY FLUX TABLES (basic compat) ---------- */
table#sidebar,table#admin_sidebar,table.task-admin-sidebar{width:100%;border-collapse:collapse;background:var(--cream-50);border:1px solid rgba(100,121,145,.35);border-radius:4px;overflow:hidden;box-shadow:0 8px 22px -16px rgba(11,20,38,.35);margin-bottom:0}
table#admin_sidebar,table.task-admin-sidebar{margin-bottom:18px}
/* sidebar gifs collapse */
table#sidebar tr:first-child,table#admin_sidebar tr:first-child,
table#sidebar tr:last-child,table#admin_sidebar tr:last-child{display:none}
table#sidebar img,table#admin_sidebar img,table.task-admin-sidebar img{display:none}
th.menuitem{background:linear-gradient(180deg, var(--navy-800), var(--navy-900));color:var(--gold-100);font-family:var(--font-display);font-size:11px;letter-spacing:.18em;text-transform:uppercase;padding:11px 14px;text-align:left;border-bottom:1px solid rgba(147,166,189,.4)}
td.menuitem{padding:0;border-bottom:1px solid rgba(100,121,145,.16);background:var(--cream-50)}
td.menuitem a{display:block;padding:10px 14px;color:var(--ink-soft);font-size:12px;font-weight:500;letter-spacing:.04em;transition:background .15s ease, color .15s ease}
td.menuitem a:hover{background:rgba(147,166,189,.12);color:var(--navy-900)}
td.menuitem a span{display:block}

table#admin_sidebar th.menuitem,table.task-admin-sidebar th.menuitem{background:linear-gradient(180deg, #5a2a2a, #3a1a1a);border-bottom-color:rgba(196,106,58,.6)}

#loginbox{background:var(--cream-50);color:var(--ink);border-radius:4px;overflow:hidden;border:1px solid rgba(100,121,145,.35);border-left:3px solid var(--gold-300);margin:0 0 18px;box-shadow:0 8px 22px -16px rgba(11,20,38,.25)}
#loginbox tr:first-child,#loginbox tr:last-child{display:none}
#loginbox td{padding:12px 18px;background:transparent !important;color:var(--ink-soft);font-size:13px;line-height:1.55}
#loginbox td:first-child,#loginbox td:last-child{display:none}
#loginbox img{display:none}
#loginbox a{color:var(--navy-800);font-weight:600;border-bottom:1px solid rgba(100,121,145,.42);transition:color .15s ease, border-color .15s ease}
#loginbox a:hover{color:var(--navy-900);border-bottom-color:var(--gold-300)}
#loginbox strong{color:var(--navy-900)}
#loginbox strong a{color:var(--navy-900);border-bottom-color:rgba(100,121,145,.5)}
#loginbox strong a:hover{color:var(--navy-900);border-bottom-color:var(--gold-300)}
#loginbox .loginbox-admin-menu{
	font-family:var(--font-display);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
	border-top:1px solid rgba(100,121,145,.2);
	padding:10px 18px;
	background:linear-gradient(180deg, #f7f9fc, #e7edf4) !important;
	color:var(--navy-900);
	display:flex;flex-wrap:wrap;align-items:center;gap:6px;
}
#loginbox .loginbox-admin-menu strong{color:var(--navy-900);margin-right:6px;letter-spacing:.18em}
#loginbox .loginbox-admin-menu a{
	display:inline-flex;align-items:center;
	padding:5px 10px;
	color:var(--navy-800);
	background:rgba(251,252,254,.9);
	border:1px solid rgba(100,121,145,.35);
	border-radius:3px;
	text-decoration:none;
	font-weight:600;letter-spacing:.12em;
	transition:background .15s ease, border-color .15s ease, color .15s ease;
}
#loginbox .loginbox-admin-menu a:hover{background:var(--navy-900);color:var(--gold-100);border-color:var(--navy-900)}

/* submenu / pagemenu */
ul.submenu,ul.pagemenu,.submenu,.pagemenu{list-style:none;margin:0 0 18px;padding:8px 12px;display:flex;flex-wrap:wrap;align-items:center;gap:6px;background:linear-gradient(180deg, #f7f9fc, #e7edf4);border:1px solid rgba(100,121,145,.35);border-left:3px solid var(--gold-300);border-radius:4px;font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
ul.submenu li,ul.pagemenu li{margin:0}
ul.submenu a,ul.pagemenu a,.submenu a,.pagemenu a{
	display:inline-flex;align-items:center;
	padding:6px 12px;
	color:var(--navy-800);
	background:rgba(251,252,254,.9);
	border:1px solid rgba(100,121,145,.35);
	border-radius:3px;
	text-decoration:none;
	font-weight:600;letter-spacing:.12em;
	transition:background .15s ease, border-color .15s ease, color .15s ease;
}
ul.submenu a:hover,ul.pagemenu a:hover{background:var(--navy-900);color:var(--gold-100);border-color:var(--navy-900)}
ul.submenu li.current a,ul.pagemenu li.current a,ul.submenu a.current,ul.pagemenu a.current{background:var(--navy-900);color:var(--gold-100);border-color:var(--navy-900)}

/* generic flux table styling */
table.horizontal-table,table.vertical-table{width:100%;border-collapse:separate;border-spacing:0;background:var(--cream-50);border-radius:4px;overflow:hidden;box-shadow:0 8px 22px -16px rgba(11,20,38,.3);margin:14px 0;border:1px solid rgba(100,121,145,.35)}
table.horizontal-table th,table.vertical-table th{background:linear-gradient(180deg, #f7f9fc, #e7edf4);color:var(--navy-900);font-family:var(--font-display);font-size:11px;letter-spacing:.16em;text-transform:uppercase;padding:10px 14px;text-align:left;border-bottom:1px solid rgba(100,121,145,.35)}
table.horizontal-table td,table.vertical-table td{padding:10px 14px;border-bottom:1px solid rgba(100,121,145,.16);font-size:13px;color:var(--ink-soft)}
table.horizontal-table tr:last-child td,table.vertical-table tr:last-child td{border-bottom:0}
table.horizontal-table tr:hover td{background:rgba(147,166,189,.08)}
.ranking-table .top-ranked td{background:rgba(221,230,240,.22);font-weight:600}
.ranking-table .empty-row td{background:rgba(147,166,189,.04);color:var(--ink-mute);font-style:italic}

/* FluxCP paginator */
.info-text{
	display:block;
	width:fit-content;
	max-width:100%;
	margin:12px 0 14px;
	padding:9px 12px;
	background:rgba(147,166,189,.08);
	border:1px solid rgba(100,121,145,.22);
	border-left:3px solid var(--gold-300);
	border-radius:4px;
	color:var(--ink-soft);
	font-size:12px;
	line-height:1.45;
}
.pages{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:6px;
	margin:18px 0 8px;
	padding:10px;
	background:linear-gradient(180deg, #f7f9fc, #e7edf4);
	border:1px solid rgba(100,121,145,.35);
	border-left:3px solid var(--gold-300);
	border-radius:4px;
	box-shadow:0 8px 22px -16px rgba(11,20,38,.28);
	font-size:0;
}
.pages a,
.page-content .pages a{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:34px;
	height:34px;
	padding:0 10px;
	background:rgba(251,252,254,.92);
	border:1px solid rgba(100,121,145,.34);
	border-radius:3px;
	color:var(--navy-800);
	font-family:var(--font-display);
	font-size:11px;
	font-weight:700;
	letter-spacing:.08em;
	line-height:1;
	text-decoration:none;
	text-transform:uppercase;
	transition:background .15s ease, border-color .15s ease, color .15s ease, transform .15s ease;
}
.pages a[href]:hover,
.page-content .pages a[href]:hover{
	background:var(--navy-900);
	border-color:var(--navy-900);
	color:var(--gold-100);
	transform:translateY(-1px);
}
.pages .current-page,
.page-content .pages .current-page{
	background:linear-gradient(180deg, var(--navy-800), var(--navy-900));
	border-color:var(--navy-900);
	color:var(--gold-100);
	cursor:default;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
}
.pages .page-prev,
.pages .page-next{
	min-width:auto;
	padding:0 14px;
	letter-spacing:.14em;
}
.jump-to-page{
	margin:8px 0 18px;
	padding:10px 12px;
	background:rgba(147,166,189,.07);
	border:1px solid rgba(100,121,145,.18);
	border-radius:4px;
	color:var(--ink-soft);
	font-size:12px;
}
.jump-to-page label{
	display:inline-flex;
	align-items:center;
	flex-wrap:wrap;
	gap:8px;
	margin:0;
	font-family:var(--font-display);
	font-size:11px;
	font-weight:700;
	letter-spacing:.12em;
	text-transform:uppercase;
	color:var(--navy-800);
}
.jump-to-page input{
	width:68px;
	max-width:68px;
	padding:7px 9px;
	border:1px solid rgba(100,121,145,.35);
	border-radius:3px;
	background:var(--cream-50);
	color:var(--ink);
	font-family:var(--font-sans);
	font-size:13px;
	text-align:center;
}
.page-jump-button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-height:33px;
	padding:7px 14px;
	border-radius:3px;
	font-size:11px;
	letter-spacing:.12em;
}
table.horizontal-table th a.sortable,
.page-content table th a.sortable{
	display:inline-flex;
	align-items:center;
	gap:4px;
	color:var(--navy-900);
	text-decoration:none;
	text-decoration-color:transparent;
}
table.horizontal-table th a.sortable:hover,
.page-content table th a.sortable:hover{
	color:var(--gold-500);
	text-decoration:none;
}

/* =============================================================
   PAGE CONTENT — typography, forms, tables, buttons, alerts
   Applies inside .page-content (inner pages) only.
   ============================================================= */

/* Inner-page headings */
.page-content > h1,
.page-content > h2,
.page-content > h3,
.page-content > h4{
	font-family:var(--font-display);
	color:var(--navy-900);
	letter-spacing:.04em;
	margin:0 0 14px;
	position:relative;
	padding-bottom:10px;
}
.page-content > h1{font-size:24px;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.page-content > h2{font-size:18px;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.page-content > h3{font-size:14px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--navy-800);margin-top:24px}
.page-content > h4{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--navy-700);margin-top:18px}
.page-content > h1::after,
.page-content > h2::after{
	content:"";position:absolute;left:0;bottom:0;height:1px;width:48px;
	background:var(--gold-400);
}
.page-content > h3::after{display:none}
.page-content > p{font-family:var(--font-sans);font-size:14px;line-height:1.65;color:var(--ink-soft);margin:0 0 12px}
.page-content > p strong{color:var(--navy-900)}
.page-content a{color:var(--navy-700);font-weight:600;text-decoration:underline;text-decoration-color:rgba(100,121,145,.34);text-underline-offset:2px}
.page-content a:hover{color:var(--gold-500);text-decoration-color:var(--gold-300)}
.page-content hr{border:0;height:1px;background:linear-gradient(90deg, transparent, rgba(100,121,145,.32), transparent);margin:20px 0}
.page-content ul:not(.submenu):not(.pagemenu),
.page-content ol{padding-left:22px;margin:8px 0 14px;color:var(--ink-soft)}
.page-content li{margin:4px 0}
.page-content code{background:rgba(11,20,38,.06);padding:1px 6px;border-radius:4px;font-size:12px;color:var(--navy-800);font-family:Consolas,Monaco,monospace}

/* Generic form layout (FluxCP standard `generic-form-table`) */
.page-content .generic-form,
.page-content form{margin:0 0 18px}
table.generic-form-table,
.generic-form-div table{
	width:100%;border-collapse:collapse;
	background:transparent;
	margin:8px 0 16px;
	border:0;
}
table.generic-form-table th,
.generic-form-div table th{
	text-align:left;
	font-family:var(--font-display);font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
	color:var(--navy-700);
	padding:10px 16px 10px 0;
	vertical-align:top;
	background:transparent;
	border:0;
	width:32%;
	white-space:nowrap;
}
table.generic-form-table td,
.generic-form-div table td{
	padding:8px 0;vertical-align:top;border:0;background:transparent;
	font-size:13px;color:var(--ink-soft);
}
table.generic-form-table label,
.generic-form-div label{font-weight:600;color:var(--navy-700)}
table.generic-form-table tr:hover td,
.generic-form-div table tr:hover td{background:transparent}

/* Inputs / selects / textareas */
.page-content input[type=text],
.page-content input[type=password],
.page-content input[type=email],
.page-content input[type=number],
.page-content input[type=search],
.page-content input[type=url],
.page-content input[type=tel],
.page-content input[type=date],
.page-content select,
.page-content textarea{
	width:100%;max-width:360px;
	padding:9px 12px;
	font-family:var(--font-sans);font-size:13px;
	color:var(--ink);
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.35);
	border-radius:3px;
	box-shadow:inset 0 1px 2px rgba(11,20,38,.04);
	transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}
.page-content textarea{min-height:120px;max-width:100%;resize:vertical;line-height:1.55}
.page-content select{padding-right:28px;cursor:pointer;background-image:linear-gradient(45deg, transparent 50%, var(--navy-700) 50%),linear-gradient(135deg, var(--navy-700) 50%, transparent 50%);background-position:calc(100% - 14px) 50%, calc(100% - 9px) 50%;background-size:5px 5px;background-repeat:no-repeat;-webkit-appearance:none;appearance:none}
.page-content input:focus,
.page-content select:focus,
.page-content textarea:focus{outline:none;border-color:var(--gold-300);background:#fff;box-shadow:0 0 0 3px rgba(147,166,189,.18)}
.page-content input[type=checkbox],
.page-content input[type=radio]{width:auto;margin-right:6px;accent-color:var(--gold-400)}
.page-content input[disabled],
.page-content select[disabled],
.page-content textarea[disabled]{opacity:.55;cursor:not-allowed;background:rgba(100,121,145,.06)}

/* Buttons (input/button) */
.page-content button,
.page-content input[type=submit],
.page-content input[type=button],
.page-content input[type=reset]{
	display:inline-flex;align-items:center;justify-content:center;gap:6px;
	padding:11px 22px;
	font-family:var(--font-display);font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;
	color:#122033;
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);
	border:1px solid #4d6178;border-radius:2px;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.5), inset 0 -1px 0 rgba(0,0,0,.2);
	cursor:pointer;
	transition:filter .15s ease, background .15s ease, color .15s ease;
	text-decoration:none;
}
.page-content button:hover,
.page-content input[type=submit]:hover,
.page-content input[type=button]:hover,
.page-content input[type=reset]:hover{filter:brightness(1.06)}
.page-content input[type=reset]{
	background:transparent;color:var(--navy-700);border-color:rgba(17,24,39,.22);box-shadow:none;
}
.page-content input[type=reset]:hover{background:rgba(17,24,39,.06);box-shadow:none;filter:none}
.page-content button strong{font-weight:700}

/* Alerts: .red, .warning, .info, .error, .message, .success */
.page-content .red,
.page-content p.red{color:#a83030;font-weight:600}
.page-content .warning,
.page-content .info,
.page-content .error,
.page-content .message,
.page-content .success,
.page-content > div.warning,
.page-content > div.info,
.page-content > div.error,
.page-content > div.success{
	display:block;margin:0 0 16px;
	padding:12px 16px 12px 44px;
	border-radius:3px;
	font-size:13px;line-height:1.5;
	border:1px solid;
	position:relative;
	background-repeat:no-repeat;background-position:14px center;
}
.page-content .warning,
.page-content > div.warning{background-color:#fff5d9;border-color:#e6c870;color:#7a5510}
.page-content .info,
.page-content > div.info,
.page-content .message{background-color:#e9f2fb;border-color:#9bc1e5;color:#1f4878}
.page-content .error,
.page-content > div.error{background-color:#fbe6e6;border-color:#e58c8c;color:#8a2424}
.page-content .success,
.page-content > div.success{background-color:#e3f4e3;border-color:#8ec98e;color:#235c23}
.page-content .warning::before{content:"⚠";position:absolute;left:14px;top:11px;font-size:18px;line-height:1}
.page-content .info::before,.page-content .message::before{content:"ℹ";position:absolute;left:16px;top:11px;font-size:16px;font-weight:700}
.page-content .error::before{content:"✕";position:absolute;left:16px;top:11px;font-size:14px;font-weight:700}
.page-content .success::before{content:"✓";position:absolute;left:16px;top:11px;font-size:16px;font-weight:700}

/* Captcha + misc */
.page-content .security-code{display:inline-block;margin-bottom:8px;padding:6px;background:#fff;border:1px solid rgba(100,121,145,.3);border-radius:8px}
.page-content .security-code img{display:block;max-height:50px}
.page-content .no-recaptcha{padding:10px 12px;background:#fbe6e6;border:1px solid #e58c8c;border-radius:8px;color:#8a2424 !important;font-size:12px}
.page-content .action{margin-top:6px;font-size:12px}
.page-content p.important,
.page-content .important{color:var(--navy-900);font-weight:700}

/* Generic table fallback (modules that just use bare <table>) */
.page-content table:not(.generic-form-table):not(.horizontal-table):not(.vertical-table):not(#loginbox):not(#sidebar):not(#admin_sidebar){
	width:100%;border-collapse:separate;border-spacing:0;
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.35);
	border-radius:4px;overflow:hidden;
	margin:12px 0;
	box-shadow:0 8px 22px -16px rgba(11,20,38,.3);
	font-size:13px;
}
.page-content table:not(.generic-form-table):not(.horizontal-table):not(.vertical-table):not(#loginbox):not(#sidebar):not(#admin_sidebar) th{
	background:linear-gradient(180deg, #f7f9fc 0%, #e7edf4 100%);
	color:var(--navy-900);
	font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
	padding:10px 14px;text-align:left;
	border-bottom:1px solid rgba(100,121,145,.35);
}
.page-content table:not(.generic-form-table):not(.horizontal-table):not(.vertical-table):not(#loginbox):not(#sidebar):not(#admin_sidebar) td{
	padding:9px 14px;
	border-bottom:1px solid rgba(100,121,145,.16);
	color:var(--ink-soft);
	vertical-align:middle;
}
.page-content table:not(.generic-form-table):not(.horizontal-table):not(.vertical-table):not(#loginbox):not(#sidebar):not(#admin_sidebar) tr:last-child td{border-bottom:0}
.page-content table:not(.generic-form-table):not(.horizontal-table):not(.vertical-table):not(#loginbox):not(#sidebar):not(#admin_sidebar) tbody tr:hover td{background:rgba(147,166,189,.08)}

/* Submenu / Pagemenu (div-based) */
#submenu,#pagemenu{
	display:flex;flex-wrap:wrap;align-items:center;gap:6px;
	margin:0 0 18px;padding:8px 12px;
	background:linear-gradient(180deg, #f7f9fc, #e7edf4);
	border:1px solid rgba(100,121,145,.35);
	border-left:3px solid var(--gold-300);
	border-radius:4px;
	font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;
	color:var(--navy-900);
}
#submenu a,#pagemenu a{
	display:inline-flex;align-items:center;
	padding:6px 12px;
	color:var(--navy-800);
	background:rgba(251,252,254,.9);
	border:1px solid rgba(100,121,145,.35);
	border-radius:3px;
	text-decoration:none;
	font-weight:600;letter-spacing:.12em;
	transition:background .15s ease, border-color .15s ease, color .15s ease;
}
#submenu a:hover,#pagemenu a:hover{background:var(--navy-900);color:var(--gold-100);border-color:var(--navy-900)}
#submenu a.current-sub-menu,
#pagemenu a.current{background:var(--navy-900);color:var(--gold-100);border-color:var(--navy-900)}

/* Loginbox legacy table — corner gif cells already collapsed via :first-child/:last-child rules above. Keep select consistent. */
#loginbox select{background:var(--cream-50);color:var(--navy-900);border:1px solid rgba(100,121,145,.35);border-radius:3px;padding:4px 8px;font-size:12px}

/* Sidebar improvements — smaller padding, better hit area */
.page-sidebar table#sidebar a span,
.page-sidebar table#admin_sidebar a span,
.page-sidebar table.task-admin-sidebar a span{display:block;white-space:normal;word-wrap:break-word}
.mobile-panel-backdrop{
	display:none;
	position:fixed;
	inset:0;
	background:rgba(7,12,21,.68);
	opacity:0;
	pointer-events:none;
	transition:opacity .18s ease;
	z-index:55;
}
.mobile-panel-backdrop.is-visible{
	display:block;
	opacity:1;
	pointer-events:auto;
}

/* Help bubble (?) used in account create page */
.page-content strong[title]{
	display:inline-flex;align-items:center;justify-content:center;
	width:18px;height:18px;border-radius:50%;
	background:var(--navy-700);color:var(--gold-100);
	font-size:11px;cursor:help;margin-left:6px;
	vertical-align:middle;
}

/* Inline radio/checkbox label rows */
.page-content label input[type=radio],
.page-content label input[type=checkbox]{margin-right:4px}
.page-content td label{margin-right:14px;display:inline-flex;align-items:center}

/* Date field (<select>×3) — keep them inline */
.page-content td select + select{margin-left:6px}

/* Shared search forms */
.page-content .toggler{
	margin:0 0 10px;
}
.page-content .toggler a{
	display:inline-flex;
	align-items:center;
	padding:7px 12px;
	background:linear-gradient(180deg, #f7f9fc, #e7edf4);
	border:1px solid rgba(100,121,145,.3);
	border-radius:3px;
	text-decoration:none;
	font-family:var(--font-display);
	font-size:11px;
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
}
.page-content form.search-form{
	padding:14px 16px;
	background:linear-gradient(180deg, #f9fbfd 0%, #eef3f8 100%);
	border:1px solid rgba(100,121,145,.28);
	border-radius:4px;
	margin:0 0 18px;
}
.page-content form.search-form p{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:8px 12px;
	margin:0 0 10px;
}
.page-content form.search-form p:last-child{margin-bottom:0}
.page-content form.search-form label{
	font-family:var(--font-display);
	font-size:10px;
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:var(--navy-700);
}
.page-content form.search-form input[type=text],
.page-content form.search-form input[type=search],
.page-content form.search-form select{
	max-width:220px;
}

/* Who's Online page */
.page-content .online-intro{
	margin:0 0 16px;
	font-size:15px;
	color:var(--ink-soft);
}
.page-content .online-summary{
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:12px;
	margin:0 0 18px;
}
.page-content .online-summary-card{
	padding:14px 16px;
	background:linear-gradient(180deg, #f7f9fc 0%, #edf2f8 100%);
	border:1px solid rgba(100,121,145,.28);
	border-left:3px solid var(--gold-300);
	border-radius:4px;
	box-shadow:0 8px 20px -18px rgba(11,20,38,.3);
}
.page-content .online-summary-label{
	display:block;
	margin-bottom:6px;
	font-family:var(--font-display);
	font-size:10px;
	font-weight:700;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:var(--ink-mute);
}
.page-content .online-summary-value{
	display:block;
	font-family:var(--font-display);
	font-size:22px;
	font-weight:700;
	color:var(--navy-900);
	line-height:1.1;
}
.page-content .online-summary-server{
	font-size:16px;
	letter-spacing:.04em;
}
.page-content .online-toggler{
	margin:0 0 10px;
}
.page-content .online-toggler a{
	display:inline-flex;
	align-items:center;
	padding:7px 12px;
	background:linear-gradient(180deg, #f7f9fc, #e7edf4);
	border:1px solid rgba(100,121,145,.3);
	border-radius:3px;
	text-decoration:none;
	font-family:var(--font-display);
	font-size:11px;
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
}
.page-content .online-search-form{
	padding:14px 16px;
	background:linear-gradient(180deg, #f9fbfd 0%, #eef3f8 100%);
	border:1px solid rgba(100,121,145,.28);
	border-radius:4px;
	margin:0 0 18px;
}
.page-content .online-search-grid{
	display:grid;
	grid-template-columns:repeat(3, minmax(0, 1fr));
	gap:12px 14px;
	align-items:end;
}
.page-content .online-search-field{
	min-width:0;
}
.page-content .online-search-field label{
	display:block;
	margin-bottom:6px;
	font-family:var(--font-display);
	font-size:10px;
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:var(--navy-700);
}
.page-content .online-search-field input{
	max-width:none;
}
.page-content .online-search-actions{
	display:flex;
	gap:8px;
	flex-wrap:wrap;
	align-items:center;
}
.page-content .online-meta{
	margin:0 0 10px;
	font-size:12px;
	color:var(--ink-mute);
}
.page-content .online-hidden-note{
	margin:0 0 16px;
	padding:10px 12px;
	background:rgba(147,166,189,.08);
	border:1px solid rgba(100,121,145,.18);
	border-radius:4px;
	color:var(--ink-soft);
}
.page-content .online-table{
	border-radius:4px;
	overflow:hidden;
}
.page-content .online-table th{
	padding-top:11px;
	padding-bottom:11px;
}
.page-content .online-table td{
	padding-top:12px;
	padding-bottom:12px;
}
.page-content .online-table .online-char{
	font-weight:700;
	color:var(--navy-900);
}
.page-content .online-table .online-char a{
	color:var(--navy-900);
	text-decoration:none;
}
.page-content .online-table .online-char a:hover{
	color:var(--gold-500);
}
.page-content .online-name{
	display:inline-block;
	font-family:var(--font-display);
	font-size:14px;
	letter-spacing:.03em;
}
.page-content .online-job{
	display:inline-block;
	padding:5px 9px;
	background:rgba(147,166,189,.1);
	border:1px solid rgba(100,121,145,.18);
	border-radius:999px;
	font-size:12px;
	font-weight:600;
	color:var(--navy-800);
	white-space:nowrap;
}
.page-content .online-level-badge,
.page-content .online-map-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:5px 9px;
	border-radius:999px;
	font-size:11px;
	font-weight:700;
	letter-spacing:.06em;
	text-transform:uppercase;
}
.page-content .online-level-badge{
	background:linear-gradient(180deg, #f7f9fc 0%, #e7edf4 100%);
	border:1px solid rgba(100,121,145,.22);
	color:var(--navy-800);
}
.page-content .online-map-badge{
	background:rgba(17,24,39,.06);
	border:1px solid rgba(100,121,145,.18);
	color:var(--navy-900);
}
.page-content .online-guild-emblem{
	width:42px;
	text-align:center;
}
.page-content .online-guild-emblem img{
	display:block;
	width:24px;
	height:24px;
	margin:0 auto;
	border-radius:3px;
	box-shadow:0 4px 10px -7px rgba(11,20,38,.45);
}
.page-content .online-guild,
.page-content .online-map{
	color:var(--ink-soft);
}
.page-content .online-guild a{
	font-weight:700;
	text-decoration:none;
}
.page-content .online-guild-empty{
	color:var(--ink-mute);
}
.page-content .online-empty{
	padding:18px;
	background:rgba(147,166,189,.06);
	border:1px solid rgba(100,121,145,.18);
	border-radius:4px;
}

/* Server info class matrix */
.page-content .job-classes{
	width:100%;
	table-layout:fixed;
	border-collapse:separate;
	border-spacing:0;
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.35);
	border-radius:4px;
	overflow:hidden;
	box-shadow:0 8px 22px -16px rgba(11,20,38,.24);
}
.page-content .job-classes th label{
	display:block;
}
.page-content .job-classes th,
.page-content .job-classes td{
	width:10%;
	padding:10px 12px;
	border-right:1px solid rgba(100,121,145,.12);
	border-bottom:1px solid rgba(100,121,145,.12);
	vertical-align:middle;
}
.page-content .job-classes th{
	background:linear-gradient(180deg, #f7f9fc 0%, #eef3f8 100%);
	white-space:normal;
	font-size:10px;
	letter-spacing:.12em;
	line-height:1.35;
}
.page-content .job-classes td{
	background:rgba(251,252,254,.92);
	text-align:center;
}
.page-content .job-classes p{
	margin:0;
}
.page-content .job-classes .important{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:34px;
	padding:4px 8px;
	border-radius:999px;
	background:rgba(147,166,189,.12);
	color:var(--navy-900);
	font-weight:700;
}
.page-content .job-classes tr:last-child th,
.page-content .job-classes tr:last-child td{
	border-bottom:0;
}
.page-content .job-classes th:last-child,
.page-content .job-classes td:last-child{
	border-right:0;
}

/* Monster view clarity */
.page-content .monster-sprite-cell{
	width:190px;
	padding:14px !important;
	background:linear-gradient(180deg, #f7f9fc 0%, #edf2f8 100%);
	vertical-align:middle;
}
.page-content .monster-sprite-frame{
	display:flex;
	align-items:center;
	justify-content:center;
	min-height:220px;
	padding:16px;
	border:1px solid rgba(100,121,145,.22);
	border-radius:4px;
	background:
		radial-gradient(circle at 50% 35%, rgba(147,166,189,.18) 0%, rgba(147,166,189,.08) 38%, transparent 72%),
		linear-gradient(180deg, rgba(255,255,255,.95) 0%, rgba(238,242,247,.96) 100%);
	box-shadow:inset 0 1px 0 rgba(255,255,255,.7);
}
.page-content .monster-sprite-image{
	display:block;
	max-width:100%;
	max-height:200px;
	width:auto;
	height:auto;
	image-rendering:auto;
	filter:drop-shadow(0 10px 18px rgba(17,24,39,.18));
}

/* Monster database */
/* Monster table inherits the standard .horizontal-table look; only semantic
   cues (MVP rows, custom flag) get distinct styling so it stays cohesive
   with the item / ranking / character tables. */
.page-content .monster-db-table .monster-db-id{text-align:right;white-space:nowrap}
.page-content .monster-db-table .monster-db-id a,
.page-content .monster-db-table .monster-db-name a{text-decoration:none;font-weight:600}
.page-content .monster-db-table .monster-db-subtle{color:var(--ink-mute);font-size:11px;margin-left:4px}
.page-content .monster-db-table tr.is-mvp td{background:rgba(212,168,83,.08)}
.page-content .monster-db-table tr.is-mvp:hover td{background:rgba(212,168,83,.15)}

/* Shared yes/no chip — used by item For-Sale, monster Custom, and any other
   boolean column in the page tables. */
.chip-yes,.chip-no,
.for-sale.yes,.for-sale.no,
.monster-db-custom-yes,.monster-db-custom-no,
.mvp,.monster-db-mvp{
	display:inline-flex;align-items:center;justify-content:center;
	min-width:38px;padding:3px 9px;border-radius:999px;
	font-family:var(--font-display);font-size:10px;font-weight:700;
	letter-spacing:.12em;text-transform:uppercase;line-height:1.4;
	border:1px solid transparent;
}
.chip-yes,.for-sale.yes,.monster-db-custom-yes{background:rgba(68,140,92,.14);color:#2b6b42;border-color:rgba(68,140,92,.28)}
.chip-no,.for-sale.no,.monster-db-custom-no{background:rgba(100,121,145,.12);color:var(--ink-mute);border-color:rgba(100,121,145,.22)}
.for-sale.yes a{color:inherit;text-decoration:none}
.mvp,.monster-db-mvp{background:rgba(180,60,52,.14);color:#a13a2c;border-color:rgba(180,60,52,.3);margin-right:6px}

/* Monster detail */
.page-content .monster-view-hero{
	display:grid;
	grid-template-columns:minmax(220px, 280px) minmax(0, 1fr);
	gap:18px;
	align-items:stretch;
	margin:0 0 18px;
}
.page-content .monster-view-hero-meta{
	display:flex;
	flex-direction:column;
	gap:12px;
}
.page-content .monster-sprite-frame-top{
	min-height:260px;
	height:100%;
}
.page-content .monster-badges{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
}
.page-content .monster-badge{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:6px 10px;
	border-radius:999px;
	background:linear-gradient(180deg, #f7f9fc 0%, #e7edf4 100%);
	border:1px solid rgba(100,121,145,.22);
	font-size:11px;
	font-weight:700;
	color:var(--navy-900);
}
.page-content .monster-badge-mvp{
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 100%);
	color:#122033;
	border-color:#5b6e85;
}
.page-content .monster-spotlight-grid{
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	gap:10px;
}
.page-content .monster-spotlight-card{
	padding:14px 16px;
	background:linear-gradient(180deg, #f7f9fc 0%, #edf2f8 100%);
	border:1px solid rgba(100,121,145,.24);
	border-radius:4px;
	box-shadow:0 8px 18px -18px rgba(11,20,38,.3);
}
.page-content .monster-spotlight-label{
	display:block;
	margin-bottom:6px;
	font-family:var(--font-display);
	font-size:10px;
	font-weight:700;
	letter-spacing:.16em;
	text-transform:uppercase;
	color:var(--ink-mute);
}
.page-content .monster-spotlight-value{
	display:block;
	font-family:var(--font-display);
	font-size:20px;
	font-weight:700;
	color:var(--navy-900);
	line-height:1.1;
}
.page-content .monster-view-table th{
	width:22%;
}
.page-content .monster-view-table .monster-mode{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin:0;
	padding:0;
	list-style:none;
}
.page-content .monster-view-table .monster-mode li{
	margin:0;
	padding:6px 10px;
	border-radius:999px;
	background:rgba(147,166,189,.1);
	border:1px solid rgba(100,121,145,.18);
	font-size:11px;
	font-weight:700;
	color:var(--navy-800);
}
.page-content .monster-view-table .character-stats{
	width:100%;
	border-collapse:separate;
	border-spacing:0;
	background:rgba(251,252,254,.92);
	border:1px solid rgba(100,121,145,.2);
	border-radius:4px;
	overflow:hidden;
}
.page-content .monster-view-table .character-stats td{
	padding:10px 12px;
	border-bottom:1px solid rgba(100,121,145,.12);
	border-right:1px solid rgba(100,121,145,.12);
}
.page-content .monster-view-table .character-stats tr:last-child td{
	border-bottom:0;
}
.page-content .monster-view-table .character-stats td:last-child{
	border-right:0;
}
.page-content .monster-view-table .stat-name{
	display:block;
	font-family:var(--font-display);
	font-size:10px;
	font-weight:700;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:var(--ink-mute);
}
.page-content .monster-view-table .stat-value{
	display:block;
	margin-top:3px;
	font-size:14px;
	font-weight:700;
	color:var(--navy-900);
}
.page-content .monster-drop-table td img{
	border-radius:3px;
	background:rgba(147,166,189,.08);
	box-shadow:0 4px 10px -8px rgba(11,20,38,.45);
}
.page-content .monster-skill-table td em{
	color:var(--ink-mute);
}

/* =============================================================
   Homepage polish pass — restrained, image-backed hero
   ============================================================= */
.shell-home{position:relative;z-index:3;margin-top:-32px}

.is-home .site-topbar{
	position:absolute;top:0;left:0;right:0;z-index:10;
	background:linear-gradient(180deg, rgba(8,14,28,.82) 0%, rgba(8,14,28,.45) 70%, rgba(8,14,28,0) 100%);
	border-bottom:0;
	box-shadow:none;
}
.is-home .site-topbar::before,
.is-home .topbar-trim{display:none}
.is-home .topbar-inner{
	max-width:1320px;
	padding:14px 28px;
}
.is-home .topbar-brand{
	filter:drop-shadow(0 4px 14px rgba(0,0,0,.55));
}
.is-home .topbar-nav ul{
	background:transparent;
	border:0;
	box-shadow:none;
	padding:0;
	gap:4px;
}
.is-home .topbar-nav > ul > li > a{
	padding:10px 16px;
	color:rgba(228,235,245,.85);
	font-size:12px;
	font-weight:600;
	letter-spacing:.16em;
	text-transform:uppercase;
	text-shadow:0 1px 4px rgba(0,0,0,.55);
	border-radius:2px;
	transition:color .15s ease, background .15s ease;
}
.is-home .topbar-nav li.has-children > a{padding-right:42px}
.is-home .topbar-nav > ul > li > a:hover{background:rgba(248,251,255,.06);color:#f8fbff}
.is-home .topbar-nav > ul > li.is-active > a{
	background:transparent;
	color:#f8fbff;
	box-shadow:inset 0 -2px 0 var(--gold-300);
}
.is-home .topbar-account .account-pill,
.is-home .topbar-account .account-cta{
	color:#e4ebf5;
	border-color:rgba(147,166,189,.45);
	background:rgba(17,24,39,.45);
	backdrop-filter:blur(4px);
}
.is-home .topbar-account .account-cta{
	background:linear-gradient(180deg, #edf2f8, #93a6bd);
	color:#122033;
	border-color:#51657d;
}

.card{
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.35);
	border-radius:4px;
	box-shadow:0 8px 22px -16px rgba(11,20,38,.35);
}
.card::before{display:none}
.news-card,.status-card,.items-card,.guide-card,.search-card{
	background:var(--cream-50);
}

.login-panel{
	border-radius:4px;
	background:linear-gradient(180deg, var(--navy-800) 0%, var(--navy-900) 100%);
	border:1px solid rgba(147,166,189,.32);
	border-left:3px solid var(--gold-300);
	box-shadow:0 8px 22px -16px rgba(11,20,38,.5);
}
.login-panel::after{display:none}
.login-panel .card-head-dark{
	background:transparent;
	border-bottom:1px solid rgba(147,166,189,.22);
	padding:14px 18px 12px;
}
.login-panel .card-body-dark{
	background:transparent;
	padding:16px 18px 18px;
}
.login-panel .head-title{
	font-size:12px;
	letter-spacing:.22em;
	text-transform:uppercase;
}
.login-form label{color:#d7e0ea}
.login-form input[type=text],.login-form input[type=password]{
	background:rgba(9,19,34,.5);
	border-color:rgba(147,166,189,.28);
	border-radius:3px;
}
.btn.btn-gold{
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);
}

.promo-card{
	padding:14px 16px;
	background:var(--cream-50);
	color:var(--navy-900);
	border-radius:4px;
	border-left:3px solid var(--gold-300);
}
.promo-card::after{display:none}
.promo-icon{
	width:38px;height:38px;border-radius:3px;
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);
	border:1px solid #4d6178;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.4);
	position:relative;
}
.promo-icon::before{display:none}
.promo-text strong{color:var(--navy-900);font-family:var(--font-display);font-size:13px;letter-spacing:.14em;text-transform:uppercase}
.promo-text span{color:var(--ink-mute);font-size:12px}
.promo-arrow{color:var(--gold-400);font-size:18px;font-weight:700;transition:transform .15s ease}

.search-card{padding:8px}
.search-card .search-form{
	padding:0;
	border-radius:3px;
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.35);
}
.search-card .search-form input{
	flex:1;padding:9px 12px;border:0;background:transparent;font-size:13px;color:var(--ink);
}
.search-card .search-form input::placeholder{color:var(--ink-mute);font-style:italic}
.search-card .search-form button{
	width:42px;border:0;
	border-radius:0 2px 2px 0;
	background:linear-gradient(180deg, var(--navy-800), var(--navy-900));
	color:var(--gold-100);font-size:14px;cursor:pointer;
	border-left:1px solid rgba(100,121,145,.35);
}
.search-card .search-form button:hover{background:linear-gradient(180deg, var(--navy-700), var(--navy-800))}

.guide-classes{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.guide-class{
	display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;
	padding:16px 8px 14px;
	border-radius:3px;
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.3);
	color:var(--navy-800);
	text-decoration:none;
	transition:background .15s ease, border-color .15s ease, color .15s ease;
}
.guide-class:hover{background:rgba(147,166,189,.1);border-color:rgba(100,121,145,.5);color:var(--navy-900)}
.gc-glyph{
	width:34px;height:34px;border-radius:3px;
	display:flex;align-items:center;justify-content:center;
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);
	border:1px solid #4d6178;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.4);
	color:#122033;
	font-family:var(--font-display);
	font-size:16px;
	font-weight:700;
	letter-spacing:.02em;
}
.gc-glyph::before{display:none}
.gc-name{font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}

.news-card{
	padding:0;
	border-radius:4px;
	overflow:hidden;
}
.news-head{
	margin:0;
	padding:13px 18px;
	background:linear-gradient(180deg, var(--navy-800), var(--navy-900));
	border-bottom:1px solid rgba(147,166,189,.28);
	display:flex;align-items:center;justify-content:space-between;
}
.news-head .head-title{color:var(--gold-100);font-size:12px;letter-spacing:.22em;text-transform:uppercase;margin:0}
.news-more{color:var(--gold-200);font-family:var(--font-display);font-size:11px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none}
.news-more:hover{color:var(--gold-100)}
.news-feature{
	display:block;
	border-radius:0;
	overflow:hidden;
	border:0;
	border-bottom:1px solid rgba(100,121,145,.2);
	box-shadow:none;
	text-decoration:none;
}
.feature-art,.feature-glow,.feature-runes{display:none}
.feature-meta{
	padding:20px 22px;
	background:var(--cream-50);
}
.feature-pill{display:inline-block;font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:#122033;background:linear-gradient(180deg, #edf2f8, #93a6bd);padding:4px 10px;border-radius:2px;font-weight:700;font-family:var(--font-display);border:1px solid #4d6178}
.feature-title{
	font-size:20px;
	line-height:1.2;
	color:var(--navy-900);
	font-family:var(--font-display);
	font-weight:700;
	letter-spacing:.02em;
	margin:10px 0 8px;
}
.feature-lead{color:var(--ink-soft);font-size:13px;line-height:1.55;margin:0 0 10px}
.feature-cta-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:8px}
.feature-date{font-family:var(--font-serif);font-style:italic;font-size:12px;color:var(--ink-mute);letter-spacing:.04em}
.feature-cta{font-family:var(--font-display);font-size:11px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--navy-800)}
.news-feature:hover .feature-cta{color:var(--gold-400)}
.news-list{list-style:none;margin:0;padding:6px 0}
.news-item a{
	display:flex;align-items:center;gap:10px;
	padding:11px 18px;
	color:var(--ink);text-decoration:none;
	border-bottom:1px solid rgba(100,121,145,.12);
	transition:background .15s ease;
}
.news-item:last-child a{border-bottom:0}
.news-item a:hover{background:rgba(147,166,189,.08)}
.ni-tag{color:var(--gold-400);font-size:10px}
.ni-title{flex:1;font-size:13px;color:var(--navy-900);font-weight:500}
.ni-date{color:var(--ink-mute);font-size:11px;font-family:var(--font-serif);font-style:italic;letter-spacing:.04em}
.news-empty{padding:20px;color:var(--ink-mute);font-style:italic;text-align:center}

/* ---------- News feed (4 full entries) ---------- */
.news-feed{padding:4px 0}
.news-entry{
	padding:18px 22px;
	border-bottom:1px solid rgba(100,121,145,.18);
	background:var(--cream-50);
}
.news-entry:last-child{border-bottom:0}
.news-entry-lead{
	border-bottom:1px solid rgba(100,121,145,.28);
}
.news-entry-head{margin:0 0 8px}
.news-entry-title{
	font-family:var(--font-display);
	font-weight:700;
	letter-spacing:.02em;
	margin:0 0 4px;
	font-size:18px;
	line-height:1.25;
}
.news-entry-lead .news-entry-title{font-size:22px}
.news-entry-title a{color:var(--navy-900);text-decoration:none}
.news-entry-title a:hover{color:var(--gold-500)}
.news-entry-meta{
	display:flex;flex-wrap:wrap;gap:10px;
	font-family:var(--font-serif);
	font-style:italic;
	font-size:12px;
	color:var(--ink-mute);
	letter-spacing:.04em;
}
.news-entry-author{color:var(--ink-soft)}
.news-entry-body{
	color:var(--ink);
	font-size:14px;
	line-height:1.65;
	margin:8px 0 4px;
}
.news-entry-body p{margin:0 0 12px}
.news-entry-body p:last-child{margin-bottom:0}
.news-entry-body h1,
.news-entry-body h2,
.news-entry-body h3,
.news-entry-body h4,
.news-entry-body h5,
.news-entry-body h6{
	font-family:var(--font-display);
	color:var(--navy-900);
	font-weight:700;
	letter-spacing:.02em;
	line-height:1.25;
	margin:18px 0 8px;
}
.news-entry-body h1{font-size:22px}
.news-entry-body h2{font-size:19px}
.news-entry-body h3{font-size:17px}
.news-entry-body h4{font-size:15px;text-transform:uppercase;letter-spacing:.12em}
.news-entry-body h5,
.news-entry-body h6{font-size:13px;text-transform:uppercase;letter-spacing:.14em;color:var(--ink-soft)}
.news-entry-body strong,
.news-entry-body b{color:var(--navy-900);font-weight:700}
.news-entry-body em,
.news-entry-body i{font-style:italic}
.news-entry-body u{text-decoration:underline}
.news-entry-body a{color:var(--gold-500);text-decoration:underline}
.news-entry-body a:hover{color:var(--gold-400)}
.news-entry-body ul,
.news-entry-body ol{margin:8px 0 12px;padding-left:24px}
.news-entry-body li{margin:3px 0}
.news-entry-body blockquote{
	margin:10px 0;
	padding:10px 14px;
	border-left:3px solid var(--gold-400);
	background:rgba(147,166,189,.08);
	color:var(--ink-soft);
	font-style:italic;
}
.news-entry-body code,
.news-entry-body pre{
	font-family:Consolas,Menlo,monospace;
	font-size:.92em;
	background:rgba(18,32,51,.06);
	border-radius:3px;
}
.news-entry-body code{padding:1px 5px}
.news-entry-body pre{padding:10px 12px;overflow:auto;margin:10px 0}
.news-entry-body pre code{background:transparent;padding:0}
.news-entry-body img{max-width:100%;height:auto;border-radius:3px;margin:8px 0}
.news-entry-body hr{border:0;border-top:1px solid rgba(100,121,145,.25);margin:14px 0}
.news-entry-body table{
	border-collapse:collapse;
	margin:10px 0;
	width:100%;
	font-size:13px;
}
.news-entry-body table td,
.news-entry-body table th{
	border:1px solid rgba(100,121,145,.25);
	padding:6px 9px;
	text-align:left;
}
.news-entry-body table th{background:rgba(147,166,189,.12);font-weight:700;color:var(--navy-900)}
.news-entry-link{
	display:inline-block;
	margin-top:12px;
	font-family:var(--font-display);
	font-size:12px;
	font-weight:600;
	letter-spacing:.14em;
	text-transform:uppercase;
	color:var(--gold-500);
	text-decoration:none;
	transition:color .15s ease;
}
.news-entry-link:hover{color:var(--gold-400)}
.news-entry-modified{
	margin-top:8px;
	font-size:11px;
	color:var(--ink-mute);
	font-style:italic;
}
.news-entry-date{color:var(--ink-mute);font-family:var(--font-serif);font-style:italic}
.news-entry-cta{
	display:inline-block;
	font-family:var(--font-display);
	font-size:11px;
	font-weight:700;
	letter-spacing:.18em;
	text-transform:uppercase;
	color:var(--navy-800);
	text-decoration:none;
}
.news-entry-cta:hover{color:var(--gold-500)}

.status-card .card-body,
.items-card .card-body,
.guide-card .card-body{padding:16px 18px}
.status-list{list-style:none;margin:0 0 14px;padding:0}
.status-list li{display:flex;justify-content:space-between;align-items:center;padding:9px 0;border-bottom:1px solid rgba(100,121,145,.16);font-size:13px}
.status-list li:last-child{border-bottom:0}
.sl-k{font-family:var(--font-display);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-mute);font-weight:600}
.sl-v{font-family:var(--font-sans);font-size:13px;font-weight:700;color:var(--navy-900)}
.sl-v.sl-on{color:#2d7a3a}
.sl-v.sl-off{color:#a83b3b}
.status-dot{width:10px;height:10px;border-radius:50%;display:inline-block}
.status-dot.online{background:#3aaf52;box-shadow:0 0 0 2px rgba(58,175,82,.18)}
.status-dot.offline{background:#c44a3f;box-shadow:0 0 0 2px rgba(196,74,63,.18)}

.quicklinks{display:flex;flex-direction:column;gap:6px}
.quicklink{
	display:flex;align-items:center;gap:12px;
	padding:11px 12px;
	border-radius:3px;
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.3);
	color:var(--ink);
	text-decoration:none;
	transition:background .15s ease, border-color .15s ease;
}
.quicklink:hover{background:rgba(147,166,189,.1);border-color:rgba(100,121,145,.5)}
.ql-glyph{
	width:32px;height:32px;border-radius:3px;
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);
	border:1px solid #4d6178;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.4);
	flex-shrink:0;
}
.ql-glyph::before{display:none}
.ql-online .ql-glyph::before,
.ql-vending .ql-glyph::before,
.ql-castle .ql-glyph::before{display:none}
.ql-text{display:flex;flex-direction:column;line-height:1.3}
.ql-text strong{color:var(--navy-900);font-family:var(--font-display);font-size:12px;letter-spacing:.14em;text-transform:uppercase}
.ql-text em{color:var(--ink-mute);font-style:normal;font-size:11px}

.support-card{
	display:flex;
	align-items:center;
	gap:14px;
	padding:16px;
	background:linear-gradient(180deg, var(--navy-800), var(--navy-900));
	border:1px solid rgba(147,166,189,.32);
	border-left:3px solid var(--gold-300);
	border-radius:4px;
	color:var(--cream-50);
	text-decoration:none;
	transition:background .15s ease;
}
.support-card:hover{background:linear-gradient(180deg, var(--navy-700), var(--navy-800));color:var(--cream-50)}
.support-sigil{
	width:42px;height:42px;flex-shrink:0;
	border-radius:3px;
	background:linear-gradient(180deg, #edf2f8 0%, #93a6bd 55%, #5a6d84 100%);
	border:1px solid #4d6178;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.4);
	position:relative;
}
.support-sigil::before,
.support-sigil::after{
	content:"";position:absolute;left:50%;top:50%;
	background:#1a1208;
	transform:translate(-50%, -50%);
	border-radius:1px;
}
.support-sigil::before{width:18px;height:3px}
.support-sigil::after{width:3px;height:18px}
.mascot-card:hover{box-shadow:0 12px 26px -18px rgba(11,20,38,.5)}
.mascot-text strong{font-size:13px;font-family:var(--font-display);letter-spacing:.14em;text-transform:uppercase;color:var(--gold-100);display:block;margin-bottom:4px}
.mascot-text span{font-size:12px;color:rgba(208,217,229,.72);font-style:normal;line-height:1.4}

/* generic forms */
input[type=text],input[type=password],input[type=email],input[type=number],select,textarea{
	font-family:var(--font-sans);font-size:13px;
	padding:8px 12px;
	background:var(--cream-50);
	border:1px solid rgba(100,121,145,.35);
	border-radius:8px;color:var(--ink);
	transition:border-color .15s ease, box-shadow .15s ease;
}
input[type=text]:focus,input[type=password]:focus,input[type=email]:focus,input[type=number]:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold-300);box-shadow:0 0 0 3px rgba(147,166,189,.18)}

button,input[type=submit],input[type=button]{
	font-family:var(--font-display);font-size:12px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
	padding:9px 18px;border-radius:var(--radius-pill);cursor:pointer;
	color:var(--navy-900);
	background:linear-gradient(180deg, #edf2f8 0%, #bccadd 50%, #93a6bd 100%);
	border:1px solid #5b6e85;
	box-shadow:inset 0 1px 0 rgba(255,255,255,.7), 0 4px 12px -6px rgba(147,166,189,.35);
	transition:transform .15s ease;
}
button:hover,input[type=submit]:hover,input[type=button]:hover{transform:translateY(-1px)}

/* messages */
div.error,div.warning,div.info,div.message{padding:12px 16px;border-radius:10px;margin:12px 0;font-size:13px;border:1px solid}
div.error{background:#fde8e8;color:#7a1f1f;border-color:#f0bcbc}
div.warning{background:#fff5d4;color:#7a5a1f;border-color:#f0d88a}
div.info,div.message{background:#e6efff;color:#1f3a7a;border-color:#bccef0}

h1,h2,h3{color:var(--navy-900)}
h1{font-size:28px;border-bottom:2px solid var(--gold-300);padding-bottom:10px;margin-bottom:18px}
h2{font-size:22px}
h3{font-size:17px}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px){
	.is-home .site-topbar{position:relative;top:0;background:linear-gradient(180deg, var(--navy-900) 0%, var(--navy-800) 100%);border-bottom:1px solid rgba(147,166,189,.2)}
	.is-home .site-topbar::before,.is-home .topbar-trim{display:block}
	.is-home .topbar-brand{margin-top:0;background:none;border:0;box-shadow:none;padding:0}
	.is-home .topbar-nav{max-width:none;padding-top:0}
	.is-home .topbar-nav ul{padding:0;background:none;border:0;box-shadow:none}
	.shell-home{margin-top:0}
	.portal-grid{grid-template-columns:280px minmax(0,1fr)}
	.portal-col-right{grid-column:1 / -1;display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
	.footer-inner{grid-template-columns:1fr 1fr}
	.footer-extra{grid-column:1 / -1}
}
@media (max-width:960px){
	.portal-grid{grid-template-columns:1fr;gap:16px}
	.portal-col-right{grid-template-columns:1fr;gap:16px}
}
@media (max-width:860px){
	.site-topbar,
	.is-home .site-topbar{
		position:relative;
		top:auto;
		left:auto;
		right:auto;
		z-index:140;
		background:linear-gradient(180deg, var(--navy-900) 0%, var(--navy-800) 100%);
		border-bottom:1px solid rgba(147,166,189,.22);
		box-shadow:0 10px 28px -24px rgba(0,0,0,.75);
	}
	.topbar-inner,.is-home .topbar-inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;width:100%;max-width:100%}
	.topbar-brand{margin:0}
	.topbar-brand,.is-home .topbar-brand{min-width:0;max-width:calc(100% - 128px);filter:none}
	.topbar-logo{height:40px;max-width:100%;object-fit:contain}
	.topbar-menu-toggle{
		display:inline-flex;
		margin-left:auto;
		position:relative;
		z-index:162;
		flex-shrink:0;
		border-radius:999px;
		background:rgba(248,251,255,.08);
		box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
	}
	.has-mobile-menus .topbar-panel{
		display:none;
		position:fixed;
		top:64px;
		left:10px;
		right:10px;
		width:auto;
		max-width:calc(100vw - 20px);
		max-height:calc(100vh - 84px);
		overflow-y:auto;
		-webkit-overflow-scrolling:touch;
		flex-direction:column;
		align-items:stretch;
		gap:14px;
		margin:0;
		padding:14px;
		background:linear-gradient(180deg, rgba(12,20,34,.98) 0%, rgba(20,31,48,.98) 100%);
		border:1px solid rgba(147,166,189,.28);
		border-radius:10px;
		box-shadow:0 28px 60px -24px rgba(0,0,0,.88);
		z-index:160;
	}
	.has-mobile-menus .topbar-panel.is-open{display:flex}
	.topbar-nav{width:100%;justify-content:stretch}
	.topbar-nav > ul,.is-home .topbar-nav ul{width:100%;flex-direction:column;align-items:stretch;padding:0;gap:7px;background:transparent;border:0;box-shadow:none}
	.topbar-nav > ul > li{display:block}
	.topbar-nav > ul > li > a,
	.is-home .topbar-nav > ul > li > a{
		display:flex;
		align-items:center;
		justify-content:space-between;
		width:100%;
		padding:12px 13px;
		font-size:11px;
		letter-spacing:.14em;
		border:1px solid rgba(147,166,189,.2);
		border-radius:6px;
		background:rgba(248,251,255,.045);
		box-shadow:none;
		text-shadow:none;
	}
	.topbar-nav li.has-children > a{padding-right:34px}
	.topbar-nav li.has-children > a::after{right:11px}
	.topbar-nav li.has-children .topbar-subnav{
		position:static;
		display:flex !important;
		width:100%;
		min-width:0;
		flex-wrap:nowrap;
		flex-direction:column;
		justify-content:flex-start;
		gap:6px;
		margin-top:7px;
		padding:8px;
		background:rgba(17,24,39,.48);
		border-color:rgba(147,166,189,.2);
		border-radius:6px;
		box-shadow:none;
		backdrop-filter:none;
	}
	.topbar-subnav li{flex:1 1 auto;width:100%}
	.topbar-subnav li a{
		padding:9px 10px;
		font-size:10px;
		white-space:normal;
		text-align:left;
	}
	.topbar-account{width:100%;justify-content:stretch;flex-wrap:wrap;gap:8px}
	.topbar-account > a{justify-content:center}
	.topbar-account .account-pill,
	.topbar-account .account-cta{flex:1 1 180px}
	.site-hero{min-height:560px}
	.hero-stage{padding:108px 16px 56px;gap:18px}
	.hero-cta{width:100%}
	.hero-cta-row{width:100%;flex-direction:column;align-items:center}
	.hero-cta-row .hero-cta{width:min(100%, 360px)}
	.footer-inner{grid-template-columns:1fr}
	.hero-cta .cta-text{width:min(100%, 360px);padding:14px 28px;font-size:16px;letter-spacing:.18em;text-align:center}
	.hero-quickbar{display:grid;grid-template-columns:1fr 1fr;gap:8px;width:min(100%, 420px)}
	.qb-pill{justify-content:center;padding:9px 12px;font-size:10px;letter-spacing:.14em}
	.portal-grid{grid-template-columns:1fr}
	.portal-col-right{display:grid;grid-template-columns:1fr 1fr;gap:14px}
	.portal-col-right .mascot-card{grid-column:1 / -1}
	.news-head{align-items:flex-start;flex-direction:column;gap:6px}
	.feature-cta-row{flex-direction:column;align-items:flex-start}
	.news-item a{flex-wrap:wrap;align-items:flex-start}
	.ni-date{width:100%}
	.footer-inner{grid-template-columns:1fr;gap:28px;padding:36px 18px 24px}
	.footer-cols{grid-template-columns:repeat(2,1fr)}
	.shell-inner-page{display:flex;flex-direction:column;gap:14px}
	.sidebar-menu-toggle{display:inline-flex;order:1;align-self:flex-start}
	.page-content{order:2;padding:18px;max-width:100%;overflow-x:hidden}
	.has-mobile-menus .page-sidebar{
		order:3;
		position:fixed;
		top:0;
		left:0;
		bottom:0;
		width:min(320px, 86vw);
		padding:84px 14px 18px;
		overflow-y:auto;
		background:linear-gradient(180deg, #f8fafc 0%, #e9eff6 100%);
		border-right:1px solid rgba(100,121,145,.26);
		box-shadow:18px 0 34px -24px rgba(11,20,38,.45);
		transform:translateX(-100%);
		transition:transform .18s ease;
		z-index:70;
	}
	.has-mobile-menus .page-sidebar.is-open{transform:translateX(0)}
	.site-shell{padding:24px 12px 48px}
	.page-content > h1{font-size:22px}
	.page-content > h2{font-size:17px}
	.table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:14px 0}
	table.horizontal-table,
	table.vertical-table,
	.page-content table:not(.generic-form-table):not(.horizontal-table):not(.vertical-table):not(#loginbox):not(#sidebar):not(#admin_sidebar){
		display:block;
		width:100%;
		max-width:100%;
		overflow-x:auto;
		-webkit-overflow-scrolling:touch;
		min-width:0;
	}
	table.horizontal-table > tbody,
	table.vertical-table > tbody,
	.page-content table:not(.generic-form-table):not(.horizontal-table):not(.vertical-table):not(#loginbox):not(#sidebar):not(#admin_sidebar) > tbody{
		display:table;
		min-width:600px;
		width:100%;
	}
	table.horizontal-table th,
	table.horizontal-table td{white-space:nowrap}
	table.generic-form-table th,.generic-form-div table th{width:auto;display:block;padding:10px 0 4px;white-space:normal}
	table.generic-form-table td,.generic-form-div table td{display:block;padding:0 0 10px}
	.page-content input[type=text],.page-content input[type=password],.page-content input[type=email],
	.page-content input[type=number],.page-content input[type=search],.page-content select,.page-content textarea{max-width:100%}
	.page-content form.search-form{padding:12px}
	.page-content form.search-form p{flex-direction:column;align-items:stretch}
	.page-content form.search-form input[type=text],
	.page-content form.search-form input[type=search],
	.page-content form.search-form select{max-width:100%}
	.subhead-inner{flex-direction:column;align-items:flex-start;gap:8px}
	.page-content .online-summary,
	.page-content .online-search-grid{grid-template-columns:1fr}
	.page-content .online-search-actions{justify-content:flex-start}
	.page-content .monster-view-hero{grid-template-columns:1fr}
	.page-content .monster-spotlight-grid{grid-template-columns:1fr 1fr}
	.page-content .monster-db-search-row{flex-direction:column;align-items:stretch}
	.page-content .monster-db-search input[type=text],
	.page-content .monster-db-search select{max-width:100%}
	.pages{justify-content:center;padding:8px;gap:5px}
	.pages a,.page-content .pages a{min-width:32px;height:32px;padding:0 9px;font-size:10px}
	.pages .page-prev,.pages .page-next{flex:1 1 120px}
	.jump-to-page label{display:flex;align-items:stretch;flex-direction:column}
	.jump-to-page input{width:100%;max-width:100%}
	.page-jump-button{width:100%}
	.admin-action-panel,.itemmall-admin-panel{flex-direction:column;align-items:stretch}
	.admin-action-links,.itemmall-admin-actions{justify-content:flex-start}
	.private-hub-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
	.topbar-account .account-cta{display:none}
	.site-hero{min-height:500px}
	.hero-stage{padding:92px 14px 44px}
	.hero-cta .cta-text{width:100%;padding:13px 24px;font-size:14px;letter-spacing:.16em}
	.hero-logo{max-height:180px;max-width:90%}
	.hero-quickbar{grid-template-columns:1fr;width:100%}
	.topbar-logo{height:36px}
	.has-mobile-menus .topbar-panel{top:58px;left:8px;right:8px;max-width:calc(100vw - 16px);padding:12px}
	.topbar-account{gap:6px}
	.account-pill{padding:8px 12px 8px 8px}
	.has-mobile-menus .topbar-panel{padding:10px}
	.has-mobile-menus .page-sidebar{width:min(300px, 88vw);padding-top:78px}
	.status-rates{grid-template-columns:1fr}
	.portal-col-right{grid-template-columns:1fr}
	.footer-cols{grid-template-columns:1fr}
	.guide-classes{grid-template-columns:1fr}
	.page-content{padding:14px}
	.page-content > h1{font-size:20px}
	.page-content > h2{font-size:16px}
	.page-content .monster-spotlight-grid{grid-template-columns:1fr}
}