/*
 * Premium WebEngine 1.2.7 presentation layer
 * One custom stylesheet. Loaded after the native WebEngine/module styles.
 */
:root {
    --p-bg: #07090c;
    --p-surface: #0d1116;
    --p-surface-2: #11171e;
    --p-surface-3: #161d25;
    --p-border: rgba(210, 175, 104, .22);
    --p-border-soft: rgba(255, 255, 255, .08);
    --p-text: #e8e4da;
    --p-muted: #9b9b98;
    --p-dim: #666b70;
    --p-metal: #c7a66a;
    --p-metal-light: #e2c68a;
    --p-metal-dark: #806638;
    --p-danger: #b96a63;
    --p-success: #8bb66f;
    --p-shadow: 0 24px 70px rgba(0,0,0,.38);
    --p-radius: 6px;
    --p-container: 1280px;
    --p-font-ui: 'Rajdhani', 'Arial Narrow', Arial, sans-serif;
    --p-font-body: 'Exo 2', Arial, sans-serif;
    --p-font-display: 'Cinzel', Georgia, serif;
}

html {
    min-width: 0 !important;
    background: var(--p-bg);
    scroll-behavior: smooth;
}

body.premium-site {
    min-width: 0 !important;
    margin: 0;
    color: var(--p-text);
    background-color: var(--p-bg) !important;
    background-image: none !important;
    font-family: var(--p-font-body);
    font-size: 14px;
    line-height: 1.6;
}

body.premium-site a {
    color: var(--p-metal-light);
    text-decoration: none;
}

body.premium-site a:hover,
body.premium-site a:focus {
    color: #f1d9a4;
    text-decoration: none;
}

body.premium-site img {
    max-width: 100%;
}

body.premium-site ::selection {
    background: rgba(199,166,106,.28);
    color: #fff;
}

.skip-link {
    position: fixed;
    left: 12px;
    top: -100px;
    z-index: 9999;
    padding: 10px 14px;
    border-radius: 4px;
    background: #fff;
    color: #111 !important;
    font-weight: 700;
}

.skip-link:focus {
    top: 12px;
}

/* Game-server typography system ----------------------------------------- */
body.premium-site button,
body.premium-site input,
body.premium-site select,
body.premium-site textarea,
body.premium-site .btn,
body.premium-site nav,
body.premium-site .site-utility-bar,
body.premium-site .site-nav,
body.premium-site .site-nav a,
body.premium-site .hero-kicker,
body.premium-site .hero-actions,
body.premium-site .hero-stats,
body.premium-site .section-kicker,
body.premium-site .section-title,
body.premium-site .feature-label,
body.premium-site .event-time,
body.premium-site .ranking-rank,
body.premium-site .ranking-name,
body.premium-site .ucp-app,
body.premium-site .ucp-nav,
body.premium-site .ucp-module,
body.premium-site .download-card,
body.premium-site .download-action,
body.premium-site .module-kicker,
body.premium-site .module-title {
    font-family: var(--p-font-ui);
}

body.premium-site p,
body.premium-site li,
body.premium-site td,
body.premium-site th,
body.premium-site label,
body.premium-site .module-description,
body.premium-site .news-excerpt,
body.premium-site .faq-answer,
body.premium-site .download-description {
    font-family: var(--p-font-body);
}

/* Header / navigation ---------------------------------------------------- */
/*
 * The native WebEngine stylesheet targets #navbar, #header and .global-top-bar.
 * The premium template deliberately uses its own class names here so those
 * legacy selectors cannot alter the header geometry.
 */
.site-utility-bar {
    position: relative;
    z-index: 90;
    width: 100%;
    min-height: 32px;
    margin: 0;
    padding: 0;
    background: rgba(5,7,9,.96);
    border-bottom: 1px solid rgba(255,255,255,.055);
    color: var(--p-muted);
    font-size: 10px;
    letter-spacing: .10em;
    text-transform: uppercase;
}

.site-utility-inner {
    width: min(calc(100% - 40px), var(--p-container));
    min-height: 32px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: flex-end;
}

.topbar-left,
.topbar-right {
    display: flex;
    align-items: center;
    gap: 9px;
    min-height: 32px;
}

.topbar-left { margin-right: auto; }

.topbar-right a {
    display: inline-flex;
    align-items: center;
    min-height: 32px;
    color: #a9a59d !important;
    transition: color .18s ease;
}

.topbar-right a:hover,
.topbar-right a:focus { color: var(--p-metal-light) !important; }
.topbar-right .logout { color: #c07c74 !important; }

/* The core may inject the AdminCP control at document level. Keep it aligned
 * with the premium utility bar without changing its functionality. */
body.premium-site .admincp-button {
    position: absolute !important;
    top: 4px !important;
    right: max(20px, calc((100% - var(--p-container)) / 2)) !important;
    z-index: 100 !important;
    display: inline-flex !important;
    align-items: center;
    min-height: 24px;
    padding: 0 9px !important;
    border: 1px solid rgba(199,166,106,.28) !important;
    border-radius: 2px !important;
    background: rgba(10,12,15,.92) !important;
    color: #9f9b93 !important;
    font-size: 9px !important;
    font-weight: 700 !important;
    letter-spacing: .08em;
    line-height: 22px !important;
    text-transform: uppercase;
    box-shadow: none !important;
}

body.premium-site .admincp-button:hover,
body.premium-site .admincp-button:focus {
    background: rgba(199,166,106,.10) !important;
    border-color: rgba(199,166,106,.55) !important;
    color: var(--p-metal-light) !important;
}

.site-nav {
    position: relative;
    z-index: 70;
    background: rgba(7,9,12,.90);
    border-bottom: 1px solid rgba(199,166,106,.16);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: background .2s ease, box-shadow .2s ease;
}

.site-nav.is-scrolled {
    background: rgba(7,9,12,.98);
    box-shadow: 0 12px 35px rgba(0,0,0,.28);
}

.site-nav-inner {
    width: min(100% - 40px, var(--p-container));
    min-height: 72px;
    margin: 0 auto;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 32px;
}

.nav-brand {
    flex: 0 0 auto;
    width: 112px;
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.nav-brand img {
    display: block;
    width: auto;
    height: auto;
    max-width: 112px;
    max-height: 48px;
    object-fit: contain;
}

.nav-menu {
    flex: 1 1 auto;
    min-width: 0;
    margin-left: auto;
}

.nav-menu > ul {
    display: flex !important;
    justify-content: flex-end;
    align-items: stretch;
    gap: 2px;
    margin: 0 !important;
    padding: 0 !important;
}

.nav-menu > ul > li {
    display: block !important;
    list-style: none !important;
    margin: 0 !important;
}

.nav-menu > ul > li > a {
    position: relative;
    display: flex !important;
    align-items: center;
    min-height: 72px;
    padding: 0 15px !important;
    color: #b9b6af !important;
    font-size: 10px !important;
    font-weight: 700;
    letter-spacing: .10em;
    text-transform: uppercase;
    white-space: nowrap;
    transition: color .18s ease, background .18s ease;
}

.nav-menu > ul > li > a::after {
    content: '';
    position: absolute;
    left: 15px;
    right: 15px;
    bottom: -1px;
    height: 2px;
    background: var(--p-metal);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform .18s ease;
}

.nav-menu > ul > li > a:hover,
.nav-menu > ul > li > a:focus {
    color: #fff !important;
    background: rgba(255,255,255,.018);
}

.nav-menu > ul > li > a:hover::after,
.nav-menu > ul > li > a:focus::after {
    transform: scaleX(1);
}

.nav-menu > ul > li.is-active > a,
.nav-menu > ul > li > a[aria-current="page"] {
    color: var(--p-metal-light) !important;
}

.nav-menu > ul > li.is-active > a::after,
.nav-menu > ul > li > a[aria-current="page"]::after {
    transform: scaleX(1);
}

.nav-toggle {
    display: none;
    margin-left: auto;
    width: 44px;
    height: 42px;
    padding: 8px;
    border: 1px solid var(--p-border-soft);
    border-radius: 4px;
    background: rgba(255,255,255,.03);
}

.nav-toggle span:not(.sr-only) {
    display: block;
    height: 2px;
    margin: 5px 0;
    background: var(--p-metal-light);
}

/* Hero: the artwork is the actual background layer; no negative z-index tricks. */
.premium-hero {
    position: relative;
    min-height: 590px;
    display: flex;
    align-items: center;
    overflow: hidden;
    background: #080a0d;
    border-bottom: 1px solid rgba(199,166,106,.16);
}

.hero-art,
.hero-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.hero-art {
    z-index: 0;
    background: url('../img/background-2600.jpg') center / cover no-repeat;
}

.hero-overlay {
    z-index: 1;
    background:
        linear-gradient(90deg, rgba(4,6,8,.96) 0%, rgba(4,6,8,.78) 36%, rgba(4,6,8,.38) 72%, rgba(4,6,8,.76) 100%),
        linear-gradient(180deg, rgba(4,6,8,.28) 0%, rgba(4,6,8,.08) 46%, rgba(4,6,8,.88) 100%);
}

.hero-content {
    position: relative;
    z-index: 2;
    width: min(100%, var(--p-container));
    margin: 0 auto;
    padding: 90px 30px 100px;
    display: grid;
    grid-template-columns: minmax(0, 1.25fr) minmax(280px, .55fr);
    gap: 70px;
    align-items: center;
}

.hero-copy {
    max-width: 700px;
}

.eyebrow,
.section-kicker,
.panel-kicker {
    display: block;
    color: var(--p-metal);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .24em;
    text-transform: uppercase;
}

.hero-copy h1,
.inner-header h1,
.home-section-heading h2,
.home-panel-heading h3 {
    font-family: var(--p-font-display);
}

.hero-copy h1 {
    margin: 10px 0 16px;
    color: #f4efe3;
    font-size: clamp(42px, 6vw, 78px);
    line-height: .98;
    letter-spacing: -.02em;
    text-shadow: 0 10px 40px rgba(0,0,0,.45);
}

.hero-lead {
    max-width: 650px;
    margin: 0 0 28px;
    color: #b9b6ae;
    font-size: 17px;
    line-height: 1.8;
}

.hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.btn-premium {
    min-height: 46px;
    padding: 13px 20px;
    border-radius: 3px;
    border: 1px solid transparent;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    transition: transform .18s ease, background .18s ease, border-color .18s ease, color .18s ease;
}

.btn-premium:hover,
.btn-premium:focus {
    transform: translateY(-1px);
}

.btn-primary-hero {
    color: #15110a !important;
    background: linear-gradient(180deg, var(--p-metal-light), var(--p-metal));
    border-color: var(--p-metal-light);
    box-shadow: 0 10px 28px rgba(0,0,0,.22);
}

.btn-primary-hero:hover,
.btn-primary-hero:focus {
    color: #0b0906 !important;
    background: #ebd49e !important;
    border-color: #ebd49e !important;
}

.btn-secondary-hero {
    color: #ded9cf !important;
    background: rgba(255,255,255,.035);
    border-color: rgba(255,255,255,.16);
}

.btn-secondary-hero:hover,
.btn-secondary-hero:focus {
    color: #fff !important;
    background: rgba(255,255,255,.08) !important;
    border-color: rgba(199,166,106,.45) !important;
}

.hero-status {
    padding: 25px;
    background: rgba(7,9,12,.72);
    border: 1px solid rgba(199,166,106,.24);
    border-radius: var(--p-radius);
    box-shadow: var(--p-shadow);
    backdrop-filter: blur(10px);
}

.status-label {
    color: #aaa69e;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
}

.status-dot {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 7px;
    border-radius: 50%;
    background: var(--p-success);
    box-shadow: 0 0 0 4px rgba(139,182,111,.08);
    vertical-align: 1px;
}

.status-number {
    margin-top: 13px;
    color: #f2ecdf;
    font-family: var(--p-font-display);
    font-size: 48px;
    line-height: 1;
}

.status-caption,
.status-capacity {
    color: var(--p-muted);
    font-size: 10px;
    letter-spacing: .12em;
}

.status-bar {
    height: 4px;
    margin: 18px 0 8px;
    overflow: hidden;
    background: rgba(255,255,255,.08);
    border-radius: 10px;
}

.status-bar span {
    display: block;
    height: 100%;
    background: var(--p-metal);
}

.status-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}

.status-meta span {
    flex: 1 1 70px;
    padding: 10px;
    background: rgba(255,255,255,.035);
    border: 1px solid rgba(255,255,255,.06);
    color: #c0bcb4;
    font-size: 11px;
}

.status-meta b {
    display: block;
    margin-bottom: 2px;
    color: var(--p-metal);
    font-size: 9px;
    letter-spacing: .12em;
}

.hero-scroll {
    position: absolute;
    left: 50%;
    bottom: 20px;
    z-index: 2;
    width: 22px;
    height: 34px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 15px;
    transform: translateX(-50%);
}

.hero-scroll span {
    position: absolute;
    left: 50%;
    top: 7px;
    width: 3px;
    height: 7px;
    background: var(--p-metal);
    border-radius: 4px;
    transform: translateX(-50%);
}

/* Inner page header */
.inner-header {
    position: relative;
    overflow: hidden;
    min-height: 210px;
    display: flex;
    align-items: flex-end;
    background: #090b0f url('../img/background.jpg') center 25% / cover no-repeat;
    border-bottom: 1px solid rgba(199,166,106,.16);
}

.inner-header-backdrop {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(5,7,9,.96), rgba(5,7,9,.66), rgba(5,7,9,.9));
}

.inner-header-content {
    position: relative;
    z-index: 1;
    width: min(100%, var(--p-container));
    margin: 0 auto;
    padding: 48px 30px 34px;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
}

.inner-header h1 {
    margin: 6px 0 0;
    color: #f0ebe1;
    font-size: clamp(28px, 4vw, 46px);
    line-height: 1.1;
}

.inner-server-state {
    padding: 9px 12px;
    border: 1px solid rgba(255,255,255,.1);
    background: rgba(0,0,0,.25);
    color: #aaa69e;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
}

