/* style.css */
* {
    box-sizing: border-box;
}

html {
    height: 100%;
    overflow-y: scroll;
}

body {
    margin: 0;
    font-family: "Arial Narrow", "Roboto Condensed", Arial, Helvetica, sans-serif;
    font-size: 14px;
    line-height: 1.35;
}

a {
    text-decoration: none;
}

a:focus,
a:focus-visible,
button:focus,
button:focus-visible {
    outline: none;
}

.page-shell {
    width: 1494px;
    margin: 0 auto;
    padding: 0 20px 8px 20px;
}

.site-banner {
    position: relative;
    height: 160px;
    padding: 0;
    border-bottom-width: 4px;
    border-bottom-style: solid;
    overflow: hidden;
}

.site-banner-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 1454px;
    height: 160px;
    object-fit: fill;
}

.site-banner-brand {
    position: absolute;
    left: 42px;
    top: 24px;
    z-index: 2;
    width: 440px;
    height: 96px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    pointer-events: none;
}

.site-banner-brand-title {
    display: block;
    height: 58px;
    font-family: "Arial Narrow", Impact, Arial, Helvetica, sans-serif;
    font-size: 54px;
    font-weight: 900;
    line-height: 56px;
    letter-spacing: 0;
    text-transform: uppercase;
}

.site-banner-brand-subtitle {
    display: block;
    height: 28px;
    margin-top: 2px;
    font-size: 20px;
    font-weight: 900;
    line-height: 26px;
}

.top-nav {
    display: grid;
    grid-template-columns: 200px 220px 180px 160px 180px 150px 364px;
    height: 46px;
    margin-bottom: 16px;
    border-width: 1px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-style: solid;
}

.top-nav a {
    display: block;
    height: 44px;
    padding: 13px 12px 0 12px;
    border-right-width: 1px;
    border-right-style: solid;
    font-size: 15px;
    font-weight: 900;
    text-align: center;
    text-transform: uppercase;
}

.page-grid {
    display: grid;
    grid-template-columns: 250px 950px 254px;
    column-gap: 16px;
    align-items: stretch;
    width: 1454px;
    overflow: hidden;
}

.left-column,
.right-column {
    padding: 0;
}

.left-column {
    border-right-width: 0;
    border-right-style: none;
}

.right-column {
    border-left-width: 0;
    border-left-style: none;
}

.middle-column {
    width: 950px;
    padding: 0;
    overflow: hidden;
}

.side-box {
    margin-bottom: 16px;
    border-width: 1px;
    border-style: solid;
}

.side-title {
    margin-bottom: 0;
    height: 38px;
    padding: 9px 14px 0 14px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    font-size: 16px;
    font-weight: 900;
    text-transform: uppercase;
}

.side-box a {
    display: block;
    margin: 3px 0;
    font-size: 12px;
    font-weight: 700;
}

.left-player-stats {
    width: 250px;
    margin-bottom: 16px;
    padding: 12px 14px;
}

.left-stat-line {
    width: 220px;
    height: 25px;
    font-size: 14px;
    font-weight: 700;
    line-height: 24px;
}

.left-stat-extra {
    width: 220px;
    height: 24px;
    font-size: 14px;
    font-weight: 700;
    line-height: 22px;
}

.left-bar {
    width: 220px;
    height: 15px;
    margin: 0 0 6px 0;
    overflow: hidden;
}

.left-bar span {
    display: block;
    height: 15px;
    font-size: 10px;
    font-weight: 900;
    line-height: 14px;
    text-align: center;
}

.bar-fill-p0 { width: 0%; }
.bar-fill-p1 { width: 1%; }
.bar-fill-p2 { width: 2%; }
.bar-fill-p3 { width: 3%; }
.bar-fill-p4 { width: 4%; }
.bar-fill-p5 { width: 5%; }
.bar-fill-p6 { width: 6%; }
.bar-fill-p7 { width: 7%; }
.bar-fill-p8 { width: 8%; }
.bar-fill-p9 { width: 9%; }
.bar-fill-p10 { width: 10%; }
.bar-fill-p11 { width: 11%; }
.bar-fill-p12 { width: 12%; }
.bar-fill-p13 { width: 13%; }
.bar-fill-p14 { width: 14%; }
.bar-fill-p15 { width: 15%; }
.bar-fill-p16 { width: 16%; }
.bar-fill-p17 { width: 17%; }
.bar-fill-p18 { width: 18%; }
.bar-fill-p19 { width: 19%; }
.bar-fill-p20 { width: 20%; }
.bar-fill-p21 { width: 21%; }
.bar-fill-p22 { width: 22%; }
.bar-fill-p23 { width: 23%; }
.bar-fill-p24 { width: 24%; }
.bar-fill-p25 { width: 25%; }
.bar-fill-p26 { width: 26%; }
.bar-fill-p27 { width: 27%; }
.bar-fill-p28 { width: 28%; }
.bar-fill-p29 { width: 29%; }
.bar-fill-p30 { width: 30%; }
.bar-fill-p31 { width: 31%; }
.bar-fill-p32 { width: 32%; }
.bar-fill-p33 { width: 33%; }
.bar-fill-p34 { width: 34%; }
.bar-fill-p35 { width: 35%; }
.bar-fill-p36 { width: 36%; }
.bar-fill-p37 { width: 37%; }
.bar-fill-p38 { width: 38%; }
.bar-fill-p39 { width: 39%; }
.bar-fill-p40 { width: 40%; }
.bar-fill-p41 { width: 41%; }
.bar-fill-p42 { width: 42%; }
.bar-fill-p43 { width: 43%; }
.bar-fill-p44 { width: 44%; }
.bar-fill-p45 { width: 45%; }
.bar-fill-p46 { width: 46%; }
.bar-fill-p47 { width: 47%; }
.bar-fill-p48 { width: 48%; }
.bar-fill-p49 { width: 49%; }
.bar-fill-p50 { width: 50%; }
.bar-fill-p51 { width: 51%; }
.bar-fill-p52 { width: 52%; }
.bar-fill-p53 { width: 53%; }
.bar-fill-p54 { width: 54%; }
.bar-fill-p55 { width: 55%; }
.bar-fill-p56 { width: 56%; }
.bar-fill-p57 { width: 57%; }
.bar-fill-p58 { width: 58%; }
.bar-fill-p59 { width: 59%; }
.bar-fill-p60 { width: 60%; }
.bar-fill-p61 { width: 61%; }
.bar-fill-p62 { width: 62%; }
.bar-fill-p63 { width: 63%; }
.bar-fill-p64 { width: 64%; }
.bar-fill-p65 { width: 65%; }
.bar-fill-p66 { width: 66%; }
.bar-fill-p67 { width: 67%; }
.bar-fill-p68 { width: 68%; }
.bar-fill-p69 { width: 69%; }
.bar-fill-p70 { width: 70%; }
.bar-fill-p71 { width: 71%; }
.bar-fill-p72 { width: 72%; }
.bar-fill-p73 { width: 73%; }
.bar-fill-p74 { width: 74%; }
.bar-fill-p75 { width: 75%; }
.bar-fill-p76 { width: 76%; }
.bar-fill-p77 { width: 77%; }
.bar-fill-p78 { width: 78%; }
.bar-fill-p79 { width: 79%; }
.bar-fill-p80 { width: 80%; }
.bar-fill-p81 { width: 81%; }
.bar-fill-p82 { width: 82%; }
.bar-fill-p83 { width: 83%; }
.bar-fill-p84 { width: 84%; }
.bar-fill-p85 { width: 85%; }
.bar-fill-p86 { width: 86%; }
.bar-fill-p87 { width: 87%; }
.bar-fill-p88 { width: 88%; }
.bar-fill-p89 { width: 89%; }
.bar-fill-p90 { width: 90%; }
.bar-fill-p91 { width: 91%; }
.bar-fill-p92 { width: 92%; }
.bar-fill-p93 { width: 93%; }
.bar-fill-p94 { width: 94%; }
.bar-fill-p95 { width: 95%; }
.bar-fill-p96 { width: 96%; }
.bar-fill-p97 { width: 97%; }
.bar-fill-p98 { width: 98%; }
.bar-fill-p99 { width: 99%; }
.bar-fill-p100 { width: 100%; }

