/* =========================================================================
   AresWhiteOriginal - dark Millennial home layout
   Loaded last. Home-specific structure is scoped by body.page.
   ========================================================================= */

:root {
    --site-max-width: 1240px;
    --main-gap: 18px;
    --sidebar-w: 300px;
    --d-bg: #070f1b;
    --navy: #0a1320;
    --neon: #3a93ff;
    --neon-2: #82c1ff;
    --gold: #e9b24b;
    --gold-2: #ffd886;
    --ink: #c3cfde;
    --ink-dim: #7f8b9c;
    --border: #1f4d7a;
    --border-2: rgba(80,150,235,.32);
    --glow: rgba(58,147,255,.45);
    --title-font: 'Orbitron','Roboto Condensed',sans-serif;
    --body-font: 'Inter','Roboto',Arial,sans-serif;

    --webenginebg1: #070f1b;
    --webenginebg2: #0b1627;
    --webenginebg3: #04070c;
    --webenginecolor1: #3a93ff;
    --webenginecolor2: #c3cfde;
    --webenginecolor3: #3a93ff;
    --webenginecolor4: #82c1ff;
    --webenginecolor5: rgba(36,86,140,.35);
    --webenginecolor6: #82c1ff;
    --webenginecolor7: rgba(80,150,235,.30);
    --webenginecolor8: #15304c;
    --webenginecolor9: #dff0ff;
    --webenginecolor10: #1f4d7a;
    --webenginecolor11: #3a93ff;
    --webenginecolor12: #fff;
    --webenginecolor13: #82c1ff;
    --webenginecolor14: #7f8b9c;
    --webenginecolor15: rgba(255,255,255,.04);
    --webenginecolor16: rgba(80,150,235,.22);
    --webenginecolor17: #c3cfde;
    --webenginecolor18: #3a93ff;
    --webenginecolor19: #c3cfde;
    --webenginecolor20: #3a93ff;
    --webenginecolor21: rgba(255,255,255,.07);
    --webenginecolor22: #0b1627;
    --webenginecolor23: #7f8b9c;
    --webenginecolor24: #0b1627;
    --webenginecolor25: #c3cfde;
    --webenginecolor26: #3a93ff;
    --webenginecolor27: #0b1627;
    --webenginecolor28: #0e1d31;
    --webenginecolor33: #c3cfde;
}

html {
    min-width: 0 !important;
    overflow-x: hidden;
}

body {
    margin: 0;
    background: linear-gradient(180deg,#0c1726 0%,#0a1320 55%,#050b13 100%) !important;
    color: var(--ink);
    font-family: var(--body-font);
    overflow-x: hidden;
}

body.page {
    background: #081423 !important;
}

.wrap a { color: var(--neon); }
.wrap, .wrap * { color: var(--ink); }

.wrap,
.wrap .main,
.wrap .main .content,
.wrap .main .content .container,
.wrap .main .content .c,
.wrap .main .sidebar.right,
.wrap .main .sidebar.right .container,
.wrap .main .sidebar.right .container .box,
.rank-col {
    box-sizing: border-box !important;
}

/* Menu */
#menujscallzer {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    min-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
    z-index: 50 !important;
    pointer-events: none !important;
}

#menujscallzer .boxmenusz {
    pointer-events: auto;
    position: relative;
    width: min(650px, calc(100% - 24px)) !important;
    min-height: 46px !important;
    margin: 0 auto !important;
    padding: 0 34px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background:
        linear-gradient(180deg, rgba(52,60,68,.92), rgba(12,17,25,.96) 52%, rgba(52,60,68,.82)) !important;
    border: 1px solid rgba(205,218,230,.36) !important;
    border-top-color: rgba(255,236,190,.45) !important;
    border-radius: 0 !important;
    box-shadow:
        0 6px 24px rgba(0,0,0,.45),
        inset 0 0 0 1px rgba(0,0,0,.65),
        inset 0 0 20px rgba(255,255,255,.08);
}

#menujscallzer .boxmenusz::before,
#menujscallzer .boxmenusz::after {
    content: "";
    position: absolute;
    top: 0;
    width: 38px;
    height: 100%;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(92,100,108,.92), rgba(13,18,26,.96) 52%, rgba(92,100,108,.82));
    border: 1px solid rgba(205,218,230,.28);
    box-shadow: inset 0 0 0 1px rgba(0,0,0,.55);
}

#menujscallzer .boxmenusz::before {
    left: -28px;
    clip-path: polygon(0 50%, 40% 0, 100% 0, 100% 100%, 40% 100%);
}

#menujscallzer .boxmenusz::after {
    right: -28px;
    clip-path: polygon(0 0, 60% 0, 100% 50%, 60% 100%, 0 100%);
}

div#menujscallzer ul {
    width: auto !important;
    min-height: 46px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 15px !important;
    list-style: none !important;
}

div#menujscallzer ul li {
    display: inline-flex !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    font-size: 12px !important;
}

div#menujscallzer ul li a {
    color: #f4e9cb !important;
    font-family: var(--title-font) !important;
    font-weight: 700 !important;
    text-transform: uppercase;
    letter-spacing: 0;
    padding: 6px 0 !important;
    text-shadow: 0 1px 2px #000, 0 0 8px rgba(255,216,134,.35) !important;
}

div#menujscallzer ul li a:hover {
    color: #fff !important;
    text-shadow: 0 0 10px var(--glow) !important;
}

#menujscallzer .dropdown-content {
    display: none;
    position: absolute;
    min-width: 170px;
    padding: 7px 0 !important;
    margin: 0 !important;
    background: rgba(8,14,24,.97) !important;
    border: 1px solid var(--border);
    box-shadow: 0 10px 30px rgba(0,0,0,.6);
}

#menujscallzer .dropdown:hover .dropdown-content { display: block; }
#menujscallzer .dropdown-content ul { display: block !important; min-height: 0 !important; }
#menujscallzer .dropdown-content li { display: block !important; width: auto !important; }
#menujscallzer .dropdown-content li a { display: block; padding: 7px 14px !important; }

#menujscallzer ul li.menu-social {
    gap: 9px !important;
    margin-left: 0 !important;
}

#menujscallzer ul li.menu-social a {
    display: inline-flex;
    align-items: center;
    padding: 0 !important;
}

#menujscallzer ul li.menu-social img {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.16);
    box-shadow: 0 0 8px rgba(58,147,255,.45);
}

/* Legacy inner pages keep the old centered shell. */
body.page-inner .wrap {
    position: relative;
    width: min(calc(100% - 24px), var(--site-max-width)) !important;
    max-width: var(--site-max-width) !important;
    margin: 88px auto 0 !important;
}

body.page-inner .wrap::before {
    content: "";
    position: absolute;
    top: -88px;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    height: 360px;
    z-index: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(7,16,29,.1) 0%, rgba(10,19,32,.88) 92%, #0a1320 100%),
        url(../img/ui/top-fon-home-dark.jpg) no-repeat center top / cover;
}

body.page-inner .wrap > * {
    position: relative;
    z-index: 1;
}

body.page-inner .wrap .header {
    height: 150px !important;
    margin: 0 !important;
    background: none !important;
}

body.page-inner .wrap .header .logotipo {
    display: none !important;
}

body.page-inner .wrap .main {
    width: 100% !important;
    display: flow-root !important;
    margin: 0 !important;
    padding: 6px !important;
    background: rgba(10,20,36,.9) !important;
    border: 1px solid var(--border-2) !important;
    box-shadow: 0 12px 32px rgba(0,0,0,.45) !important;
}

/* Home hero */
body.page .wrap {
    position: relative;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

body.page .wrap::before {
    content: none !important;
}

body.page .wrap > * {
    position: relative;
    z-index: 1;
}

body.page .wrap .language,
body.page .wrap .header {
    display: none !important;
}

body.page .home-hero {
    position: relative;
    width: 100%;
    height: clamp(350px, 29vw, 455px);
    overflow: hidden;
    background: #d8e0e8 url(../img/ui/top-fon-home-dark.jpg) center top / cover no-repeat;
}

body.page .home-hero-overlay {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background:
        linear-gradient(180deg, rgba(5,11,20,.02) 0%, rgba(5,11,20,.04) 50%, rgba(6,14,26,.48) 80%, #081423 100%);
}

.home-server-status {
    position: absolute;
    left: max(24px, calc((100% - 1240px) / 2));
    bottom: 125px;
    z-index: 6;
    min-width: 205px;
    min-height: 54px;
    padding: 9px 14px;
    display: flex;
    align-items: center;
    gap: 10px;
    background: rgba(6,17,31,.72);
    border: 1px solid rgba(63,157,232,.55);
    box-shadow: 0 10px 24px rgba(0,0,0,.28), inset 0 0 18px rgba(63,157,232,.12);
    /* backdrop-filter removido (perf de scroll) */
}

.home-server-status .status-dot {
    width: 13px;
    height: 13px;
    flex: 0 0 13px;
    border-radius: 50%;
    background: #38d477;
    box-shadow: 0 0 14px rgba(56,212,119,.85);
}

.home-server-status .status-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}

.home-server-status strong {
    color: #eef5ff;
    font-family: var(--title-font);
    font-size: 13px;
    line-height: 1.1;
    text-transform: uppercase;
}

.home-server-status small {
    color: #8fa7c2;
    font-size: 12px;
    line-height: 1.2;
}

body.page .wrap .main {
    position: relative !important;
    z-index: 10 !important;
    width: min(calc(100% - 48px), 1240px) !important;
    margin: -95px auto 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 300px !important;
    gap: 18px !important;
    align-items: start !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page .wrap .main > .top,
body.page .wrap .main .content-middle {
    display: none !important;
}

body.page .wrap .main > .content,
body.page .wrap .main > .sidebar.right {
    float: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.page .wrap .main > .content {
    position: relative !important;
    width: 100% !important;
    overflow: visible !important;
}

body.page .wrap .main > .content::before,
body.page .wrap .main > .content::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 6;
    width: 12px;
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    opacity: .72;
}

body.page .wrap .main > .content::before {
    left: -6px;
    background-image: url(../img/ui/pillar-l.png);
}

body.page .wrap .main > .content::after {
    right: -6px;
    background-image: url(../img/ui/pillar-r.png);
}

body.page .wrap .main .content .container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
    background: transparent !important;
    overflow: visible !important;
}

body.page .wrap .main .content .container .c {
    position: relative !important;
    width: 100% !important;
    min-height: 0 !important;
    height: auto !important;
    margin: 0 !important;
    padding: 14px 26px 18px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
    background: rgba(6,17,32,.94) !important;
    border: 1px solid rgba(93,160,226,.48) !important;
    box-shadow:
        inset 0 0 0 1px rgba(8,25,43,.9),
        0 8px 24px rgba(0,0,0,.45) !important;
}

body.page .wrap .main .content .container .c::before,
body.page .wrap .main .content .container .c::after {
    content: "";
    position: absolute;
    top: -10px;
    width: 78px;
    height: 78px;
    z-index: 7;
    pointer-events: none;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

body.page .wrap .main .content .container .c::before {
    left: -10px;
    background-image: url(../img/ui/corner-tl.png);
}

body.page .wrap .main .content .container .c::after {
    right: -10px;
    background-image: url(../img/ui/corner-tr.png);
}

body.page .slider-container {
    display: none !important;
}

/* News */
body.page .wrap .main .content .row { margin: 0 !important; }
body.page .home-news-block {
    width: 100% !important;
    float: none !important;
    padding: 0 !important;
    margin: 0 !important;
    background: none !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page .home-news-block-header {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    min-height: 45px !important;
    padding: 0 28px !important;
    margin: 0 0 8px !important;
    background:
        linear-gradient(180deg, rgba(6,17,31,.22), rgba(6,17,31,.22)),
        url(../img/ui/footer-bar.png) center / 100% 100% no-repeat !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none;
}

body.page .home-news-block-header > div {
    width: auto !important;
    padding: 0 !important;
}

body.page .home-news-block-header h2 {
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    font-family: 'Roboto Condensed', var(--title-font) !important;
    font-size: 19px !important;
    font-weight: 700;
    text-transform: none;
    color: #fff !important;
    text-shadow: 0 1px 3px #000;
}

body.page .home-news-block-header a {
    color: var(--neon-2) !important;
    font-size: 12px !important;
    font-style: italic;
}

body.page .home-news-block-body,
body.page .home-news-block-body > .col-xs-12 {
    padding: 0 !important;
}

body.page .home-news-block-article {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    margin: 0 !important;
    padding: 5px 4px !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
}

body.page .home-news-block-article > div {
    width: auto !important;
    padding: 0 !important;
    float: none !important;
}

body.page .home-news-block-article > .col-xs-3:first-child {
    display: none !important;
}

body.page .home-news-block-article-title-container {
    flex: 1 1 auto !important;
    min-width: 0 !important;
}

body.page .home-news-block-article-title a { color: #e7eef8 !important; }
body.page .home-news-block-article-title a:hover { color: var(--neon) !important; }
body.page .home-news-block-article-date {
    color: var(--ink-dim) !important;
    font-size: 11px !important;
    white-space: nowrap;
}

/* Rankings */
body.page .home-rankings-section {
    margin: 0 !important;
}

body.page .home-rankings-section::before {
    content: "";
    display: block;
    width: 170px;
    height: 18px;
    margin: 11px auto 8px;
    background: url(../img/ui/divider.png) center / contain no-repeat;
}

body.page .home-rankings-title {
    margin: 0 0 8px !important;
    padding: 0 !important;
    border: 0 !important;
    font-family: var(--title-font) !important;
    font-size: 14px !important;
    text-transform: uppercase;
    color: var(--gold-2) !important;
    text-shadow: 0 0 10px rgba(233,178,75,.4);
}

body.page .rank-cols {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    gap: 10px !important;
}

body.page .rank-col {
    min-width: 0 !important;
    height: 145px !important;
    padding: 4px !important;
    overflow: hidden !important;
    background: rgba(8,16,29,.92) !important;
    border: 1px solid rgba(80,150,235,.38) !important;
    border-radius: 5px;
    box-shadow: inset 0 0 14px rgba(0,0,0,.48);
}

body.page .rank-col-title {
    min-height: 27px;
    padding: 4px 2px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-family: var(--title-font);
    font-weight: 700;
    font-size: 8.5px;
    letter-spacing: 0;
    text-transform: uppercase;
    color: var(--gold-2);
    border-bottom: 1px solid var(--border-2);
    text-shadow: 0 0 8px rgba(233,178,75,.35);
}

body.page .rank-col .rank-list {
    list-style: none;
    counter-reset: rk;
    margin: 0;
    padding: 3px 2px 0;
}

body.page .rank-col .rank-list li {
    counter-increment: rk;
    display: flex;
    align-items: center;
    gap: 4px;
    min-height: 17px;
    padding: 2px;
    border-bottom: 1px solid rgba(255,255,255,.05);
    font-size: 10px;
}

body.page .rank-col .rank-list li:last-child { border-bottom: 0; }
body.page .rank-col .rank-list li::before {
    content: counter(rk) "\00BA";
    flex: 0 0 14px;
    text-align: center;
    font-weight: 700;
    color: var(--ink-dim);
    font-size: 9px;
}

body.page .rank-col .rank-list .rk-name {
    flex: 1;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    color: #dde6f1;
}

body.page .rank-col .rank-list .rk-name a { color: #dde6f1 !important; }
body.page .rank-col .rank-list .rk-value {
    color: var(--gold);
    font-weight: 700;
    font-size: 10px;
}

/* Sidebar */
body.page .wrap .main > .sidebar.right {
    width: 300px !important;
    margin: 0 !important;
    padding: 0 !important;
    float: none !important;
}

body.page .sidebar.right > .container {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: flex;
    flex-direction: column;
    gap: 2px;
}

body.page .partial-login,
body.page .servers-block,
body.page .sidebar.right .box,
body.page .sidebar.right .title {
    width: 100% !important;
    box-sizing: border-box !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
}

body.page .sidebar.right .space,
body.page .sidebar.right .box-bottom,
body.page .sidebar.right .sidebar-bottom {
    display: none !important;
}

body.page .sidebar-title,
body.page .title.title-servers,
body.page .title.title-team,
body.page .title.title-events,
body.page .title.title-info,
body.page .title.title-user {
    width: 100% !important;
    height: 24px !important;
    min-height: 24px !important;
    margin: 0 0 2px !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
    display: flex !important;
    align-items: center !important;
}

body.page .title.title-servers,
body.page .title.title-team,
body.page .title.title-events {
    padding: 0 !important;
    font-size: 0 !important;
    line-height: 0 !important;
    color: transparent !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 100% 100% !important;
    border: 0 !important;
    filter: drop-shadow(0 3px 8px rgba(0,0,0,.38));
}

body.page .title.title-servers { background-image: url(../img/ui/title-servers.png) !important; }
body.page .title.title-team { background-image: url(../img/ui/title-team.png) !important; }
body.page .title.title-events { background-image: url(../img/ui/title-events.png) !important; }

body.page .title.title-user {
    justify-content: center !important;
    color: #eaf4ff !important;
    text-transform: uppercase;
    font-family: var(--title-font) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0;
    text-shadow: 0 0 10px rgba(58,147,255,.5) !important;
    background: linear-gradient(180deg, rgba(34,74,120,.92), rgba(10,26,46,.95)) !important;
    border: 1px solid var(--border-2) !important;
    border-bottom: 2px solid var(--neon) !important;
    border-radius: 5px 5px 0 0 !important;
}

body.page .title.title-info {
    justify-content: center !important;
    color: #6fc7ff !important;
    font-family: var(--title-font) !important;
    font-size: 13px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase;
    text-shadow: 0 0 8px rgba(63,157,232,.55) !important;
    background:
        linear-gradient(180deg, rgba(6,17,31,.18), rgba(6,17,31,.18)),
        url(../img/ui/footer-bar.png) center / 100% 100% no-repeat !important;
    border: 0 !important;
}

body.page .title.title-servers .onlines {
    position: absolute !important;
    right: 9% !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    display: flex !important;
    align-items: center !important;
    gap: 4px !important;
    font-size: 12px !important;
    line-height: 1 !important;
    color: #d6ecff !important;
    z-index: 3 !important;
    text-shadow: 0 0 8px rgba(58,147,255,.6);
}

body.page .title.title-servers .onlines i { color: #3ad07a !important; }
body.page .title.title-servers .onlines label {
    margin: 0 !important;
    color: #d6ecff !important;
    font-size: 12px !important;
}

body.page .sidebar.right .container .box {
    background: rgba(11,22,39,.92) !important;
    border: 1px solid rgba(80,150,235,.35) !important;
    box-shadow: inset 0 0 14px rgba(0,0,0,.45) !important;
    color: var(--ink) !important;
    padding: 4px 8px !important;
    margin: 0 !important;
}

body.page .partial-login .box {
    padding: 5px 10px !important;
    margin: 0 !important;
}

body.page #loginjscallzer,
body.page #senhajs {
    width: 100% !important;
    height: 23px !important;
    margin: 0 0 4px !important;
    padding: 0 10px 0 32px !important;
    color: #e7eef8 !important;
    background-color: rgba(255,255,255,.04) !important;
    background-repeat: no-repeat !important;
    background-position: 9px center !important;
    background-size: 13px 13px !important;
    border: 1px solid var(--border) !important;
    border-radius: 5px !important;
    text-align: left !important;
    filter: none !important;
}

body.page #loginjscallzer {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233a93ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 21c0-4 4-6 8-6s8 2 8 6'/%3E%3C/svg%3E") !important;
}

body.page #senhajs {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%233a93ff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='9' r='4'/%3E%3Cpath d='M11 11l9 9'/%3E%3Cpath d='M16 16l3-3'/%3E%3C/svg%3E") !important;
}

body.page #logaaijs {
    width: 100% !important;
    height: 22px !important;
    margin: 0 0 1px !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: url(../img/ui/btn-signin.png) no-repeat center / 100% 100% !important;
    color: transparent !important;
    font-size: 0 !important;
    cursor: pointer;
    box-shadow: none !important;
    filter: drop-shadow(0 2px 8px var(--glow));
}

body.page .forgot-password {
    padding: 1px 0 0 !important;
    text-align: center !important;
    font-size: 8px !important;
    line-height: 1.05 !important;
    color: var(--ink-dim) !important;
}

body.page .forgot-password a {
    font-size: 8px !important;
    color: var(--ink-dim) !important;
    text-transform: none !important;
}

body.page .forgot-password br {
    display: none !important;
}

body.page .servers-block .box { padding: 3px 8px !important; }
body.page .server {
    width: 100% !important;
    height: auto !important;
    padding: 0 !important;
}

body.page .server .name {
    color: #dfe7f1 !important;
    font-size: 10px !important;
    text-align: center;
    text-transform: uppercase;
}

body.page .server .onlines-bar {
    width: 100% !important;
    overflow: hidden !important;
    border: 1px solid var(--border);
    border-radius: 4px;
}

body.page .server .onlines-bar .bar {
    max-width: 100% !important;
    height: 9px !important;
    background: linear-gradient(90deg,#0c6fbf,#3a93ff) !important;
}

body.page .server .onlines-bar .bar-percentual {
    display: none !important;
}

body.page .sidebar.right .box ul {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
    width: 100% !important;
}

body.page .sidebar.right .box ul li {
    min-height: 16px;
    padding: 1px 2px !important;
    line-height: 14px !important;
    color: var(--ink) !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
    font-size: 10px !important;
}

body.page .sidebar.right .box ul li:last-child { border-bottom: 0 !important; }
body.page span.time.bg-success {
    float: right !important;
    background: transparent !important;
    color: #3ad07a !important;
    font-weight: 700;
}

body.page span.time.label-default {
    float: right !important;
    background: transparent !important;
    color: #e0544e !important;
    font-weight: 700;
}

body.page .panel-sidebar-events {
    height: auto !important;
    max-height: 98px !important;
    overflow: hidden !important;
    padding: 3px 7px !important;
}

body.page .panel-sidebar-info {
    padding: 8px 10px !important;
}

body.page .panel-sidebar-info ul li {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 22px;
    font-size: 11px !important;
}

body.page .panel-sidebar-info .text {
    margin-left: auto !important;
    color: #eef5ff !important;
    font-weight: 700 !important;
    text-align: right !important;
}

body.page .panel-sidebar-info .online-text {
    color: #38d477 !important;
}

body.page .panel-sidebar-events .events-table {
    width: 100% !important;
    border-collapse: collapse !important;
}

body.page .panel-sidebar-events .events-table td {
    padding: 1px 2px !important;
    border-bottom: 1px solid rgba(255,255,255,.06) !important;
    color: var(--ink) !important;
    font-size: 8px !important;
    line-height: 1 !important;
    vertical-align: top !important;
    white-space: nowrap !important;
    font-variant-numeric: tabular-nums;
}

body.page .panel-sidebar-events .events-table tr:last-child td { border-bottom: 0 !important; }
body.page .panel-sidebar-events .events-table .text-right { text-align: right !important; }
body.page .panel-sidebar-events .smalltext {
    font-size: 6.5px !important;
    line-height: .95 !important;
    color: var(--ink-dim) !important;
    white-space: nowrap !important;
}

/* Shared dark module skin */
.panel,
.panel-sidebar {
    background: rgba(11,22,39,.85) !important;
    border: 1px solid var(--border) !important;
    box-shadow: 0 6px 22px rgba(0,0,0,.45) !important;
}

.panel-heading {
    background: linear-gradient(180deg, rgba(36,86,140,.55), rgba(13,32,55,.55)) !important;
    border-bottom: 1px solid var(--border) !important;
}

.panel-title { color: var(--gold-2) !important; }
.table { color: var(--ink) !important; }
.table > thead > tr > th {
    background: rgba(36,86,140,.30) !important;
    color: var(--neon-2) !important;
    border-color: var(--border) !important;
}

.table > tbody > tr > td { border-color: rgba(255,255,255,.06) !important; }
.table-striped > tbody > tr:nth-of-type(odd) { background: rgba(255,255,255,.02) !important; }
.table-hover > tbody > tr:hover { background: rgba(58,147,255,.07) !important; }
.form-control {
    background: rgba(255,255,255,.04) !important;
    border: 1px solid var(--border) !important;
    color: #e7eef8 !important;
}
.form-control:focus {
    border-color: var(--neon) !important;
    box-shadow: 0 0 0 2px rgba(58,147,255,.18) !important;
}
label { color: var(--ink) !important; }
.breadcrumber { background: transparent !important; }
.page-title,
.page-title span {
    color: #fff !important;
    text-transform: uppercase;
    text-shadow: 0 0 14px var(--glow);
}

/* Footer */
#footer-faixa {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 12px 0 0 !important;
    padding: 42px 16px 12px !important;
    box-sizing: border-box !important;
    background: #030914 !important;
    border-top: 1px solid rgba(76,138,203,.32) !important;
    text-align: center !important;
    color: var(--ink-dim) !important;
}

#footer-faixa::before {
    content: "";
    position: absolute;
    top: 8px;
    left: 50%;
    transform: translateX(-50%);
    width: min(430px, 75%);
    height: 30px;
    background: url(../img/ui/footer-bar.png) center / contain no-repeat;
}

#footer-faixa > * {
    position: relative;
    z-index: 1;
}

