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);
    background-image: var(--banner-image);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    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-bottom-color: var(--nav-border); }
.top-nav a { color: var(--nav-text); }
.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-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); }
.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-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);
}
.login-page-message {
    background: var(--box-soft-bg);
    border-color: var(--box-border);
    color: var(--box-text);
}
.register-panel,
.register-preview,
.register-trait,
.register-note,
.register-message {
    background: var(--box-bg);
    border-color: var(--box-border);
    color: var(--box-text);
    box-shadow: var(--box-shadow);
}
.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,
.login-page-footer 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,
.login-page-footer a:hover {
    background: var(--scroll-button-hover-bg);
    color: #ffffff !important;
}
.login-page-footer {
    background: var(--box-soft-bg);
    border-top-color: var(--box-border);
}
.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); }
.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-top-color: var(--footer-border); color: var(--footer-text); }
.footer-cookie-link {
    color: var(--footer-text);
}
.footer-cookie-link:hover {
    color: var(--hover);
}
.theme-switcher select {
    background: var(--select-bg);
    border: 1px solid var(--select-border);
    color: var(--select-text);
    box-shadow: inset 0 0 0 1px var(--select-hover-bg);
    outline: 0;
}
.theme-switcher select:hover {
    background: var(--select-hover-bg);
}
.theme-switcher select:focus {
    box-shadow: var(--select-focus-shadow);
}
.theme-switcher option {
    background: var(--select-bg);
    color: var(--select-text);
}
.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);
}