.bb-align-left { text-align: left; }
.bb-align-center { text-align: center; }
.bb-align-right { text-align: right; }
.bb-color-black { color: black; }
.bb-color-white { color: white; }
.bb-color-red { color: red; }
.bb-color-green { color: green; }
.bb-color-blue { color: blue; }
.bb-color-yellow { color: yellow; }
.bb-color-orange { color: orange; }
.bb-color-purple { color: purple; }
.bb-color-pink { color: pink; }
.bb-color-gray { color: gray; }
.bb-color-grey { color: grey; }
.bb-color-silver { color: silver; }
.bb-color-maroon { color: maroon; }
.bb-color-olive { color: olive; }
.bb-color-navy { color: navy; }
.bb-color-teal { color: teal; }
.bb-color-aqua { color: aqua; }
.bb-color-fuchsia { color: fuchsia; }
.bb-color-lime { color: lime; }
.bb-bgcolor-black { background-color: black; }
.bb-bgcolor-white { background-color: white; }
.bb-bgcolor-red { background-color: red; }
.bb-bgcolor-green { background-color: green; }
.bb-bgcolor-blue { background-color: blue; }
.bb-bgcolor-yellow { background-color: yellow; }
.bb-bgcolor-orange { background-color: orange; }
.bb-bgcolor-purple { background-color: purple; }
.bb-bgcolor-pink { background-color: pink; }
.bb-bgcolor-gray { background-color: gray; }
.bb-bgcolor-grey { background-color: grey; }
.bb-bgcolor-silver { background-color: silver; }
.bb-bgcolor-maroon { background-color: maroon; }
.bb-bgcolor-olive { background-color: olive; }
.bb-bgcolor-navy { background-color: navy; }
.bb-bgcolor-teal { background-color: teal; }
.bb-bgcolor-aqua { background-color: aqua; }
.bb-bgcolor-fuchsia { background-color: fuchsia; }
.bb-bgcolor-lime { background-color: lime; }
.bb-font-arial { font-family: Arial, Helvetica, sans-serif; }
.bb-font-verdana { font-family: Verdana, Arial, sans-serif; }
.bb-font-tahoma { font-family: Tahoma, Arial, sans-serif; }
.bb-font-trebuchet-ms { font-family: "Trebuchet MS", Arial, sans-serif; }
.bb-font-georgia { font-family: Georgia, serif; }
.bb-font-times-new-roman { font-family: "Times New Roman", serif; }
.bb-font-courier-new { font-family: "Courier New", monospace; }
.bb-font-lucida-console { font-family: "Lucida Console", monospace; }
.bb-font-monospace { font-family: monospace; }
.bb-font-serif { font-family: serif; }
.bb-font-sans-serif { font-family: sans-serif; }
.bb-size-8 { font-size: 8px; }
.bb-size-9 { font-size: 9px; }
.bb-size-10 { font-size: 10px; }
.bb-size-11 { font-size: 11px; }
.bb-size-12 { font-size: 12px; }
.bb-size-13 { font-size: 13px; }
.bb-size-14 { font-size: 14px; }
.bb-size-15 { font-size: 15px; }
.bb-size-16 { font-size: 16px; }
.bb-size-17 { font-size: 17px; }
.bb-size-18 { font-size: 18px; }
.bb-size-19 { font-size: 19px; }
.bb-size-20 { font-size: 20px; }
.bb-size-21 { font-size: 21px; }
.bb-size-22 { font-size: 22px; }
.bb-size-23 { font-size: 23px; }
.bb-size-24 { font-size: 24px; }
.bb-size-25 { font-size: 25px; }
.bb-size-26 { font-size: 26px; }
.bb-size-27 { font-size: 27px; }
.bb-size-28 { font-size: 28px; }
.bb-size-29 { font-size: 29px; }
.bb-size-30 { font-size: 30px; }
.bb-size-31 { font-size: 31px; }
.bb-size-32 { font-size: 32px; }
.bb-size-33 { font-size: 33px; }
.bb-size-34 { font-size: 34px; }
.bb-size-35 { font-size: 35px; }
.bb-size-36 { font-size: 36px; }
.bb-size-37 { font-size: 37px; }
.bb-size-38 { font-size: 38px; }
.bb-size-39 { font-size: 39px; }
.bb-size-40 { font-size: 40px; }
.bb-size-41 { font-size: 41px; }
.bb-size-42 { font-size: 42px; }
.bb-size-43 { font-size: 43px; }
.bb-size-44 { font-size: 44px; }
.bb-size-45 { font-size: 45px; }
.bb-size-46 { font-size: 46px; }
.bb-size-47 { font-size: 47px; }
.bb-size-48 { font-size: 48px; }
.bb-size-49 { font-size: 49px; }
.bb-size-50 { font-size: 50px; }
.bb-size-51 { font-size: 51px; }
.bb-size-52 { font-size: 52px; }
.bb-size-53 { font-size: 53px; }
.bb-size-54 { font-size: 54px; }
.bb-size-55 { font-size: 55px; }
.bb-size-56 { font-size: 56px; }
.bb-size-57 { font-size: 57px; }
.bb-size-58 { font-size: 58px; }
.bb-size-59 { font-size: 59px; }
.bb-size-60 { font-size: 60px; }
.bb-size-61 { font-size: 61px; }
.bb-size-62 { font-size: 62px; }
.bb-size-63 { font-size: 63px; }
.bb-size-64 { font-size: 64px; }
.bb-size-65 { font-size: 65px; }
.bb-size-66 { font-size: 66px; }
.bb-size-67 { font-size: 67px; }
.bb-size-68 { font-size: 68px; }
.bb-size-69 { font-size: 69px; }
.bb-size-70 { font-size: 70px; }
.bb-size-71 { font-size: 71px; }
.bb-size-72 { font-size: 72px; }
.bb-size-73 { font-size: 73px; }
.bb-size-74 { font-size: 74px; }
.bb-size-75 { font-size: 75px; }
.bb-size-76 { font-size: 76px; }
.bb-size-77 { font-size: 77px; }
.bb-size-78 { font-size: 78px; }
.bb-size-79 { font-size: 79px; }
.bb-size-80 { font-size: 80px; }
.bb-size-81 { font-size: 81px; }
.bb-size-82 { font-size: 82px; }
.bb-size-83 { font-size: 83px; }
.bb-size-84 { font-size: 84px; }
.bb-size-85 { font-size: 85px; }
.bb-size-86 { font-size: 86px; }
.bb-size-87 { font-size: 87px; }
.bb-size-88 { font-size: 88px; }
.bb-size-89 { font-size: 89px; }
.bb-size-90 { font-size: 90px; }
.bb-size-91 { font-size: 91px; }
.bb-size-92 { font-size: 92px; }
.bb-size-93 { font-size: 93px; }
.bb-size-94 { font-size: 94px; }
.bb-size-95 { font-size: 95px; }
.bb-size-96 { font-size: 96px; }
.bb-progress {
    display: block;
    width: 360px;
    height: 24px;
}
.bb-progress-label,
.bb-progress-value {
    display: inline-block;
    height: 18px;
    line-height: 18px;
}
.bb-progress-track {
    display: inline-block;
    width: 220px;
    height: 12px;
    overflow: hidden;
    vertical-align: middle;
}
.bb-progress-bar {
    display: block;
    height: 12px;
}

.left-menu-box {
    width: 250px;
    margin-bottom: 16px;
}

.left-menu-box .side-title {
    width: 248px;
}

.left-menu-grid {
    display: grid;
    grid-template-columns: 248px;
    column-gap: 0;
    row-gap: 0;
    width: 248px;
}