#footer-faixa a { color: var(--neon) !important; }
#footer-faixa a[style] { color: var(--ink-dim) !important; }

#creditos {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 9px 12px 12px !important;
    box-sizing: border-box !important;
    background: #02060d !important;
    border-top: 1px solid rgba(255,255,255,.05) !important;
    text-align: center !important;
}

#creditos .creditos {
    width: min(calc(100% - 24px), 1000px) !important;
    margin: 0 auto !important;
    text-align: center !important;
    color: var(--ink-dim) !important;
    font-family: Arial, sans-serif !important;
    font-size: 13px !important;
}

#creditos a { color: var(--ink-dim) !important; }
#creditos a:hover { color: var(--neon) !important; }

::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: #070d16 !important; }
::-webkit-scrollbar-thumb {
    background: #1c4368 !important;
    border-radius: 6px;
}
::-webkit-scrollbar-thumb:hover { background: var(--neon) !important; }

@media (max-width: 1104px) and (min-width: 850px) {
    body.page .wrap .main {
        width: min(calc(100% - 24px), 960px) !important;
        grid-template-columns: minmax(0, 1fr) 260px !important;
    }

    body.page .wrap .main > .sidebar.right {
        width: 260px !important;
    }

    body.page .rank-cols {
        grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 849px) {
    #menujscallzer .boxmenusz {
        padding: 0 16px !important;
    }

    #menujscallzer .boxmenusz::before,
    #menujscallzer .boxmenusz::after {
        display: none;
    }

    div#menujscallzer ul {
        flex-wrap: wrap !important;
        gap: 5px 12px !important;
        padding: 5px 0 !important;
    }

    body.page .home-hero {
        height: clamp(330px, 58vw, 430px);
    }

    body.page .wrap .main {
        grid-template-columns: 1fr !important;
        margin-top: -70px !important;
    }

    body.page .wrap .main > .sidebar.right {
        width: 100% !important;
    }

    body.page .rank-cols {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    body.page .wrap .main > .content::before,
    body.page .wrap .main > .content::after {
        display: none !important;
    }
}

@media (max-width: 500px) {
    body.page .rank-cols {
        grid-template-columns: 1fr !important;
    }

    body.page .wrap .main .content .container .c {
        padding: 12px 14px 16px !important;
    }

    body.page .home-news-block-header h2 {
        font-size: 16px !important;
    }
}

/* Final home sidebar specificity guards against legacy Millennial selectors. */
body.page .wrap .main .sidebar.right .container .title.title-servers,
body.page .wrap .main .sidebar.right .container .title.title-team,
body.page .wrap .main .sidebar.right .container .title.title-events,
body.page .wrap .main .sidebar.right .container .title.title-info {
    width: 100% !important;
    height: 24px !important;
    min-height: 24px !important;
    margin: 0 0 2px !important;
    padding: 0 !important;
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    background-color: transparent !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: 100% 100% !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page .wrap .main .sidebar.right .container .title.title-servers {
    background-image: url(../img/ui/title-servers.png) !important;
}

body.page .wrap .main .sidebar.right .container .title.title-team {
    background-image: url(../img/ui/title-team.png) !important;
}

body.page .wrap .main .sidebar.right .container .title.title-events {
    background-image: url(../img/ui/title-events.png) !important;
}

body.page .wrap .main .sidebar.right .container .title.title-info {
    color: #6fc7ff !important;
    font-size: 13px !important;
    line-height: 1 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    text-shadow: 0 0 8px rgba(63,157,232,.55) !important;
    background:
        linear-gradient(180deg, rgba(6,17,31,.18), rgba(6,17,31,.18)),
        url(../img/ui/footer-bar.png) center / 100% 100% no-repeat !important;
}

body.page .wrap .main .sidebar.right .container .box.panel-sidebar-info ul {
    margin: 0 !important;
    padding: 0 !important;
}

body.page .wrap .main .sidebar.right .container .box.panel-sidebar-info ul li {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 14px !important;
    width: 100% !important;
}

body.page .wrap .main .sidebar.right .container .box.panel-sidebar-info ul li span.text {
    float: none !important;
    position: static !important;
    display: inline-block !important;
    width: auto !important;
    min-width: 72px !important;
    max-width: 150px !important;
    margin: 0 !important;
    color: #eef6ff !important;
    text-align: right !important;
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.85) !important;
}

body.page .wrap .main .sidebar.right .container .box.panel-sidebar-info ul li span.online-text {
    color: #38d477 !important;
}

body.page .wrap .main .sidebar.right .container .title.title-user {
    width: 100% !important;
    height: 24px !important;
    min-height: 24px !important;
    margin: 0 0 2px !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #eaf4ff !important;
    font-family: var(--title-font) !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-transform: uppercase;
    background: linear-gradient(180deg, rgba(34,74,120,.92), rgba(10,26,46,.95)) !important;
    border: 1px solid var(--border-2) !important;
    border-bottom: 2px solid var(--neon) !important;
    border-radius: 5px 5px 0 0 !important;
    box-shadow: inset 0 0 16px rgba(58,147,255,.12) !important;
}

body.page .wrap .main .sidebar.right .container .box {
    width: 100% !important;
    margin: 0 !important;
    padding: 4px 8px !important;
    color: var(--ink) !important;
    background: rgba(11,22,39,.92) !important;
    border: 1px solid rgba(80,150,235,.35) !important;
    border-bottom: 1px solid rgba(80,150,235,.35) !important;
    box-shadow: inset 0 0 14px rgba(0,0,0,.45) !important;
}

body.page .wrap .main .sidebar.right .container .partial-login .box {
    padding: 5px 10px !important;
}

body.page .wrap .main .sidebar.right .container .box.panel-sidebar-events {
    max-height: 98px !important;
    overflow: hidden !important;
    padding: 3px 7px !important;
}

/* =========================================================================
   CONTEUDO INTERNO (coluna central das paginas que NAO sao a Home)
   -------------------------------------------------------------------------
   Escopado SOB .page-main-content (= a coluna .content). Assim NUNCA vaza
   para a sidebar / painel de login (corrige secoes 13-16 da spec). Estiliza
   apenas tabelas / formularios / botoes / titulos DO CONTEUDO. A sidebar e
   todo o chrome vem das regras .page (identicas a Home).
   Escopo `body.page:not(.page-home)` = paginas internas (tem `page`, nao
   `page-home`); exclui o User CP (que tem seu proprio shell).
   ========================================================================= */
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .container .c {
    padding: 22px !important;
    color: #eef5ff !important;
    background: rgba(6,17,31,.92) !important;
    border: 1px solid rgba(38,91,136,.72) !important;
    box-shadow: 0 16px 36px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}

body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content h1.title,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .page-title,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .panel-heading {
    min-height: 42px !important;
    margin: 0 0 14px !important;
    padding: 10px 16px !important;
    display: flex !important;
    align-items: center !important;
    color: #eef5ff !important;
    background: linear-gradient(180deg, rgba(16,37,61,.96), rgba(8,20,35,.98)) !important;
    border: 1px solid rgba(38,91,136,.76) !important;
    border-bottom: 2px solid #3f9de8 !important;
    border-radius: 6px 6px 0 0 !important;
    box-shadow: inset 0 0 18px rgba(63,157,232,.12) !important;
}

body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content h1.title,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .page-title span,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .panel-title {
    color: #eef5ff !important;
    font-family: var(--title-font) !important;
    font-size: 20px !important;
    letter-spacing: 0 !important;
    text-shadow: none !important;
}

body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .panel,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .table,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .general-table-ui {
    color: #eef5ff !important;
    background: #0b1b2e !important;
    border: 1px solid rgba(38,91,136,.7) !important;
    box-shadow: inset 0 0 14px rgba(0,0,0,.28) !important;
}

body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .table td,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .table th,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .general-table-ui tr td,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content table.custom td {
    color: #eef5ff !important;
    background: transparent !important;
    border-color: rgba(38,91,136,.45) !important;
}

body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content input,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content select,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content textarea,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .form-control {
    color: #eef5ff !important;
    background: #071525 !important;
    border: 1px solid rgba(38,91,136,.74) !important;
    border-radius: 5px !important;
}