.compact-server-info {
    background: rgba(5,7,9,.88);
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.server-strip {
    width: min(100%, var(--p-container));
    margin: 0 auto;
    padding: 12px 30px;
    display: flex;
    flex-wrap: wrap;
    gap: 16px 24px;
    color: #8f918f;
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.server-strip strong { color: var(--p-metal); margin-right: 4px; }
.server-clock { margin-left: auto; }

/* Main shell */
#container.site-container {
    width: min(100%, var(--p-container)) !important;
    min-height: 0;
    height: auto;
    margin: 0 auto !important;
    padding: 0 !important;
    background: transparent !important;
    border-radius: 0 !important;
}

#content.site-content {
    width: 100% !important;
    min-height: 0;
    margin: 0;
    padding: 0 30px 70px !important;
    overflow: visible !important;
}

.page-main-column,
.page-layout {
    width: 100%;
}

.page-layout {
    margin: 0;
}

.page-layout > [class*="col-"] {
    padding-left: 10px;
    padding-right: 10px;
}

.page-sidebar-column {
    position: sticky;
    top: 18px;
}

/* Homepage intro */
.home-intro-strip {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 30px;
    margin: 0 0 26px;
    padding: 28px 0 26px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

.home-intro-copy h2 {
    margin: 5px 0 4px;
    color: #e9e4d9;
    font-family: var(--p-font-display);
    font-size: 24px;
}

.home-intro-copy p {
    margin: 0;
    color: var(--p-muted);
}

.home-intro-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
}

.home-intro-links a {
    padding: 9px 11px;
    border: 1px solid rgba(199,166,106,.18);
    color: #aaa69e;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .1em;
}

.home-intro-links a:hover,
.home-intro-links a:focus {
    border-color: rgba(199,166,106,.42);
    color: var(--p-metal-light);
}

/* Home module */
.home-command-center {
    margin-top: 0;
}

.home-section-heading {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    margin-bottom: 16px;
}

.home-section-heading h2 {
    margin: 5px 0 0;
    color: #ece7dd;
    font-size: 28px;
}

.section-link {
    color: #aaa69e !important;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.section-link:hover,
.section-link:focus { color: var(--p-metal-light) !important; }

.home-grid {
    display: grid;
    gap: 16px;
}

.home-grid-top {
    grid-template-columns: minmax(0, 1.75fr) minmax(280px, .85fr);
    margin-bottom: 16px;
}

.home-grid-bottom {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.home-panel {
    position: relative;
    min-width: 0;
    background: linear-gradient(180deg, rgba(16,21,27,.97), rgba(10,13,17,.97));
    border: 1px solid var(--p-border-soft);
    border-radius: var(--p-radius);
    box-shadow: 0 20px 55px rgba(0,0,0,.22);
    overflow: hidden;
}

.home-panel::before {
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, rgba(199,166,106,.55), transparent);
}

.home-panel-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    padding: 19px 20px 15px;
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.home-panel-heading h3 {
    margin: 4px 0 0;
    color: #e8e3d8;
    font-size: 18px;
}

.panel-icon-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid rgba(199,166,106,.24);
    color: var(--p-metal-light) !important;
    font-size: 18px;
    line-height: 1;
}

.panel-icon-link:hover,
.panel-icon-link:focus {
    background: rgba(199,166,106,.08);
    border-color: rgba(199,166,106,.5);
}

.home-news-list {
    padding: 4px 20px 8px;
}

.home-news-item {
    display: grid;
    grid-template-columns: 58px minmax(0, 1fr) 24px;
    gap: 14px;
    align-items: center;
    padding: 15px 0;
    border-bottom: 1px solid rgba(255,255,255,.055);
}

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

.home-news-date {
    text-align: center;
    color: #858984;
    line-height: 1.05;
}