.left-menu-grid a,
.left-menu-grid span {
    display: block;
    width: 248px;
    height: 36px;
    margin: 0;
    padding: 10px 20px 0 20px;
    overflow: hidden;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    font-size: 15px;
    font-weight: 700;
    line-height: 16px;
}

.left-mini-nav {
    width: 250px;
    height: 112px;
    margin: 0 0 16px 0;
    padding: 12px 20px 0 20px;
}

.left-mini-nav a {
    display: block;
    width: 208px;
    height: 28px;
    margin: 0;
    font-size: 14px;
    font-weight: 900;
    line-height: 28px;
}

.left-login-form {
    width: 250px;
    margin: 0 0 0 0;
    padding: 14px 20px;
}

.left-login-row {
    width: 208px;
    height: 37px;
    margin-bottom: 15px;
}

.left-login-row input {
    display: block;
    width: 208px;
    height: 37px;
    padding: 7px 10px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-size: 13px;
}

.left-login-captcha {
    display: none;
    width: 208px;
    height: 144px;
    margin: 0 0 10px 0;
}

.left-login-captcha.is-visible {
    display: block;
}

.left-login-captcha-inner {
    width: 208px;
    height: 144px;
    padding: 10px 8px 0 8px;
    border-width: 1px;
    border-style: solid;
    text-align: center;
}

.left-login-captcha .g-recaptcha {
    width: 164px;
    height: 144px;
    margin: 0 auto;
}

.left-login-captcha-inner span {
    display: block;
    width: 166px;
    height: 19px;
    font-size: 14px;
    font-weight: 900;
}

.left-login-captcha-inner small {
    display: block;
    width: 166px;
    height: 28px;
    margin-top: 4px;
    font-size: 11px;
    line-height: 1.2;
}

.left-login-actions {
    width: 208px;
    height: 24px;
    margin-left: 4px;
    text-align: center;
}

.left-login-actions button {
    width: 120px;
    height: 22px;
    border-width: 0;
    font: inherit;
    font-size: 13px;
    font-weight: 900;
    cursor: pointer;
}

.left-user-menu {
    width: 190px;
    margin: 6px 0 18px 6px;
}

.left-user-menu .side-title {
    width: 190px;
    margin-bottom: 6px;
}

.left-user-links {
    display: grid;
    grid-template-columns: 88px 88px;
    column-gap: 8px;
    row-gap: 2px;
    width: 184px;
}

.left-user-links a {
    display: block;
    width: 88px;
    height: 16px;
    margin: 0;
    font-size: 12px;
    font-weight: 700;
    line-height: 15px;
}

.left-status-box {
    width: 250px;
    height: 96px;
    margin-top: 28px;
    margin-left: 0;
    padding: 10px 20px;
}

.left-status-box div,
.left-status-box a {
    display: block;
    width: 208px;
    height: 24px;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    margin: 0;
}

.left-world-box {
    width: 250px;
    height: 128px;
    margin-top: 30px;
    margin-left: 0;
    padding: 0 20px;
}

.left-world-box a {
    display: block;
    width: 208px;
    height: 58px;
    margin: 0 0 12px 0;
    padding-top: 20px;
    text-align: center;
    font-size: 14px;
    font-weight: 900;
}

.left-world-box strong,
.left-world-box span {
    display: inline;
}

.small-text {
    font-size: 12px;
    line-height: 1.4;
}

.right-screenshot-grid {
    display: grid;
    grid-template-columns: 116px 116px;
    column-gap: 8px;
    row-gap: 6px;
    width: 254px;
    height: 322px;
    padding: 4px;
    border-width: 1px;
    border-style: solid;
    overflow-x: hidden;
    overflow-y: auto;
}

.right-screenshot-button {
    display: block;
    width: 116px;
    height: 58px;
    padding: 0;
    border-width: 1px;
    border-style: solid;
    cursor: pointer;
}

.right-screenshot-button img {
    display: block;
    width: 114px;
    height: 56px;
    object-fit: cover;
}

.right-side-action {
    width: 254px;
}

.right-profile-box {
    width: 254px;
    margin-bottom: 18px;
    padding: 16px 0 12px 0;
    text-align: center;
}

.right-profile-avatar {
    position: relative;
    display: block;
    width: 150px;
    height: 150px;
    margin: 0 52px 10px 52px;
}

.right-profile-avatar img {
    display: block;
    width: 150px;
    height: 150px;
    object-fit: cover;
}

.right-profile-avatar span {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 48px;
    height: 20px;
    font-size: 12px;
    font-weight: 900;
    line-height: 20px;
    text-align: center;
}

.right-profile-link {
    width: 252px;
    height: 24px;
    margin: 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 22px;
    text-align: center;
}

.right-menu-box {
    width: 254px;
    margin-bottom: 18px;
}

.right-menu-list {
    width: 252px;
    padding: 10px 14px 12px 14px;
}

.right-menu-list a,
.right-menu-list span,
.right-menu-list strong {
    display: block;
    width: 224px;
    height: 22px;
    margin: 0;
    font-size: 14px;
    line-height: 20px;
}

.right-menu-list strong {
    font-weight: 700;
}

.right-admin-menu {
    width: 254px;
}

.right-admin-rank {
    width: 252px;
    height: 54px;
    padding: 8px 10px 0 10px;
    border-width: 1px;
    border-style: solid;
}

.right-admin-rank strong,
.right-admin-rank span {
    display: block;
    width: 180px;
    height: 18px;
    line-height: 18px;
}

.right-admin-links {
    width: 252px;
    margin-top: 8px;
}

.right-admin-links a {
    display: block;
    width: 252px;
    height: 28px;
    margin: 0 0 5px 0;
    padding: 6px 9px 0 9px;
    border-width: 1px;
    border-style: solid;
    font-size: 13px;
    font-weight: 900;
    line-height: 15px;
}

.right-admin-empty {
    width: 252px;
    height: 58px;
    margin-top: 8px;
    padding: 8px 9px;
    border-width: 1px;
    border-style: solid;
    font-size: 12px;
    line-height: 14px;
}

.right-visitor-box,
.right-discord-button,
.right-mmofacts-link {
    display: block;
    width: 254px;
    height: 42px;
    padding: 11px 10px 0 10px;
    border-width: 1px;
    border-style: solid;
    font-size: 14px;
    font-weight: 900;
    text-align: center;
}

.right-discord-button span,
.right-discord-button strong {
    display: inline;
}

.screen-modal {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 20000;
    display: none;
    width: 100%;
    height: 100%;
    padding-top: 42px;
}

.screen-modal.is-open {
    display: block;
}

.screen-modal-box {
    width: 950px;
    height: 668px;
    margin: 0 auto;
    border-width: 1px;
    border-style: solid;
}

.screen-modal-head {
    width: 948px;
    height: 38px;
    padding: 8px 10px 0 10px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    font-size: 16px;
    font-weight: 900;
}