body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .btn,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content input.btn,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content button.btn,
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content a.btn {
    color: #06111f !important;
    background: linear-gradient(180deg, #55b6ff, #3f9de8) !important;
    border: 1px solid rgba(161,219,255,.45) !important;
    border-radius: 5px !important;
    font-weight: 700 !important;
    text-shadow: none !important;
}

/* Mensagens (alert/empty-state) do conteudo no tema escuro (ex.: rankings sem
   dados). Escopado ao conteudo; nao toca em chrome/sidebar. */
body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .alert {
    color: #eaf2fb !important;
    background: rgba(11,27,46,.92) !important;
    border: 1px solid rgba(38,91,136,.7) !important;
    box-shadow: inset 0 0 14px rgba(0,0,0,.28) !important;
}

body.page:not(.page-home):not([class*="route-usercp"]) .page-main-content .alert-danger {
    border-color: rgba(196,84,84,.7) !important;
}

body.route-login .wrap .main {
    display: block !important;
    width: min(100%, 980px) !important;
    margin-left: auto !important;
    margin-right: auto !important;
}

body.route-login .wrap .main > .sidebar.right {
    display: none !important;
}

body.route-login .wrap .main > .content {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* User CP rework */
body[class*="route-usercp"] {
    background: #06111f !important;
}

body[class*="route-usercp"] .wrap {
    width: min(1240px, calc(100% - 48px)) !important;
    max-width: 1240px !important;
}

body[class*="route-usercp"] .wrap::before {
    height: 300px;
}

body[class*="route-usercp"] .wrap .header {
    height: 120px !important;
}

body[class*="route-usercp"] .wrap .header .logotipo {
    top: 58px !important;
}

body[class*="route-usercp"] .wrap .main {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
    overflow: visible !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body[class*="route-usercp"] .wrap .main > .sidebar.right {
    display: none !important;
}

body[class*="route-usercp"] .wrap .main > .content {
    float: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body[class*="route-usercp"] .wrap .main .content .container,
body[class*="route-usercp"] .wrap .main .content .container .c {
    width: 100% !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    background: transparent !important;
}

body[class*="route-usercp"] .wrap .main .content .container .c {
    padding: 0 !important;
    border: 0 !important;
    box-shadow: none !important;
}

body[class*="route-usercp"] .ajax-container {
    color: #eef5ff;
}

.usercp-dashboard,
body[class*="route-usercp"] .ajax-container > .page-title,
body[class*="route-usercp"] .ajax-container > .table,
body[class*="route-usercp"] .ajax-container > .row,
body[class*="route-usercp"] .ajax-container > form,
body[class*="route-usercp"] .ajax-container > .panel,
body[class*="route-usercp"] .ajax-container > .alert {
    background: rgba(11,27,46,.94) !important;
    border: 1px solid rgba(38,91,136,.76) !important;
    box-shadow: 0 16px 36px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.035) !important;
}

.usercp-dashboard {
    overflow: hidden;
}

.usercp-topbar {
    min-height: 76px;
    padding: 14px 18px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    background: linear-gradient(180deg, rgba(16,37,61,.96), rgba(8,20,35,.98));
    border-bottom: 1px solid rgba(63,157,232,.38);
}

.usercp-identity {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
}

.usercp-avatar {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    color: #d5ad54;
    background: radial-gradient(circle at 35% 30%, rgba(63,157,232,.28), rgba(11,27,46,.9));
    border: 1px solid rgba(63,157,232,.55);
    border-radius: 6px;
    box-shadow: inset 0 0 18px rgba(63,157,232,.16);
}

.usercp-eyebrow {
    display: block;
    margin: 0 0 2px;
    color: #8fa7c2;
    font-size: 12px;
    line-height: 1.2;
    text-transform: uppercase;
}

.usercp-identity strong {
    display: block;
    color: #eef5ff;
    font-size: 18px;
    line-height: 1.25;
}

.usercp-logout {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 0 15px;
    color: #06111f !important;
    font-weight: 700;
    text-transform: uppercase;
    background: linear-gradient(180deg, #f1cd75, #d5ad54);
    border: 1px solid rgba(255,236,190,.5);
    border-radius: 5px;
}

.usercp-grid {
    display: grid;
    grid-template-columns: 250px minmax(0, 1fr);
    gap: 0;
    align-items: stretch;
}

.usercp-nav {
    padding: 18px 14px;
    background: #071525;
    border-right: 1px solid rgba(38,91,136,.65);
}

.usercp-nav-title {
    margin: 0 0 12px;
    padding: 0 4px 10px;
    color: #d5ad54;
    font-family: var(--title-font);
    font-size: 14px;
    text-transform: uppercase;
    border-bottom: 1px solid rgba(63,157,232,.22);
}

.usercp-nav nav {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.usercp-nav a {
    min-height: 38px;
    padding: 8px 9px;
    display: flex;
    align-items: center;
    gap: 9px;
    color: #cfe3f7 !important;
    background: rgba(16,37,61,.46);
    border: 1px solid rgba(38,91,136,.38);
    border-radius: 5px;
}

.usercp-nav a:hover,
.usercp-action-card:hover {
    color: #fff !important;
    border-color: rgba(63,157,232,.82);
    box-shadow: 0 0 18px rgba(63,157,232,.16);
    text-decoration: none;
}

.usercp-nav img,
.usercp-nav i {
    width: 20px;
    height: 20px;
    object-fit: contain;
    flex: 0 0 20px;
}

.usercp-nav .is-logout {
    color: #ffd6dc !important;
    border-color: rgba(239,78,94,.45);
}

.usercp-main {
    min-width: 0;
    padding: 22px;
    background: rgba(6,17,31,.72);
}

.usercp-section-head {
    margin: 0 0 18px;
}

.usercp-section-head h1,
.usercp-section-head h2 {
    margin: 0;
    color: #eef5ff;
    font-family: var(--title-font);
    letter-spacing: 0;
    text-transform: uppercase;
}

.usercp-section-head h1 {
    font-size: 28px;
}

.usercp-section-head h2 {
    font-size: 18px;
}

.usercp-section-head p {
    max-width: 620px;
    margin: 7px 0 0;
    color: #8fa7c2;
    font-size: 14px;
    line-height: 1.5;
}

.usercp-section-head-small {
    margin-top: 20px;
    margin-bottom: 12px;
}

.usercp-stat-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.usercp-stat {
    padding: 14px;
    background: #10253d;
    border: 1px solid rgba(38,91,136,.7);
    border-radius: 6px;
}

.usercp-stat span {
    display: block;
    margin: 0 0 4px;
    color: #8fa7c2;
    font-size: 12px;
    text-transform: uppercase;
}

.usercp-stat strong {
    display: block;
    color: #eef5ff;
    font-size: 17px;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.usercp-actions {
    display: grid;
    grid-template-columns: repeat(3, minmax(180px, 1fr));
    gap: 12px;
}

.usercp-action-card {
    min-height: 96px;
    padding: 14px;
    display: flex;
    align-items: center;
    gap: 12px;
    color: #eef5ff !important;
    background: #0b1b2e;
    border: 1px solid rgba(38,91,136,.64);
    border-radius: 6px;
}

.usercp-action-icon {
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    flex: 0 0 46px;
    background: rgba(63,157,232,.1);
    border: 1px solid rgba(63,157,232,.42);
    border-radius: 6px;
}

.usercp-action-icon img {
    width: 32px;
    height: 32px;
    object-fit: contain;
}

.usercp-action-copy {
    min-width: 0;
}

.usercp-action-copy strong {
    display: block;
    color: #eef5ff;
    font-size: 15px;
    line-height: 1.25;
}

.usercp-action-copy small {
    display: block;
    margin: 4px 0 0;
    color: #8fa7c2;
    font-size: 12px;
    line-height: 1.35;
}

body[class*="route-usercp"] .ajax-container > .page-title {
    margin: 0 0 12px !important;
    padding: 14px 18px !important;
    color: #eef5ff !important;
    border-radius: 6px 6px 0 0;
}

body[class*="route-usercp"] .ajax-container > .page-title span {
    color: #eef5ff !important;
    font-size: 22px !important;
}

body[class*="route-usercp"] .ajax-container > .table,
body[class*="route-usercp"] .ajax-container > .row,
body[class*="route-usercp"] .ajax-container > form,
body[class*="route-usercp"] .ajax-container > .panel,
body[class*="route-usercp"] .ajax-container > .alert {
    margin: 0 0 16px !important;
    padding: 18px !important;
    border-radius: 0 0 6px 6px;
}

body[class*="route-usercp"] .table,
body[class*="route-usercp"] table,
body[class*="route-usercp"] .general-table-ui,
body[class*="route-usercp"] .myaccount-table {
    width: 100% !important;
    color: #eef5ff !important;
    background: #0b1b2e !important;
}

body[class*="route-usercp"] .table td,
body[class*="route-usercp"] .table th,
body[class*="route-usercp"] .general-table-ui tr td,
body[class*="route-usercp"] .myaccount-table tr td {
    padding: 10px 12px !important;
    color: #eef5ff !important;
    background: transparent !important;
    border-color: rgba(38,91,136,.45) !important;
    font-size: 14px;
    line-height: 1.45;
}

body[class*="route-usercp"] .myaccount-table tr td:first-child,
body[class*="route-usercp"] .general-table-ui tr:first-child td {
    color: #d5ad54 !important;
    font-weight: 700;
    background: rgba(16,37,61,.62) !important;
}

body[class*="route-usercp"] .btn,
body[class*="route-usercp"] input.btn,
body[class*="route-usercp"] button.btn {
    color: #06111f !important;
    background: linear-gradient(180deg, #55b6ff, #3f9de8) !important;
    border: 1px solid rgba(161,219,255,.45) !important;
    border-radius: 5px !important;
    font-weight: 700 !important;
    text-shadow: none !important;
}

body[class*="route-usercp"] input,
body[class*="route-usercp"] select,
body[class*="route-usercp"] textarea,
body[class*="route-usercp"] .form-control {
    color: #eef5ff !important;
    background: #071525 !important;
    border: 1px solid rgba(38,91,136,.7) !important;
}

body[class*="route-usercp"] .row.text-center {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 12px;
    text-align: left !important;
}

body[class*="route-usercp"] .row.text-center > [class*="col-"] {
    width: auto !important;
    float: none !important;
    padding: 0 !important;
}

body[class*="route-usercp"] .myaccount-character-name,
body[class*="route-usercp"] .myaccount-character-block,
body[class*="route-usercp"] .myaccount-character-block-location {
    width: auto !important;
    margin: 0 !important;
    color: #eef5ff !important;
    background: #10253d !important;
    border-color: rgba(38,91,136,.64) !important;
}

body[class*="route-usercp"] .myaccount-character-name {
    padding: 9px 10px;
    border: 1px solid rgba(38,91,136,.64);
    border-bottom: 0;
    border-radius: 6px 6px 0 0;
}

body[class*="route-usercp"] .myaccount-character-block {
    min-height: 112px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(38,91,136,.64);
}

body[class*="route-usercp"] .myaccount-character-block img {
    max-width: 82px;
    height: auto;
}

body[class*="route-usercp"] .myaccount-character-block-location {
    padding: 8px 10px;
    border: 1px solid rgba(38,91,136,.64);
    border-top: 0;
    border-radius: 0 0 6px 6px;
    color: #8fa7c2 !important;
}

body[class*="route-usercp"] .myaccount-character-block-level {
    position: static !important;
    display: inline-flex;
    margin: 8px 0 0;
    padding: 3px 8px;
    color: #06111f !important;
    background: #d5ad54 !important;
    border-radius: 4px;
    font-weight: 700;
}

body[class*="route-usercp"] .label-success {
    background: #38d477 !important;
}

body[class*="route-usercp"] .label-danger {
    background: #ef4e5e !important;
}

body[class*="route-usercp"] .label-default {
    background: #10253d !important;
    color: #eef5ff !important;
    border: 1px solid rgba(38,91,136,.64);
}

@media (max-width: 900px) {
    body[class*="route-usercp"] .wrap {
        width: min(100% - 24px, 1240px) !important;
    }

    .usercp-grid {
        grid-template-columns: 1fr;
    }

    .usercp-nav {
        border-right: 0;
        border-bottom: 1px solid rgba(38,91,136,.65);
    }

    .usercp-nav nav {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .usercp-actions,
    .usercp-stat-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 560px) {
    body[class*="route-usercp"] .wrap {
        width: calc(100% - 16px) !important;
    }

    .usercp-topbar {
        align-items: flex-start;
        flex-direction: column;
    }

    .usercp-main {
        padding: 16px;
    }

    .usercp-nav nav,
    .usercp-actions,
    .usercp-stat-grid {
        grid-template-columns: 1fr;
    }
}

/* ==========================================================
   Home visual review - proportion, readability and alignment
   ========================================================== */
:root {
    --site-max-width: 1320px;
    --site-mid-width: 1180px;
    --sidebar-w: 318px;
    --main-gap: 22px;

    --font-display: "Orbitron", "Rajdhani", "Arial Narrow", sans-serif;
    --font-body: "Inter", "Roboto Condensed", Arial, sans-serif;

    --fs-11: 11px;
    --fs-12: 12px;
    --fs-13: 13px;
    --fs-14: 14px;
    --fs-15: 15px;
    --fs-16: 16px;
    --fs-18: 18px;
    --fs-20: 20px;
    --fs-24: 24px;
    --fs-30: 30px;

    --space-4: 4px;
    --space-6: 6px;
    --space-8: 8px;
    --space-10: 10px;
    --space-12: 12px;
    --space-14: 14px;
    --space-16: 16px;
    --space-20: 20px;
    --space-24: 24px;
    --space-28: 28px;
    --space-32: 32px;

    --bg-page: #06111f;
    --bg-panel: #08182a;
    --bg-panel-2: #0d2137;
    --bg-row: rgba(13, 33, 55, 0.66);
    --border-soft: rgba(67, 124, 173, 0.42);
    --border-strong: rgba(77, 151, 213, 0.72);
    --text-main: #edf5ff;
    --text-muted: #91a8c0;
    --text-soft: #6f88a2;
    --gold: #d9b85e;
    --gold-light: #f0d987;
    --blue: #56a9e8;
    --success: #35d77c;
    --danger: #ef5d68;
}

html,
body {
    font-family: var(--font-body) !important;
    font-size: var(--fs-14) !important;
    line-height: 1.45 !important;
    color: var(--text-main) !important;
    background-color: var(--bg-page) !important;
}

body.page #menujscallzer {
    height: 66px !important;
    padding-top: 0 !important;
    display: flex !important;
    align-items: flex-start !important;
    justify-content: center !important;
    z-index: 30 !important;
}

body.page #menujscallzer .boxmenusz {
    width: min(820px, calc(100% - 32px)) !important;
    min-height: 58px !important;
    height: 58px !important;
    padding: 0 36px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background-size: 100% 100% !important;
    filter: drop-shadow(0 9px 16px rgba(0,0,0,.38));
}

body.page #menujscallzer .boxmenusz::before,
body.page #menujscallzer .boxmenusz::after {
    top: 1px !important;
    height: 58px !important;
    background-size: auto 58px !important;
}

body.page div#menujscallzer ul {
    min-height: 58px !important;
    height: 58px !important;
    gap: 2px !important;
    align-items: center !important;
}

body.page div#menujscallzer ul li {
    height: 58px !important;
    display: inline-flex !important;
    align-items: center !important;
}

body.page div#menujscallzer ul li a {
    min-height: 58px !important;
    padding: 0 14px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #f2e8c9 !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-13) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .2px !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.9) !important;
    transition: color .18s ease, text-shadow .18s ease, background .18s ease !important;
}

body.page div#menujscallzer ul li a:hover {
    color: var(--gold-light) !important;
    background: linear-gradient(180deg, rgba(217,184,94,.08), rgba(86,169,232,.06)) !important;
    text-shadow: 0 0 9px rgba(217,184,94,.42), 0 1px 2px #000 !important;
}

body.page #menujscallzer ul li.menu-social {
    margin-left: 8px !important;
    margin-right: 16px !important;
    padding-left: 10px !important;
    border-left: 1px solid rgba(217,184,94,.34) !important;
    gap: 8px !important;
}

body.page #menujscallzer ul li.menu-social a {
    width: 24px !important;
    min-width: 24px !important;
    height: 58px !important;
    min-height: 58px !important;
    padding: 0 !important;
}

body.page #menujscallzer ul li.menu-social img {
    width: 19px !important;
    height: 19px !important;
    object-fit: contain !important;
}

body.page .wrap {
    width: 100% !important;
    max-width: none !important;
    margin: 0 auto !important;
    padding: 0 !important;
}

body.page .header,
body.page .language {
    display: none !important;
}

body.page .home-hero {
    position: relative !important;
    width: 100% !important;
    height: clamp(370px, 37vw, 470px) !important;
    min-height: 370px !important;
    margin: 0 0 -96px !important;
    background-position: center top !important;
    background-size: cover !important;
    overflow: hidden !important;
}

body.page .home-hero::after {
    content: "" !important;
    position: absolute !important;
    inset: 0 !important;
    background:
        linear-gradient(to bottom,
            rgba(4,12,24,.04) 0%,
            rgba(4,12,24,.10) 52%,
            rgba(4,12,24,.92) 100%) !important;
    pointer-events: none !important;
    z-index: 1 !important;
}

body.page .home-hero-overlay {
    background:
        radial-gradient(circle at 52% 18%, rgba(255,245,225,.18), transparent 28%),
        linear-gradient(90deg, rgba(6,17,31,.48), transparent 28%, transparent 72%, rgba(6,17,31,.55)) !important;
    z-index: 1 !important;
}

body.page .home-server-status {
    left: max(32px, calc((100% - var(--site-max-width)) / 2)) !important;
    bottom: 132px !important;
    width: 230px !important;
    min-width: 230px !important;
    min-height: 66px !important;
    padding: 14px 18px !important;
    gap: 12px !important;
    z-index: 3 !important;
    background: linear-gradient(135deg, rgba(8,24,42,.86), rgba(13,33,55,.74)) !important;
    border: 1px solid rgba(86,169,232,.38) !important;
    border-radius: 6px !important;
    box-shadow: 0 14px 28px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
    /* backdrop-filter removido (perf de scroll) */
}

body.page .home-server-status .status-dot {
    width: 14px !important;
    height: 14px !important;
    box-shadow: 0 0 13px rgba(53,215,124,.64) !important;
}

body.page .home-server-status strong {
    font-size: var(--fs-15) !important;
    line-height: 1.05 !important;
    letter-spacing: .2px !important;
}

body.page .home-server-status small {
    margin-top: 2px !important;
    font-size: var(--fs-12) !important;
    line-height: 1.25 !important;
    color: var(--text-muted) !important;
}

body.page .wrap .main {
    position: relative !important;
    width: min(var(--site-max-width), calc(100% - 64px)) !important;
    max-width: var(--site-max-width) !important;
    margin: 0 auto !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--sidebar-w) !important;
    gap: var(--main-gap) !important;
    align-items: start !important;
    z-index: 6 !important;
}

body.page .wrap .main > .top,
body.page .content-middle {
    display: none !important;
}