.home-news-date span,
.home-news-date small {
    display: block;
    font-size: 8px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.home-news-date strong {
    display: block;
    margin: 3px 0;
    color: var(--p-metal-light);
    font-family: var(--p-font-display);
    font-size: 20px;
}

.home-news-copy { min-width: 0; }
.home-news-type,
.event-label {
    color: #70746f;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.home-news-copy h4 {
    margin: 3px 0 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.45;
}

.home-news-copy h4 a { color: #d7d3cb !important; }
.home-news-copy h4 a:hover,
.home-news-copy h4 a:focus { color: var(--p-metal-light) !important; }

.home-news-arrow {
    color: #656a67 !important;
    font-size: 18px;
    text-align: right;
}

.home-news-item:hover .home-news-arrow { color: var(--p-metal-light) !important; }

.home-account-panel {
    min-height: 100%;
}

.account-panel-art {
    height: 85px;
    background: linear-gradient(180deg, rgba(8,10,13,.1), rgba(8,10,13,.92)), url('../img/sidebar_banner_join.jpg') center / cover no-repeat;
    opacity: .72;
}

.account-heading { border-bottom-color: rgba(199,166,106,.12); }

.premium-login-form {
    padding: 18px 20px 20px;
}

.premium-login-form label {
    display: block;
    margin: 0 0 6px;
    color: #8f928e;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.premium-login-form input,
body.premium-site .form-control,
body.premium-site input[type="text"],
body.premium-site input[type="password"],
body.premium-site input[type="number"],
body.premium-site input[type="email"],
body.premium-site textarea,
body.premium-site select {
    width: 100%;
    min-height: 42px;
    padding: 10px 12px;
    color: #e5e0d7 !important;
    background: #0a0d11 !important;
    border: 1px solid rgba(255,255,255,.1) !important;
    border-radius: 3px;
    box-shadow: none !important;
}

.premium-login-form input:focus,
body.premium-site .form-control:focus,
body.premium-site input:focus,
body.premium-site textarea:focus,
body.premium-site select:focus {
    border-color: rgba(199,166,106,.65) !important;
    outline: 2px solid rgba(199,166,106,.14);
    outline-offset: 1px;
}

.premium-login-form .btn { margin-top: 7px; }

.login-helper {
    display: flex;
    justify-content: space-between;
    gap: 10px;
    margin-top: 14px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.login-helper a { color: #858984 !important; }
.login-helper a:hover,
.login-helper a:focus { color: var(--p-metal-light) !important; }

.home-usercp-menu {
    padding: 8px 20px 10px;
}

.home-usercp-menu > ul,
.panel-usercp .panel-body > ul,
.usercp-sidebar ul {
    margin: 0;
    padding: 0;
}

.home-usercp-menu li,
.panel-usercp .panel-body li,
.usercp-sidebar li {
    display: flex;
    align-items: center;
    gap: 9px;
    list-style: none;
    border-bottom: 1px solid rgba(255,255,255,.05);
}

.home-usercp-menu li:last-child,
.panel-usercp .panel-body li:last-child,
.usercp-sidebar li:last-child { border-bottom: 0; }

.home-usercp-menu li img,
.panel-usercp .panel-body li img,
.usercp-sidebar li img {
    width: 18px;
    height: 18px;
    object-fit: contain;
    opacity: .72;
}

.home-usercp-menu li a,
.panel-usercp .panel-body li a,
.usercp-sidebar li a {
    flex: 1;
    display: block;
    padding: 10px 0;
    color: #aaa69e !important;
    font-size: 11px;
}

.home-usercp-menu li a:hover,
.home-usercp-menu li a:focus { color: var(--p-metal-light) !important; }

.account-dashboard-link { margin: 0 20px 20px; }

/* Leaderboards */
.leaderboard-list {
    padding: 4px 18px 12px;
}

.leaderboard-row {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 9px;
    min-height: 40px;
    border-bottom: 1px solid rgba(255,255,255,.05);
}

.leaderboard-row:last-child { border-bottom: 0; }

.leaderboard-rank {
    color: #666b69;
    font-size: 10px;
    font-weight: 800;
}

.leaderboard-name,
.leaderboard-name a {
    min-width: 0;
    color: #d4d0c8 !important;
    font-size: 11px;
    font-weight: 600;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.leaderboard-class {
    max-width: 72px;
    color: #767a76;
    font-size: 8px;
    text-transform: uppercase;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.leaderboard-score {
    min-width: 46px;
    color: var(--p-metal-light);
    font-size: 11px;
    text-align: right;
}

.guild-logo {
    display: inline-flex;
    width: 24px;
    height: 24px;
    align-items: center;
    justify-content: center;
}

.guild-logo img { max-width: 24px; max-height: 24px; }

/* Events */
.event-list { padding: 4px 18px 12px; }

.event-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    min-height: 49px;
    border-bottom: 1px solid rgba(255,255,255,.05);
}

.event-row:last-child { border-bottom: 0; }
.event-name { display: block; color: #d1cdc4; font-size: 11px; font-weight: 600; }
.event-time { min-width: 78px; text-align: right; }
.event-time strong { display: block; color: var(--p-metal-light); font-size: 11px; }
.event-time span { display: block; color: #777c77; font-size: 8px; }

.home-empty-state {
    padding: 30px 10px;
    color: #777c78;
    font-size: 11px;
    text-align: center;
}

/* Native WebEngine modules: shared premium treatment */
body.premium-site .panel,
body.premium-site .thumbnail,
body.premium-site .well {
    background: linear-gradient(180deg, rgba(16,21,27,.98), rgba(10,13,17,.98));
    border: 1px solid rgba(255,255,255,.08);
    border-radius: var(--p-radius);
    box-shadow: 0 18px 45px rgba(0,0,0,.18);
}

body.premium-site .panel-heading {
    color: #ddd8ce;
    background: rgba(255,255,255,.02);
    border-bottom: 1px solid rgba(255,255,255,.07);
}

body.premium-site .panel-title {
    color: #ddd8ce;
    font-family: var(--p-font-display);
    font-weight: 600;
}

body.premium-site .panel-body,
body.premium-site .well {
    color: #a9aaa6;
}

body.premium-site .table {
    color: #aaa9a4;
    background: transparent;
}

body.premium-site .table > thead > tr > th {
    color: var(--p-metal);
    border-bottom: 1px solid rgba(199,166,106,.18) !important;
    font-size: 9px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

body.premium-site .table > tbody > tr > td,
body.premium-site .table > tbody > tr > th,
body.premium-site .table > tfoot > tr > td,
body.premium-site .table > tfoot > tr > th {
    border-top: 1px solid rgba(255,255,255,.055) !important;
}

body.premium-site .table > tbody > tr:hover { background: rgba(255,255,255,.02); }

body.premium-site .btn-primary {
    color: #15110a !important;
    background: var(--p-metal) !important;
    border-color: var(--p-metal) !important;
}

body.premium-site .btn-primary:hover,
body.premium-site .btn-primary:focus {
    color: #0b0906 !important;
    background: var(--p-metal-light) !important;
    border-color: var(--p-metal-light) !important;
}

body.premium-site .alert {
    color: #d7d2c8;
    background: rgba(255,255,255,.04);
    border: 1px solid rgba(255,255,255,.09);
}

body.premium-site .pagination > li > a,
body.premium-site .pagination > li > span {
    color: #aaa69e;
    background: #0d1116;
    border-color: rgba(255,255,255,.08);
}

body.premium-site .pagination > .active > a,
body.premium-site .pagination > .active > span {
    color: #17130c;
    background: var(--p-metal);
    border-color: var(--p-metal);
}

body.premium-site .breadcrumb {
    background: transparent;
    border-bottom: 1px solid rgba(255,255,255,.06);
    border-radius: 0;
    color: #777c78;
}

body.premium-site .breadcrumb > .active { color: #a4a39e; }

body.premium-site .form-group label,
body.premium-site .control-label {
    color: #aaa69e;
    font-size: 10px;
    letter-spacing: .06em;
    text-transform: uppercase;
}

body.premium-site .checkbox label,
body.premium-site .radio label { color: #9d9e99; }

/* Existing profile/castle components sit inside the same visual system. */
body.premium-site .profile-container,
body.premium-site .castle-owner-widget {
    border-color: rgba(199,166,106,.15);
}

/* Sidebar / footer */
.sidebar-banner {
    margin: 0 0 16px;
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: var(--p-radius);
}

.sidebar-banner img {
    display: block;
    width: 100%;
    height: auto;
}

.footer {
    width: min(100%, var(--p-container)) !important;
    margin: 0 auto 40px !important;
    padding: 30px !important;
    color: #767b77 !important;
    background: rgba(8,10,13,.96) !important;
    border: 1px solid rgba(255,255,255,.07);
    border-radius: var(--p-radius) !important;
    box-shadow: var(--p-shadow);
}

.footer > .footer-container { width: 100% !important; }
.footer a { color: #969892 !important; }
.footer a:hover,
.footer a:focus { color: var(--p-metal-light) !important; }
.footer hr { border-color: rgba(255,255,255,.07) !important; }
.footer .footer-social-link img { opacity: .58; transition: opacity .2s ease, transform .2s ease; }
.footer .footer-social-link:hover img,
.footer .footer-social-link:focus img { opacity: 1; transform: translateY(-2px); }

/* Native WebEngine header info is hidden because the premium shell owns server status. */
body.premium-site .header-info-container:not(.compact-server-info) { display: none !important; }

/* Final QA / native WebEngine compatibility -------------------------------- */
body.premium-site .container,
body.premium-site .container-fluid {
    box-sizing: border-box;
}

body.premium-site .table-responsive {
    -webkit-overflow-scrolling: touch;
}

body.premium-site button,
body.premium-site input,
body.premium-site select,
body.premium-site textarea {
    font: inherit;
}

body.premium-site .nav-menu > ul > li > a:focus-visible,
body.premium-site .nav-toggle:focus-visible,
body.premium-site .btn:focus-visible,
body.premium-site input:focus-visible,
body.premium-site select:focus-visible,
body.premium-site textarea:focus-visible,
body.premium-site summary:focus-visible {
    outline: 2px solid var(--p-metal-light);
    outline-offset: 2px;
}

@media (max-width: 767px) {
    .premium-container { width: calc(100% - 32px); }
    .hero-content { width: calc(100% - 32px); }
}

/* Responsive */
@media (max-width: 1199px) {
    :root { --p-container: 1040px; }
    .site-nav-inner,
    .site-utility-inner { width: min(100% - 40px, var(--p-container)); }
    .hero-content { gap: 40px; padding-left: 24px; padding-right: 24px; }
    #content.site-content { padding-left: 24px !important; padding-right: 24px !important; }
}

@media (max-width: 991px) {
    .nav-toggle { display: block; }
    .nav-menu {
        position: absolute;
        left: 0;
        right: 0;
        top: 100%;
        display: none;
        padding: 8px 20px 18px;
        background: rgba(7,9,12,.98);
        border-bottom: 1px solid rgba(199,166,106,.16);
    }
    .nav-menu.is-open { display: block; }
    .nav-menu > ul { display: block !important; }
    .nav-menu > ul > li > a { padding: 13px 10px !important; }
    .nav-menu > ul > li > a::after { left: 10px; right: auto; width: 30px; }

    .hero-content {
        grid-template-columns: 1fr;
        max-width: 760px;
        gap: 28px;
    }
    .hero-status { max-width: 520px; }
    .home-grid-top { grid-template-columns: 1fr; }
    .home-grid-bottom { grid-template-columns: 1fr; }
    .page-sidebar-column { position: static; margin-top: 20px; }
    .server-clock { margin-left: 0; }
}

@media (max-width: 767px) {
    .site-utility-inner { width: calc(100% - 24px); min-height: 38px; }
    .topbar-left { max-width: 55%; overflow-x: auto; }
    .topbar-right { white-space: nowrap; }

    .site-nav-inner { width: calc(100% - 24px); min-height: 60px; }
    .nav-brand img { max-height: 42px; }

    .premium-hero { min-height: 640px; }
    .hero-content { padding: 70px 20px 90px; }
    .hero-copy h1 { font-size: clamp(38px, 12vw, 56px); }
    .hero-lead { font-size: 15px; }
    .hero-actions .btn { flex: 1 1 100%; }

    .inner-header-content { padding: 36px 20px 26px; flex-direction: column; align-items: flex-start; }
    .inner-server-state { align-self: flex-start; }

    .server-strip { padding: 10px 20px; gap: 8px 14px; }
    #content.site-content { padding: 0 16px 50px !important; }

    .home-intro-strip,
    .home-section-heading { align-items: flex-start; flex-direction: column; }
    .home-intro-links { justify-content: flex-start; }
    .home-section-heading h2 { font-size: 24px; }

    .home-news-item { grid-template-columns: 48px minmax(0, 1fr); }
    .home-news-arrow { display: none; }

    .leaderboard-row { grid-template-columns: 24px minmax(0,1fr) auto; }
    .leaderboard-class { display: none; }

    .footer { margin-bottom: 20px !important; padding: 24px 18px !important; }
    .footer .row > [class*="col-"] { width: 100%; margin-bottom: 18px; }
}

@media (max-width: 480px) {
    body.premium-site .admincp-button {
        right: 12px !important;
        top: 4px !important;
    }

    .site-utility-inner { padding: 0 12px; }
    .topbar-left { display: none; }
    .topbar-right { width: 100%; justify-content: flex-end; }
    .site-nav-inner { padding: 0; }
    .nav-brand { min-width: 0; }
    .nav-brand img { max-width: 170px; }

    .premium-hero { min-height: 610px; }
    .hero-content { padding-left: 16px; padding-right: 16px; }
    .hero-status { padding: 20px; }
    .status-number { font-size: 42px; }
    .status-meta { display: grid; grid-template-columns: repeat(2, 1fr); }

    #content.site-content { padding-left: 10px !important; padding-right: 10px !important; }
    .home-panel-heading { padding-left: 15px; padding-right: 15px; }
    .home-news-list,
    .leaderboard-list,
    .event-list { padding-left: 15px; padding-right: 15px; }
    .home-news-item { gap: 9px; }
    .home-news-date strong { font-size: 18px; }

    .server-strip span { flex: 1 1 45%; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
        scroll-behavior: auto !important;
    }
}

/* Final homepage sections */
.home-features { margin: 30px 0 42px; }
.feature-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; }
.feature-card { position:relative; min-height:180px; padding:24px; background:linear-gradient(180deg,rgba(16,21,27,.96),rgba(9,12,16,.96)); border:1px solid rgba(255,255,255,.075); border-radius:var(--p-radius); box-shadow:0 18px 45px rgba(0,0,0,.18); overflow:hidden; }
.feature-card::after { content:''; position:absolute; left:24px; bottom:0; width:48px; height:2px; background:var(--p-metal); opacity:.65; }
.feature-index { display:block; color:var(--p-metal); font:700 10px/1 'Inter',sans-serif; letter-spacing:.14em; }
.feature-card h3 { margin:30px 0 8px; color:#e7e1d5; font:600 18px/1.2 'Cinzel',Georgia,serif; }
.feature-card p { margin:0; color:#858a86; font-size:12px; line-height:1.7; }
.home-community { display:flex; align-items:center; justify-content:space-between; gap:30px; margin:54px 0 38px; padding:30px; background:linear-gradient(100deg,rgba(18,23,29,.98),rgba(10,13,17,.94)); border:1px solid rgba(199,166,106,.18); border-radius:var(--p-radius); }
.community-copy { max-width:620px; }
.community-copy h2,.home-final-cta h2 { margin:6px 0 8px; color:#eee9df; font:600 28px/1.2 'Cinzel',Georgia,serif; }
.community-copy p,.home-final-cta p { margin:0; color:#858a86; font-size:12px; }
.community-actions { display:flex; flex-wrap:wrap; gap:8px; justify-content:flex-end; }
.community-action { display:inline-flex; align-items:center; gap:12px; min-width:125px; justify-content:space-between; padding:12px 14px; border:1px solid rgba(255,255,255,.1); color:#b7b3aa!important; font-size:10px; font-weight:800; letter-spacing:.1em; }
.community-action:hover,.community-action:focus { border-color:rgba(199,166,106,.45); color:var(--p-metal-light)!important; }
.home-faq { margin:38px 0 42px; }
.faq-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.faq-item { background:rgba(13,17,22,.9); border:1px solid rgba(255,255,255,.075); border-radius:var(--p-radius); }
.faq-item summary { cursor:pointer; list-style:none; padding:17px 20px; color:#d8d3ca; font-size:12px; font-weight:700; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:'+'; float:right; color:var(--p-metal); font-size:17px; font-weight:400; }
.faq-item[open] summary::after { content:'−'; }
.faq-item p { margin:0; padding:0 20px 18px; color:#838883; font-size:12px; line-height:1.7; }
.home-final-cta { display:flex; align-items:center; justify-content:space-between; gap:30px; margin:12px 0 54px; padding:34px 30px; background:linear-gradient(100deg,rgba(199,166,106,.11),rgba(13,17,22,.94) 55%); border:1px solid rgba(199,166,106,.22); border-radius:var(--p-radius); }
.home-final-cta .hero-actions { margin:0; }
@media (max-width: 991px) { .feature-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .home-community,.home-final-cta { align-items:flex-start; flex-direction:column; } .community-actions { justify-content:flex-start; } }
@media (max-width: 767px) { .feature-grid,.faq-grid { grid-template-columns:1fr; } .feature-card { min-height:0; } .home-community,.home-final-cta { padding:24px 20px; } .community-actions { width:100%; } .community-action { flex:1 1 140px; } .community-copy h2,.home-final-cta h2 { font-size:23px; } }

/* ========================================================================
   FINAL INNER-PAGE SYSTEM
   One presentation layer for native WebEngine modules.
   ======================================================================== */
.inner-page-shell {
    padding: 30px 0 10px;
}

.inner-page-shell > .page-title {
    position: relative;
    margin: 0 0 24px !important;
    padding: 0 0 14px !important;
    color: #ece7dd !important;
    background: transparent !important;
    border: 0 !important;
    border-bottom: 1px solid rgba(199,166,106,.16) !important;
    font: 600 28px/1.2 'Cinzel', Georgia, serif !important;
    text-transform: none !important;
    letter-spacing: .01em !important;
}

.inner-page-shell > .page-title::after {
    content: '';
    display: block;
    width: 52px;
    height: 2px;
    margin-top: 12px;
    background: var(--p-metal);
}

.inner-page-shell .help-block {
    color: #737873;
    font-size: 11px;
    line-height: 1.6;
}

/* Authentication / registration */
body[data-page="login"] .inner-page-shell > .col-xs-8,
body[data-page="register"] .inner-page-shell > .col-xs-8,
body[data-page="forgotpassword"] .inner-page-shell > .col-xs-8,
body[data-page="verifyemail"] .inner-page-shell > .col-xs-8 {
    float: none;
    width: min(680px, 100%);
    margin: 18px auto 0;
    padding: 28px;
    background: linear-gradient(180deg, rgba(15,20,26,.98), rgba(9,12,16,.98));
    border: 1px solid rgba(255,255,255,.075);
    border-radius: var(--p-radius);
    box-shadow: 0 20px 55px rgba(0,0,0,.24);
}

body[data-page="login"] .form-horizontal .form-group,
body[data-page="register"] .form-horizontal .form-group {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 18px;
}

body[data-page="login"] .form-horizontal .control-label,
body[data-page="register"] .form-horizontal .control-label {
    padding-top: 12px;
}

body[data-page="login"] .form-horizontal .col-sm-8,
body[data-page="register"] .form-horizontal .col-sm-8,
body[data-page="login"] .form-horizontal .col-sm-offset-4,
body[data-page="register"] .form-horizontal .col-sm-offset-4 {
    padding-left: 0;
    padding-right: 0;
}

/* Native panels / content modules */
.inner-page-shell > .panel,
.inner-page-shell > .row > .panel,
.inner-page-shell .panel-news,
.inner-page-shell .panel-downloads {
    margin-bottom: 18px;
}

.inner-page-shell .panel-title {
    font-size: 14px;
    letter-spacing: .02em;
}

.inner-page-shell .panel-heading {
    padding: 16px 18px;
}

.inner-page-shell .panel-body {
    padding: 20px;
}

.inner-page-shell .table-responsive {
    border: 0;
}

.inner-page-shell .table {
    margin-bottom: 0;
}

.inner-page-shell .table > tbody > tr > td,
.inner-page-shell .table > tbody > tr > th {
    vertical-align: middle;
}

.inner-page-shell .download-description {
    display: inline-block;
    margin-top: 5px;
    color: #727773;
    font-size: 11px;
    line-height: 1.5;
}

/* Rankings */
body[data-page="rankings"] .rankings-table {
    width: 100%;
}

body[data-page="rankings"] .rankings-table-place {
    color: var(--p-metal);
    font-weight: 800;
}

body[data-page="rankings"] .rankings-update-time {
    color: #696e6a;
    font-size: 10px;
}

body[data-page="rankings"] .rankings-class-filter {
    margin: 0 0 22px;
    padding: 12px;
    background: rgba(255,255,255,.02);
    border: 1px solid rgba(255,255,255,.07);
    border-radius: var(--p-radius);
}

body[data-page="rankings"] .rankings-class-filter-selection {
    color: #aaa69e;
}

body[data-page="rankings"] .rankings-class-filter-selection img {
    box-shadow: 0 0 0 1px rgba(255,255,255,.07);
}

/* UserCP dashboard */

body[data-page="usercp"] .inner-page-shell > .row {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin: 0;
}

body[data-page="usercp"] .inner-page-shell > .row > [class*="col-"] {
    float: none;
    width: auto;
    margin: 0 !important;
    padding: 0;
}

body[data-page="usercp"] .inner-page-shell > .row > [class*="col-"] > a {
    display: flex;
    min-height: 170px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    padding: 22px 14px;
    color: #bcb8af !important;
    background: linear-gradient(180deg, rgba(16,21,27,.98), rgba(9,12,16,.98));
    border: 1px solid rgba(255,255,255,.075);
    border-radius: var(--p-radius);
    transition: border-color .2s ease, transform .2s ease, background .2s ease;
}

body[data-page="usercp"] .inner-page-shell > .row > [class*="col-"] > a:hover,
body[data-page="usercp"] .inner-page-shell > .row > [class*="col-"] > a:focus {
    color: var(--p-metal-light) !important;
    background: linear-gradient(180deg, rgba(22,28,36,.98), rgba(10,14,19,.98));
    border-color: rgba(199,166,106,.35);
    transform: translateY(-2px);
}

body[data-page="usercp"] .inner-page-shell > .row > [class*="col-"] img {
    width: 64px !important;
    max-width: 64px;
    height: 64px;
    object-fit: contain;
    opacity: .78;
}

/* Donations / store */
body[data-page="donation"] .inner-page-shell > .row {
    margin: 0;
}

body[data-page="donation"] .inner-page-shell .thumbnail {
    max-width: 280px;
    margin: 0;
    padding: 0;
    background: #0b0f14;
    border-color: rgba(199,166,106,.18);
    overflow: hidden;
}

body[data-page="donation"] .inner-page-shell .thumbnail:hover {
    border-color: rgba(199,166,106,.5);
}

/* News */
body[data-page="news"] .panel-news .panel-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
}

body[data-page="news"] .panel-news .panel-footer {
    color: #737873;
    background: rgba(255,255,255,.018);
    border-top-color: rgba(255,255,255,.06);
}

/* Info / server information */
body[data-page="info"] .table > tbody > tr > td:first-child {
    width: 42%;
    color: #888c88;
    font-weight: 700;
}

body[data-page="info"] .table > tbody > tr > td:last-child {
    color: #d2cec5;
    font-weight: 600;
}




/* ========================================================================
   USERCP — COMPLETE RESTRUCTURE
   One presentation system shared by the dashboard and every native
   UserCP submodule. No module business logic is implemented here.
   ======================================================================== */
.ucp-dashboard,
.ucp-module {
    width: 100%;
    min-width: 0;
}

.ucp-dashboard-header,
.ucp-module-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 24px;
    margin: 0 0 24px;
    padding: 0 0 18px;
    border-bottom: 1px solid rgba(199,166,106,.18);
}

.ucp-module-kicker {
    display: block;
    margin-bottom: 7px;
    color: var(--p-metal);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.ucp-dashboard-header h2,
.ucp-module-header h2 {
    margin: 0;
    color: #ece7dd;
    font: 600 28px/1.2 'Cinzel', Georgia, serif;
}

.ucp-dashboard-header p {
    max-width: 680px;
    margin: 9px 0 0;
    color: #7e837f;
    font-size: 12px;
    line-height: 1.65;
}

.ucp-dashboard-home {
    flex: 0 0 auto;
    padding: 10px 14px;
    color: #aaa69e !important;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 3px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .08em;
    text-decoration: none !important;
}

.ucp-dashboard-home:hover,
.ucp-dashboard-home:focus-visible {
    color: var(--p-metal-light) !important;
    border-color: rgba(199,166,106,.35);
}

.ucp-dashboard-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
}

.ucp-dashboard-card {
    position: relative;
    display: flex;
    min-height: 168px;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 13px;
    padding: 22px;
    color: #bcb8af !important;
    background: linear-gradient(180deg, rgba(16,21,27,.98), rgba(9,12,16,.98));
    border: 1px solid rgba(255,255,255,.075);
    border-radius: var(--p-radius);
    text-decoration: none !important;
    overflow: hidden;
    transition: border-color .2s ease, transform .2s ease, background .2s ease;
}

.ucp-dashboard-card::before {
    content: '';
    position: absolute;
    inset: 0 0 auto;
    height: 2px;
    background: linear-gradient(90deg, transparent, rgba(199,166,106,.45), transparent);
    opacity: 0;
    transition: opacity .2s ease;
}

.ucp-dashboard-card:hover,
.ucp-dashboard-card:focus-visible {
    color: #e2ddd3 !important;
    background: linear-gradient(180deg, rgba(22,28,36,.98), rgba(10,14,19,.98));
    border-color: rgba(199,166,106,.35);
    transform: translateY(-2px);
}

.ucp-dashboard-card:hover::before,
.ucp-dashboard-card:focus-visible::before { opacity: 1; }

.ucp-dashboard-icon {
    display: grid;
    width: 52px;
    height: 52px;
    place-items: center;
    border: 1px solid rgba(199,166,106,.16);
    border-radius: 4px;
    background: rgba(255,255,255,.025);
}

.ucp-dashboard-icon img {
    width: 34px !important;
    height: 34px !important;
    object-fit: contain;
    opacity: .82;
}

.ucp-dashboard-title {
    padding-right: 22px;
    font-size: 13px;
    font-weight: 700;
    line-height: 1.35;
}

.ucp-dashboard-arrow {
    position: absolute;
    right: 18px;
    bottom: 17px;
    color: var(--p-metal);
    font-size: 17px;
}

.ucp-module-content {
    width: 100%;
    min-width: 0;
}

.ucp-module-content > .page-title { display: none !important; }

.ucp-subsection-title {
    margin: 28px 0 14px;
    padding: 0 0 10px;
    color: #ddd8ce;
    border-bottom: 1px solid rgba(255,255,255,.06);
    font: 600 18px/1.3 'Cinzel', Georgia, serif;
}

.ucp-module-content .panel,
.ucp-module-content .panel-addstats,
.ucp-module-content .panel-general,
.ucp-module-content .panel-downloads {
    margin-bottom: 18px;
    background: linear-gradient(180deg, rgba(16,21,27,.98), rgba(9,12,16,.98));
    border: 1px solid rgba(255,255,255,.075);
    border-radius: var(--p-radius);
    box-shadow: none;
}

.ucp-module-content .panel-heading {
    padding: 15px 18px;
    color: #d8d3ca;
    background: rgba(255,255,255,.018);
    border-bottom: 1px solid rgba(255,255,255,.06);
}

.ucp-module-content .panel-body { padding: 20px; }

.ucp-module-content .form-horizontal .form-group {
    margin-left: 0;
    margin-right: 0;
    margin-bottom: 16px;
}

.ucp-module-content .form-horizontal .control-label {
    color: #aaa69e;
}

.ucp-module-content .form-control {
    min-height: 40px;
    color: #ddd8ce;
    background: #0b0f14;
    border-color: rgba(255,255,255,.09);
}

.ucp-module-content .form-control:focus {
    border-color: rgba(199,166,106,.45);
    box-shadow: 0 0 0 2px rgba(199,166,106,.08);
}

.ucp-module-content .btn {
    min-height: 36px;
    border-radius: 3px;
}

.ucp-module-content .general-table-ui,
.ucp-module-content table.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px;
}

.ucp-module-content .general-table-ui td,
.ucp-module-content .general-table-ui th,
.ucp-module-content table.table td,
.ucp-module-content table.table th {
    vertical-align: middle;
    border-color: rgba(255,255,255,.055);
}

.ucp-module-content .general-table-ui img {
    max-width: 50px;
}

.ucp-module-content .module-requirements {
    margin: 18px 0 26px;
    padding: 14px 18px;
    color: #858984;
    background: rgba(255,255,255,.018);
    border: 1px solid rgba(255,255,255,.06);
    border-radius: var(--p-radius);
}

.ucp-module-content .module-requirements p { margin: 4px 0; }

.ucp-module-content .myaccount-table {
    width: 100%;
    margin-bottom: 26px;
}

.ucp-module-content .myaccount-table td:first-child {
    width: 34%;
    color: #a8a49b;
    font-weight: 700;
}

.ucp-module-content .myaccount-table td:last-child { color: #d6d1c7; }

.ucp-module-content .myaccount-character-name {
    margin-bottom: 8px;
    color: #ddd8ce;
    font-weight: 700;
}

.ucp-module-content .myaccount-character-block {
    background: rgba(255,255,255,.025);
    border-color: rgba(199,166,106,.22);
}

.ucp-module-content .myaccount-character-block-location { color: #777d79; }

.ucp-module-content .myaccount-character-block-level {
    background: var(--p-metal);
    color: #17130c;
}

.ucp-module-content .panel-addstats .panel-body { display: flow-root; }
.ucp-module-content .panel-addstats .character-avatar { padding-right: 18px !important; }
.ucp-module-content .panel-addstats .character-name { color: #ddd8ce; }

.ucp-module-content .table-responsive {
    border: 0;
}

@media (max-width: 1100px) {
    .ucp-dashboard-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
    .ucp-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ucp-dashboard-header, .ucp-module-header { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 767px) {
    .ucp-dashboard-grid { grid-template-columns: 1fr; }
    .ucp-dashboard-header h2, .ucp-module-header h2 { font-size: 23px; }
    .ucp-dashboard-card { min-height: 125px; }
    .ucp-module-content .myaccount-table td:first-child { width: 40%; }
    .ucp-module-content .panel-addstats .character-avatar,
    .ucp-module-content .panel-addstats .col-xs-9 {
        float: none;
        width: 100%;
        padding-left: 0 !important;
        padding-right: 0 !important;
        text-align: center;
    }
    .ucp-module-content .panel-addstats .col-sm-10 {
        float: none;
        width: 100%;
        margin-top: 18px;
    }
    .ucp-module-content .general-table-ui,
    .ucp-module-content table.table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}

/* Final visual QA: keep the shell geometry independent from Bootstrap's legacy widths. */
body.premium-site #content.site-content > .page-main-column,
body.premium-site #content.site-content > .home-command-center,
body.premium-site #content.site-content > .home-community,
body.premium-site #content.site-content > .home-faq,
body.premium-site #content.site-content > .home-final-cta {
    width: 100%;
    max-width: 100%;
}

body.premium-site .home-command-center,
body.premium-site .home-community,
body.premium-site .home-faq,
body.premium-site .home-final-cta {
    box-sizing: border-box;
}

body.premium-site .home-grid > *,
body.premium-site .feature-grid > *,
body.premium-site .faq-grid > * {
    min-width: 0;
}

/* Never allow long module content to force horizontal scrolling. */
body.premium-site .inner-page-shell,
body.premium-site .page-main-column,
body.premium-site .home-command-center {
    overflow-wrap: anywhere;
}

/* Preserve readable table geometry while allowing narrow screens to scroll tables only. */
body.premium-site .inner-page-shell table {
    max-width: 100%;
}

/* Keep the footer aligned with the same content grid as the header. */
body.premium-site > .footer {
    box-sizing: border-box;
    width: min(calc(100% - 60px), var(--p-container)) !important;
}

/* Castle Siege */
body[data-page="castlesiege"] .castle-siege-block > h2 {
    margin: 28px 0 12px;
    color: #e2ddd3;
    font: 600 20px/1.25 'Cinzel', Georgia, serif;
}

body[data-page="castlesiege"] .castle-siege-block > hr {
    border-color: rgba(255,255,255,.06);
}

/* Sidebar on UserCP inner pages */
.page-sidebar-column .panel-sidebar {
    margin-bottom: 16px;
}

.page-sidebar-column .sidebar-banner img {
    width: 100%;
}

.page-sidebar-column .panel-title {
    font-size: 12px;
}

/* Prevent native Bootstrap float rules from collapsing premium grids. */
body.premium-site .inner-page-shell::after,
body.premium-site .page-layout::after {
    display: none;
}

@media (max-width: 991px) {
    body[data-page="usercp"] .inner-page-shell > .row {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 767px) {
    .inner-page-shell {
        padding-top: 22px;
    }

    .inner-page-shell > .page-title {
        font-size: 23px !important;
    }

    body[data-page="usercp"] .inner-page-shell > .row {
        grid-template-columns: 1fr;
    }

    body[data-page="usercp"] .inner-page-shell > .row > [class*="col-"] > a {
        min-height: 120px;
    }

    body[data-page="login"] .inner-page-shell > .col-xs-8,
    body[data-page="register"] .inner-page-shell > .col-xs-8,
    body[data-page="forgotpassword"] .inner-page-shell > .col-xs-8,
    body[data-page="verifyemail"] .inner-page-shell > .col-xs-8 {
        width: 100%;
        padding: 20px;
    }

    body[data-page="login"] .form-horizontal .control-label,
    body[data-page="register"] .form-horizontal .control-label {
        padding-top: 0;
        margin-bottom: 7px;
        text-align: left;
    }

    body[data-page="login"] .form-horizontal .col-sm-4,
    body[data-page="register"] .form-horizontal .col-sm-4,
    body[data-page="login"] .form-horizontal .col-sm-8,
    body[data-page="register"] .form-horizontal .col-sm-8,
    body[data-page="login"] .form-horizontal .col-sm-offset-4,
    body[data-page="register"] .form-horizontal .col-sm-offset-4 {
        width: 100%;
        margin-left: 0;
    }
}

/* ========================================================================
   UserCP V10 — complete two-column shell
   The UserCP is intentionally independent from Bootstrap's .row/.col-* grid.
   ======================================================================== */
body.premium-site .ucp-layout {
    width: 100%;
    max-width: var(--p-container);
    margin: 0 auto;
    padding: 34px 0 70px;
    display: grid;
    grid-template-columns: 270px minmax(0, 1fr);
    gap: 28px;
    align-items: start;
}

body.premium-site .ucp-sidebar {
    min-width: 0;
    position: sticky;
    top: 18px;
}

body.premium-site .ucp-main {
    min-width: 0;
}

body.premium-site .ucp-main .inner-page-shell {
    width: 100%;
    max-width: none;
    padding: 0;
    margin: 0;
    background: transparent;
    border: 0;
}

body.premium-site .ucp-sidebar-card {
    margin: 0 0 14px;
    padding: 0;
    overflow: hidden;
    background: linear-gradient(180deg, rgba(17,22,28,.98), rgba(10,13,17,.98));
    border: 1px solid rgba(199,166,106,.18);
    box-shadow: 0 18px 45px rgba(0,0,0,.20);
}

body.premium-site .ucp-account-card {
    padding: 18px 18px 16px;
}

.ucp-account-card-top,
.ucp-sidebar-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.ucp-sidebar-kicker,
.ucp-sidebar-heading span:first-child {
    color: var(--p-metal);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .16em;
    text-transform: uppercase;
}

.ucp-online-dot {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--p-success);
    box-shadow: 0 0 0 4px rgba(139,182,111,.08);
}

.ucp-account-name {
    display: block;
    margin-top: 8px;
    color: #eee9df;
    font-family: var(--p-font-display);
    font-size: 19px;
    font-weight: 600;
}

.ucp-account-logout {
    display: inline-flex;
    gap: 6px;
    margin-top: 7px;
    color: #9d9a94 !important;
    font-size: 10px;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.ucp-account-logout:hover { color: var(--p-metal-light) !important; }

.ucp-navigation-card { padding: 16px 0 8px; }
.ucp-navigation-card .ucp-sidebar-heading { padding: 0 16px 12px; border-bottom: 1px solid rgba(255,255,255,.07); }
.ucp-navigation-card .ucp-sidebar-heading a { color: #8e8e8b; font-size: 9px; letter-spacing: .1em; }

.ucp-navigation > ul,
.ucp-navigation .usercp-menu,
.ucp-navigation .usercp-menu-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.ucp-navigation li { margin: 0; padding: 0; }
.ucp-navigation li a {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 40px;
    padding: 0 16px;
    border-bottom: 1px solid rgba(255,255,255,.055);
    color: #b4b2ad !important;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: .02em;
    transition: background .16s ease, color .16s ease, padding .16s ease;
}

.ucp-navigation li:last-child a { border-bottom: 0; }
.ucp-navigation li a:hover,
.ucp-navigation li a:focus-visible {
    padding-left: 20px;
    background: rgba(199,166,106,.07);
    color: var(--p-metal-light) !important;
    outline: 0;
}

.ucp-navigation li a img {
    width: 16px;
    height: 16px;
    flex: 0 0 16px;
    object-fit: contain;
}

.ucp-side-action { padding: 0; }
.ucp-side-banner-link { position: relative; display: block; overflow: hidden; }
.ucp-side-banner-link img { display: block; width: 100%; height: 92px; object-fit: cover; opacity: .62; }
.ucp-side-banner-link::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(5,7,9,.92), rgba(5,7,9,.25)); }
.ucp-side-banner-link span { position: absolute; z-index: 1; inset: 0; display: flex; flex-direction: column; justify-content: center; padding: 0 15px; color: #e9e4da; font-size: 11px; font-weight: 800; letter-spacing: .06em; }
.ucp-side-banner-link small { margin-bottom: 4px; color: var(--p-metal); font-size: 8px; letter-spacing: .16em; }
.ucp-side-banner-link b { margin-top: 5px; color: var(--p-metal-light); }

.ucp-server-card { padding: 15px 16px 10px; }
.ucp-status-live { color: var(--p-success); font-size: 8px; letter-spacing: .12em; }
.ucp-server-list { margin: 12px 0 0; }
.ucp-server-list > div { display: flex; justify-content: space-between; gap: 12px; padding: 7px 0; border-top: 1px solid rgba(255,255,255,.055); }
.ucp-server-list dt { color: #7f817f; font-size: 10px; font-weight: 500; }
.ucp-server-list dd { margin: 0; color: #d8d4ca; font-size: 10px; font-weight: 700; text-align: right; }
.ucp-server-list dd.is-online { color: var(--p-success); }

.ucp-side-castle { padding: 0; }
.ucp-side-castle .panel,
.ucp-side-castle .castle-siege-widget { margin: 0 !important; border: 0 !important; box-shadow: none !important; }

.ucp-login-form { padding: 16px; }
.ucp-login-form label { display: block; margin: 0 0 5px; color: #8b8b88; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.ucp-login-form input { width: 100%; margin: 0 0 12px; padding: 9px 10px; background: #090c10; border: 1px solid rgba(255,255,255,.09); color: #eee; }
.ucp-login-form .btn { width: 100%; }

body.premium-site .ucp-module {
    width: 100%;
    margin: 0;
    padding: 0;
    background: transparent;
    border: 0;
}

body.premium-site .ucp-module-header {
    margin: 0 0 20px;
    padding: 0 0 17px;
    border-bottom: 1px solid rgba(199,166,106,.18);
}

body.premium-site .ucp-module-header h2 {
    margin: 5px 0 0;
    color: #eee9df;
    font-family: var(--p-font-display);
    font-size: 26px;
    line-height: 1.2;
}

body.premium-site .ucp-module-content {
    width: 100%;
    min-width: 0;
    padding: 0;
}

body.premium-site .ucp-module-content > .panel,
body.premium-site .ucp-module-content > table,
body.premium-site .ucp-module-content > .module-requirements,
body.premium-site .ucp-module-content > form,
body.premium-site .ucp-module-content > .row,
body.premium-site .ucp-module-content > .alert {
    margin-left: 0;
    margin-right: 0;
}

body.premium-site .ucp-module-content .general-table-ui,
body.premium-site .ucp-module-content table.table {
    width: 100%;
    background: rgba(10,13,17,.94);
    border: 1px solid rgba(255,255,255,.07);
}

body.premium-site .ucp-module-content .general-table-ui > tbody > tr:first-child,
body.premium-site .ucp-module-content table.table > tbody > tr:first-child {
    background: rgba(0,0,0,.35);
}

body.premium-site .ucp-module-content .general-table-ui td,
body.premium-site .ucp-module-content .general-table-ui th,
body.premium-site .ucp-module-content table.table td,
body.premium-site .ucp-module-content table.table th {
    padding: 12px 13px;
    border-color: rgba(255,255,255,.06);
    vertical-align: middle;
}

body.premium-site .ucp-module-content .general-table-ui td:first-child img { width: 38px; height: 38px; object-fit: contain; }
body.premium-site .ucp-module-content .general-table-ui button,
body.premium-site .ucp-module-content .btn { white-space: nowrap; }

@media (max-width: 1100px) {
    body.premium-site .ucp-layout { grid-template-columns: 240px minmax(0, 1fr); gap: 20px; padding-left: 20px; padding-right: 20px; }
}

@media (max-width: 767px) {
    body.premium-site .ucp-layout { display: flex; flex-direction: column; padding: 24px 0 55px; gap: 18px; }
    body.premium-site .ucp-sidebar,
    body.premium-site .ucp-main { width: 100%; }
    body.premium-site .ucp-sidebar { position: static; order: 2; }
    body.premium-site .ucp-main { order: 1; }
    body.premium-site .ucp-navigation li a { min-height: 44px; }
    body.premium-site .ucp-module-header h2 { font-size: 22px; }
}


/* ================================================================
   USERCP V11 — INDEPENDENT ACCOUNT APPLICATION
   The UserCP no longer uses the default WebEngine page/sidebar grid.
   ================================================================ */
body.premium-site .usercp-main-full { width:100%; max-width:1280px; margin:0 auto; }
body.premium-site .usercp-main-full .inner-page-shell { width:100%; max-width:none; margin:0; padding:0; background:transparent; border:0; box-shadow:none; }
body.premium-site .ucp-app { width:100%; }
body.premium-site .ucp-app-bar { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:16px 0; border-bottom:1px solid rgba(255,255,255,.07); }
body.premium-site .ucp-app-identity { display:flex; align-items:baseline; gap:12px; }
body.premium-site .ucp-app-identity strong { color:#eee9df; font-size:13px; letter-spacing:.04em; }
body.premium-site .ucp-back-link { color:#8d8d89; font-size:9px; letter-spacing:.13em; font-weight:800; }
body.premium-site .ucp-back-link:hover { color:var(--p-metal-light); }
body.premium-site .ucp-logout-link { color:#c7a66a; }
body.premium-site .ucp-logout-link:hover, body.premium-site .ucp-logout-link:focus-visible { color:#f0e6d2; border-color:rgba(199,166,106,.55); background:rgba(199,166,106,.07); }
body.premium-site .ucp-nav { display:flex; flex-wrap:wrap; align-items:center; gap:6px; padding:12px 0 20px; border-bottom:1px solid rgba(255,255,255,.07); }
body.premium-site .ucp-nav a { display:inline-flex; align-items:center; gap:8px; min-height:34px; padding:0 13px; border:1px solid rgba(255,255,255,.07); background:#0b0e12; color:#9a9b98; font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; transition:.16s ease; }
body.premium-site .ucp-nav a:hover, body.premium-site .ucp-nav a:focus-visible { color:#eee9df; border-color:rgba(199,166,106,.38); background:rgba(199,166,106,.07); outline:none; }
body.premium-site .ucp-nav .is-active { color:var(--p-metal-light); border-color:rgba(199,166,106,.5); background:rgba(199,166,106,.08); }
body.premium-site .ucp-nav-icon { font-size:13px; color:var(--p-metal); }
body.premium-site .ucp-nav img { width:15px; height:15px; object-fit:contain; }
body.premium-site .ucp-module-header { margin:28px 0 22px; padding:0 0 17px; border-bottom:1px solid rgba(199,166,106,.18); }
body.premium-site .ucp-module-header h2 { margin:5px 0 0; color:#eee9df; font-family: var(--p-font-display); font-size:28px; line-height:1.2; }
body.premium-site .ucp-module-content { width:100%; padding:0; }
body.premium-site .ucp-dashboard-intro { padding:22px 24px; margin-bottom:20px; border:1px solid rgba(255,255,255,.08); background:linear-gradient(135deg,rgba(16,19,23,.96),rgba(9,11,14,.96)); }
body.premium-site .ucp-dashboard-intro h3 { margin:6px 0 6px; color:#eee9df; font-family: var(--p-font-display); font-size:22px; }
body.premium-site .ucp-dashboard-intro p { margin:0; color:#8f918e; font-size:12px; }
body.premium-site .ucp-service-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
body.premium-site .ucp-service-card { display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:center; gap:13px; min-height:86px; padding:15px; border:1px solid rgba(255,255,255,.08); background:#0b0e12; color:inherit; transition:.16s ease; }
body.premium-site .ucp-service-card:hover { border-color:rgba(199,166,106,.4); background:#101318; transform:translateY(-1px); }
body.premium-site .ucp-service-icon { display:grid; place-items:center; width:42px; height:42px; border:1px solid rgba(199,166,106,.2); background:#080a0d; }
body.premium-site .ucp-service-icon img { width:22px; height:22px; object-fit:contain; }
body.premium-site .ucp-service-copy { display:flex; flex-direction:column; gap:4px; min-width:0; }
body.premium-site .ucp-service-copy small { color:#777b78; font-size:8px; letter-spacing:.13em; }
body.premium-site .ucp-service-copy strong { color:#ddd8ce; font-size:12px; }
body.premium-site .ucp-service-arrow { color:var(--p-metal); font-size:18px; }
body.premium-site .ucp-table-wrap { width:100%; overflow-x:auto; border:1px solid rgba(255,255,255,.08); background:#0a0d11; }
body.premium-site .ucp-data-table { width:100%; min-width:720px; border-collapse:collapse; }
body.premium-site .ucp-data-table th { padding:12px 14px; background:#07090c; border-bottom:1px solid rgba(199,166,106,.25); color:#777b78; font-size:8px; letter-spacing:.13em; text-align:left; text-transform:uppercase; white-space:nowrap; }
body.premium-site .ucp-data-table td { padding:12px 14px; border-bottom:1px solid rgba(255,255,255,.055); color:#c5c2bb; font-size:11px; vertical-align:middle; }
body.premium-site .ucp-data-table tr:last-child td { border-bottom:0; }
body.premium-site .ucp-data-table tbody tr:hover { background:rgba(255,255,255,.025); }
body.premium-site .ucp-character-cell { display:flex; align-items:center; gap:10px; min-width:170px; }
body.premium-site .ucp-character-cell img { width:36px; height:36px; object-fit:cover; border:1px solid rgba(199,166,106,.18); }
body.premium-site .ucp-character-cell strong { color:#e6e1d7; font-size:12px; }
body.premium-site .ucp-inline-form { margin:0; }
body.premium-site .ucp-button { display:inline-flex; align-items:center; justify-content:center; min-height:36px; padding:0 15px; border:1px solid rgba(199,166,106,.45); background:#c7a66a; color:#080a0d; font-size:9px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; transition:.16s ease; }
body.premium-site .ucp-button:hover, body.premium-site .ucp-button:focus-visible { background:#e1c58b; border-color:#e1c58b; outline:none; }
body.premium-site .ucp-requirements { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin-top:14px; padding:14px; border:1px solid rgba(255,255,255,.07); background:#0b0e12; }
body.premium-site .ucp-requirements-title { grid-column:1/-1; color:#b9975a; font-size:8px; letter-spacing:.14em; font-weight:900; text-transform:uppercase; }
body.premium-site .ucp-requirement { padding:9px 10px; border:1px solid rgba(255,255,255,.055); color:#858985; font-size:10px; line-height:1.5; }
body.premium-site .ucp-character-card { margin-bottom:14px; padding:18px; border:1px solid rgba(255,255,255,.08); background:#0b0e12; }
body.premium-site .ucp-character-card-head { display:flex; align-items:center; justify-content:space-between; gap:20px; padding-bottom:15px; margin-bottom:16px; border-bottom:1px solid rgba(255,255,255,.07); }
body.premium-site .ucp-character-card-head .ucp-character-cell img { width:52px; height:52px; }
body.premium-site .ucp-character-cell div { display:flex; flex-direction:column; gap:3px; }
body.premium-site .ucp-character-cell div span, .ucp-points-badge span { color:#777b78; font-size:8px; letter-spacing:.12em; }
body.premium-site .ucp-points-badge { text-align:right; }
body.premium-site .ucp-points-badge strong { display:block; margin-top:3px; color:#eee9df; font-size:20px; }
body.premium-site .ucp-stats-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
body.premium-site .ucp-stats-grid label, .ucp-form-grid label, .ucp-form-stack label, .ucp-form-grid-3 label { display:flex; flex-direction:column; gap:7px; color:#858985; font-size:9px; font-weight:800; letter-spacing:.08em; text-transform:uppercase; }
body.premium-site .ucp-stats-grid em { color:#b9975a; font-style:normal; }
body.premium-site .ucp-stats-grid input, body.premium-site .ucp-form-grid input, body.premium-site .ucp-form-stack input, body.premium-site .ucp-form-grid-3 select { width:100%; min-height:42px; box-sizing:border-box; padding:0 12px; border:1px solid rgba(255,255,255,.09); background:#07090c; color:#eee9df; outline:none; }
body.premium-site .ucp-stats-grid input:focus, body.premium-site .ucp-form-grid input:focus, body.premium-site .ucp-form-stack input:focus, body.premium-site .ucp-form-grid-3 select:focus { border-color:rgba(199,166,106,.6); box-shadow:0 0 0 2px rgba(199,166,106,.08); }
body.premium-site .ucp-form-card { padding:22px; border:1px solid rgba(255,255,255,.08); background:#0b0e12; }
body.premium-site .ucp-form-intro { margin-bottom:22px; padding-bottom:16px; border-bottom:1px solid rgba(255,255,255,.07); }
body.premium-site .ucp-form-intro span, body.premium-site .ucp-section-heading span { color:#b9975a; font-size:8px; letter-spacing:.14em; font-weight:900; }
body.premium-site .ucp-form-intro h3, body.premium-site .ucp-section-heading h3 { margin:5px 0; color:#eee9df; font-family: var(--p-font-display); font-size:20px; }
body.premium-site .ucp-form-intro p { margin:0; color:#858985; font-size:11px; }
body.premium-site .ucp-form-grid { display:grid; grid-template-columns:180px minmax(0,1fr); align-items:center; gap:15px; max-width:760px; }
body.premium-site .ucp-form-grid > input { margin:0; }
body.premium-site .ucp-form-stack { display:grid; gap:10px; max-width:680px; }
body.premium-site .ucp-form-grid-3 { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:15px; max-width:800px; }
body.premium-site .ucp-form-actions { display:flex; justify-content:flex-end; gap:10px; margin-top:20px; }
body.premium-site .ucp-info-card, body.premium-site .ucp-section-block { margin-bottom:16px; padding:20px; border:1px solid rgba(255,255,255,.08); background:#0b0e12; }
body.premium-site .ucp-info-card header { margin-bottom:12px; }
body.premium-site .ucp-info-card header span { color:#b9975a; font-size:8px; letter-spacing:.14em; font-weight:900; }
body.premium-site .ucp-info-card header h3 { margin:5px 0 0; color:#eee9df; font-family: var(--p-font-display); font-size:20px; }
body.premium-site .ucp-info-list { margin:0; }
body.premium-site .ucp-info-list > div { display:grid; grid-template-columns:220px minmax(0,1fr); gap:20px; padding:12px 0; border-top:1px solid rgba(255,255,255,.055); }
body.premium-site .ucp-info-list dt { color:#777b78; font-size:9px; letter-spacing:.08em; text-transform:uppercase; }
body.premium-site .ucp-info-list dd { margin:0; color:#d8d4ca; font-size:11px; }
body.premium-site .ucp-text-link { float:right; color:#c7a66a; font-size:9px; font-weight:800; text-transform:uppercase; }
body.premium-site .ucp-status { color:#a7a9a5; }
body.premium-site .ucp-status-online { color:#77c86c; }
body.premium-site .ucp-status-danger { color:#d46b62; }
body.premium-site .ucp-section-heading { margin-bottom:14px; }
body.premium-site .ucp-character-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
body.premium-site .ucp-character-summary { position:relative; padding:14px; border:1px solid rgba(255,255,255,.07); background:#080b0e; color:inherit; }
body.premium-site .ucp-character-summary:hover { border-color:rgba(199,166,106,.35); }
body.premium-site .ucp-character-summary-top { position:relative; width:64px; height:64px; margin-bottom:10px; }
body.premium-site .ucp-character-summary-top img { width:64px; height:64px; object-fit:cover; }
body.premium-site .ucp-online-dot { display:inline-block; width:7px; height:7px; border-radius:50%; background:#555; }
body.premium-site .ucp-character-summary-top .ucp-online-dot { position:absolute; right:-2px; bottom:-2px; border:2px solid #080b0e; width:10px; height:10px; }
body.premium-site .ucp-online-dot.is-online { background:#77c86c; }
body.premium-site .ucp-character-summary strong, .ucp-character-summary span, .ucp-character-summary small { display:block; }
body.premium-site .ucp-character-summary strong { color:#e7e2d8; font-size:12px; }
body.premium-site .ucp-character-summary span { margin-top:3px; color:#b9975a; font-size:10px; }
body.premium-site .ucp-character-summary small { margin-top:8px; color:#777b78; font-size:9px; }
body.premium-site .ucp-vote-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
body.premium-site .ucp-vote-card { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px; border:1px solid rgba(255,255,255,.08); background:#0b0e12; }
body.premium-site .ucp-vote-card span { color:#b9975a; font-size:8px; letter-spacing:.14em; }
body.premium-site .ucp-vote-card h3 { margin:5px 0; color:#eee9df; font-family: var(--p-font-display); font-size:16px; }
body.premium-site .ucp-vote-card p { margin:0; color:#858985; font-size:10px; }
@media (max-width: 900px){
 body.premium-site .usercp-main-full{padding:0 18px;box-sizing:border-box}
 body.premium-site .ucp-service-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.premium-site .ucp-character-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.premium-site .ucp-requirements{grid-template-columns:1fr 1fr}
}
@media (max-width: 640px){
 body.premium-site .ucp-app-bar{align-items:flex-start;flex-direction:column;gap:10px}
 body.premium-site .ucp-nav{overflow-x:auto;flex-wrap:nowrap;padding-bottom:12px}
 body.premium-site .ucp-nav a{flex:0 0 auto}
 body.premium-site .ucp-module-header h2{font-size:23px}
 body.premium-site .ucp-service-grid,.ucp-character-grid,.ucp-vote-grid,.ucp-form-grid-3{grid-template-columns:1fr}
 body.premium-site .ucp-requirements{grid-template-columns:1fr}
 body.premium-site .ucp-requirements-title{grid-column:auto}
 body.premium-site .ucp-character-card-head{align-items:flex-start;flex-direction:column}
 body.premium-site .ucp-points-badge{text-align:left}
 body.premium-site .ucp-stats-grid{grid-template-columns:1fr}
 body.premium-site .ucp-form-grid{grid-template-columns:1fr;max-width:none}
 body.premium-site .ucp-info-list > div{grid-template-columns:1fr;gap:5px}
 body.premium-site .ucp-text-link{float:none;margin-left:10px}
 body.premium-site .ucp-data-table{min-width:650px}
 body.premium-site .ucp-vote-card{align-items:flex-start;flex-direction:column}
}

/* ========================================================================
   UserCP V12 — standalone application shell
   The UserCP no longer inherits the default WebEngine sidebar/page layout.
   ======================================================================== */
body.premium-site .ucp-standalone-page {
    width: 100%;
    background: #080a0d;
    border-top: 1px solid rgba(255,255,255,.04);
}

body.premium-site .ucp-standalone-container {
    width: min(var(--p-container), calc(100% - 48px));
    margin: 0 auto;
    padding: 34px 0 80px;
}

body.premium-site .ucp-app {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

body.premium-site .ucp-app-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    padding: 0 0 22px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

body.premium-site .ucp-app-brand h1 {
    margin: 5px 0 0;
    color: #eee9df;
    font-family: var(--p-font-display);
    font-size: clamp(26px, 3vw, 42px);
    font-weight: 500;
    line-height: 1.05;
    letter-spacing: -.02em;
}

body.premium-site .ucp-app-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 14px;
    flex-wrap: wrap;
}

body.premium-site .ucp-app-actions a + a {
    margin-left: 0;
}

body.premium-site .ucp-app-actions a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 34px;
    padding: 0 13px;
    white-space: nowrap;
    border: 1px solid rgba(255,255,255,.08);
    background: #0c0f13;
    color: #aaa69e;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .1em;
    text-decoration: none;
}

body.premium-site .ucp-app-actions a:hover,
body.premium-site .ucp-app-actions a:focus-visible {
    color: #eee9df;
    border-color: rgba(199,166,106,.45);
    outline: none;
}

body.premium-site .ucp-app-nav {
    padding: 14px 0 18px;
    border-bottom: 1px solid rgba(255,255,255,.07);
}

body.premium-site .ucp-app-nav .ucp-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0;
    border: 0;
    overflow: visible;
}

body.premium-site .ucp-app-nav .ucp-nav a {
    min-height: 34px;
    padding: 0 12px;
    background: #0b0e12;
    border: 1px solid rgba(255,255,255,.07);
    font-size: 8px;
}

body.premium-site .ucp-app-nav .ucp-nav a img {
    width: 14px;
    height: 14px;
}


body.premium-site .ucp-module-header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    min-height: 92px;
    padding: 28px 0 18px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

body.premium-site .ucp-module-header h2 {
    margin: 5px 0 0;
    color: #eee9df;
    font-family: var(--p-font-display);
    font-size: clamp(22px, 2.2vw, 31px);
    font-weight: 500;
    line-height: 1.1;
}

body.premium-site .ucp-module-content {
    padding: 22px 0 0;
}

/* Remove any remaining legacy UserCP sidebar/card presentation. */
body.premium-site .ucp-standalone-page .ucp-sidebar,
body.premium-site .ucp-standalone-page .ucp-navigation-card,
body.premium-site .ucp-standalone-page .ucp-sidebar-heading,
body.premium-site .ucp-standalone-page .sidebar-module {
    display: none !important;
}

@media (max-width: 768px) {
    body.premium-site .ucp-standalone-container {
        width: min(100% - 32px, var(--p-container));
        padding: 24px 0 55px;
    }

    body.premium-site .ucp-app-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 16px;
    }

    body.premium-site .ucp-app-actions {
        width: 100%;
    }

    body.premium-site .ucp-app-actions a {
        flex: 1;
        justify-content: center;
    }

    body.premium-site .ucp-app-nav .ucp-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
        scrollbar-width: thin;
    }

    body.premium-site .ucp-app-nav .ucp-nav a {
        flex: 0 0 auto;
    }

}

/* ========================================================================
   V13 — STANDALONE PUBLIC MODULE SYSTEM
   Native WebEngine modules remain the data/logic source. This layer owns
   the page geometry and presentation for public modules.
   ======================================================================== */
.module-app {
    width: 100%;
    max-width: 1180px;
    margin: 0 auto;
    padding: 34px 0 70px;
}
.module-app-head {
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:30px;
    padding:0 0 22px;
    border-bottom:1px solid rgba(199,166,106,.16);
}
.module-app-heading { min-width:0; }
.module-app-kicker {
    display:block;
    margin-bottom:7px;
    color:var(--p-metal);
    font-size:10px;
    font-weight:800;
    letter-spacing:.16em;
    text-transform:uppercase;
}
.module-app-heading h2 {
    margin:0;
    color:#eee9df;
    font:600 30px/1.18 'Cinzel',Georgia,serif;
}
.module-app-heading p {
    max-width:720px;
    margin:9px 0 0;
    color:#7f847f;
    font-size:12px;
    line-height:1.65;
}
.module-app-status {
    flex:0 0 auto;
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:9px 12px;
    color:#8e938e;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(8,11,15,.72);
    font-size:9px;
    font-weight:800;
    letter-spacing:.1em;
    white-space:nowrap;
}
.module-app-status strong { color:#d7d2c8; font-size:11px; }
/* Downloads */
body[data-page="downloads"] .module-app-body .panel-downloads,
body[data-page="downloads"] .module-app-body .panel {
    overflow:hidden;
}
body[data-page="downloads"] .module-app-body .download-description { color:#7d827e; }
body[data-page="downloads"] .module-app-body .download-link,
body[data-page="downloads"] .module-app-body a.btn { min-height:38px; }

/* Rankings */
body[data-page="rankings"] .module-app-body .rankings-class-filter {
    margin-bottom:18px;
    padding:14px;
    background:rgba(255,255,255,.018);
    border:1px solid rgba(255,255,255,.07);
    border-radius:var(--p-radius);
}
body[data-page="rankings"] .module-app-body .rankings-table { overflow:hidden; }
body[data-page="rankings"] .module-app-body .rankings-table tr:first-child th { border-top:0; }
body[data-page="rankings"] .module-app-body .rankings-table-place { color:var(--p-metal); font-weight:800; }
body[data-page="rankings"] .module-app-body .rankings-update-time { color:#6f746f; }

/* Information */
body[data-page="info"] .module-app-body .table > tbody > tr > td:first-child {
    width:36%; color:#858b86; font-weight:700;
}
body[data-page="info"] .module-app-body .table > tbody > tr > td:last-child { color:#d2cec5; font-weight:600; }

/* Donation / store */
body[data-page="donation"] .module-app-body > .row {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
}
body[data-page="donation"] .module-app-body > .row > [class*="col-"] {
    float:none; width:auto; padding:0;
}
body[data-page="donation"] .module-app-body .thumbnail {
    height:100%;
    margin:0;
    padding:0;
    overflow:hidden;
}
body[data-page="donation"] .module-app-body .thumbnail img { width:100%; height:auto; }
body[data-page="donation"] .module-app-body .thumbnail .caption { padding:20px; }

/* News */
body[data-page="news"] .module-app-body .panel-news { overflow:hidden; }
body[data-page="news"] .module-app-body .panel-news .panel-heading {
    display:flex; align-items:center; justify-content:space-between; gap:16px;
}
body[data-page="news"] .module-app-body .panel-news .panel-footer { color:#707570; }

/* Events */
body[data-page="events"] .module-app-body .event-list { padding:0; }
body[data-page="events"] .module-app-body .event-row {
    display:flex; align-items:center; justify-content:space-between; gap:20px;
    padding:16px 18px;
    border-bottom:1px solid rgba(255,255,255,.055);
}
body[data-page="events"] .module-app-body .event-row:last-child { border-bottom:0; }

/* Castle Siege */
body[data-page="castlesiege"] .module-app-body .castle-siege-block {
    padding:22px;
    background:linear-gradient(180deg,rgba(15,20,26,.98),rgba(9,12,16,.98));
    border:1px solid rgba(255,255,255,.075);
    border-radius:var(--p-radius);
}
body[data-page="castlesiege"] .module-app-body .castle-siege-block > h2 {
    color:#e6e0d5; font:600 22px/1.25 'Cinzel',Georgia,serif;
}

/* Auth */
body[data-page="login"] .module-app-body > .col-xs-8,
body[data-page="register"] .module-app-body > .col-xs-8,
body[data-page="forgotpassword"] .module-app-body > .col-xs-8,
body[data-page="verifyemail"] .module-app-body > .col-xs-8 {
    float:none; width:min(680px,100%); margin:0 auto; padding:28px;
    background:linear-gradient(180deg,rgba(15,20,26,.98),rgba(9,12,16,.98));
    border:1px solid rgba(255,255,255,.075); border-radius:var(--p-radius);
}

@media (max-width: 900px) {
    .module-app { padding-top:26px; }
    .module-app-head { align-items:flex-start; flex-direction:column; }
    .module-app-status { align-self:flex-start; }
    body[data-page="donation"] .module-app-body > .row { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width: 767px) {
    .module-app { padding:22px 0 50px; }
    .module-app-heading h2 { font-size:24px; }
    .module-app-meta { gap:8px 14px; }
    .module-app-clock { margin-left:0; width:100%; }
    body[data-page="donation"] .module-app-body > .row { grid-template-columns:1fr; }
    .module-app-body .table-responsive { overflow-x:auto; }
    .module-app-body .table { min-width:620px; }
    body[data-page="login"] .module-app-body > .col-xs-8,
    body[data-page="register"] .module-app-body > .col-xs-8,
    body[data-page="forgotpassword"] .module-app-body > .col-xs-8,
    body[data-page="verifyemail"] .module-app-body > .col-xs-8 { padding:20px; }
}

/* ========================================================================
   V14 — PUBLIC MODULE RECONSTRUCTION
   Each public module gets its own visual language while retaining native
   WebEngine data, routing and business logic.
   ======================================================================== */

/* Shared module canvas */
.module-app-body {
    padding-top: 30px;
}
.module-app-body > .page-title { display:none !important; }
.module-app-body .text-center { text-align:center; }

/* ------------------------------------------------------------------------
   SERVER INFORMATION — specification cards + dark data tables
   ------------------------------------------------------------------------ */
body[data-page="info"] .module-app-body {
    display:grid;
    gap:24px;
}
body[data-page="info"] .public-section {
    position:relative;
    padding:0;
}
body[data-page="info"] .public-section::before {
    content:"";
    display:block;
    width:34px;
    height:2px;
    margin-bottom:12px;
    background:var(--p-metal);
}
body[data-page="info"] .public-section > h2 {
    margin:0 0 12px;
    color:#ece6da;
    font:600 22px/1.25 'Cinzel',Georgia,serif;
}
body[data-page="info"] .public-section > table {
    margin:0;
    border:1px solid rgba(255,255,255,.075);
    background:#090c10;
    border-collapse:separate;
    border-spacing:0;
    overflow:hidden;
    border-radius:4px;
}
body[data-page="info"] .public-section > table > thead > tr > th {
    padding:13px 16px;
    color:#d7c08c;
    background:#0e1217;
    border:0;
    border-bottom:1px solid rgba(199,166,106,.22);
    font-size:9px;
    letter-spacing:.13em;
    text-transform:uppercase;
}
body[data-page="info"] .public-section > table > tbody > tr > td {
    padding:12px 16px;
    color:#c3c0b8;
    background:#0a0e13;
    border:0;
    border-top:1px solid rgba(255,255,255,.045);
}
body[data-page="info"] .public-section > table > tbody > tr:first-child > td { border-top:0; }
body[data-page="info"] .public-section > table > tbody > tr > td:first-child {
    color:#777e79;
    font-weight:700;
}
body[data-page="info"] .public-section > table > tbody > tr > td:last-child {
    color:#e1ddd4;
    font-weight:600;
}
body[data-page="info"] .public-section > table > tbody > tr:hover > td {
    background:#0d1116;
}

/* ------------------------------------------------------------------------
   DOWNLOADS — three distinct launcher cards rather than Bootstrap panels
   ------------------------------------------------------------------------ */
body[data-page="downloads"] .module-app-body {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:16px;
    align-items:stretch;
}
body[data-page="downloads"] .download-card {
    position:relative;
    min-width:0;
    min-height:220px;
    margin:0 !important;
    padding:0;
    overflow:hidden;
    background:linear-gradient(145deg,#10151b,#090c10 70%);
    border:1px solid rgba(255,255,255,.075);
    border-radius:4px;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.025);
}
body[data-page="downloads"] .download-card::before {
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:3px;
    background:var(--p-metal);
}
body[data-page="downloads"] .download-card .panel-body {
    height:100%;
    padding:24px 20px 18px;
    display:flex;
    flex-direction:column;
}
body[data-page="downloads"] .download-card .panel-title {
    margin:0 0 22px;
    padding:0 0 13px;
    color:#eee8dc;
    border-bottom:1px solid rgba(199,166,106,.2);
    font:600 18px/1.2 'Cinzel',Georgia,serif;
}
body[data-page="downloads"] .download-card table,
body[data-page="downloads"] .download-card tbody {
    display:block;
    width:100%;
}
body[data-page="downloads"] .download-card tr {
    display:grid;
    grid-template-columns:1fr auto;
    gap:12px;
    padding:12px 0;
    border-top:1px solid rgba(255,255,255,.05);
}
body[data-page="downloads"] .download-card tr:first-child { border-top:0; }
body[data-page="downloads"] .download-card td {
    display:block;
    width:auto !important;
    padding:0 !important;
    border:0 !important;
    text-align:left !important;
    background:transparent !important;
}
body[data-page="downloads"] .download-card td:first-child {
    grid-column:1 / -1;
    color:#d9d5cc;
    font-weight:700;
    line-height:1.45;
}
body[data-page="downloads"] .download-card .download-description {
    display:block;
    margin-top:4px;
    color:#737975;
    font-size:10px;
    font-weight:400;
}
body[data-page="downloads"] .download-card td:nth-child(2) {
    color:#737a75;
    font-size:10px;
    align-self:center;
}
body[data-page="downloads"] .download-card td:nth-child(3) {
    grid-column:2;
    grid-row:2;
    align-self:center;
}
body[data-page="downloads"] .download-card .btn {
    min-width:92px;
    padding:9px 13px;
    color:#111;
    background:var(--p-metal);
    border:0;
    border-radius:2px;
    font-size:9px;
    font-weight:900;
    letter-spacing:.1em;
    text-transform:uppercase;
}
body[data-page="downloads"] .download-card .btn:hover,
body[data-page="downloads"] .download-card .btn:focus {
    background:#e0c27d;
}

/* ------------------------------------------------------------------------
   RANKINGS — competition board, not a generic table page
   ------------------------------------------------------------------------ */
body[data-page="rankings"] .module-app-body {
    display:block;
}
body[data-page="rankings"] .rankings_menu {
    display:flex;
    justify-content:center;
    flex-wrap:wrap;
    gap:6px;
    margin:0 0 18px;
    padding:0;
}
body[data-page="rankings"] .rankings_menu a {
    display:inline-flex;
    align-items:center;
    min-height:38px;
    padding:0 17px;
    color:#7e837e;
    background:#0b0f14;
    border:1px solid rgba(255,255,255,.07);
    border-radius:3px;
    font-size:9px;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
    text-decoration:none;
    transition:all .18s ease;
}
body[data-page="rankings"] .rankings_menu a:hover,
body[data-page="rankings"] .rankings_menu a:focus,
body[data-page="rankings"] .rankings_menu a.active {
    color:#17130d;
    background:var(--p-metal);
    border-color:var(--p-metal);
}
body[data-page="rankings"] .rankings-class-filter {
    display:flex !important;
    justify-content:center;
    flex-wrap:wrap;
    gap:8px;
    margin:0 0 20px !important;
    padding:13px !important;
    list-style:none;
    background:#090d12 !important;
    border:1px solid rgba(255,255,255,.065) !important;
    border-radius:4px;
}
body[data-page="rankings"] .rankings-class-filter li {
    float:none !important;
    margin:0 !important;
}
body[data-page="rankings"] .rankings-class-filter-selection {
    display:flex !important;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    width:72px;
    min-height:72px;
    padding:7px 4px !important;
    color:#777c78 !important;
    background:#0d1116;
    border:1px solid transparent;
    border-radius:3px;
    font-size:8px;
    text-decoration:none;
    transition:all .18s ease;
}
body[data-page="rankings"] .rankings-class-filter-selection:hover {
    color:#ddd7cc !important;
    border-color:rgba(199,166,106,.25);
}
body[data-page="rankings"] .rankings-class-filter-image {
    margin-bottom:5px;
}
body[data-page="rankings"] .ranking-results {
    overflow:hidden;
    background:#090c10;
    border:1px solid rgba(255,255,255,.075);
    border-radius:4px;
}
body[data-page="rankings"] .rankings-table {
    width:100%;
    margin:0;
    border-collapse:collapse;
}
body[data-page="rankings"] .rankings-table tr:first-child td,
body[data-page="rankings"] .rankings-table tr:first-child th {
    padding:12px 14px;
    color:#767c77 !important;
    background:#0d1116;
    border:0;
    border-bottom:1px solid rgba(199,166,106,.2);
    font-size:9px;
    font-weight:900 !important;
    letter-spacing:.11em;
    text-transform:uppercase;
}
body[data-page="rankings"] .rankings-table tr:not(:first-child) td {
    padding:12px 14px;
    color:#c6c2ba;
    background:#090c10;
    border:0;
    border-top:1px solid rgba(255,255,255,.045);
}
body[data-page="rankings"] .rankings-table tr:not(:first-child):hover td { background:#0d1116; }
body[data-page="rankings"] .rankings-table-place {
    width:54px;
    color:var(--p-metal) !important;
    font-weight:900;
}
body[data-page="rankings"] .rankings-class-image { vertical-align:middle; }
body[data-page="rankings"] .online-status-indicator { margin-left:6px; }
body[data-page="rankings"] .rankings-update-time {
    padding:12px 15px;
    color:#676d68;
    background:#070a0e;
    border-top:1px solid rgba(255,255,255,.045);
    font-size:9px;
}

/* ------------------------------------------------------------------------
   STORE / CREDITS — product-style destination
   ------------------------------------------------------------------------ */
body[data-page="donation"] .module-app-body {
    display:block;
}
body[data-page="donation"] .store-grid {
    display:grid;
    grid-template-columns:minmax(260px,360px);
    justify-content:start;
}
body[data-page="donation"] .store-card {
    position:relative;
    overflow:hidden;
    background:#0a0e13;
    border:1px solid rgba(255,255,255,.075);
    border-radius:4px;
}
body[data-page="donation"] .store-card::after {
    content:"STORE / CREDITS";
    position:absolute;
    left:16px;
    bottom:13px;
    padding:6px 8px;
    color:#15110b;
    background:var(--p-metal);
    font-size:8px;
    font-weight:900;
    letter-spacing:.12em;
}
body[data-page="donation"] .store-card .thumbnail {
    display:block;
    margin:0;
    padding:0;
    background:transparent;
    border:0;
    border-radius:0;
}
body[data-page="donation"] .store-card img {
    display:block;
    width:100%;
    height:auto;
    opacity:.9;
    transition:opacity .2s ease, transform .2s ease;
}
body[data-page="donation"] .store-card a:hover img,
body[data-page="donation"] .store-card a:focus img {
    opacity:1;
    transform:scale(1.015);
}

/* ------------------------------------------------------------------------
   NEWS — editorial cards
   ------------------------------------------------------------------------ */
body[data-page="news"] .module-app-body {
    display:grid;
    gap:14px;
}
body[data-page="news"] .news-card {
    margin:0 !important;
    overflow:hidden;
    background:#0a0e13;
    border:1px solid rgba(255,255,255,.07);
    border-radius:4px;
}
body[data-page="news"] .news-card .panel-heading {
    position:relative;
    padding:18px 20px;
    background:#0d1116;
    border:0;
    border-bottom:1px solid rgba(255,255,255,.055);
}
body[data-page="news"] .news-card .panel-heading::before {
    content:"NEWS";
    display:block;
    margin-bottom:7px;
    color:var(--p-metal);
    font-size:8px;
    font-weight:900;
    letter-spacing:.15em;
}
body[data-page="news"] .news-card .panel-title,
body[data-page="news"] .news-card .panel-title a {
    color:#e8e2d8;
    font:600 20px/1.3 'Cinzel',Georgia,serif;
    text-decoration:none;
}
body[data-page="news"] .news-card .panel-body {
    padding:20px;
    color:#aeb1ac;
    font-size:12px;
    line-height:1.75;
}
body[data-page="news"] .news-card .panel-footer {
    padding:10px 20px;
    color:#656b66;
    background:#080b0f;
    border:0;
    font-size:9px;
    letter-spacing:.06em;
}

/* ------------------------------------------------------------------------
   CASTLE SIEGE — battle dashboard
   ------------------------------------------------------------------------ */
body[data-page="castlesiege"] .module-app-body {
    display:block;
}
body[data-page="castlesiege"] .castle-siege-app {
    width:100%;
}
body[data-page="castlesiege"] .castle-siege-block {
    margin:0;
    padding:0;
    background:transparent;
    border:0;
}
body[data-page="castlesiege"] .castle-siege-block > h2 {
    margin:28px 0 12px;
    padding-left:12px;
    border-left:2px solid var(--p-metal);
    color:#e7e1d6;
    font:600 21px/1.25 'Cinzel',Georgia,serif;
}
body[data-page="castlesiege"] .castle-siege-block > h2:first-child { margin-top:0; }
body[data-page="castlesiege"] .castle-siege-block > table,
body[data-page="castlesiege"] .castle-owner-panel {
    margin:0;
    background:#090d12;
    border:1px solid rgba(255,255,255,.07);
    border-radius:4px;
}
body[data-page="castlesiege"] .castle-siege-block > hr {
    margin:24px 0;
    border-color:rgba(255,255,255,.055);
}
body[data-page="castlesiege"] #siegeTimer {
    padding:28px;
    color:#e4d6b4;
    background:#0a0e13;
    border:1px solid rgba(199,166,106,.18);
    border-radius:4px;
    text-align:center;
    font:600 28px/1 'Cinzel',Georgia,serif;
}

/* ------------------------------------------------------------------------
   Mobile module behavior
   ------------------------------------------------------------------------ */
@media (max-width: 900px) {
    body[data-page="downloads"] .module-app-body { grid-template-columns:1fr; }
    body[data-page="downloads"] .download-card { min-height:0; }
}
@media (max-width: 767px) {
    body[data-page="rankings"] .rankings_menu { justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; padding-bottom:4px; }
    body[data-page="rankings"] .rankings_menu a { flex:0 0 auto; }
    body[data-page="rankings"] .rankings-class-filter { justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; }
    body[data-page="rankings"] .rankings-class-filter li { flex:0 0 auto; }
    body[data-page="rankings"] .ranking-results { overflow-x:auto; }
    body[data-page="rankings"] .rankings-table { min-width:720px; }
    body[data-page="info"] .public-section > table { min-width:640px; }
    body[data-page="info"] .public-section { overflow-x:auto; }
    body[data-page="donation"] .store-grid { grid-template-columns:minmax(0,1fr); }
}

/* ============================================================
   DOWNLOAD CENTER — V15
   A dedicated presentation layer; does not depend on Bootstrap
   panel/table styling.
   ============================================================ */
body[data-page="downloads"] .module-app-body {
    display: block;
}
body[data-page="downloads"] .download-zone,
body[data-page="downloads"] .system-requirements {
    position: relative;
    margin: 0 0 18px;
    padding: 22px;
    border: 1px solid rgba(255,255,255,.09);
    background: linear-gradient(180deg, rgba(17,21,26,.98), rgba(9,12,15,.98));
    box-shadow: 0 18px 45px rgba(0,0,0,.18);
}
body[data-page="downloads"] .download-zone::before,
body[data-page="downloads"] .system-requirements::before {
    content: "";
    position: absolute;
    top: 0;
    left: 22px;
    width: 72px;
    height: 2px;
    background: #b9975a;
}
body[data-page="downloads"] .download-zone-heading,
body[data-page="downloads"] .requirements-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 17px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}
body[data-page="downloads"] .download-eyebrow {
    display: block;
    margin-bottom: 7px;
    color: #b9975a;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .18em;
    text-transform: uppercase;
}
body[data-page="downloads"] .download-zone-heading h2,
body[data-page="downloads"] .requirements-heading h2 {
    margin: 0;
    color: #f1e9d9;
    font-family: var(--p-font-display);
    font-size: 22px;
    font-weight: 400;
    letter-spacing: .01em;
}
body[data-page="downloads"] .download-zone-heading p,
body[data-page="downloads"] .requirements-heading p {
    margin: 7px 0 0;
    color: #777e84;
    font-size: 12px;
    line-height: 1.6;
}
body[data-page="downloads"] .download-zone-badge,
body[data-page="downloads"] .requirements-note {
    flex: 0 0 auto;
    padding: 7px 10px;
    border: 1px solid rgba(185,151,90,.35);
    color: #b9975a;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .14em;
}
body[data-page="downloads"] .download-client-list {
    margin-top: 16px;
}
body[data-page="downloads"] .download-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0,1fr));
    gap: 10px;
    margin-top: 16px;
}
body[data-page="downloads"] .download-item {
    display: grid;
    grid-template-columns: 42px minmax(0,1fr) auto;
    align-items: center;
    gap: 14px;
    min-height: 82px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.07);
    background: #0b0f13;
    transition: border-color .18s ease, transform .18s ease, background .18s ease;
}
body[data-page="downloads"] .download-item:hover {
    border-color: rgba(185,151,90,.42);
    background: #0e1318;
    transform: translateY(-1px);
}
body[data-page="downloads"] .download-item-featured {
    min-height: 112px;
    border-color: rgba(185,151,90,.28);
    background: linear-gradient(100deg, rgba(185,151,90,.07), #0b0f13 42%);
}
body[data-page="downloads"] .download-item-icon {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border: 1px solid rgba(185,151,90,.28);
    color: #c7a96b;
    font-size: 21px;
    line-height: 1;
}
body[data-page="downloads"] .download-item-copy h3 {
    margin: 0;
    color: #e9e1d2;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .02em;
}
body[data-page="downloads"] .download-item-copy p {
    margin: 5px 0 0;
    color: #737b82;
    font-size: 11px;
    line-height: 1.5;
}
body[data-page="downloads"] .download-item-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    justify-content: flex-end;
}
body[data-page="downloads"] .download-size {
    color: #6f777d;
    font-size: 10px;
    white-space: nowrap;
}
body[data-page="downloads"] .download-action {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 0 12px;
    border: 1px solid rgba(185,151,90,.45);
    background: rgba(185,151,90,.08);
    color: #d5b779;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: .1em;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
}
body[data-page="downloads"] .download-action:hover,
body[data-page="downloads"] .download-action:focus-visible {
    background: #b9975a;
    color: #090b0d;
}
body[data-page="downloads"] .download-empty {
    margin-top: 16px;
    padding: 18px;
    border: 1px dashed rgba(255,255,255,.1);
    color: #6f777d;
    font-size: 11px;
    text-align: center;
}
body[data-page="downloads"] .system-requirements {
    margin-top: 26px;
    background: #090c0f;
}
body[data-page="downloads"] .requirements-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
    margin-top: 16px;
}
body[data-page="downloads"] .requirement-card {
    min-height: 86px;
    padding: 15px;
    border: 1px solid rgba(255,255,255,.07);
    background: #0d1115;
}
body[data-page="downloads"] .requirement-card span {
    display: block;
    margin-bottom: 8px;
    color: #b9975a;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: .15em;
}
body[data-page="downloads"] .requirement-card strong {
    color: #dfe1df;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
}
body[data-page="downloads"] .requirement-card small {
    color: #6e767c;
    font-size: 9px;
    font-weight: 400;
}
body[data-page="downloads"] .requirements-source {
    margin: 14px 0 0;
    color: #626a70;
    font-size: 9px;
    line-height: 1.6;
}
@media (max-width: 800px) {
    body[data-page="downloads"] .download-grid,
    body[data-page="downloads"] .requirements-grid { grid-template-columns: 1fr 1fr; }
    body[data-page="downloads"] .download-item { grid-template-columns: 38px minmax(0,1fr); }
    body[data-page="downloads"] .download-item-meta { grid-column: 2; justify-content: flex-start; }
}
@media (max-width: 520px) {
    body[data-page="downloads"] .download-zone,
    body[data-page="downloads"] .system-requirements { padding: 16px; }
    body[data-page="downloads"] .download-zone-heading,
    body[data-page="downloads"] .requirements-heading { display: block; }
    body[data-page="downloads"] .download-zone-badge,
    body[data-page="downloads"] .requirements-note { display: inline-block; margin-top: 12px; }
    body[data-page="downloads"] .download-grid,
    body[data-page="downloads"] .requirements-grid { grid-template-columns: 1fr; }
    body[data-page="downloads"] .download-item { grid-template-columns: 38px minmax(0,1fr); }
    body[data-page="downloads"] .download-item-meta { grid-column: 2; flex-wrap: wrap; }
}

/* HOME MODULE — native home.php presentation */
.home-module{width:100%;}
.home-data-grid,.home-ranking-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin-top:22px;}
.home-data-card,.home-ranking-card{background:rgba(12,15,19,.92);border:1px solid rgba(255,255,255,.09);padding:24px;min-width:0;}
.home-data-head{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.09);margin-bottom:6px;}
.home-data-head h2{margin:4px 0 0;font-family: var(--p-font-display);font-size:24px;line-height:1.2;color:#f0eee9;}
.home-data-head>a{font-size:10px;letter-spacing:.12em;color:#cda95f;text-decoration:none;white-space:nowrap;}
.home-news-item,.home-event-item,.home-ranking-row{display:grid;align-items:center;gap:14px;min-height:54px;border-bottom:1px solid rgba(255,255,255,.07);text-decoration:none;color:inherit;}
.home-news-item{grid-template-columns:54px minmax(0,1fr) 82px;}
.home-news-type{font-size:9px;letter-spacing:.12em;color:#cda95f;}
.home-news-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ddd;}
.home-news-item time{font-size:10px;color:#737982;text-align:right;}
.home-event-item{grid-template-columns:minmax(0,1fr) 100px;}
.home-event-item strong{display:block;color:#ddd;font-size:12px;}
.home-event-item span{display:block;color:#737982;font-size:10px;margin-top:3px;}
.home-event-time{text-align:right;}
.home-ranking-row{grid-template-columns:34px minmax(0,1fr) auto 72px;}
.rank-number{color:#cda95f;font-weight:700;}
.rank-character,.rank-guild{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#ddd;}
.rank-class{color:#7e858e;font-size:10px;}
.home-ranking-row>strong{color:#e8e5de;text-align:right;}
.guild-logo{display:flex;justify-content:center;}
.home-empty-state{padding:24px 0;color:#707780;font-size:12px;}
@media(max-width:760px){.home-data-grid,.home-ranking-grid{grid-template-columns:1fr}.home-data-card,.home-ranking-card{padding:18px}.home-news-item{grid-template-columns:45px minmax(0,1fr);}.home-news-item time{display:none}.home-ranking-row{grid-template-columns:28px minmax(0,1fr) auto}.rank-class{display:none}.home-event-item{grid-template-columns:minmax(0,1fr) 82px}}

/* ============================================================
   V17 — SERVER INFORMATION / COMPLETE VISUAL RECONSTRUCTION
   Replaces the native WebEngine table presentation with a
   dedicated MMORPG server dossier interface.
   ============================================================ */
body[data-page="info"] .module-app-body {
    padding-top: 24px;
}
body[data-page="info"] .module-app-body > .server-info-page {
    width: 100%;
    display: grid;
    gap: 22px;
}
body[data-page="info"] .server-info-hero {
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: 24px;
    align-items: end;
    padding: 30px;
    background: linear-gradient(135deg,#0d1218,#090c10);
    border: 1px solid rgba(199,166,106,.16);
    position: relative;
    overflow: hidden;
}
body[data-page="info"] .server-info-hero::after {
    content:"";
    position:absolute;
    width:220px;
    height:220px;
    right:-100px;
    top:-120px;
    border:1px solid rgba(199,166,106,.12);
    transform:rotate(45deg);
}
body[data-page="info"] .server-info-kicker {
    display:block;
    color:#b9975a;
    font:700 10px/1 'Rajdhani',Arial,sans-serif;
    letter-spacing:.18em;
    text-transform:uppercase;
}
body[data-page="info"] .server-info-hero h1,
body[data-page="info"] .server-info-section h2 {
    margin:8px 0 0;
    color:#eee9df;
    font-family:'Cinzel',Georgia,serif;
    font-weight:600;
}
body[data-page="info"] .server-info-hero h1 { font-size:32px; }
body[data-page="info"] .server-info-hero p {
    max-width:680px;
    margin:10px 0 0;
    color:#8d938f;
    font:400 13px/1.7 'Exo 2',Arial,sans-serif;
}
body[data-page="info"] .server-info-version {
    min-width:220px;
    padding:18px 22px;
    background:#0b0f14;
    border:1px solid rgba(255,255,255,.07);
    border-left:2px solid #b9975a;
}
body[data-page="info"] .server-info-version span {
    display:block;
    color:#747b78;
    font:700 9px/1 'Rajdhani',Arial,sans-serif;
    letter-spacing:.16em;
}
body[data-page="info"] .server-info-version strong {
    display:block;
    margin-top:7px;
    color:#e4d6b4;
    font:700 18px/1.2 'Rajdhani',Arial,sans-serif;
}
body[data-page="info"] .server-info-stats {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:14px;
}
body[data-page="info"] .server-stat-card {
    padding:20px 22px;
    background:#0b0f14;
    border:1px solid rgba(255,255,255,.065);
    position:relative;
}
body[data-page="info"] .server-stat-card::before {
    content:"";
    position:absolute;
    left:0;
    top:0;
    bottom:0;
    width:2px;
    background:#b9975a;
}
body[data-page="info"] .server-stat-label {
    display:block;
    color:#777e7b;
    font:700 10px/1 'Rajdhani',Arial,sans-serif;
    letter-spacing:.12em;
    text-transform:uppercase;
}
body[data-page="info"] .server-stat-card strong {
    display:block;
    margin-top:8px;
    color:#eee9df;
    font:700 30px/1 'Rajdhani',Arial,sans-serif;
}
body[data-page="info"] .server-stat-card small {
    display:block;
    margin-top:7px;
    color:#686f6d;
    font:400 10px/1 'Exo 2',Arial,sans-serif;
}
body[data-page="info"] .server-info-section {
    padding:26px;
    background:#090d12;
    border:1px solid rgba(255,255,255,.065);
}
body[data-page="info"] .server-info-section-head {
    display:flex;
    justify-content:space-between;
    gap:20px;
    align-items:end;
    margin-bottom:18px;
}
body[data-page="info"] .server-info-section-head h2 { font-size:22px; }
body[data-page="info"] .server-info-section-head p {
    margin:0;
    color:#707774;
    font:400 11px/1.5 'Exo 2',Arial,sans-serif;
    text-align:right;
}
body[data-page="info"] .chaos-grid,
body[data-page="info"] .party-grid {
    border:1px solid rgba(255,255,255,.055);
    background:#070a0e;
}
body[data-page="info"] .chaos-grid-head,
body[data-page="info"] .chaos-grid-row,
body[data-page="info"] .party-grid-head,
body[data-page="info"] .party-grid-row {
    display:grid;
    grid-template-columns:minmax(220px,1fr) 140px 140px;
    align-items:center;
}
body[data-page="info"] .chaos-grid-head,
body[data-page="info"] .party-grid-head {
    min-height:42px;
    background:#0e1319;
    color:#9a9f9b;
    font:700 9px/1 'Rajdhani',Arial,sans-serif;
    letter-spacing:.14em;
    text-transform:uppercase;
}
body[data-page="info"] .chaos-grid-head span,
body[data-page="info"] .chaos-grid-row span,
body[data-page="info"] .chaos-grid-row strong,
body[data-page="info"] .party-grid-head span,
body[data-page="info"] .party-grid-row > * {
    padding:11px 15px;
}
body[data-page="info"] .chaos-grid-head span:not(:first-child),
body[data-page="info"] .chaos-grid-row strong,
body[data-page="info"] .party-grid-head span:not(:first-child),
body[data-page="info"] .party-grid-row span { text-align:center; }
body[data-page="info"] .chaos-grid-row,
body[data-page="info"] .party-grid-row { border-top:1px solid rgba(255,255,255,.045); }
body[data-page="info"] .chaos-grid-row span,
body[data-page="info"] .party-grid-row span {
    color:#777e7b;
    font:400 11px/1.35 'Exo 2',Arial,sans-serif;
}
body[data-page="info"] .chaos-grid-row strong,
body[data-page="info"] .party-grid-row strong {
    color:#ddd8ce;
    font:700 12px/1.2 'Rajdhani',Arial,sans-serif;
}
body[data-page="info"] .chaos-grid-row:hover,
body[data-page="info"] .party-grid-row:hover { background:#0b1016; }
body[data-page="info"] .command-grid {
    display:grid;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
}
body[data-page="info"] .command-card {
    padding:15px 16px;
    background:#0c1117;
    border:1px solid rgba(255,255,255,.055);
}
body[data-page="info"] .command-card code {
    color:#d5b66f;
    font:700 13px/1.2 'Rajdhani',Arial,sans-serif;
    background:none;
}
body[data-page="info"] .command-card p {
    margin:7px 0 0;
    color:#777e7b;
    font:400 11px/1.5 'Exo 2',Arial,sans-serif;
}
body[data-page="info"] .server-video-frame {
    aspect-ratio:16/9;
    background:#050608;
    border:1px solid rgba(255,255,255,.06);
}
body[data-page="info"] .server-video-frame iframe {
    width:100%;
    height:100%;
    border:0;
    display:block;
}
@media (max-width:900px) {
    body[data-page="info"] .server-info-hero { grid-template-columns:1fr; }
    body[data-page="info"] .server-info-version { min-width:0; }
    body[data-page="info"] .server-info-stats { grid-template-columns:1fr; }
    body[data-page="info"] .server-info-section-head { display:block; }
    body[data-page="info"] .server-info-section-head p { margin-top:8px; text-align:left; }
    body[data-page="info"] .command-grid { grid-template-columns:1fr; }
}
@media (max-width:640px) {
    body[data-page="info"] .server-info-hero,
    body[data-page="info"] .server-info-section { padding:20px; }
    body[data-page="info"] .server-info-hero h1 { font-size:25px; }
    body[data-page="info"] .chaos-grid,
    body[data-page="info"] .party-grid { overflow-x:auto; }
    body[data-page="info"] .chaos-grid-head,
    body[data-page="info"] .chaos-grid-row,
    body[data-page="info"] .party-grid-head,
    body[data-page="info"] .party-grid-row { min-width:620px; }
}