.screen-modal-close {
    float: right;
    width: 32px;
    height: 24px;
    margin-top: -2px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.screen-modal-body {
    width: 948px;
    height: 628px;
    padding: 10px;
}

.screen-modal-image {
    display: block;
    width: 928px;
    height: 540px;
    object-fit: contain;
    border-width: 1px;
    border-style: solid;
}

.screen-modal-desc {
    width: 928px;
    height: 62px;
    margin-top: 8px;
    padding: 8px 10px;
    border-width: 1px;
    border-style: solid;
    font-size: 14px;
    line-height: 1.35;
    overflow: hidden;
}

.content-box {
    border-width: 1px;
    border-style: solid;
    padding: 18px 20px;
}

.content-box h1 {
    margin: 0 0 10px 0;
    font-size: 22px;
}

.content-box p {
    margin: 0;
    line-height: 1.5;
}

.admin-dashboard-grid {
    display: grid;
    grid-template-columns: 260px 260px 260px;
    column-gap: 16px;
    width: 812px;
    height: 70px;
    margin-top: 18px;
}

.admin-dashboard-grid a {
    display: block;
    width: 260px;
    height: 52px;
    padding: 16px 12px 0 12px;
    border-width: 1px;
    border-style: solid;
    font-size: 15px;
    font-weight: 900;
    text-align: center;
}

.login-page-wrap {
    width: 950px;
    margin: 10px auto 0 auto;
}

.login-page-panel {
    width: 950px;
    height: 350px;
    padding: 0;
    border-width: 2px;
    border-style: solid;
    overflow: hidden;
}

.login-page-panel.is-captcha-visible {
    height: 448px;
}

.login-page-head {
    display: block;
    width: 946px;
    height: 38px;
    padding: 8px 12px 0 12px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.login-page-head span {
    display: block;
    height: 24px;
    font-size: 22px;
    font-weight: 900;
    line-height: 22px;
}

.login-page-form {
    display: grid;
    grid-template-columns: 210px 424px 210px;
    column-gap: 30px;
    width: 914px;
    height: 210px;
    margin: 18px 18px 0 18px;
    align-items: center;
}

.login-page-form.is-captcha-visible {
    height: 306px;
}

.login-page-orb {
    width: 178px;
    height: 210px;
    padding: 14px;
}

.login-page-ball {
    display: block;
    width: 150px;
    height: 150px;
    object-fit: cover;
}

.login-page-center {
    width: 424px;
    height: 210px;
    padding: 14px 24px 0 24px;
    border-width: 1px;
    border-style: solid;
}

.login-page-form.is-captcha-visible .login-page-center {
    height: 306px;
}

.login-page-form.is-captcha-visible .login-page-orb {
    height: 306px;
    padding-top: 48px;
}

.login-page-center-title {
    width: 376px;
    height: 28px;
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 900;
    line-height: 24px;
    text-align: center;
}

.login-page-center input {
    display: block;
    width: 376px;
    height: 34px;
    margin-bottom: 8px;
    padding: 5px 9px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-size: 16px;
}

.login-page-captcha {
    display: none;
    width: 376px;
    height: 86px;
    margin: 0 0 7px 0;
}

.login-page-captcha.is-visible {
    display: block;
}

.login-page-captcha-inner {
    width: 376px;
    height: 86px;
    padding: 11px 12px 0 12px;
    border-width: 1px;
    border-style: solid;
    text-align: center;
}

.login-page-captcha .g-recaptcha {
    width: 304px;
    height: 78px;
    margin: 0 auto;
}

.login-page-captcha-inner span {
    display: block;
    width: 350px;
    height: 20px;
    font-size: 15px;
    font-weight: 900;
}

.login-page-captcha-inner small {
    display: block;
    width: 350px;
    height: 28px;
    margin-top: 4px;
    font-size: 12px;
    line-height: 1.2;
}

.login-page-actions {
    width: 344px;
    height: 36px;
    margin: 2px auto 0 auto;
    text-align: center;
}

.login-page-actions button,
.login-page-actions a {
    display: inline-block;
    vertical-align: top;
    width: 120px;
    height: 36px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-size: 14px;
    font-weight: 900;
    cursor: pointer;
}

.login-page-actions a {
    width: 194px;
    margin-left: 10px;
    padding-top: 8px;
}

.register-page {
    width: 950px;
    margin: 0 auto;
}

.register-panel {
    width: 950px;
    border-width: 1px;
    border-style: solid;
}

.register-head {
    display: block;
    width: 948px;
    height: 42px;
    padding: 10px 12px 0 12px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.register-head span {
    display: block;
    width: 850px;
    height: 22px;
    font-size: 18px;
    font-weight: 900;
    line-height: 20px;
}

.register-form {
    display: grid;
    grid-template-columns: 510px 338px;
    column-gap: 14px;
    width: 850px;
    margin: 12px;
}

.register-fields {
    width: 510px;
}

.register-field {
    display: grid;
    grid-template-columns: 160px 340px;
    column-gap: 10px;
    width: 510px;
    height: 42px;
    margin-bottom: 8px;
}

.register-field span {
    display: block;
    width: 160px;
    height: 34px;
    padding-top: 8px;
    font-size: 14px;
    font-weight: 900;
}

.register-field input,
.register-field select {
    width: 340px;
    height: 34px;
    padding: 6px 8px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-size: 14px;
}

.register-field .register-captcha {
    width: 340px;
    height: 78px;
}

.register-field-captcha {
    height: 86px;
}

.register-captcha-missing {
    width: 340px;
    height: 38px;
    padding-top: 9px;
    text-align: center;
}

.register-submit {
    width: 510px;
    height: 42px;
    padding-left: 170px;
}

.register-submit button {
    width: 180px;
    height: 34px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-size: 15px;
    font-weight: 900;
    cursor: pointer;
}

.register-preview {
    width: 338px;
    height: 548px;
    padding: 12px;
    border-width: 1px;
    border-style: solid;
}

.register-preview-title {
    width: 314px;
    height: 28px;
    font-size: 18px;
    font-weight: 900;
    line-height: 22px;
    text-align: center;
}

.register-preview-canvas {
    position: relative;
    width: 314px;
    height: 370px;
    margin-top: 4px;
    overflow: hidden;
}

.register-preview-layer {
    position: absolute;
    left: 37px;
    top: 24px;
    width: 240px;
    height: 340px;
    object-fit: contain;
    pointer-events: none;
}

#register-preview-body {
    z-index: 1;
}

#register-preview-hair {
    z-index: 2;
}

.register-trait {
    width: 314px;
    height: 104px;
    margin-top: 18px;
    padding: 9px;
    border-width: 1px;
    border-style: solid;
}

.register-trait strong {
    display: block;
    width: 294px;
    height: 20px;
    font-size: 15px;
}

.register-trait span {
    display: block;
    width: 294px;
    height: 64px;
    margin-top: 5px;
    font-size: 13px;
    line-height: 16px;
}

.register-note {
    width: 950px;
    height: 62px;
    margin-top: 12px;
    padding: 12px;
    border-width: 1px;
    border-style: solid;
    text-align: center;
}

.news-post {
    width: 950px;
    padding: 16px;
    border-width: 1px;
    border-style: solid;
}

.news-header {
    display: grid;
    grid-template-columns: 78px 1fr;
    column-gap: 14px;
    align-items: center;
    width: 916px;
    height: 86px;
    margin: 0 0 20px 0;
    padding: 8px;
}

.news-avatar-wrap {
    position: relative;
    width: 70px;
    height: 70px;
    display: block;
}

.news-avatar {
    width: 70px;
    height: 70px;
    display: block;
    object-fit: cover;
    border-width: 2px;
    border-style: solid;
}

.news-avatar-badge {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 34px;
    height: 14px;
    border-width: 1px;
    border-style: solid;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 7px;
    font-weight: 900;
    line-height: 1;
    z-index: 2;
}

.news-meta {
    display: flex;
    flex-direction: column;
    justify-content: center;
    height: 70px;
}

.news-meta strong {
    display: block;
    margin-bottom: 2px;
    font-size: 18px;
}

.news-meta span {
    display: block;
    font-size: 14px;
}

.news-media {
    width: 916px;
    height: 330px;
    margin: 0 0 26px 0;
    overflow: hidden;
}

.news-hero {
    width: 916px;
    height: 330px;
    display: block;
    object-fit: cover;
}

.news-body {
    width: 916px;
    padding: 0 24px;
    font-size: 16px;
    line-height: 1.55;
    text-align: center;
}

.news-body p,
.news-body blockquote {
    margin-top: 0;
}

.news-divider {
    width: 916px;
    height: 82px;
    margin-top: 26px;
    overflow: hidden;
}

.news-divider img {
    width: 916px;
    height: 82px;
    display: block;
    object-fit: cover;
}

.bbcode-content img {
    width: 836px;
    height: 260px;
    object-fit: cover;
}

.bbcode-content blockquote {
    width: 796px;
    margin: 16px auto;
    padding: 10px 14px;
    border-left-width: 4px;
    border-left-style: solid;
    text-align: left;
}

.news-post-nav {
    display: flex;
    justify-content: space-between;
    width: 916px;
    margin-top: 18px;
    padding-top: 12px;
    border-top-width: 1px;
    border-top-style: solid;
    font-weight: 700;
}

.section-title {
    width: 950px;
    height: 40px;
    padding: 8px 14px 0 14px;
    border-width: 1px;
    border-style: solid;
    font-size: 20px;
    font-weight: 700;
    text-transform: uppercase;
}

.news-list,
.news-history {
    width: 950px;
}

.news-preview {
    width: 950px;
    margin-top: 12px;
    padding: 16px 18px;
    border-width: 1px;
    border-style: solid;
}

.news-preview h2 {
    margin: 4px 0 8px 0;
    font-size: 20px;
}

.news-preview-date {
    font-size: 12px;
    font-weight: 700;
}

.news-preview-text {
    width: 874px;
    margin-bottom: 10px;
    line-height: 1.45;
}

.news-read-more,
.news-more a,
.news-history-entry a {
    font-weight: 700;
}

.news-more {
    width: 950px;
    margin-top: 12px;
    padding: 12px 18px;
    border-width: 1px;
    border-style: solid;
}

.news-history-entry p {
    margin: 0 0 10px 0;
}

.news-history-head {
    width: 950px;
    height: 96px;
    margin-top: 12px;
    padding: 14px 18px;
    border-width: 1px;
    border-style: solid;
}

.news-history-head-title {
    width: 520px;
    height: 26px;
    float: left;
    font-size: 22px;
    font-weight: 900;
}

.news-history-head-meta {
    width: 300px;
    height: 24px;
    float: right;
    padding-top: 4px;
    font-size: 14px;
    font-weight: 700;
    text-align: right;
}

.news-history-head p {
    clear: both;
    margin: 8px 0 0 0;
    font-size: 16px;
}

.news-history-search {
    display: grid;
    grid-template-columns: 150px 486px 110px 126px;
    column-gap: 8px;
    width: 950px;
    height: 56px;
    margin-top: 10px;
    padding: 10px 18px;
    border-width: 1px;
    border-style: solid;
}

.news-history-search label {
    display: block;
    width: 150px;
    height: 34px;
    padding-top: 8px;
    font-size: 16px;
    font-weight: 900;
}

.news-history-search input[type="text"] {
    width: 486px;
    height: 34px;
    padding: 6px 10px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
}

.news-history-search button,
.news-history-search a {
    display: block;
    width: 110px;
    height: 34px;
    margin: 0;
    padding: 7px 10px 0 10px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-weight: 900;
    text-align: center;
    vertical-align: top;
    cursor: pointer;
}

.news-history-search a {
    width: 126px;
}

.news-history-empty {
    width: 950px;
    height: 70px;
    margin-top: 10px;
    padding: 24px 18px 0 18px;
    border-width: 1px;
    border-style: solid;
    font-size: 16px;
    font-weight: 700;
}

.news-history-entry {
    display: grid;
    grid-template-columns: 150px 604px 120px;
    column-gap: 20px;
    width: 950px;
    height: 96px;
    margin-top: 10px;
    padding: 14px 26px 14px 18px;
    border-width: 1px;
    border-style: solid;
}

.news-history-entry-date {
    width: 150px;
    height: 66px;
    padding: 22px 0 0 12px;
    border-left-width: 3px;
    border-left-style: solid;
    font-size: 14px;
    font-weight: 700;
}

.news-history-entry-content {
    width: 604px;
    height: 66px;
    overflow: hidden;
}

.news-history-entry-content h2 {
    margin: 0 0 7px 0;
    font-size: 20px;
}

.news-history-entry-content p {
    margin: 0;
    font-size: 15px;
    line-height: 1.3;
}

.news-history-open {
    display: block;
    width: 120px;
    height: 32px;
    margin-top: 17px;
    padding: 7px 10px 0 10px;
    border-width: 1px;
    border-style: solid;
    font-size: 15px;
    font-weight: 900;
    text-align: center;
}

.news-pagination {
    width: 950px;
    height: 54px;
    margin-top: 12px;
    padding: 10px 12px;
    border-width: 1px;
    border-style: solid;
    text-align: center;
}

.news-pagination-link,
.news-pagination-gap {
    display: inline-block;
    width: 34px;
    height: 32px;
    margin: 0 2px;
    padding-top: 7px;
    border-width: 1px;
    border-style: solid;
    font-weight: 900;
    text-align: center;
}

.news-pagination-step {
    width: 42px;
}

.news-pagination-gap {
    border-color: transparent;
}

.info-page {
    width: 950px;
    padding: 0 0 24px 0;
}

.info-hub {
    display: grid;
    grid-template-columns: 208px 488px 208px;
    column-gap: 10px;
    width: 950px;
    height: 238px;
    margin-top: 12px;
    padding: 10px 12px;
    border-width: 1px;
    border-style: solid;
}

.info-menu {
    width: 208px;
    height: 216px;
    padding: 7px 9px;
    border-width: 1px;
    border-style: solid;
    overflow: hidden;
}

.info-menu a {
    display: block;
    width: 188px;
    height: 12px;
    margin-bottom: 1px;
    font-size: 11px;
    font-weight: 700;
}

.info-hub-center {
    width: 488px;
    height: 216px;
    padding: 10px;
    border-width: 1px;
    border-style: solid;
    text-align: center;
}

.info-hub-center img {
    display: block;
    width: 466px;
    height: 132px;
    object-fit: contain;
    margin: 0 auto 12px auto;
    border-width: 1px;
    border-style: solid;
}

.info-hub-title {
    width: 466px;
    height: 28px;
    margin: 0 auto;
    padding-top: 3px;
    font-size: 20px;
    font-weight: 900;
}

.info-hub-current {
    width: 466px;
    height: 24px;
    margin: 4px auto 0 auto;
    font-size: 16px;
    font-weight: 700;
}

.info-content {
    width: 950px;
    margin-top: 12px;
    padding: 18px 20px;
    border-width: 1px;
    border-style: solid;
}

.info-content h1 {
    margin: 0 0 10px 0;
    font-size: 24px;
    font-weight: 900;
}

.info-summary {
    width: 898px;
    margin: 0 0 16px 0;
    padding: 12px 14px;
    border-left-width: 3px;
    border-left-style: solid;
    font-size: 16px;
    line-height: 1.35;
}

.info-content-section {
    width: 908px;
    margin-top: 10px;
    padding: 12px 14px;
    border-width: 1px;
    border-style: solid;
}

.info-content-section h2 {
    margin: 0 0 7px 0;
    font-size: 19px;
    font-weight: 900;
}

.info-content-section p {
    margin: 0;
    font-size: 15px;
    line-height: 1.38;
}

.partner-page {
    width: 950px;
    padding: 0 0 24px 0;
}

.partner-overview {
    position: relative;
    width: 950px;
    height: 210px;
    margin-top: 12px;
    padding: 0;
    border-width: 1px;
    border-style: solid;
    overflow: hidden;
}

.partner-overview-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 948px;
    height: 208px;
    object-fit: fill;
}