body.page .content,
body.page .sidebar.right {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.page .content .container,
body.page .sidebar.right .container {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.page .content .c {
    min-height: 372px !important;
    padding: 30px 32px 30px !important;
    border: 1px solid rgba(67,124,173,.58) !important;
    border-radius: 6px !important;
    background:
        linear-gradient(180deg, rgba(5,15,28,.9), rgba(5,15,28,.94)),
        radial-gradient(circle at 50% 0%, rgba(86,169,232,.12), transparent 36%) !important;
    box-shadow: 0 20px 38px rgba(0,0,0,.30), inset 0 0 0 1px rgba(255,255,255,.03) !important;
}

body.page .home-news-block {
    margin: 0 0 26px !important;
}

body.page .home-news-block-header {
    position: relative !important;
    min-height: 48px !important;
    height: 48px !important;
    margin: -2px 0 18px !important;
    padding: 0 30px !important;
    display: grid !important;
    grid-template-columns: 1fr auto 1fr !important;
    align-items: center !important;
    background:
        linear-gradient(180deg, rgba(6,17,31,.14), rgba(6,17,31,.26)),
        url(../img/ui/footer-bar.png) center / 100% 100% no-repeat !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page .home-news-block-header > div:first-child {
    grid-column: 2 !important;
}

body.page .home-news-block-header > div:last-child {
    grid-column: 3 !important;
    justify-self: end !important;
}

body.page .home-news-block-header h2 {
    font-family: var(--font-display) !important;
    font-size: var(--fs-18) !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    color: var(--text-main) !important;
    letter-spacing: .2px !important;
    text-align: center !important;
    text-shadow: 0 1px 2px #000, 0 0 10px rgba(217,184,94,.18) !important;
}

body.page .home-news-block-header a {
    font-size: var(--fs-12) !important;
    line-height: 1 !important;
    color: #8cc9f5 !important;
}

body.page .home-news-block-body > .col-xs-12 {
    padding: 0 !important;
}

body.page .home-news-block-article {
    min-height: 48px !important;
    margin: 0 !important;
    padding: 0 10px !important;
    display: grid !important;
    grid-template-columns: 1fr 110px !important;
    align-items: center !important;
    gap: 16px !important;
    border-bottom: 1px solid rgba(83,132,176,.15) !important;
    transition: background .18s ease, border-color .18s ease !important;
}

body.page .home-news-block-article:hover {
    background: rgba(13,33,55,.34) !important;
    border-color: rgba(86,169,232,.24) !important;
}

body.page .home-news-block-article > div {
    width: auto !important;
    padding: 0 !important;
}

body.page .home-news-block-article > .col-xs-3:first-child {
    display: none !important;
}

body.page .home-news-block-article-title-container {
    grid-column: 1 !important;
}

body.page .home-news-block-article > .col-xs-3:last-child {
    grid-column: 2 !important;
    justify-self: end !important;
}

body.page .home-news-block-article-title a {
    font-size: var(--fs-14) !important;
    font-weight: 600 !important;
    line-height: 1.35 !important;
    color: var(--text-main) !important;
}

body.page .home-news-block-article-date {
    width: 110px !important;
    display: block !important;
    font-size: var(--fs-12) !important;
    line-height: 1.2 !important;
    color: var(--text-muted) !important;
    text-align: right !important;
}

body.page .home-rankings-section {
    margin-top: 26px !important;
}

body.page .home-rankings-title {
    margin: 0 0 14px !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-18) !important;
    font-weight: 700 !important;
    line-height: 1.1 !important;
    color: var(--gold-light) !important;
    letter-spacing: .2px !important;
    text-shadow: 0 1px 2px #000 !important;
}

body.page .rank-cols {
    display: grid !important;
    grid-template-columns: repeat(5, minmax(145px, 1fr)) !important;
    gap: 14px !important;
}

body.page .rank-col {
    min-height: 170px !important;
    padding: 0 0 10px !important;
    overflow: hidden !important;
    border: 1px solid rgba(77,151,213,.52) !important;
    border-radius: 5px !important;
    background:
        linear-gradient(180deg, rgba(9,24,42,.92), rgba(5,15,28,.96)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), inset 0 -18px 34px rgba(0,0,0,.18) !important;
}

body.page .rank-col-title {
    min-height: 42px !important;
    padding: 0 10px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--gold-light) !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-12) !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    text-align: center !important;
    border-bottom: 1px solid rgba(83,132,176,.22) !important;
    background: linear-gradient(180deg, rgba(13,33,55,.62), rgba(8,24,42,.26)) !important;
}

body.page .rank-list {
    margin: 6px 0 0 !important;
    padding: 0 !important;
}

body.page .rank-list li {
    min-height: 25px !important;
    padding: 0 10px !important;
    display: grid !important;
    grid-template-columns: 26px minmax(0, 1fr) !important;
    align-items: center !important;
    color: #bfd4e9 !important;
    font-size: var(--fs-12) !important;
    line-height: 1.25 !important;
    border-bottom: 1px solid rgba(83,132,176,.10) !important;
}

body.page .rank-list li::marker {
    color: transparent !important;
}

body.page .rank-list li::before {
    content: counter(rk) "º" !important;
    color: #8fc4ed !important;
    font-weight: 600 !important;
}

body.page .rank-list .rk-name,
body.page .rank-list .rk-value {
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.page .sidebar.right {
    width: var(--sidebar-w) !important;
}

body.page .sidebar.right .partial-login,
body.page .sidebar.right .box,
body.page .sidebar.right .panel-sidebar-events {
    width: 100% !important;
}

body.page .sidebar.right .box,
body.page .sidebar.right .box-loginform,
body.page .sidebar.right .panel-sidebar-info,
body.page .sidebar.right .panel-sidebar-events {
    margin: 0 !important;
    padding: 12px 14px !important;
    border: 1px solid rgba(67,124,173,.54) !important;
    border-radius: 0 0 6px 6px !important;
    background: linear-gradient(180deg, rgba(8,24,42,.86), rgba(5,15,28,.92)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 20px rgba(0,0,0,.16) !important;
}

body.page .sidebar.right .box-bottom {
    height: 14px !important;
    margin: 0 !important;
    background: none !important;
}

body.page .wrap .main .sidebar.right .container .title.title-user,
body.page .wrap .main .sidebar.right .container .title.title-team,
body.page .wrap .main .sidebar.right .container .title.title-events,
body.page .wrap .main .sidebar.right .container .title.title-info {
    width: 100% !important;
    min-height: 34px !important;
    height: 34px !important;
    margin: 0 !important;
    padding: 0 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #77caff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-13) !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    letter-spacing: .25px !important;
    text-transform: uppercase !important;
    text-shadow: 0 1px 2px #000, 0 0 8px rgba(86,169,232,.24) !important;
    background-size: 100% 100% !important;
}

body.page .wrap .main .sidebar.right .container .title.title-team,
body.page .wrap .main .sidebar.right .container .title.title-events {
    color: transparent !important;
    font-size: 0 !important;
    line-height: 0 !important;
    text-shadow: none !important;
}

body.page .wrap .main .sidebar.right .container .title.title-info {
    background:
        linear-gradient(180deg, rgba(6,17,31,.16), rgba(6,17,31,.16)),
        url(../img/ui/footer-bar.png) center / 100% 100% no-repeat !important;
}

body.page .box-loginform form {
    display: grid !important;
    gap: 8px !important;
}

body.page .box-loginform input.login-input {
    width: 100% !important;
    height: 36px !important;
    padding: 0 12px 0 38px !important;
    color: var(--text-main) !important;
    font-size: var(--fs-13) !important;
    line-height: 36px !important;
    border: 1px solid rgba(86,169,232,.58) !important;
    border-radius: 4px !important;
    background-color: rgba(5,15,28,.78) !important;
    background-position: 12px center !important;
    box-shadow: inset 0 1px 4px rgba(0,0,0,.34) !important;
}

body.page .box-loginform input.login-input:focus {
    border-color: rgba(86,169,232,.95) !important;
    box-shadow: 0 0 0 2px rgba(86,169,232,.12), inset 0 1px 4px rgba(0,0,0,.34) !important;
    outline: none !important;
}

body.page .box-loginform input.login-submit {
    width: 100% !important;
    height: 38px !important;
    margin-top: 2px !important;
    color: #f7fbff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-13) !important;
    font-weight: 700 !important;
    line-height: 38px !important;
    letter-spacing: .4px !important;
    border: 0 !important;
    border-radius: 4px !important;
    background-size: 100% 100% !important;
    text-shadow: 0 1px 2px #000 !important;
    transition: filter .18s ease, box-shadow .18s ease !important;
}

body.page .box-loginform input.login-submit:hover {
    filter: brightness(1.12) !important;
    box-shadow: 0 0 14px rgba(86,169,232,.18) !important;
}

body.page .forgot-password {
    margin-top: 8px !important;
    padding-top: 0 !important;
    color: var(--text-soft) !important;
    font-size: var(--fs-11) !important;
    line-height: 1.35 !important;
    text-align: center !important;
}

body.page .panel-sidebar-info ul li,
body.page .sidebar.right .box > ul > li {
    min-height: 30px !important;
    padding: 0 10px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    color: #b9cce1 !important;
    font-size: var(--fs-12) !important;
    line-height: 1.4 !important;
    border-bottom: 1px solid rgba(83,132,176,.14) !important;
}

body.page .panel-sidebar-info ul li:last-child,
body.page .sidebar.right .box > ul > li:last-child {
    border-bottom: 0 !important;
}

body.page .panel-sidebar-info ul li span.text,
body.page .sidebar.right .box > ul > li span.time {
    justify-self: end !important;
    min-width: auto !important;
    max-width: 150px !important;
    color: var(--text-main) !important;
    font-size: var(--fs-12) !important;
    font-weight: 600 !important;
    line-height: 1.2 !important;
    text-align: right !important;
}

body.page .panel-sidebar-info ul li span.online-text,
body.page .sidebar.right .box > ul > li span.bg-success {
    color: var(--success) !important;
}

body.page .sidebar.right .box > ul > li span.label-default {
    color: var(--danger) !important;
    background: transparent !important;
}

body.page .panel-sidebar-events .events-table {
    width: 100% !important;
    table-layout: fixed !important;
}

body.page .panel-sidebar-events .events-table tr {
    min-height: 32px !important;
}

body.page .panel-sidebar-events .events-table td {
    min-height: 32px !important;
    height: 32px !important;
    padding: 5px 10px !important;
    color: #bfd4e9 !important;
    font-size: var(--fs-12) !important;
    line-height: 1.2 !important;
    vertical-align: middle !important;
    border-bottom: 1px solid rgba(83,132,176,.14) !important;
}

body.page .panel-sidebar-events .events-table td:first-child {
    width: calc(100% - 92px) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

body.page .panel-sidebar-events .events-table td:last-child {
    width: 92px !important;
    color: var(--text-main) !important;
    font-weight: 600 !important;
}

body.page .panel-sidebar-events .smalltext {
    display: block !important;
    margin-top: 2px !important;
    color: var(--text-soft) !important;
    font-size: var(--fs-11) !important;
    line-height: 1.15 !important;
}

body.page #footer-faixa {
    width: min(var(--site-max-width), calc(100% - 64px)) !important;
    min-height: 0 !important;
    margin: 44px auto 0 !important;
    padding: 34px 24px 30px !important;
    border-top: 1px solid rgba(67,124,173,.36) !important;
    background: linear-gradient(180deg, rgba(5,15,28,.92), rgba(3,10,18,.98)) !important;
    text-align: center !important;
}

body.page #footer-faixa::before {
    top: 10px !important;
    width: min(360px, calc(100% - 48px)) !important;
}

body.page #footer-faixa a {
    font-size: var(--fs-13) !important;
    line-height: 1.45 !important;
    color: #8bb9df !important;
    transition: color .18s ease !important;
}

body.page #footer-faixa a:hover {
    color: var(--gold-light) !important;
}

body.page #creditos {
    padding: 18px 16px 26px !important;
    color: var(--text-soft) !important;
    font-size: var(--fs-12) !important;
    line-height: 1.4 !important;
}

@media (max-width: 1440px) {
    :root {
        --site-max-width: 1180px;
        --sidebar-w: 300px;
        --main-gap: 20px;
    }

    body.page .wrap .main,
    body.page #footer-faixa {
        width: min(var(--site-max-width), calc(100% - 40px)) !important;
    }

    body.page .content .c {
        padding: 28px 30px !important;
    }

    body.page .rank-cols {
        gap: 12px !important;
    }
}

@media (max-width: 1180px) {
    :root {
        --sidebar-w: 286px;
        --main-gap: 18px;
    }

    body.page .wrap .main {
        grid-template-columns: minmax(0, 1fr) var(--sidebar-w) !important;
    }

    body.page .rank-cols {
        grid-template-columns: repeat(3, minmax(145px, 1fr)) !important;
    }

    body.page div#menujscallzer ul li a {
        padding: 0 10px !important;
        font-size: var(--fs-12) !important;
    }
}

@media (max-width: 900px) {
    body.page #menujscallzer {
        height: auto !important;
        min-height: 64px !important;
    }

    body.page #menujscallzer .boxmenusz {
        width: calc(100% - 20px) !important;
        height: auto !important;
        min-height: 64px !important;
        padding: 8px 22px !important;
    }

    body.page div#menujscallzer ul {
        height: auto !important;
        min-height: 48px !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        row-gap: 2px !important;
    }

    body.page div#menujscallzer ul li,
    body.page div#menujscallzer ul li a,
    body.page #menujscallzer ul li.menu-social a {
        height: 34px !important;
        min-height: 34px !important;
    }

    body.page .home-hero {
        height: 330px !important;
        min-height: 330px !important;
        margin-bottom: -70px !important;
    }

    body.page .home-server-status {
        left: 20px !important;
        bottom: 94px !important;
        width: 220px !important;
        min-width: 220px !important;
    }

    body.page .wrap .main {
        width: calc(100% - 32px) !important;
        grid-template-columns: 1fr !important;
    }

    body.page .sidebar.right {
        width: 100% !important;
    }

    body.page .rank-cols {
        grid-template-columns: repeat(2, minmax(145px, 1fr)) !important;
    }

    body.page #footer-faixa {
        width: calc(100% - 32px) !important;
        margin-top: 36px !important;
    }
}

@media (max-width: 640px) {
    body.page .home-hero {
        height: 290px !important;
        min-height: 290px !important;
        background-position: 54% top !important;
    }

    body.page .home-server-status {
        width: calc(100% - 32px) !important;
        min-width: 0 !important;
        left: 16px !important;
        bottom: 82px !important;
    }

    body.page .wrap .main {
        width: calc(100% - 24px) !important;
    }

    body.page .content .c {
        padding: 22px 16px !important;
    }

    body.page .home-news-block-header {
        min-height: 46px !important;
        height: 46px !important;
        padding: 0 18px !important;
    }

    body.page .home-news-block-header h2 {
        font-size: var(--fs-16) !important;
    }

    body.page .home-news-block-article {
        grid-template-columns: 1fr !important;
        gap: 2px !important;
        padding: 8px 10px !important;
    }

    body.page .home-news-block-article > .col-xs-3:last-child {
        grid-column: 1 !important;
        justify-self: start !important;
    }

    body.page .home-news-block-article-date {
        text-align: left !important;
    }

    body.page .rank-cols {
        grid-template-columns: 1fr !important;
    }

    body.page #footer-faixa {
        width: calc(100% - 24px) !important;
        padding: 32px 16px 28px !important;
    }
}

/* ==========================================================
   Premium MU mockup pass
   ========================================================== */
:root {
    --premium-width: 1320px;
    --premium-sidebar: 340px;
    --premium-gap: 18px;
    --premium-bg: #06111f;
    --premium-panel: rgba(6, 18, 33, .92);
    --premium-panel-2: rgba(9, 27, 47, .88);
    --premium-row: rgba(18, 43, 68, .58);
    --premium-border: rgba(184, 132, 54, .62);
    --premium-border-blue: rgba(77, 151, 213, .42);
    --premium-gold: #f0c568;
    --premium-gold-2: #b88436;
    --premium-blue: #67bdf2;
}

body.page {
    background:
        radial-gradient(circle at 50% 0, rgba(30,77,116,.34), transparent 30%),
        linear-gradient(90deg, #020914 0, #06111f 14%, #06111f 86%, #020914 100%) !important;
}

body.page #menujscallzer {
    height: 82px !important;
    align-items: stretch !important;
    background: linear-gradient(180deg, rgba(1,9,18,.96), rgba(4,16,30,.92)) !important;
    border-bottom: 1px solid rgba(184,132,54,.28) !important;
    box-shadow: 0 16px 34px rgba(0,0,0,.36) !important;
}

body.page #menujscallzer .boxmenusz {
    width: min(var(--premium-width), calc(100% - 40px)) !important;
    height: 82px !important;
    min-height: 82px !important;
    padding: 0 22px !important;
    background: none !important;
    filter: none !important;
}

body.page #menujscallzer .boxmenusz::before,
body.page #menujscallzer .boxmenusz::after {
    display: none !important;
}

body.page div#menujscallzer ul {
    width: 100% !important;
    height: 82px !important;
    min-height: 82px !important;
    justify-content: center !important;
    gap: 0 !important;
}

body.page div#menujscallzer ul li {
    height: 82px !important;
}

body.page div#menujscallzer ul li a {
    height: 82px !important;
    min-height: 82px !important;
    min-width: 92px !important;
    padding: 10px 12px 9px !important;
    display: inline-flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    color: #c7d0dc !important;
    font-family: var(--font-body) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .2px !important;
}

body.page div#menujscallzer ul li a::before {
    content: "\f005";
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(210,222,236,.58);
    font-family: "Font Awesome 6 Free";
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
    transition: color .18s ease, transform .18s ease, text-shadow .18s ease;
}

body.page div#menujscallzer ul li:nth-child(1) a::before { content: "\f015"; color: var(--premium-gold); }
body.page div#menujscallzer ul li:nth-child(2) a::before { content: "\f234"; }
body.page div#menujscallzer ul li:nth-child(3) a::before { content: "\f019"; }
body.page div#menujscallzer ul li:nth-child(4) a::before { content: "\f091"; }
body.page div#menujscallzer ul li:nth-child(5) a::before { content: "\f3a5"; }
body.page div#menujscallzer ul li:nth-child(6) a::before { content: "\f19c"; }

body.page div#menujscallzer ul li a:hover,
body.page div#menujscallzer ul li:first-child a {
    color: var(--premium-gold) !important;
    background: linear-gradient(180deg, rgba(240,197,104,.10), transparent) !important;
}

body.page div#menujscallzer ul li a:hover::before,
body.page div#menujscallzer ul li:first-child a::before {
    color: var(--premium-gold) !important;
    transform: translateY(-1px);
    text-shadow: 0 0 12px rgba(240,197,104,.34);
}

body.page #menujscallzer ul li.menu-social {
    height: 82px !important;
    margin-left: 10px !important;
    margin-right: 0 !important;
    padding-left: 16px !important;
    border-left: 1px solid rgba(184,132,54,.38) !important;
}

body.page #menujscallzer ul li.menu-social a {
    width: 34px !important;
    min-width: 34px !important;
    height: 82px !important;
    min-height: 82px !important;
}

body.page #menujscallzer ul li.menu-social a::before {
    display: none !important;
}