.partner-overview::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 948px;
    height: 208px;
}

.partner-overview-title {
    position: relative;
    z-index: 1;
    width: 948px;
    height: 34px;
    padding: 7px 12px 0 12px;
    font-size: 22px;
    font-weight: 900;
}

.partner-overview-body {
    position: relative;
    z-index: 1;
    width: 948px;
    height: 174px;
    padding: 20px 22px;
}

.partner-overview-text {
    width: 386px;
    height: 134px;
    margin-left: 0;
    padding: 14px 16px;
    border-width: 1px;
    border-style: solid;
    text-align: left;
}

.partner-overview-text p {
    margin: 0;
    font-size: 15px;
    line-height: 1.25;
}

.partner-overview-button {
    display: block;
    width: 160px;
    height: 32px;
    margin-top: 16px;
    padding: 7px 10px 0 10px;
    border-width: 1px;
    border-style: solid;
    font-size: 15px;
    font-weight: 900;
    text-align: center;
    text-decoration: none;
}

.partner-join {
    width: 950px;
    margin: 14px 0 0 0;
    padding: 0;
    border-width: 1px;
    border-style: solid;
}

.partner-join-head {
    width: 948px;
    padding: 14px 18px 10px 18px;
    text-align: left;
}

.partner-join-head h2 {
    margin: 0 0 8px 0;
    font-size: 22px;
    font-weight: 900;
}

.partner-join-head p {
    margin: 0 0 8px 0;
    font-size: 16px;
    line-height: 1.35;
}

.partner-banner-list {
    display: grid;
    grid-template-columns: 410px 410px;
    column-gap: 18px;
    row-gap: 14px;
    width: 874px;
    padding: 0 18px 16px 18px;
}

.partner-banner-entry {
    width: 410px;
    border-width: 1px;
    border-style: solid;
}

.partner-banner-label {
    width: 408px;
    height: 24px;
    padding: 3px 8px 0 8px;
    font-size: 16px;
    font-weight: 900;
    text-align: left;
}

.partner-own-banner {
    display: block;
    width: 388px;
    height: 48px;
    margin: 10px auto 8px auto;
    object-fit: cover;
    border-width: 1px;
    border-style: solid;
}

.partner-banner-entry textarea {
    display: block;
    width: 388px;
    height: 54px;
    margin: 0 auto 12px auto;
    padding: 6px 8px;
    resize: none;
    font: inherit;
    line-height: 1.2;
}

.site-footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 1454px;
    height: 54px;
    margin-top: 20px;
    padding: 10px 14px;
    border-width: 1px;
    border-top-width: 1px;
    border-top-style: solid;
    border-style: solid;
    text-align: center;
    font-size: 12px;
    font-weight: 700;
}

.footer-legal {
    width: 1040px;
    margin: 0;
    line-height: 1.35;
}

.footer-cookie-link {
    display: inline;
    padding: 0;
    border: 0;
    background: transparent;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

.system-message-overlay {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 30000;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .55);
}

.system-message-modal {
    width: 560px;
    border-width: 1px;
    border-style: solid;
    box-shadow: 0 10px 30px rgba(0, 0, 0, .45);
}

.system-message-head {
    width: 558px;
    height: 38px;
    padding: 8px 10px 0 10px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    font-size: 16px;
    font-weight: 900;
}

.system-message-body {
    width: 558px;
    padding: 12px 10px 4px 10px;
}

.system-message-line {
    width: 538px;
    margin-bottom: 8px;
    padding: 8px 10px;
    border-width: 1px;
    border-left-width: 4px;
    border-style: solid;
    line-height: 18px;
}

.system-message-foot {
    width: 558px;
    height: 42px;
    padding: 8px 10px 0 10px;
    border-top-width: 1px;
    border-top-style: solid;
    text-align: right;
}