body.page #menujscallzer ul li.menu-social img {
    width: 25px !important;
    height: 25px !important;
    filter: drop-shadow(0 0 8px rgba(86,169,232,.28));
}

body.page #menujscallzer ul li.menu-play {
    height: 82px !important;
    margin-left: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
}

body.page #menujscallzer ul li.menu-play a {
    width: 172px !important;
    min-width: 172px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 22px !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff2c8 !important;
    font-family: var(--font-display) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    letter-spacing: .4px !important;
    text-transform: uppercase !important;
    border: 1px solid rgba(240,197,104,.78) !important;
    border-radius: 4px !important;
    background:
        linear-gradient(180deg, rgba(22,83,137,.88), rgba(7,30,56,.96)),
        radial-gradient(circle at 50% 0, rgba(240,197,104,.28), transparent 38%) !important;
    box-shadow:
        0 0 0 1px rgba(77,151,213,.28),
        0 0 22px rgba(15,89,157,.32),
        inset 0 1px 0 rgba(255,255,255,.12) !important;
}

body.page #menujscallzer ul li.menu-play a::before,
body.page #menujscallzer ul li.menu-play a::after {
    display: none !important;
}

body.page .home-hero {
    height: 348px !important;
    min-height: 348px !important;
    margin: 0 0 -48px !important;
    background-position: center top !important;
}

body.page .home-server-status {
    display: none !important;
}

body.page .wrap .main {
    width: min(var(--premium-width), calc(100% - 56px)) !important;
    max-width: var(--premium-width) !important;
    grid-template-columns: minmax(0, 1fr) var(--premium-sidebar) !important;
    gap: var(--premium-gap) !important;
}

body.page .content .c {
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
}

body.page .premium-stat-strip {
    position: relative;
    z-index: 3;
    margin: 0 0 12px !important;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    border: 1px solid rgba(184,132,54,.52);
    background:
        linear-gradient(180deg, rgba(9,27,47,.94), rgba(4,15,29,.92)),
        radial-gradient(circle at 10% 0, rgba(103,189,242,.12), transparent 32%);
    box-shadow: 0 12px 24px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.05);
}

body.page .premium-stat-card {
    min-height: 66px;
    padding: 12px 16px;
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr);
    grid-template-rows: auto auto;
    column-gap: 12px;
    align-items: center;
    border-right: 1px solid rgba(184,132,54,.24);
}

body.page .premium-stat-card:last-child {
    border-right: 0;
}

body.page .premium-stat-card i {
    grid-row: 1 / span 2;
    color: var(--premium-gold);
    font-size: 25px;
    text-shadow: 0 0 13px rgba(240,197,104,.24);
}

body.page .premium-stat-card span {
    color: var(--premium-gold);
    font-size: 11px;
    font-weight: 800;
    line-height: 1.1;
    text-transform: uppercase;
}

body.page .premium-stat-card strong {
    color: #eef6ff;
    font-size: 14px;
    font-weight: 800;
    line-height: 1.15;
    text-transform: uppercase;
}

body.page .home-news-block,
body.page .home-rankings-section,
body.page .premium-action-grid {
    border: 1px solid rgba(184,132,54,.52);
    background:
        linear-gradient(180deg, rgba(7,20,36,.94), rgba(5,15,28,.96)),
        radial-gradient(circle at 50% 0, rgba(103,189,242,.10), transparent 35%) !important;
    box-shadow: inset 0 0 0 1px rgba(77,151,213,.12), 0 16px 30px rgba(0,0,0,.26);
}

body.page .home-news-block {
    margin: 0 !important;
    padding: 18px 20px 16px !important;
    border-bottom: 0 !important;
}

body.page .home-news-block-header {
    min-height: 34px !important;
    height: 34px !important;
    margin: 0 0 12px !important;
    padding: 0 !important;
    grid-template-columns: auto 1fr auto !important;
    background: none !important;
}

body.page .home-news-block-header::after {
    content: "";
    grid-column: 2;
    height: 1px;
    margin: 0 18px;
    background: linear-gradient(90deg, rgba(184,132,54,.48), transparent);
}

body.page .home-news-block-header > div:first-child {
    grid-column: 1 !important;
}

body.page .home-news-block-header > div:last-child {
    grid-column: 3 !important;
}

body.page .home-news-block-header h2,
body.page .home-rankings-title {
    color: var(--premium-gold) !important;
    font-family: var(--font-body) !important;
    font-size: 18px !important;
    font-weight: 900 !important;
    text-align: left !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
}

body.page .home-news-block-header a {
    color: var(--premium-blue) !important;
    font-size: 11px !important;
    font-weight: 800 !important;
    text-transform: uppercase !important;
}

body.page .home-news-block-body > .col-xs-12 {
    display: grid !important;
    grid-template-columns: minmax(300px, .95fr) minmax(0, 1fr) !important;
    column-gap: 18px !important;
    align-items: stretch !important;
}

body.page .premium-featured-news {
    grid-row: span 3;
    min-height: 190px;
    border: 1px solid rgba(77,151,213,.48);
    border-radius: 5px;
    overflow: hidden;
    background:
        linear-gradient(180deg, rgba(4,10,18,.18), rgba(4,10,18,.86)),
        url(../img/castle_owner_bg.jpg) center / cover no-repeat;
    box-shadow: inset 0 0 0 1px rgba(255,255,255,.04);
}

body.page .premium-featured-copy {
    min-height: 190px;
    padding: 0 18px 18px;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
}

body.page .premium-featured-copy span {
    color: var(--premium-gold);
    font-size: 17px;
    font-weight: 900;
    line-height: 1.1;
    text-transform: uppercase;
}

body.page .premium-featured-copy strong {
    max-width: 95%;
    margin-top: 8px;
    color: #f2f7ff;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.35;
}

body.page .premium-featured-copy a {
    width: max-content;
    margin-top: 12px;
    padding: 7px 18px;
    color: #dcecff !important;
    font-size: 12px;
    font-weight: 800;
    text-transform: uppercase;
    border: 1px solid rgba(77,151,213,.54);
    border-radius: 4px;
    background: linear-gradient(180deg, rgba(24,74,114,.8), rgba(9,31,55,.9));
}

body.page .home-news-block-article {
    min-height: 60px !important;
    padding: 0 0 0 0 !important;
    grid-template-columns: minmax(0, 1fr) 92px !important;
}

body.page .home-rankings-section {
    margin: 0 !important;
    padding: 0 20px 22px !important;
    border-top: 0 !important;
}

body.page .home-rankings-title {
    margin: 0 0 12px !important;
}

body.page .rank-cols {
    grid-template-columns: repeat(5, minmax(132px, 1fr)) !important;
    gap: 10px !important;
}

body.page .rank-col {
    min-height: 178px !important;
    border-color: rgba(77,151,213,.55) !important;
    background: linear-gradient(180deg, rgba(8,24,42,.92), rgba(5,17,31,.95)) !important;
}

body.page .rank-col-title {
    min-height: 44px !important;
    color: var(--premium-gold) !important;
}

body.page .premium-action-grid {
    margin-top: 14px;
    padding: 14px;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

body.page .premium-action-card {
    min-height: 84px;
    padding: 16px 18px 16px 76px;
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    color: #dcecff !important;
    border: 1px solid rgba(184,132,54,.58);
    border-radius: 4px;
    background:
        linear-gradient(90deg, rgba(184,132,54,.10), rgba(9,27,47,.74)),
        radial-gradient(circle at 0 50%, rgba(103,189,242,.22), transparent 35%);
}

body.page .premium-action-card i {
    position: absolute;
    left: 20px;
    top: 50%;
    transform: translateY(-50%);
    color: var(--premium-gold);
    font-size: 34px;
}

body.page .premium-action-card span {
    color: var(--premium-gold);
    font-size: 17px;
    font-weight: 900;
    line-height: 1.1;
    text-transform: uppercase;
}

body.page .premium-action-card small {
    margin-top: 5px;
    color: #aebed2;
    font-size: 12px;
    line-height: 1.25;
}

body.page .sidebar.right .box,
body.page .sidebar.right .box-loginform,
body.page .sidebar.right .panel-sidebar-info,
body.page .sidebar.right .panel-sidebar-events {
    border-color: rgba(184,132,54,.56) !important;
    border-radius: 5px !important;
    background:
        linear-gradient(180deg, rgba(8,24,42,.94), rgba(5,15,28,.96)),
        radial-gradient(circle at 50% 0, rgba(103,189,242,.10), transparent 38%) !important;
}

body.page .wrap .main .sidebar.right .container .title.title-user,
body.page .wrap .main .sidebar.right .container .title.title-team,
body.page .wrap .main .sidebar.right .container .title.title-events,
body.page .wrap .main .sidebar.right .container .title.title-info {
    height: 38px !important;
    min-height: 38px !important;
    color: var(--premium-gold) !important;
    border: 1px solid rgba(184,132,54,.58) !important;
    border-bottom: 0 !important;
    border-radius: 5px 5px 0 0 !important;
    background: linear-gradient(180deg, rgba(11,35,61,.94), rgba(5,15,28,.95)) !important;
}

body.page .wrap .main .sidebar.right .container .title.title-team,
body.page .wrap .main .sidebar.right .container .title.title-events {
    color: var(--premium-gold) !important;
    font-size: 13px !important;
    line-height: 1 !important;
    text-shadow: 0 1px 2px #000 !important;
}

body.page .box-loginform::before {
    content: "Entre com sua conta para acessar o painel";
    display: block;
    margin-bottom: 10px;
    color: #aebed2;
    font-size: 12px;
    line-height: 1.35;
    text-align: center;
}

body.page #footer-faixa {
    border-color: rgba(184,132,54,.38) !important;
    background:
        linear-gradient(180deg, rgba(5,15,28,.94), rgba(2,8,16,.98)),
        url(../img/bottom-bg-fon.jpg) right bottom / auto 100% no-repeat !important;
}

@media (max-width: 1440px) {
    :root {
        --premium-width: 1180px;
        --premium-sidebar: 300px;
        --premium-gap: 16px;
    }

    body.page .home-news-block-body > .col-xs-12 {
        grid-template-columns: minmax(280px, .9fr) minmax(0, 1fr) !important;
    }
}

@media (max-width: 1180px) {
    body.page .premium-stat-strip {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.page .home-news-block-body > .col-xs-12 {
        grid-template-columns: 1fr !important;
    }

    body.page .premium-featured-news {
        margin-bottom: 12px;
    }

    body.page .rank-cols {
        grid-template-columns: repeat(3, minmax(145px, 1fr)) !important;
    }
}

@media (max-width: 900px) {
    body.page #menujscallzer,
    body.page #menujscallzer .boxmenusz,
    body.page div#menujscallzer ul {
        height: auto !important;
        min-height: 72px !important;
    }

    body.page div#menujscallzer ul li,
    body.page div#menujscallzer ul li a,
    body.page #menujscallzer ul li.menu-social a {
        height: 58px !important;
        min-height: 58px !important;
    }

    body.page div#menujscallzer ul li a {
        min-width: 78px !important;
        font-size: 11px !important;
    }

    body.page div#menujscallzer ul li a::before {
        font-size: 18px;
    }

    body.page .premium-action-grid {
        grid-template-columns: 1fr;
    }

    body.page .wrap .main {
        width: calc(100% - 28px) !important;
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }

    body.page .content,
    body.page .sidebar.right {
        width: 100% !important;
        max-width: 100% !important;
    }

    body.page .premium-stat-strip {
        margin-top: 0 !important;
    }
}

@media (max-width: 640px) {
    body.page .premium-stat-strip {
        grid-template-columns: 1fr;
    }

    body.page .premium-stat-card {
        border-right: 0;
        border-bottom: 1px solid rgba(184,132,54,.22);
    }

    body.page .home-hero {
        height: 260px !important;
        min-height: 260px !important;
        margin-bottom: -34px !important;
    }

    body.page .rank-cols {
        grid-template-columns: 1fr !important;
    }

    body.page .wrap .main {
        width: calc(100% - 24px) !important;
    }

    body.page .home-news-block {
        padding: 16px 14px !important;
    }

    body.page .home-news-block-header {
        grid-template-columns: minmax(0, 1fr) auto !important;
        height: auto !important;
        min-height: 38px !important;
    }

    body.page .home-news-block-header::after {
        display: none !important;
    }

    body.page .home-news-block-header h2 {
        max-width: 190px !important;
        font-size: 17px !important;
        line-height: 1.1 !important;
    }

    body.page .premium-featured-news,
    body.page .premium-featured-copy {
        min-height: 200px !important;
    }

    body.page .premium-featured-copy span {
        font-size: 16px !important;
    }

    body.page .premium-featured-copy strong {
        font-size: 12px !important;
    }
}

/* ==========================================================
   Premium fixes requested: remove loose ornaments, normalize
   login/events and keep inner pages visually consistent.
   ========================================================== */
body.page .home-rankings-section::before,
body.page .home-rankings-section::after,
body.page .home-news-block::before,
body.page .home-news-block::after,
body.page .content .c::before,
body.page .content .c::after,
body.page .ajax-container::before,
body.page .ajax-container::after,
body.page #footer-faixa::before,
body.page #footer-faixa::after,
body.page .content-middle,
body.page .box-bottom {
    display: none !important;
    content: none !important;
    background: none !important;
}

body.page .home-news-block,
body.page .home-rankings-section,
body.page .premium-action-grid {
    position: relative !important;
    overflow: visible !important;
}

body.page .home-rankings-section {
    border-top: 1px solid rgba(184,132,54,.52) !important;
    margin-top: 14px !important;
    padding-top: 18px !important;
}

body.page .sidebar.right .partial-login,
body.page .sidebar.right .box,
body.page .sidebar.right .panel-sidebar-info,
body.page .sidebar.right .panel-sidebar-events {
    overflow: visible !important;
}

body.page .sidebar.right .box-loginform {
    min-height: 196px !important;
    padding: 12px 14px 14px !important;
}

body.page .box-loginform form {
    display: grid !important;
    gap: 9px !important;
}

body.page .box-loginform input.login-input,
body.page-inner .box-loginform input.login-input {
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 12px 0 38px !important;
    line-height: 34px !important;
    color: #eaf5ff !important;
    border: 1px solid rgba(77,151,213,.58) !important;
    border-radius: 4px !important;
    background-color: rgba(4,15,28,.86) !important;
}

body.page .box-loginform input.login-submit,
body.page-inner .box-loginform input.login-submit,
body.page-inner input#logaaijs {
    width: 100% !important;
    height: 44px !important;
    min-height: 44px !important;
    margin: 2px 0 0 !important;
    padding: 0 !important;
    display: block !important;
    color: #f5fbff !important;
    font-family: var(--font-display) !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    line-height: 44px !important;
    letter-spacing: 1px !important;
    text-align: center !important;
    text-indent: 0 !important;
    text-transform: uppercase !important;
    border: 1px solid rgba(77,151,213,.74) !important;
    border-radius: 4px !important;
    background:
        linear-gradient(180deg, rgba(24,86,137,.96), rgba(7,31,57,.98)) !important;
    background-image:
        linear-gradient(180deg, rgba(24,86,137,.96), rgba(7,31,57,.98)) !important;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 0 15px rgba(77,151,213,.22) !important;
    appearance: none !important;
}

body.page .forgot-password,
body.page-inner .forgot-password {
    margin-top: 8px !important;
    font-size: 11px !important;
    line-height: 1.35 !important;
}

body.page .panel-sidebar-events {
    max-height: none !important;
    overflow: visible !important;
}

body.page .panel-sidebar-events .events-table,
body.page .panel-sidebar-events .events-table tbody {
    display: block !important;
    width: 100% !important;
}

body.page .panel-sidebar-events .events-table tr {
    min-height: 44px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 96px !important;
    align-items: center !important;
    border-bottom: 1px solid rgba(83,132,176,.14) !important;
}

body.page .panel-sidebar-events .events-table tr:last-child {
    border-bottom: 0 !important;
}

body.page .panel-sidebar-events .events-table td {
    width: auto !important;
    height: auto !important;
    min-height: 44px !important;
    padding: 6px 8px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    border-bottom: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
}

body.page .panel-sidebar-events .events-table td:last-child {
    width: auto !important;
    align-items: flex-end !important;
    text-align: right !important;
}

body.page .panel-sidebar-events .smalltext {
    white-space: nowrap !important;
}

body.page-inner {
    background:
        radial-gradient(circle at 50% 0, rgba(30,77,116,.34), transparent 30%),
        linear-gradient(90deg, #020914 0, #06111f 14%, #06111f 86%, #020914 100%) !important;
}

body.page-inner #menujscallzer {
    height: 82px !important;
    align-items: stretch !important;
    background: linear-gradient(180deg, rgba(1,9,18,.96), rgba(4,16,30,.92)) !important;
    border-bottom: 1px solid rgba(184,132,54,.28) !important;
    box-shadow: 0 16px 34px rgba(0,0,0,.36) !important;
}

body.page-inner #menujscallzer .boxmenusz {
    width: min(var(--premium-width), calc(100% - 40px)) !important;
    height: 82px !important;
    min-height: 82px !important;
    padding: 0 22px !important;
    background: none !important;
    filter: none !important;
}

body.page-inner #menujscallzer .boxmenusz::before,
body.page-inner #menujscallzer .boxmenusz::after {
    display: none !important;
}

body.page-inner div#menujscallzer ul {
    width: 100% !important;
    height: 82px !important;
    min-height: 82px !important;
    justify-content: center !important;
    gap: 0 !important;
}

body.page-inner div#menujscallzer ul li {
    height: 82px !important;
}

body.page-inner div#menujscallzer ul li a {
    height: 82px !important;
    min-height: 82px !important;
    min-width: 92px !important;
    padding: 10px 12px 9px !important;
    display: inline-flex !important;
    flex-direction: column !important;
    gap: 7px !important;
    color: #c7d0dc !important;
    font-family: var(--font-body) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .2px !important;
}