.system-message-ok {
    width: 82px;
    height: 25px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.scroll-top-button {
    position: fixed;
    right: 22px;
    bottom: 22px;
    z-index: 50;
    width: 42px;
    height: 42px;
    display: none;
    align-items: center;
    justify-content: center;
    border-width: 1px;
    border-style: solid;
    font-size: 18px;
    font-weight: 900;
    line-height: 1;
    cursor: pointer;
}

.scroll-top-button.is-visible {
    display: flex;
}

.cookie-modal {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 21000;
    display: none;
    width: 100%;
    height: 100%;
    padding-top: 46px;
}

.cookie-modal.is-open {
    display: block;
}

.cookie-modal-box {
    width: 560px;
    height: 460px;
    margin: 0 auto;
    border-width: 1px;
    border-style: solid;
}

.cookie-modal-head {
    width: 558px;
    height: 38px;
    padding: 8px 10px 0 10px;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    font-size: 16px;
    font-weight: 900;
}

.cookie-modal-close {
    float: right;
    width: 30px;
    height: 24px;
    margin-top: -2px;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.cookie-modal-body {
    width: 558px;
    height: 348px;
    padding: 12px;
}

.cookie-modal-text {
    width: 534px;
    height: 84px;
    margin: 0 0 12px 0;
    padding: 10px 12px;
    border-width: 1px;
    border-style: solid;
    font-size: 13px;
    line-height: 1.32;
}

.cookie-modal-text span {
    display: block;
    margin-top: 6px;
    font-weight: 900;
}

.cookie-modal-row {
    display: grid;
    grid-template-columns: 416px 88px;
    column-gap: 10px;
    width: 534px;
    height: 74px;
    margin-bottom: 8px;
    padding: 8px 10px;
    border-width: 1px;
    border-style: solid;
}

.cookie-modal-row > span {
    display: block;
    width: 416px;
    height: 56px;
}

.cookie-modal-row-title {
    display: block;
    height: 20px;
    font-size: 16px;
    font-weight: 900;
}

.cookie-modal-row-text {
    display: block;
    height: 38px;
    margin-top: 4px;
    font-size: 13px;
    line-height: 1.2;
}

.cookie-modal-row-state {
    width: 88px;
    height: 20px;
    margin-top: 27px;
    font-size: 13px;
    font-weight: 900;
    text-align: right;
}

.cookie-modal-choice {
    cursor: pointer;
}

.cookie-modal-choice input {
    width: 20px;
    height: 20px;
    margin-top: 19px;
    margin-left: 68px;
}

.cookie-modal-actions {
    width: 558px;
    height: 72px;
    padding: 18px 12px;
    border-top-width: 1px;
    border-top-style: solid;
}

.cookie-modal-actions button {
    display: inline-block;
    width: 170px;
    height: 34px;
    margin: 0;
    border-width: 1px;
    border-style: solid;
    font: inherit;
    font-weight: 900;
    cursor: pointer;
}

.cookie-modal-actions button + button {
    margin-left: 8px;
}

/* theme-base.css */
html { background: var(--html-bg); }
html { background: var(--html-bg); }
body { background: var(--body-bg); color: var(--text); }
a { color: var(--link); }
a:hover { color: var(--hover); }
.page-shell { background: var(--shell-bg); box-shadow: var(--shell-shadow); }
.site-banner {
    background: var(--banner-bg);
    border-bottom-color: var(--banner-border);
    color: var(--banner-text);
}
.site-banner-brand-title { color: var(--brand-title); text-shadow: var(--brand-title-shadow); }
.site-banner-brand-subtitle { color: var(--brand-subtitle); text-shadow: var(--brand-subtitle-shadow); }
.top-nav { background: var(--nav-bg); border-color: var(--nav-border); box-shadow: var(--box-shadow); }
.top-nav a { color: var(--nav-text); }
.top-nav a { border-right-color: var(--nav-border); }
.top-nav a:hover,
.top-nav a.is-active { background: var(--nav-active-bg); color: var(--nav-active-text); }
.left-column,
.right-column { background: var(--col-bg); }
.left-column { border-right-color: var(--col-border); }
.right-column { border-left-color: var(--col-border); }
.side-box { background: var(--box-bg); border-color: var(--box-border); box-shadow: var(--box-shadow); }
.side-title { background: var(--side-title-bg); border-color: var(--side-title-border); color: var(--side-title-text); }
.side-box a { color: var(--side-link); }
.side-box a:hover { color: var(--side-hover); }
.small-text { color: var(--small-text); }
.left-player-stats,
.left-menu-grid span,
.right-menu-list span,
.right-menu-list strong {
    color: var(--text);
}
.left-menu-grid a,
.left-menu-grid span {
    border-bottom-color: var(--box-border);
}
.left-menu-grid a:hover {
    background: var(--select-hover-bg);
}
.left-bar {
    background: var(--box-bg);
    border: 1px solid var(--box-border);
}
.left-bar span {
    color: #ffffff;
}
.left-bar-lp span {
    background: #e00000;
}
.left-bar-kp span {
    background: #101be8;
}
.right-profile-avatar img {
    border: 2px solid var(--avatar-border);
    box-shadow: var(--avatar-shadow);
}
.right-profile-avatar span {
    background: var(--badge-bg);
    border: 1px solid var(--badge-border);
    color: var(--badge-text);
    box-shadow: var(--badge-shadow);
}
.right-profile-link {
    color: var(--side-link);
}
.right-profile-link:hover {
    color: var(--side-hover);
}
.bb-progress-track {
    background: var(--box-bg);
    border: 1px solid var(--box-border);
}
.bb-progress-bar {
    background: var(--scroll-button-bg);
}
.right-screenshot-grid {
    background: var(--box-bg);
    border-color: var(--box-border);
}
.right-screenshot-button {
    background: var(--select-bg);
    border-color: var(--select-border);
}
.right-screenshot-button:hover {
    border-color: var(--hover);
}
.right-screenshot-grid::-webkit-scrollbar {
    width: 10px;
}
.right-screenshot-grid::-webkit-scrollbar-track {
    background: var(--select-bg);
}
.right-screenshot-grid::-webkit-scrollbar-thumb {
    background: var(--scroll-button-bg);
    border: 1px solid var(--scroll-button-border);
}
.right-admin-rank,
.right-admin-empty {
    background: var(--box-bg);
    border-color: var(--box-border);
    color: var(--box-text);
    box-shadow: var(--box-shadow);
}
.right-admin-rank strong {
    color: var(--title-text);
}
.right-admin-links a {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff !important;
    box-shadow: var(--scroll-button-shadow);
}
.right-admin-links a:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff !important;
}
.right-visitor-box,
.right-discord-button,
.right-mmofacts-link {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff !important;
    box-shadow: var(--scroll-button-shadow);
}
.right-visitor-box *,
.right-discord-button *,
.right-mmofacts-link * {
    color: #ffffff !important;
}
.right-visitor-box span,
.right-discord-button span,
.right-discord-button strong,
.right-mmofacts-link span,
.right-mmofacts-link strong {
    color: #ffffff !important;
}
.right-discord-button strong {
    color: #ffffff !important;
}
.right-visitor-box span {
    color: #ffffff !important;
}
.right-discord-button:hover,
.right-mmofacts-link:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff !important;
}
.right-discord-button:hover span,
.right-discord-button:hover strong,
.right-mmofacts-link:hover span,
.right-mmofacts-link:hover strong {
    color: #ffffff !important;
}
.left-login-row input {
    background: var(--select-bg);
    border-color: var(--select-border);
    color: var(--select-text);
}
.left-login-row input:focus {
    outline: none;
    background: var(--select-hover-bg);
    box-shadow: var(--select-focus-shadow);
}
.left-login-captcha-inner {
    background: var(--box-soft-bg);
    border-color: var(--box-border);
    color: var(--box-text);
}
.left-login-captcha-inner span {
    color: var(--accent);
}
.left-login-actions button {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff !important;
    box-shadow: var(--scroll-button-shadow);
}
.left-login-actions button:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff !important;
}
.left-status-box {
    color: var(--body-text);
}
.left-status-box a {
    color: var(--body-text);
}
.left-status-box a:hover {
    color: var(--accent);
}
.left-world-box a {
    background: var(--scroll-button-bg);
    border: 1px solid var(--scroll-button-border);
    color: #ffffff !important;
    box-shadow: var(--scroll-button-shadow);
}
.left-world-box a strong {
    color: #ffffff !important;
}
.left-world-box a span {
    color: var(--success);
}
.left-world-box a:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff !important;
}
.login-page-panel {
    background: var(--box-bg);
    border-color: var(--box-border);
    box-shadow: var(--box-shadow);
}
.login-page-head {
    background: var(--side-title-bg);
    border-bottom-color: var(--box-border);
}
.login-page-head span {
    color: var(--accent);
}
.login-page-center {
    background: var(--box-soft-bg);
    border-color: var(--box-border);
}
.login-page-center-title {
    color: var(--accent);
}
.login-page-ball {
    filter: drop-shadow(0 2px 3px rgba(0,0,0,.45));
}
.login-page-center input {
    background: var(--select-bg);
    border-color: var(--select-border);
    color: var(--select-text);
}
.login-page-center input:focus {
    outline: none;
    background: var(--select-hover-bg);
    box-shadow: var(--select-focus-shadow);
}
.login-page-captcha-inner {
    background: var(--box-soft-bg);
    border-color: var(--box-border);
    color: var(--box-text);
}
.register-panel,
.register-preview,
.register-trait,
.register-note,
.system-message-modal,
.system-message-line {
    background: var(--box-bg);
    border-color: var(--box-border);
    color: var(--box-text);
    box-shadow: var(--box-shadow);
}
.system-message-head {
    background: var(--section-bg);
    border-color: var(--box-border);
    color: var(--section-text);
}
.system-message-foot {
    background: var(--box-soft-bg);
    border-color: var(--box-border);
}
.system-message-line.success {
    border-left-color: #2f8f2f;
}
.system-message-line.error {
    border-left-color: #b30000;
}
.system-message-ok {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #fff;
}
.system-message-ok:hover {
    background: var(--scroll-button-hover-bg);
    color: #fff;
}
.register-head {
    background: var(--section-bg);
    border-color: var(--box-border);
    color: var(--section-text);
}
.register-field input,
.register-field select {
    background: var(--select-bg);
    border-color: var(--select-border);
    color: var(--select-text);
}
.register-field input:focus,
.register-field select:focus {
    outline: none;
    background: var(--select-hover-bg);
    box-shadow: var(--select-focus-shadow);
}
.register-submit button {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff !important;
    box-shadow: var(--scroll-button-shadow);
}
.register-submit button:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff !important;
}
.register-preview-canvas {
    background: var(--box-soft-bg);
}
.register-trait strong,
.register-head strong {
    color: var(--accent);
}
.login-page-captcha-inner span {
    color: var(--accent);
}
.login-page-actions button,
.login-page-actions a {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff !important;
    box-shadow: var(--scroll-button-shadow);
}
.login-page-actions button:hover,
.login-page-actions a:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff !important;
}
.screen-modal {
    background: rgba(0,0,0,.76);
}
.screen-modal-box {
    background: var(--box-bg);
    border-color: var(--box-border);
    color: var(--box-text);
    box-shadow: var(--box-shadow);
}
.screen-modal-head {
    background: var(--section-bg);
    border-bottom-color: var(--box-border);
    color: var(--section-text);
}
.screen-modal-close {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff;
}
.screen-modal-image {
    background: #000;
    border-color: var(--box-border);
}
.screen-modal-desc {
    background: var(--quote-bg);
    border-color: var(--box-border);
    color: var(--box-text);
}
.content-box,
.news-post,
.news-preview,
.news-history-head,
.news-history-search,
.news-history-entry,
.news-history-empty,
.news-more,
.news-pagination { background: var(--box-bg); border-color: var(--box-border); color: var(--box-text); box-shadow: var(--box-shadow); }
.admin-dashboard-grid a {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff !important;
    box-shadow: var(--scroll-button-shadow);
}
.admin-dashboard-grid a:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff !important;
}
.content-box h1,
.news-meta strong,
.news-preview h2 a,
.news-history-entry h2 a,
.news-history-head-title { color: var(--title-text); }
.news-header { background: var(--news-header-bg); border-color: var(--news-header-border); }
.news-avatar { border-color: var(--avatar-border); box-shadow: var(--avatar-shadow); }
.news-avatar-badge { background: var(--badge-bg); border-color: var(--badge-border); color: var(--badge-text); text-shadow: var(--badge-shadow); }
.news-meta span,
.news-body { color: var(--box-text); }
.bbcode-content blockquote { background: var(--quote-bg); border-left-color: var(--quote-border); color: var(--box-text); }
.news-post-nav { border-top-color: var(--box-border); }
.section-title { background: var(--section-bg); border-color: var(--box-border); color: var(--section-text); }
.news-preview-date,
.news-history-head-meta { color: var(--preview-date); }
.news-history-entry-date {
    background: transparent;
    border-left-color: var(--title-text);
    color: var(--preview-date);
}
.news-history-search label { color: var(--title-text); }
.news-history-search input[type="text"] {
    background: var(--select-bg);
    border-color: var(--select-border);
    color: var(--select-text);
}
.news-history-search button,
.news-history-search a {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff;
    box-shadow: var(--scroll-button-shadow);
}
.news-history-search button:hover,
.news-history-search a:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff;
}
.news-history-open,
.news-pagination-link {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff;
    box-shadow: var(--scroll-button-shadow);
}
.news-history-open:hover,
.news-pagination-link:hover,
.news-pagination-link.is-active {
    background: var(--scroll-button-hover-bg);
    color: #ffffff;
}
.news-pagination-link.is-disabled {
    background: var(--news-header-bg);
    border-color: var(--news-header-border);
    color: var(--preview-date);
    box-shadow: none;
}
.news-pagination-gap {
    background: transparent;
    color: var(--preview-date);
    box-shadow: none;
}
.info-hub,
.info-menu,
.info-hub-center,
.info-content,
.info-content-section {
    background: var(--box-bg);
    border-color: var(--box-border);
    color: var(--box-text);
    box-shadow: var(--box-shadow);
}
.info-menu a { color: var(--side-link); }
.info-menu a:hover,
.info-menu a.is-active { color: var(--hover); }
.info-hub-center img { border-color: var(--box-border); }
.info-hub-title,
.info-content h1,
.info-content-section h2 { color: var(--title-text); }
.info-hub-current,
.info-summary { color: var(--box-text); }
.info-summary {
    background: var(--quote-bg);
    border-left-color: var(--title-text);
}
.partner-join,
.partner-banner-entry { background: var(--box-bg); border-color: var(--box-border); color: var(--box-text); box-shadow: var(--box-shadow); }
.partner-overview { border-color: var(--box-border); color: var(--box-text); box-shadow: var(--box-shadow); }
.partner-join-head h2 { color: var(--title-text); }
.partner-overview::before { background: var(--partner-overlay-bg, rgba(0,0,0,.46)); }
.partner-overview-title,
.partner-banner-label { background: var(--nav-bg); color: var(--nav-active-text); }
.partner-overview-text {
    background: var(--partner-text-bg, rgba(0,0,0,.58));
    border-color: var(--box-border);
    color: var(--partner-text, #fff);
    text-shadow: var(--partner-text-shadow, 0 1px 2px rgba(0,0,0,.9));
}
.partner-own-banner { border-color: var(--box-border); }
.partner-overview-button {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff;
    box-shadow: var(--scroll-button-shadow);
}
.partner-overview-button:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff;
}
.partner-banner-entry textarea {
    background: var(--select-bg);
    border: 1px solid var(--select-border);
    color: var(--select-text);
}
.site-footer { background: var(--footer-bg); border-color: var(--footer-border); color: var(--footer-text); box-shadow: var(--box-shadow); }
.footer-cookie-link {
    color: var(--footer-text);
}
.footer-cookie-link:hover {
    color: var(--hover);
}
.scroll-top-button {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: var(--scroll-button-text);
    box-shadow: var(--scroll-button-shadow);
}
.scroll-top-button:hover {
    background: var(--scroll-button-hover-bg);
    color: var(--scroll-button-hover-text);
}
.cookie-modal {
    background: rgba(0,0,0,.76);
}
.cookie-modal-box {
    background: var(--box-bg);
    border-color: var(--box-border);
    color: var(--box-text);
    box-shadow: var(--box-shadow);
}
.cookie-modal-head {
    background: var(--section-bg);
    border-bottom-color: var(--box-border);
    color: var(--section-text);
}
.cookie-modal-close,
.cookie-modal-actions button {
    background: var(--scroll-button-bg);
    border-color: var(--scroll-button-border);
    color: #ffffff;
    box-shadow: var(--scroll-button-shadow);
}
.cookie-modal-close:hover,
.cookie-modal-actions button:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff;
}
.cookie-modal-row {
    background: var(--quote-bg);
    border-color: var(--box-border);
}
.cookie-modal-text {
    background: var(--quote-bg);
    border-color: var(--box-border);
    color: var(--box-text);
}
.cookie-modal-text a {
    color: var(--title-text);
}
.cookie-modal-row-title,
.cookie-modal-row-state {
    color: var(--title-text);
}
.cookie-modal-choice input {
    accent-color: var(--title-text);
}

/* theme-default.css */
:root {
    --html-bg: linear-gradient(180deg, #4f9dde 0%, #7fb7df 145px, #d9d9d9 360px, #8f8f8f 100%) fixed;
    --body-bg: transparent;
    --text: #111;
    --link: #111;
    --hover: #147f79;
    --shell-bg: #fff;
    --shell-shadow: none;
    --banner-bg: #4f89c7;
    --banner-border: #333;
    --banner-text: #f5f5f5;
    --brand-title: #f7e8b7;
    --brand-subtitle: #ffffff;
    --brand-title-shadow: 0 2px 0 #123f77, 0 0 10px rgba(255,255,255,.55);
    --brand-subtitle-shadow: 0 1px 0 #123f77, 0 0 8px rgba(255,255,255,.45);
    --sub-text: #f5f5f5;
    --nav-bg: #303030;
    --nav-border: #202020;
    --nav-text: #fff;
    --nav-active-bg: #3f3f3f;
    --nav-active-text: #fff;
    --col-bg: #efefef;
    --col-border: #bcbcbc;
    --side-title-bg: #d1d1d1;
    --side-title-border: #bcbcbc;
    --side-title-text: #111;
    --side-link: #111;
    --side-hover: #147f79;
    --small-text: #111;
    --box-bg: #e8e8e8;
    --box-border: #9f9f9f;
    --box-text: #111;
    --box-shadow: none;
    --title-text: #1a1a1a;
    --news-header-bg: #d1d1d1;
    --news-header-border: #bcbcbc;
    --avatar-border: #e00000;
    --avatar-shadow: 0 0 0 1px #000;
    --quote-bg: #eeeeee;
    --quote-border: #303030;
    --section-bg: #d1d1d1;
    --section-text: #1a1a1a;
    --preview-date: #555;
    --footer-bg: #d1d1d1;
    --footer-border: #bcbcbc;
    --footer-text: #111;
    --select-bg: #fff;
    --select-border: #999;
    --select-text: #111;
    --badge-bg: #e00000;
    --badge-border: #e00000;
    --badge-text: #fff;
    --badge-shadow: 0 1px 1px rgba(0,0,0,.45);
    --banner-shadow: 0 1px 0 #000;
    --title-shadow: 0 1px 0 #000;
    --select-focus-shadow: 0 0 0 2px rgba(20, 127, 121, 0.22);
    --select-hover-bg: #f5f5f5;
    --scroll-button-border: #606060;
    --scroll-button-shadow: 0 2px 8px rgba(0,0,0,.30);
    --scroll-button-text: #fff;
    --scroll-button-hover-text: #fff;
    --scroll-button-hover-bg: linear-gradient(180deg, #707070 0%, #3f3f3f 100%);
    --scroll-button-bg: linear-gradient(180deg, #5f5f5f 0%, #363636 100%);
    --partner-overlay-bg: rgba(0,0,0,.48);
    --partner-text-bg: rgba(0,0,0,.74);
    --partner-text: #ffffff;
    --partner-text-shadow: 0 1px 2px rgba(0,0,0,.95);
}