body.page-inner div#menujscallzer ul li a::before {
    content: "\f005";
    width: 30px;
    height: 30px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: rgba(210,222,236,.58);
    font-family: "Font Awesome 6 Free";
    font-size: 22px;
    font-weight: 900;
    line-height: 1;
}

body.page-inner div#menujscallzer ul li:nth-child(1) a::before { content: "\f015"; }
body.page-inner div#menujscallzer ul li:nth-child(2) a::before { content: "\f234"; }
body.page-inner div#menujscallzer ul li:nth-child(3) a::before { content: "\f019"; }
body.page-inner div#menujscallzer ul li:nth-child(4) a::before { content: "\f091"; }
body.page-inner div#menujscallzer ul li:nth-child(5) a::before { content: "\f3a5"; }
body.page-inner div#menujscallzer ul li:nth-child(6) a::before { content: "\f19c"; }

body.page-inner div#menujscallzer ul li a:hover,
body.page-inner div#menujscallzer ul li:first-child a {
    color: var(--premium-gold) !important;
    background: linear-gradient(180deg, rgba(240,197,104,.10), transparent) !important;
}

body.page-inner #menujscallzer ul li.menu-social {
    height: 82px !important;
    margin-left: 10px !important;
    padding-left: 16px !important;
    border-left: 1px solid rgba(184,132,54,.38) !important;
}

body.page-inner #menujscallzer ul li.menu-social a {
    width: 34px !important;
    min-width: 34px !important;
    height: 82px !important;
    min-height: 82px !important;
    padding: 0 !important;
}

body.page-inner #menujscallzer ul li.menu-social a::before {
    display: none !important;
}

body.page-inner #menujscallzer ul li.menu-social img {
    width: 25px !important;
    height: 25px !important;
}

body.page-inner #menujscallzer ul li.menu-play {
    height: 82px !important;
    margin-left: 18px !important;
    display: inline-flex !important;
    align-items: center !important;
}

body.page-inner #menujscallzer ul li.menu-play a {
    width: 172px !important;
    min-width: 172px !important;
    height: 54px !important;
    min-height: 54px !important;
    padding: 0 22px !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    color: #fff2c8 !important;
    font-family: var(--font-display) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    letter-spacing: .4px !important;
    text-transform: uppercase !important;
    border: 1px solid rgba(240,197,104,.78) !important;
    border-radius: 4px !important;
    background: linear-gradient(180deg, rgba(24,83,137,.88), rgba(7,30,56,.96)) !important;
}

body.page-inner #menujscallzer ul li.menu-play a::before {
    display: none !important;
}

body.page-inner .wrap {
    width: min(var(--premium-width), calc(100% - 56px)) !important;
    max-width: var(--premium-width) !important;
    margin: 210px auto 0 !important;
}

body.page-inner .wrap::before {
    top: -210px !important;
    height: 410px !important;
    background:
        linear-gradient(180deg, rgba(5,11,20,.02) 0%, rgba(5,11,20,.15) 58%, rgba(6,14,26,.75) 86%, #06111f 100%),
        url(../img/ui/top-fon-home-dark.jpg) center top / cover no-repeat !important;
}

body.page-inner .wrap .header {
    display: none !important;
}

body.page-inner .wrap .main {
    width: 100% !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--premium-sidebar) !important;
    gap: var(--premium-gap) !important;
    padding: 22px !important;
    border: 1px solid rgba(77,151,213,.38) !important;
    border-radius: 6px !important;
    background: rgba(6,18,33,.88) !important;
    box-shadow: 0 18px 34px rgba(0,0,0,.34), inset 0 0 0 1px rgba(255,255,255,.03) !important;
}

body.page-inner .wrap .main .content,
body.page-inner .wrap .main .sidebar.right {
    width: auto !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.page-inner .wrap .main .content .container,
body.page-inner .wrap .main .sidebar.right .container {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.page-inner:not([class*="route-usercp"]) .wrap .main .content .container .c {
    padding: 22px !important;
    border: 1px solid rgba(184,132,54,.36) !important;
    border-radius: 5px !important;
    background: linear-gradient(180deg, rgba(7,20,36,.94), rgba(5,15,28,.96)) !important;
    box-shadow: inset 0 0 0 1px rgba(77,151,213,.12) !important;
}

body.page-inner .wrap .main .sidebar.right .container .title,
body.page-inner:not([class*="route-usercp"]) .wrap .main .content .container h1.title,
body.page-inner:not([class*="route-usercp"]) .wrap .main .content .container .page-title,
body.page-inner:not([class*="route-usercp"]) .wrap .main .content .container .panel-heading {
    min-height: 38px !important;
    color: var(--premium-gold) !important;
    border: 1px solid rgba(184,132,54,.58) !important;
    border-radius: 5px 5px 0 0 !important;
    background: linear-gradient(180deg, rgba(11,35,61,.94), rgba(5,15,28,.95)) !important;
}

body.page-inner .wrap .main .sidebar.right .container .box {
    padding: 12px 14px !important;
    border: 1px solid rgba(184,132,54,.42) !important;
    border-radius: 0 0 5px 5px !important;
    background: linear-gradient(180deg, rgba(8,24,42,.94), rgba(5,15,28,.96)) !important;
}

body.page-inner .wrap .main .sidebar.right .container .box-bottom {
    display: none !important;
}

body.page-inner .language,
body.page-inner .servers-block {
    display: none !important;
}

body.page-inner .partial-login {
    width: 100% !important;
    margin: 0 0 14px !important;
}

body.page-inner .wrap .main .sidebar.right .container .title {
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    margin: 0 !important;
    padding: 0 18px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: var(--premium-gold) !important;
    font-family: var(--font-display) !important;
    font-size: 13px !important;
    font-weight: 900 !important;
    line-height: 1 !important;
    letter-spacing: .25px !important;
    text-transform: uppercase !important;
    text-shadow: 0 1px 2px #000 !important;
    border: 1px solid rgba(184,132,54,.58) !important;
    border-bottom: 0 !important;
    border-radius: 5px 5px 0 0 !important;
    background: linear-gradient(180deg, rgba(11,35,61,.94), rgba(5,15,28,.95)) !important;
}

body.page-inner .box-loginform {
    min-height: 196px !important;
}

body.page-inner .box-loginform form {
    display: grid !important;
    gap: 9px !important;
}

body.page-inner input#loginjscallzer,
body.page-inner input#senhajs,
body.page-inner .box-loginform input[type="text"],
body.page-inner .box-loginform input[type="password"] {
    width: 100% !important;
    height: 34px !important;
    min-height: 34px !important;
    padding: 0 12px 0 38px !important;
    color: #eaf5ff !important;
    font-size: 13px !important;
    font-weight: 600 !important;
    line-height: 34px !important;
    text-align: left !important;
    text-indent: 0 !important;
    border: 1px solid rgba(77,151,213,.58) !important;
    border-radius: 4px !important;
    background-color: rgba(4,15,28,.86) !important;
    box-shadow: inset 0 1px 4px rgba(0,0,0,.34) !important;
}

body.page-inner input#loginjscallzer::placeholder,
body.page-inner input#senhajs::placeholder {
    color: #b8cce0 !important;
    opacity: 1 !important;
    text-align: left !important;
}

body.page input#loginjscallzer:-webkit-autofill,
body.page input#senhajs:-webkit-autofill,
body.page-inner input#loginjscallzer:-webkit-autofill,
body.page-inner input#senhajs:-webkit-autofill {
    -webkit-text-fill-color: #eaf5ff !important;
    box-shadow: 0 0 0 1000px rgba(4,15,28,.96) inset !important;
    border: 1px solid rgba(77,151,213,.58) !important;
    caret-color: #eaf5ff !important;
}

body.page-inner input#loginjscallzer:focus,
body.page-inner input#senhajs:focus {
    border-color: rgba(86,169,232,.95) !important;
    box-shadow: 0 0 0 2px rgba(86,169,232,.12), inset 0 1px 4px rgba(0,0,0,.34) !important;
    outline: none !important;
}

body.page-inner .forgot-password .link,
body.page-inner .forgot-password {
    color: #8bbff0 !important;
}

body.page-inner .panel-sidebar-events,
body.page-inner .sidebar.right .box {
    max-height: none !important;
    overflow: visible !important;
}

body.page-inner .panel-sidebar-events .events-table,
body.page-inner .panel-sidebar-events .events-table tbody {
    display: block !important;
    width: 100% !important;
}

body.page-inner .panel-sidebar-events .events-table tr {
    min-height: 44px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) 96px !important;
    align-items: center !important;
    border-bottom: 1px solid rgba(83,132,176,.14) !important;
}

body.page-inner .panel-sidebar-events .events-table tr:last-child {
    border-bottom: 0 !important;
}

body.page-inner .panel-sidebar-events .events-table td {
    width: auto !important;
    height: auto !important;
    min-height: 44px !important;
    padding: 6px 8px !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    color: #bfd4e9 !important;
    border-bottom: 0 !important;
    white-space: normal !important;
    overflow: visible !important;
}

body.page-inner .panel-sidebar-events .events-table td:last-child {
    align-items: flex-end !important;
    text-align: right !important;
    color: #eef6ff !important;
    font-weight: 700 !important;
}

body.page-inner .panel-sidebar-events .smalltext {
    color: #7f98b3 !important;
    font-size: 11px !important;
    line-height: 1.15 !important;
    white-space: nowrap !important;
}

body.page-inner .sidebar.right .box > ul > li,
body.page-inner .panel-sidebar-info ul li {
    min-height: 30px !important;
    padding: 0 10px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    color: #b9cce1 !important;
    border-bottom: 1px solid rgba(83,132,176,.14) !important;
}

body.page-inner .sidebar.right .box > ul > li:last-child,
body.page-inner .panel-sidebar-info ul li:last-child {
    border-bottom: 0 !important;
}

body.page-inner .sidebar.right .box > ul > li span.time,
body.page-inner .sidebar.right .box > ul > li span.bg-success,
body.page-inner .sidebar.right .box > ul > li span.label-default,
body.page-inner .panel-sidebar-info ul li span.text {
    justify-self: end !important;
    padding: 0 !important;
    color: #eef6ff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-align: right !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
}

body.page-inner .sidebar.right .box > ul > li span.bg-success {
    color: var(--success) !important;
}

body.page-inner .sidebar.right .box > ul > li span.label-default {
    color: var(--danger) !important;
}

@media (max-width: 1180px) {
    body.page-inner .wrap .main {
        grid-template-columns: minmax(0, 1fr) 300px !important;
    }
}

@media (max-width: 900px) {
    body.page-inner .wrap {
        width: calc(100% - 28px) !important;
        margin-top: 180px !important;
    }

    body.page-inner .wrap .main {
        grid-template-columns: 1fr !important;
        padding: 16px !important;
    }
}

/* ==========================================================
   Premium polish: events scroll, dropdown, logged panel,
   compact CTA and featured-news controls.
   ========================================================== */
body.page .wrap .main > .content::before,
body.page .wrap .main > .content::after,
body.page .wrap .main .content .container .c::before,
body.page .wrap .main .content .container .c::after {
    display: none !important;
    content: none !important;
}

body.page #menujscallzer,
body.page-inner #menujscallzer {
    border-left: 0 !important;
    border-right: 0 !important;
}

body.page #menujscallzer .boxmenusz,
body.page-inner #menujscallzer .boxmenusz {
    border-left: 0 !important;
    border-right: 0 !important;
}

body.page #menujscallzer ul li.menu-social,
body.page-inner #menujscallzer ul li.menu-social {
    border-left: 0 !important;
    margin-left: 8px !important;
    padding-left: 8px !important;
}

body.page #menujscallzer ul li.menu-play,
body.page-inner #menujscallzer ul li.menu-play {
    margin-left: 12px !important;
}

body.page #menujscallzer ul li.menu-play a,
body.page-inner #menujscallzer ul li.menu-play a {
    width: 138px !important;
    min-width: 138px !important;
    height: 44px !important;
    min-height: 44px !important;
    padding: 0 16px !important;
    font-size: 14px !important;
    line-height: 1.05 !important;
}

#menujscallzer .dropdown {
    position: relative !important;
}

body.page #menujscallzer .dropdown-content,
body.page-inner #menujscallzer .dropdown-content {
    position: absolute !important;
    top: 82px !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    min-width: 190px !important;
    padding: 8px !important;
    display: none !important;
    background: linear-gradient(180deg, rgba(7,20,36,.98), rgba(3,12,23,.98)) !important;
    border: 1px solid rgba(184,132,54,.58) !important;
    border-radius: 0 0 5px 5px !important;
    box-shadow: 0 14px 26px rgba(0,0,0,.42) !important;
    z-index: 2000 !important;
}

body.page #menujscallzer .dropdown:hover .dropdown-content,
body.page-inner #menujscallzer .dropdown:hover .dropdown-content {
    display: block !important;
}

body.page #menujscallzer .dropdown-content ul,
body.page-inner #menujscallzer .dropdown-content ul {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    display: grid !important;
    gap: 6px !important;
}

body.page #menujscallzer .dropdown-content li,
body.page-inner #menujscallzer .dropdown-content li {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    display: block !important;
}

body.page #menujscallzer .dropdown-content li a,
body.page-inner #menujscallzer .dropdown-content li a {
    width: 100% !important;
    min-width: 0 !important;
    height: 42px !important;
    min-height: 42px !important;
    padding: 0 12px !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 10px !important;
    color: #dcecff !important;
    font-size: 12px !important;
    text-align: left !important;
    background: rgba(9,27,47,.78) !important;
    border: 1px solid rgba(77,151,213,.22) !important;
    border-radius: 4px !important;
}

body.page #menujscallzer .dropdown-content li a::before,
body.page-inner #menujscallzer .dropdown-content li a::before {
    content: "\f19c" !important;
    width: 18px !important;
    height: 18px !important;
    color: var(--premium-gold) !important;
    font-family: "Font Awesome 6 Free" !important;
    font-size: 14px !important;
    font-weight: 900 !important;
    flex: 0 0 18px !important;
}

body.page .wrap .main .sidebar.right .container .title.title-user,
body.page .wrap .main .sidebar.right .container .title.title-team,
body.page .wrap .main .sidebar.right .container .title.title-events,
body.page .wrap .main .sidebar.right .container .title.title-info,
body.page-inner .wrap .main .sidebar.right .container .title {
    background:
        linear-gradient(180deg, rgba(5,15,28,.08), rgba(5,15,28,.28)),
        url(../img/ui/footer-bar.png) center / 145% 145% no-repeat !important;
}

body.page .panel-sidebar-events,
body.page-inner .panel-sidebar-events {
    height: 236px !important;
    max-height: 236px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    scrollbar-width: thin;
    scrollbar-color: rgba(184,132,54,.74) rgba(5,15,28,.82);
}

body.page .panel-sidebar-events::-webkit-scrollbar,
body.page-inner .panel-sidebar-events::-webkit-scrollbar {
    width: 7px;
}

body.page .panel-sidebar-events::-webkit-scrollbar-thumb,
body.page-inner .panel-sidebar-events::-webkit-scrollbar-thumb {
    background: rgba(184,132,54,.74);
    border-radius: 8px;
}

body.page .panel-sidebar-events::-webkit-scrollbar-track,
body.page-inner .panel-sidebar-events::-webkit-scrollbar-track {
    background: rgba(5,15,28,.82);
}

body.page .panel-sidebar-events .events-table tr,
body.page-inner .panel-sidebar-events .events-table tr {
    min-height: 48px !important;
}

body.page .panel-sidebar-events .events-table td,
body.page-inner .panel-sidebar-events .events-table td {
    min-height: 48px !important;
}

body.page .premium-featured-news {
    position: relative !important;
}

body.page .premium-featured-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    transition: opacity .35s ease;
}

body.page .premium-featured-slide.is-active {
    opacity: 1;
    pointer-events: auto;
}

body.page .premium-featured-nav {
    position: absolute;
    top: 50%;
    z-index: 4;
    width: 34px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #fff2c8;
    background: linear-gradient(180deg, rgba(24,86,137,.88), rgba(7,31,57,.96));
    border: 1px solid rgba(240,197,104,.62);
    border-radius: 4px;
    box-shadow: 0 8px 16px rgba(0,0,0,.28);
    transform: translateY(-50%);
}

body.page .premium-featured-prev {
    left: 10px;
}

body.page .premium-featured-next {
    right: 10px;
}

body.page .premium-featured-copy {
    padding-left: 50px !important;
    padding-right: 50px !important;
}

body.page .box-userpanel,
body.page-inner .box-userpanel {
    padding: 14px !important;
}

body.page #BemVindoJscallzer,
body.page-inner #BemVindoJscallzer {
    margin: 0 0 12px !important;
    padding: 0 0 12px !important;
    color: #dcecff !important;
    font-size: 12px !important;
    font-weight: 800 !important;
    line-height: 1.3 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    border-bottom: 1px solid rgba(83,132,176,.16) !important;
}

body.page #BemVindoJscallzer i,
body.page-inner #BemVindoJscallzer i {
    color: var(--premium-gold) !important;
    font-style: normal !important;
}

body.page .box-userpanel ul,
body.page-inner .box-userpanel ul {
    margin: 0 !important;
    padding: 0 !important;
}

body.page .box-userpanel ul li,
body.page-inner .box-userpanel ul li {
    min-height: 35px !important;
    padding: 0 8px !important;
    display: grid !important;
    grid-template-columns: 24px minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 10px !important;
    border-bottom: 1px solid rgba(83,132,176,.14) !important;
}

body.page .box-userpanel ul li:last-child,
body.page-inner .box-userpanel ul li:last-child {
    border-bottom: 0 !important;
}

body.page .box-userpanel ul li img,
body.page-inner .box-userpanel ul li img {
    width: 18px !important;
    height: 18px !important;
    object-fit: contain !important;
}

body.page .box-userpanel ul li a,
body.page-inner .box-userpanel ul li a {
    color: #dcecff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
    text-align: left !important;
    text-decoration: none !important;
}

body.page .box-userpanel ul li a:hover,
body.page-inner .box-userpanel ul li a:hover {
    color: var(--premium-gold) !important;
}

body.page-inner .btn,
body.page-inner input.btn,
body.page-inner button.btn,
body.page-inner a.btn,
body.page-inner input[type="submit"]:not(#logaaijs),
body.page-inner button[type="submit"] {
    min-height: 38px !important;
    padding: 0 18px !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #f5fbff !important;
    font-family: var(--font-body) !important;
    font-size: 13px !important;
    font-weight: 800 !important;
    text-align: center !important;
    text-transform: uppercase !important;
    border: 1px solid rgba(77,151,213,.62) !important;
    border-radius: 4px !important;
    background: linear-gradient(180deg, rgba(24,86,137,.88), rgba(7,31,57,.96)) !important;
}

@media (max-width: 900px) {
    body.page #menujscallzer .dropdown-content,
    body.page-inner #menujscallzer .dropdown-content {
        top: 58px !important;
    }

    body.page #menujscallzer ul li.menu-play a,
    body.page-inner #menujscallzer ul li.menu-play a {
        width: 132px !important;
        min-width: 132px !important;
        height: 42px !important;
        min-height: 42px !important;
    }
}

@media (max-width: 640px) {
    body.page .premium-featured-copy {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    body.page .premium-featured-nav {
        top: auto;
        bottom: 10px;
        transform: none;
    }
}

body.page .wrap .main .sidebar.right .container .box-loginform input#loginjscallzer,
body.page .wrap .main .sidebar.right .container .box-loginform input#senhajs,
body.page-inner .wrap .main .sidebar.right .container .box-loginform input#loginjscallzer,
body.page-inner .wrap .main .sidebar.right .container .box-loginform input#senhajs {
    background: rgba(4,15,28,.92) !important;
    background-color: rgba(4,15,28,.92) !important;
    background-image: none !important;
    color: #eaf5ff !important;
    -webkit-text-fill-color: #eaf5ff !important;
    text-align: left !important;
    text-indent: 0 !important;
    box-shadow: inset 0 1px 4px rgba(0,0,0,.34) !important;
    appearance: none !important;
}

body.page .wrap .main .sidebar.right .container .box-loginform input#loginjscallzer:-webkit-autofill,
body.page .wrap .main .sidebar.right .container .box-loginform input#senhajs:-webkit-autofill,
body.page-inner .wrap .main .sidebar.right .container .box-loginform input#loginjscallzer:-webkit-autofill,
body.page-inner .wrap .main .sidebar.right .container .box-loginform input#senhajs:-webkit-autofill {
    background: rgba(4,15,28,.96) !important;
    background-color: rgba(4,15,28,.96) !important;
    background-image: none !important;
    -webkit-text-fill-color: #eaf5ff !important;
    -webkit-box-shadow: 0 0 0 1000px rgba(4,15,28,.96) inset !important;
    box-shadow: 0 0 0 1000px rgba(4,15,28,.96) inset !important;
    transition: background-color 9999s ease-in-out 0s !important;
}

/* =========================================================================
   IMAGE / ASSET PRESENTATION FIXES (appended last -> highest priority)
   Escopo: apenas apresentacao grafica. Nao altera backend/markup logico.
   1) Logo oficial restaurada    2) Hero com camada de imagem + contraste
   3) Banner do evento valorizado 4) Rodape sem retangulo de largura fixa
   ========================================================================= */

/* Regra global de nitidez (evita upscale borrado / saltos de layout) */
img { max-width: 100%; image-rendering: auto; }

/* -------------------------------------------------------------------------
   2) HERO  ->  imagem em camada propria (permite contraste real) + overlay.
   A arte top-fon-home-dark.jpg desbota para branco na base; brightness/
   contrast + um overlay inferior mais forte corrigem o aspecto esbranquicado.
   ------------------------------------------------------------------------- */
body.page .home-hero {
    background: #071322 !important;
}

body.page .home-hero .hero-media {
    position: absolute !important;
    inset: 0 !important;
    overflow: hidden !important;
    z-index: 0 !important;
}

body.page .home-hero .hero-media img {
    width: 100% !important;
    height: 100% !important;
    display: block !important;
    object-fit: cover !important;
    object-position: center top !important;
    image-rendering: auto !important;
    filter: brightness(.9) contrast(1.1) saturate(1.08) !important;
}

body.page .home-hero-overlay {
    z-index: 1 !important;
    background:
        linear-gradient(90deg,
            rgba(4,13,25,.42) 0%,
            rgba(4,13,25,.10) 30%,
            rgba(4,13,25,.05) 64%,
            rgba(4,13,25,.40) 100%),
        linear-gradient(180deg,
            rgba(4,13,25,.06) 0%,
            rgba(4,13,25,.05) 52%,
            rgba(6,14,26,.58) 80%,
            #081423 100%) !important;
}

/* -------------------------------------------------------------------------
   3) BANNER DO EVENTO  (img/castle_owner_bg.jpg 1200x500 -> proporcao ok)
   Overlay reescrito: escuro do lado do texto (esquerda) e revelando o
   cenario do castelo a direita -> profundidade, sem ficar chapado/escuro.
   ------------------------------------------------------------------------- */
body.page .premium-featured-news {
    background:
        linear-gradient(90deg,
            rgba(4,12,22,.93) 0%,
            rgba(4,12,22,.66) 46%,
            rgba(4,12,22,.18) 100%),
        linear-gradient(180deg,
            rgba(4,12,22,.04),
            rgba(4,12,22,.40)),
        url(../img/castle_owner_bg.jpg) center / cover no-repeat !important;
    background-color: #081625 !important;
}

/* -------------------------------------------------------------------------
   4) RODAPE  ->  remove a dependencia de bottom-bg-fon.jpg (largura fixa,
   right bottom / auto 100%) que formava um retangulo claro a direita.
   Fundo continuo em CSS, sem emendas.
   ------------------------------------------------------------------------- */
body.page #footer-faixa {
    background:
        radial-gradient(circle at 82% 35%, rgba(33,71,105,.16), transparent 36%),
        linear-gradient(180deg, rgba(5,15,28,.96), rgba(2,8,16,.99)) !important;
    border-color: rgba(184,132,54,.30) !important;
}

/* =========================================================================
   AJUSTES SOLICITADOS (rev. 2)
   A) menu cortado no tamanho do conteudo + botao JOGAR AGORA ajustado
   B) "Online Agora" como badge sobre o hero, com barra indicadora
   C) trofeus (ouro/prata/bronze) no Top 1/2/3 dos rankings
   D) titulos da sidebar no tom do tema (sem o metal prateado)
   E) fundo continua nas laterais e esmaece ate o rodape
   F) telinha de noticias em destaque equilibrada + setas refinadas
   ========================================================================= */

/* ---- (A) MENU: remove a faixa cheia; barra com largura do conteudo ------ */
body.page #menujscallzer,
body.page-inner #menujscallzer {
    background: none !important;
    border-bottom: 0 !important;
    box-shadow: none !important;
}

body.page #menujscallzer .boxmenusz,
body.page-inner #menujscallzer .boxmenusz {
    width: max-content !important;
    max-width: calc(100% - 24px) !important;
    margin: 0 auto !important;
    padding: 0 18px !important;
    background: linear-gradient(180deg, rgba(2,11,21,.97), rgba(5,18,33,.95)) !important;
    border: 1px solid rgba(184,132,54,.32) !important;
    border-top: 0 !important;
    border-radius: 0 0 10px 10px !important;
    box-shadow: 0 16px 30px rgba(0,0,0,.42), inset 0 -1px 0 rgba(184,132,54,.16) !important;
    filter: none !important;
}

body.page div#menujscallzer ul,
body.page-inner div#menujscallzer ul {
    width: auto !important;
    gap: 2px !important;
}

/* botao JOGAR AGORA: largura no tamanho do texto (sem sobra a direita) */
body.page #menujscallzer ul li.menu-play a,
body.page-inner #menujscallzer ul li.menu-play a {
    width: auto !important;
    min-width: 0 !important;
    padding: 0 22px !important;
    white-space: nowrap !important;
    text-align: center !important;
}

/* ---- (B) ONLINE AGORA: badge flutuante sobre o hero + barra de players -- */
body.page .hero-online {
    position: absolute !important;
    z-index: 6 !important;
    left: max(26px, calc((100% - 1180px) / 2)) !important;
    top: 47% !important;
    transform: translateY(-50%) !important;
    width: 244px !important;
    max-width: calc(100% - 52px) !important;
    padding: 13px 17px 15px !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 8px !important;
    background: linear-gradient(180deg, rgba(7,20,36,.82), rgba(4,12,23,.9)) !important;
    border: 1px solid rgba(86,160,224,.5) !important;
    border-radius: 9px !important;
    box-shadow: 0 16px 32px rgba(0,0,0,.45), inset 0 0 22px rgba(63,157,232,.12) !important;
    /* backdrop-filter removido (perf de scroll) */
}

.hero-online-top {
    display: flex !important;
    align-items: center !important;
    gap: 8px !important;
    color: #f0c568 !important;
    font-family: var(--title-font, 'Orbitron'), sans-serif !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    letter-spacing: .6px !important;
    text-transform: uppercase !important;
}
.hero-online-top i { font-size: 14px !important; }

.hero-online-count {
    color: #eef6ff !important;
    font-family: var(--title-font, 'Orbitron'), sans-serif !important;
    font-size: 23px !important;
    font-weight: 800 !important;
    line-height: 1 !important;
}
.hero-online-count small { font-size: 12px !important; font-weight: 500 !important; color: #9fb6cf !important; }

.hero-online-bar {
    position: relative !important;
    display: block !important;
    height: 14px !important;
    border-radius: 7px !important;
    overflow: hidden !important;
    border: 1px solid rgba(86,160,224,.4) !important;
    box-shadow: inset 0 1px 3px rgba(0,0,0,.6) !important;
    background:
        repeating-linear-gradient(118deg, rgba(255,255,255,.22) 0 2px, transparent 2px 10px),
        linear-gradient(90deg, #36b14a 0%, #8fc63d 24%, #ecd531 46%, #f4a52a 68%, #ec5a2a 86%, #d72f2f 100%) !important;
}

/* a faixa colorida representa a capacidade; o trecho nao preenchido fica escuro */
.hero-online-fill {
    position: absolute !important;
    top: 0 !important;
    bottom: 0 !important;
    left: var(--fill, 4%) !important;
    right: 0 !important;
    /* parte VAZIA (de --fill ate o fim) agora e escura/opaca, entao a barra
       reflete de verdade quantos players estao online (antes era translucida
       e parecia sempre cheia). */
    background: linear-gradient(90deg, rgba(8,16,26,.97), rgba(5,11,19,.99)) !important;
    border-left: 1px solid rgba(255,255,255,.65) !important;
    box-shadow: -2px 0 6px rgba(0,0,0,.5) !important;
    transition: left .45s ease !important;
}

/* ---- (C) TROFEUS no Top 1/2/3 (ouro/prata/bronze 31x50) ----------------- */
body.page .rank-col .rank-list li { min-height: 24px !important; }
body.page .rank-col .rank-list li:nth-child(-n+3)::before {
    content: "" !important;
    width: 17px !important;
    height: 24px !important;
    flex: 0 0 17px !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,.6)) !important;
}
body.page .rank-col .rank-list li:nth-child(1)::before { background-image: url(../img/trofeu_ouro.png) !important; }
body.page .rank-col .rank-list li:nth-child(2)::before { background-image: url(../img/trofeu_prata.png) !important; }
body.page .rank-col .rank-list li:nth-child(3)::before { background-image: url(../img/trofeu_bronze.png) !important; }

/* ---- (D) TITULOS DA SIDEBAR no tom do tema ------------------------------ */
body.page .wrap .main .sidebar.right .container .title.title-user,
body.page .wrap .main .sidebar.right .container .title.title-info,
body.page .wrap .main .sidebar.right .container .title.title-team,
body.page .wrap .main .sidebar.right .container .title.title-events,
body.page .wrap .main .sidebar.right .container .title.title-servers,
body.page-inner .wrap .main .sidebar.right .container .title {
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #f3c965 !important;
    font-family: var(--title-font, 'Orbitron'), sans-serif !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.75) !important;
    background: linear-gradient(180deg, rgba(24,56,92,.96), rgba(8,22,40,.97)) !important;
    border: 1px solid rgba(86,160,224,.42) !important;
    border-bottom: 2px solid rgba(184,132,54,.6) !important;
    border-radius: 7px 7px 0 0 !important;
    box-shadow: inset 0 0 16px rgba(58,147,255,.12), 0 3px 8px rgba(0,0,0,.32) !important;
    filter: none !important;
}

/* ---- (E) FUNDO continua nas laterais e esmaece ate o rodape ------------- */
body.page { position: relative !important; }
body.page::before {
    content: "" !important;
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 1320px !important;
    z-index: 0 !important;
    pointer-events: none !important;
    background:
        linear-gradient(180deg,
            rgba(8,20,35,0) 0%,
            rgba(8,20,35,0) 18%,
            rgba(7,15,26,.55) 22%,
            #081423 26.5%,
            #081423 100%),
        url(../img/ui/top-fon-home-dark.jpg) top center / 100% auto no-repeat !important;
    /* filter removido: aplicar brightness/contrast/saturate numa camada de
       1320px full-width causava travamento no scroll (re-render por frame).
       O escurecimento ja vem do gradiente acima. */
}

/* hero transparente para o fundo continuo aparecer; overlay mais suave */
body.page .home-hero { background: transparent !important; }
body.page .home-hero-overlay {
    background:
        linear-gradient(90deg, rgba(4,13,25,.40) 0%, rgba(4,13,25,.08) 28%, rgba(4,13,25,.05) 66%, rgba(4,13,25,.38) 100%),
        linear-gradient(180deg, rgba(4,13,25,.05) 0%, rgba(4,13,25,0) 45%, rgba(4,13,25,.16) 100%) !important;
}

/* ---- (F) Stat strip agora com 4 cards + telinha de noticias ------------- */
body.page .premium-stat-strip { grid-template-columns: repeat(4, minmax(0,1fr)) !important; }
/* card "Online Agora" so aparece no mobile (no desktop ele e o badge do hero) */
body.page .premium-stat-card.stat-online-mobile { display: none !important; }

body.page .home-news-list {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    gap: 4px !important;
    min-width: 0 !important;
}

body.page .premium-featured-news { grid-row: auto !important; }

body.page .premium-featured-nav {
    width: 30px !important;
    height: 30px !important;
    border-radius: 50% !important;
    background: rgba(6,17,31,.7) !important;
    border: 1px solid rgba(86,160,224,.55) !important;
    box-shadow: 0 4px 12px rgba(0,0,0,.4) !important;
    opacity: .85 !important;
    transition: opacity .18s ease, background .18s ease !important;
}
body.page .premium-featured-nav:hover { opacity: 1 !important; background: rgba(16,46,78,.92) !important; }
body.page .premium-featured-prev { left: 12px !important; }
body.page .premium-featured-next { right: 12px !important; }
body.page .premium-featured-copy { padding: 0 46px 18px !important; justify-content: center !important; }

@media (max-width: 1180px) {
    body.page .premium-stat-strip { grid-template-columns: repeat(2, minmax(0,1fr)) !important; }
    body.page .premium-stat-card:nth-child(2n) { border-right: 0 !important; }
    body.page .hero-online { left: 18px !important; width: 220px !important; }
}

@media (max-width: 900px) {
    /* hero fica estreito e o menu (multilinha) cobre o topo: oculta o badge
       flutuante; o contador online volta para a faixa de stats no mobile. */
    body.page .hero-online { display: none !important; }
    body.page .premium-stat-strip .stat-online-mobile { display: grid !important; }
}

@media (max-width: 640px) {
    body.page .premium-stat-strip { grid-template-columns: 1fr !important; }
}

/* =========================================================================
   AJUSTES SOLICITADOS (rev. 3)
   - "fundo cortado": remove a camada separada do hero -> fundo unico continuo
   - desce um pouco o badge "Online Agora"
   - pilares decorativos ui/7.png e ui/13.png nas laterais
   - dropdown Doacoes: icones distintos + sem quebra de linha
   ========================================================================= */

/* fundo continuo: o hero usa o mesmo body::before; sem camada de imagem extra
   (a antiga .hero-media gerava a emenda/"corte" no rodape do hero) */
body.page .home-hero .hero-media { display: none !important; }

/* overlay do hero: apenas um leve escurecimento no topo (atras do menu) que
   some bem antes da base -> nada de vinheta lateral nem corte nas gutters */
body.page .home-hero-overlay {
    background: linear-gradient(180deg, rgba(4,13,25,.24) 0%, rgba(4,13,25,0) 32%, rgba(4,13,25,0) 100%) !important;
}

/* badge "Online Agora" um pouco mais baixo */
body.page .hero-online { top: 57% !important; }

/* ---- DROPDOWN Doacoes: icones distintos + sem quebra ------------------- */
body.page #menujscallzer .dropdown-content li a,
body.page-inner #menujscallzer .dropdown-content li a {
    white-space: nowrap !important;
}
body.page #menujscallzer .dropdown-content li:nth-child(1) a::before,
body.page-inner #menujscallzer .dropdown-content li:nth-child(1) a::before {
    content: "\f51e" !important; /* fa-coins */
}
body.page #menujscallzer .dropdown-content li:nth-child(2) a::before,
body.page-inner #menujscallzer .dropdown-content li:nth-child(2) a::before {
    content: "\f521" !important; /* fa-crown */
}

/* ==========================================================
   Info page stabilization
   ========================================================== */

body.route-info .wrap .main .content .container .c {
    overflow: hidden !important;
}

body.route-info .wrap .main .content .container .c h2 {
    margin: 34px 0 12px !important;
    color: #e6edf8 !important;
    font-family: var(--font-body) !important;
    font-size: 27px !important;
    font-weight: 500 !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.5) !important;
}

body.route-info .wrap .main .content .container .c h2:first-child {
    margin-top: 0 !important;
}

body.route-info .wrap .main .content .container .table {
    width: 100% !important;
    margin: 0 0 24px !important;
    table-layout: fixed !important;
    border-collapse: collapse !important;
}

body.route-info .wrap .main .content .container .table th,
body.route-info .wrap .main .content .container .table td {
    padding: 9px 12px !important;
    color: #f0f6ff !important;
    font-size: 14px !important;
    line-height: 1.28 !important;
    vertical-align: middle !important;
    word-break: normal !important;
    overflow-wrap: anywhere !important;
}

body.route-info .wrap .main .content .container .table th {
    color: #fff !important;
    font-weight: 800 !important;
    background: rgba(13,37,62,.74) !important;
}

body.route-info .wrap .main .content .container .table td.text-center,
body.route-info .wrap .main .content .container .table th.text-center {
    text-align: center !important;
}


/* ==========================================================
   Sidebar/event alignment pass
   ========================================================== */
body.page .wrap .main .sidebar.right,
body.route-info .wrap .main .sidebar.right {
    height: max-content !important;
}

body.page .wrap .main .sidebar.right .container,
body.route-info .wrap .main .sidebar.right .container {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
}

body.page .wrap .main .sidebar.right .container > .partial-login,
body.route-info .wrap .main .sidebar.right .container > .partial-login,
body.page .wrap .main .sidebar.right .container > .title,
body.route-info .wrap .main .sidebar.right .container > .title,
body.page .wrap .main .sidebar.right .container > .box,
body.route-info .wrap .main .sidebar.right .container > .box {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

body.page .wrap .main .sidebar.right .container > .partial-login > .title,
body.route-info .wrap .main .sidebar.right .container > .partial-login > .title,
body.page .wrap .main .sidebar.right .container > .partial-login > .box,
body.route-info .wrap .main .sidebar.right .container > .partial-login > .box {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

body.page .wrap .main .sidebar.right .container > .box-bottom,
body.route-info .wrap .main .sidebar.right .container > .box-bottom,
body.page .wrap .main .sidebar.right .container > .space,
body.route-info .wrap .main .sidebar.right .container > .space {
    display: none !important;
}

body.page .wrap .main .sidebar.right .container > .title + .box,
body.route-info .wrap .main .sidebar.right .container > .title + .box {
    margin-top: -12px !important;
}

body.page .wrap .main .sidebar.right .container .box-loginform,
body.route-info .wrap .main .sidebar.right .container .box-loginform {
    padding: 22px 28px 18px !important;
}

body.page .wrap .main .sidebar.right .container .title.title-events,
body.route-info .wrap .main .sidebar.right .container .title.title-events {
    margin-top: 0 !important;
}

body.page .panel-sidebar-events,
body.route-info .panel-sidebar-events {
    height: 318px !important;
    max-height: 318px !important;
    padding: 12px 14px !important;
}

body.page .wrap .main .sidebar.right .container .box.panel-sidebar-events,
body.route-info .wrap .main .sidebar.right .container .box.panel-sidebar-events {
    height: 318px !important;
    min-height: 318px !important;
    max-height: 318px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

body.page .panel-sidebar-events .events-table,
body.route-info .panel-sidebar-events .events-table,
body.page .panel-sidebar-events .events-table tbody,
body.route-info .panel-sidebar-events .events-table tbody {
    width: 100% !important;
}

body.page .panel-sidebar-events .events-table tr,
body.route-info .panel-sidebar-events .events-table tr {
    width: 100% !important;
    min-height: 48px !important;
    grid-template-columns: minmax(0, 1fr) 102px !important;
}

body.page .panel-sidebar-events .events-table td,
body.route-info .panel-sidebar-events .events-table td {
    min-width: 0 !important;
    padding: 6px 8px !important;
}

body.page .panel-sidebar-events .events-table td:first-child,
body.route-info .panel-sidebar-events .events-table td:first-child {
    align-items: flex-start !important;
    text-align: left !important;
}

body.page .panel-sidebar-events .events-table td:last-child,
body.route-info .panel-sidebar-events .events-table td:last-child {
    align-items: flex-end !important;
    text-align: right !important;
}

body.page .panel-sidebar-events .smalltext,
body.route-info .panel-sidebar-events .smalltext {
    display: block !important;
    max-width: 100% !important;
}

body.route-info .wrap .main .content .container .c {
    padding: 24px !important;
}

body.route-info .wrap .main .content .container .page-title {
    width: 100% !important;
    margin: 0 0 14px !important;
    box-sizing: border-box !important;
}

body.route-info .wrap .main .content .container .table {
    margin-left: 0 !important;
    margin-right: 0 !important;
}

/* ==========================================================
   Inner pages use the same sidebar rhythm/assets as Home
   ========================================================== */
body.page-inner .wrap .main .sidebar.right {
    height: max-content !important;
}

body.page-inner .wrap .main .sidebar.right .container {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
}

body.page-inner .wrap .main .sidebar.right .container > .partial-login,
body.page-inner .wrap .main .sidebar.right .container > .title,
body.page-inner .wrap .main .sidebar.right .container > .box {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
    margin: 0 !important;
}

body.page-inner .wrap .main .sidebar.right .container > .partial-login > .title,
body.page-inner .wrap .main .sidebar.right .container > .partial-login > .box {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
}

body.page-inner .wrap .main .sidebar.right .container > .box-bottom,
body.page-inner .wrap .main .sidebar.right .container > .space {
    display: none !important;
}

body.page-inner .wrap .main .sidebar.right .container > .title + .box {
    margin-top: -12px !important;
}

body.page-inner .wrap .main .sidebar.right .container > .title.title-user,
body.page-inner .wrap .main .sidebar.right .container > .title.title-info,
body.page-inner .wrap .main .sidebar.right .container > .title.title-team,
body.page-inner .wrap .main .sidebar.right .container > .title.title-events {
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #f3c965 !important;
    font-family: var(--title-font, 'Orbitron'), sans-serif !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.75) !important;
    background:
        linear-gradient(180deg, rgba(5,15,28,.08), rgba(5,15,28,.28)),
        url(../img/ui/footer-bar.png) center / 145% 145% no-repeat !important;
    border: 1px solid rgba(86,160,224,.42) !important;
    border-bottom: 2px solid rgba(184,132,54,.6) !important;
    border-radius: 7px 7px 0 0 !important;
    box-shadow: inset 0 0 16px rgba(58,147,255,.12), 0 3px 8px rgba(0,0,0,.32) !important;
    filter: none !important;
}

body.page-inner .wrap .main .sidebar.right .container > .title.title-info + .panel-sidebar-info {
    display: block !important;
}

body.page-inner .wrap .main .sidebar.right .container .panel-sidebar-info {
    padding: 12px 14px !important;
}

body.page-inner .wrap .main .sidebar.right .container .panel-sidebar-info ul {
    margin: 0 !important;
    padding: 0 !important;
}

body.page-inner .wrap .main .sidebar.right .container .panel-sidebar-info ul li {
    min-height: 30px !important;
    padding: 0 10px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    color: #b9cce1 !important;
    border-bottom: 1px solid rgba(83,132,176,.14) !important;
}

body.page-inner .wrap .main .sidebar.right .container .panel-sidebar-info ul li:last-child {
    border-bottom: 0 !important;
}

body.page-inner .wrap .main .sidebar.right .container .panel-sidebar-info ul li span.text {
    justify-self: end !important;
    color: #eef6ff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-align: right !important;
}

body.page-inner .wrap .main .sidebar.right .container .box.panel-sidebar-events {
    height: 318px !important;
    min-height: 318px !important;
    max-height: 318px !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
}

body.page-inner .wrap .main .sidebar.right .container .panel-sidebar-events + .box-bottom + .title.title-info,
body.page-inner .wrap .main .sidebar.right .container .panel-sidebar-events + .box-bottom + .title.title-info + .box,
body.page-inner .wrap .main .sidebar.right .container .panel-sidebar-events + .box-bottom + .title.title-info + .box + .box-bottom {
    display: none !important;
}

body.page-inner .wrap .main .sidebar.right .container > .title.title-user,
body.page-inner .wrap .main .sidebar.right .container > .title.title-info,
body.page-inner .wrap .main .sidebar.right .container > .title.title-team,
body.page-inner .wrap .main .sidebar.right .container > .title.title-events {
    background: linear-gradient(180deg, rgba(24,56,92,.96), rgba(8,22,40,.97)) !important;
    border: 1px solid rgba(86,160,224,.42) !important;
    border-bottom: 2px solid rgba(184,132,54,.6) !important;
}

body.page .wrap .main .sidebar.right .container .box.panel-sidebar-events,
body.page-inner .wrap .main .sidebar.right .container .box.panel-sidebar-events {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

/* ==========================================================
   Top menu active state parity
   ========================================================== */
body.page div#menujscallzer ul li:first-child a,
body.page-inner div#menujscallzer ul li:first-child a {
    color: #c7d0dc !important;
    background: transparent !important;
}

body.page div#menujscallzer ul li:first-child a::before,
body.page-inner div#menujscallzer ul li:first-child a::before {
    color: rgba(210,222,236,.58) !important;
}

body.page div#menujscallzer ul li.active > a,
body.page-inner div#menujscallzer ul li.active > a,
body.route-info div#menujscallzer ul li:nth-child(5) > a,
body.route-login div#menujscallzer ul li:nth-child(6) > a {
    color: var(--premium-gold) !important;
    background: linear-gradient(180deg, rgba(240,197,104,.10), transparent) !important;
}

body.page div#menujscallzer ul li.active > a::before,
body.page-inner div#menujscallzer ul li.active > a::before,
body.route-info div#menujscallzer ul li:nth-child(5) > a::before,
body.route-login div#menujscallzer ul li:nth-child(6) > a::before {
    color: var(--premium-gold) !important;
}

/* ==========================================================
   Shared header/sidebar components parity
   ========================================================== */
body.page .wrap .main .sidebar.right .container.site-sidebar,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar {
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    gap: 12px !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar > .partial-login,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar > .partial-login,
body.page .wrap .main .sidebar.right .container.site-sidebar > .title,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar > .title,
body.page .wrap .main .sidebar.right .container.site-sidebar > .box,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar > .box {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar > .box-bottom,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar > .box-bottom {
    display: none !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .title,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .title {
    width: 100% !important;
    height: 30px !important;
    min-height: 30px !important;
    padding: 0 14px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    color: #f3c965 !important;
    font-family: var(--title-font, 'Orbitron'), sans-serif !important;
    font-size: 11px !important;
    line-height: 1 !important;
    font-weight: 700 !important;
    letter-spacing: .7px !important;
    text-transform: uppercase !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.75) !important;
    background: linear-gradient(180deg, rgba(24,56,92,.96), rgba(8,22,40,.97)) !important;
    border: 1px solid rgba(86,160,224,.42) !important;
    border-bottom: 2px solid rgba(184,132,54,.6) !important;
    border-radius: 7px 7px 0 0 !important;
    box-shadow: inset 0 0 16px rgba(58,147,255,.12), 0 3px 8px rgba(0,0,0,.32) !important;
    filter: none !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .partial-login .box,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .partial-login .box,
body.page .wrap .main .sidebar.right .container.site-sidebar > .box,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar > .box {
    background: rgba(7,19,34,.92) !important;
    border: 1px solid rgba(77,151,213,.45) !important;
    border-top: 0 !important;
    border-radius: 0 0 5px 5px !important;
    box-shadow: inset 0 0 22px rgba(58,147,255,.05) !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .box-loginform,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .box-loginform {
    min-height: 196px !important;
    padding: 12px 14px 14px !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .box-loginform form,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .box-loginform form {
    display: grid !important;
    gap: 8px !important;
    margin: 0 !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .box-loginform input.login-input,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .box-loginform input.login-input {
    width: 100% !important;
    height: 36px !important;
    min-height: 36px !important;
    padding: 0 12px 0 38px !important;
    color: var(--text-main) !important;
    font-size: var(--fs-13) !important;
    line-height: 36px !important;
    border: 1px solid rgba(86,169,232,.58) !important;
    border-radius: 4px !important;
    background-color: rgba(5,15,28,.78) !important;
    background-position: 12px center !important;
    box-shadow: inset 0 1px 4px rgba(0,0,0,.34) !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .box-loginform input.login-submit,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .box-loginform input.login-submit,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar input#logaaijs {
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    margin-top: 2px !important;
    padding: 0 !important;
    display: block !important;
    color: #f7fbff !important;
    font-family: var(--font-display) !important;
    font-size: var(--fs-13) !important;
    font-weight: 700 !important;
    line-height: 38px !important;
    letter-spacing: .4px !important;
    text-align: center !important;
    text-indent: 0 !important;
    text-transform: uppercase !important;
    border: 0 !important;
    border-radius: 4px !important;
    background: url(../img/ui/btn-signin.png) center / 100% 100% no-repeat, linear-gradient(180deg, rgba(24,86,137,.96), rgba(7,31,57,.98)) !important;
    text-shadow: 0 1px 2px #000 !important;
    box-shadow: none !important;
    appearance: none !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar input#logaaijs,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar input#logaaijs {
    color: transparent !important;
    text-shadow: none !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .forgot-password,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .forgot-password {
    margin-top: 8px !important;
    padding-top: 0 !important;
    color: var(--text-soft) !important;
    font-size: var(--fs-11) !important;
    line-height: 1.35 !important;
    text-align: center !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar > .title + .box,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar > .title + .box {
    margin-top: -12px !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info {
    padding: 12px 14px !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul {
    margin: 0 !important;
    padding: 0 !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul li,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul li {
    min-height: 30px !important;
    padding: 0 10px !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 12px !important;
    color: #b9cce1 !important;
    border-bottom: 1px solid rgba(83,132,176,.14) !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul li:last-child,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul li:last-child {
    border-bottom: 0 !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul li span.text,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul li span.text {
    justify-self: end !important;
    color: #eef6ff !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-align: right !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul li span.online-text,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-info ul li span.online-text {
    color: #14f067 !important;
}

body.page .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-events,
body.page-inner .wrap .main .sidebar.right .container.site-sidebar .panel-sidebar-events {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow: visible !important;
}

/* =========================================================================
   LAYOUT PARITY  -  sidebar direita IGUAL a home em TODAS as abas internas
   -------------------------------------------------------------------------
   Antes: paginas internas usavam o layout legado por FLOAT do millennial.css
   (.content 810px float-left, .sidebar.right 284px float-right) dentro de um
   .main "flow-root", entao a sidebar mudava de largura/posicao conforme o
   conteudo de cada aba (Cadastro/Informacoes/Downloads...).
   Agora: as internas usam o MESMO grid da home -> coluna fixa de 300px a
   direita, mesma largura/posicao, sem oscilar ao trocar de aba.
   Escopo: page-inner, EXCETO usercp e login (que escondem a sidebar de
   proposito - ver blocos route-usercp / route-login acima).
   Usa as MESMAS variaveis premium da home (--premium-width / --premium-sidebar
   / --premium-gap), entao largura, track e gap acompanham a home em todos os
   breakpoints (as premium-* sao redefinidas em :root nas media queries).
   O elemento da sidebar e fixado em 300px (igual a home, linha ~658): a track
   tem 340px e sobra ~40px a direita - exatamente como a home renderiza.
   Bloco anexado por ULTIMO de proposito (o ultimo bloco vence).
   ========================================================================= */
body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main {
    position: relative !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) var(--premium-sidebar) !important;
    gap: var(--premium-gap) !important;
    align-items: start !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
}

body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main > .top,
body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main .content-middle {
    display: none !important;
}

body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main > .content,
body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main > .sidebar.right {
    float: none !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main > .content {
    width: 100% !important;
}

body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main > .sidebar.right {
    width: 300px !important;
}

body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main .content .container {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

/* breakpoints espelhando a home: <=900px vira coluna unica */
@media (max-width: 900px) {
    body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main {
        width: calc(100% - 28px) !important;
        grid-template-columns: 1fr !important;
        gap: 16px !important;
    }
    body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main > .content,
    body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main > .sidebar.right {
        width: 100% !important;
        max-width: 100% !important;
    }
}

@media (max-width: 640px) {
    body.page-inner:not([class*="route-usercp"]):not(.route-login) .wrap .main {
        width: calc(100% - 24px) !important;
    }
}

/* =========================================================================
   DROPDOWN do menu "Doacoes" - paleta navy/dourado do site (antes vinha
   branco: o <li> herdava fundo claro). Route-agnostic, vence por ser ultimo.
   ========================================================================= */
#menujscallzer .menu-doacoes .dropdown-content {
    min-width: 184px !important;
    padding: 6px !important;
    background: linear-gradient(180deg, rgba(11,24,42,.99), rgba(6,15,27,.99)) !important;
    border: 1px solid rgba(86,160,224,.45) !important;
    border-top: 2px solid var(--gold, #e9b24b) !important;
    border-radius: 0 0 6px 6px !important;
    box-shadow: 0 14px 30px rgba(0,0,0,.6), inset 0 0 18px rgba(58,147,255,.08) !important;
}

#menujscallzer .menu-doacoes .dropdown-content ul,
#menujscallzer .menu-doacoes .dropdown-content li {
    background: transparent !important;
    border: 0 !important;
    margin: 0 !important;
}

#menujscallzer .menu-doacoes .dropdown-content li a {
    display: block !important;
    padding: 9px 14px !important;
    border-radius: 4px !important;
    color: #e9f1fb !important;
    font-family: var(--title-font, 'Orbitron', sans-serif) !important;
    font-size: 12px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: .3px !important;
    text-shadow: 0 1px 2px rgba(0,0,0,.7) !important;
    background: transparent !important;
    transition: color .15s ease, background .15s ease !important;
}

#menujscallzer .menu-doacoes .dropdown-content li a:hover {
    color: var(--gold-2, #ffd886) !important;
    background: linear-gradient(180deg, rgba(58,147,255,.16), rgba(233,178,75,.10)) !important;
    text-shadow: 0 0 9px rgba(255,216,134,.5), 0 1px 2px #000 !important;
}
