Universal Darkmode for BGA! (forums not yet. Need feedback)
DM now balanced for PC version browsers. Soon mobile version Darkmode develop start.
Main features! (17 nov 2025)
* 98% darkened BGA. Main site and in games
* Increased size of action buttons in action bars in games
* Tuned sizes of different elements in games to make them bigger for better UX
* Mobile version ready
* Added special visual effects on interface
* Created community group. Darkmode theme for BGA. Waiting for comments, issues, bugs etc.
Take a moment to send me feedback. Some games reacts different on universal code. Soif there is a kind of disappeared features in games, please, send me a message with that problem, i will fix that, Enjoy and Dark them all!
Here is the code!
Todo:
Replay game view is still bright.
Forums DM not in development, because there is no copypaste box for code to make
Barbiecore pink color heaven mode is made too just for fun. Will send code of glamourus pink theme via private message.
* HOW TO USE IT *
Copy and paste the code in text box in Preferences in "advanced" tab. There will be an empty field. Paste the code there and push "Save" button.
DM now balanced for PC version browsers. Soon mobile version Darkmode develop start.
Main features! (17 nov 2025)
* 98% darkened BGA. Main site and in games
* Increased size of action buttons in action bars in games
* Tuned sizes of different elements in games to make them bigger for better UX
* Mobile version ready
* Added special visual effects on interface
* Created community group. Darkmode theme for BGA. Waiting for comments, issues, bugs etc.
Take a moment to send me feedback. Some games reacts different on universal code. Soif there is a kind of disappeared features in games, please, send me a message with that problem, i will fix that, Enjoy and Dark them all!
Here is the code!
Todo:
Replay game view is still bright.
Forums DM not in development, because there is no copypaste box for code to make
Barbiecore pink color heaven mode is made too just for fun. Will send code of glamourus pink theme via private message.* HOW TO USE IT *
Copy and paste the code in text box in Preferences in "advanced" tab. There will be an empty field. Paste the code there and push "Save" button.
Code: Select all
#pageheader_lobbymenunav_wrap,
.pageheader_mobile_switcher_wrap,
.pageheader_big_switch_dropdown,
.pageheader_menuitem,
.pageheader,
.chatwindowavatar,
.roundedboxinner,
.bga-menu-bar-items__menu-item.bga-link.truncate.svelte-1duixkh,
.bg-bga-gray-211,
.bga-menu-subbar.svelte-1edikia.svelte-1edikia,
.bga-game-browser__panel.svelte-x617ll.svelte-x617ll,
.arrow.svelte-e257fk.svelte-e257fk,
.bga-latest-news__item.bga-button-clean.svelte-1c7gchg.transition-opacity.duration-500,
.bga-popup-modal__holder.relative.bg-white.dark\:bg-black.rounded-md.bga-modal-shadow.desktop\:w-fit.svelte-onjxky,
.bga-page-section>.bga-page-section__content,
.whiteblock,
.player-board,
.standard_popin,
.ingame.topbar_new_version,
.homepage-section__content.rounded-md.mt-2.bg-bga-whitebg.p-3.bga-page-section-shadow,
.post.bga-hover-for-list,
.p-3.bg-bga-whitebg.rounded-md.bga-page-section-shadow,
.block.overflow-hidden.rounded-md.bg-bga-gray-233.bga-hover-for-list.cursor-pointer,
.bga-player-menu__top.bg-bga-whitebg.dark\:bg-bga-blackbg.svelte-1ri87l2,
.pagesection__content.newsabstract,
.portlet__content,
.bga-dropdown-button-wrap.flex.svelte-szfc5g,
.bga-game-option-item-choice__selector.svelte-1th7ay1,
.bga-lobby-table-item.svelte-1bum8hm.svelte-1bum8hm,
.bga-popup-modal__holder.relative.bg-white.dark\:bg-black.rounded-md.bga-modal-shadow.desktop\:w-fit.svelte-onjxky,
.bga-homepage-games-recommandations__menu-item.bga-homepage-games-recommandations__menu-item--highlighted.svelte-n13xz2,
.bga-premium-page-section--full.order-2.svelte-1lcvrll,
.bga-table-list-item__main.svelte-1yag60g.svelte-1yag60g {
transition: all 0.3s ease-in-out !important;
transform-origin: center !important;
}
/* 1. Glassmorphism - стеклянные эффекты */
#pageheader_lobbymenunav_wrap,
.pageheader_mobile_switcher_wrap,
.pageheader_big_switch_dropdown,
.pageheader_menuitem,
.pageheader,
.bga-menu-subbar.svelte-1edikia.svelte-1edikia,
.bga-popup-modal__holder.relative.bg-white.dark\:bg-black.rounded-md.bga-modal-shadow.desktop\:w-fit.svelte-onjxky,
.bga-page-section>.bga-page-section__content,
.standard_popin,
.bga-player-menu__top.bg-bga-whitebg.dark\:bg-bga-blackbg.svelte-1ri87l2,
.pagesection__content.newsabstract,
.portlet__content {
/*backdrop-filter: blur(1em) !important; */
background: rgba(45, 45, 45, 0.85) !important;
border: 0.0625rem solid rgba(255, 255, 255, 0.1) !important;
background-image:
linear-gradient(135deg, rgba(255, 255, 255, 0.1) 0%, transparent 50%),
linear-gradient(180deg, rgba(45, 45, 45, 0.9), rgba(26, 26, 26, 0.8)) !important;
}
.chatwindowavatar,
.roundedboxinner,
.bga-menu-bar-items__menu-item.bga-link.truncate.svelte-1duixkh,
.bga-game-browser__panel.svelte-x617ll.svelte-x617ll,
.homepage-section__content.rounded-md.mt-2.bg-bga-whitebg.p-3.bga-page-section-shadow,
.post.bga-hover-for-list,
.p-3.bg-bga-whitebg.rounded-md.bga-page-section-shadow,
.block.overflow-hidden.rounded-md.bg-bga-gray-233.bga-hover-for-list.cursor-pointer,
.bga-game-option-item-choice__selector.svelte-1th7ay1,
.bga-lobby-table-item.svelte-1bum8hm.svelte-1bum8hm {
box-shadow:
inset 0 0.0625rem 0.1875rem rgba(255, 255, 255, 0.2),
inset 0 -0.0625rem 0.1875rem rgba(0, 0, 0, 0.4) !important;
background-image:
linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, transparent 25%),
linear-gradient(180deg, rgba(45, 45, 45, 0.95), rgba(26, 26, 26, 0.9)) !important;
border: 0.0625rem solid rgba(255, 255, 255, 0.08) !important;
}
.notouch-device .bga-hover-for-list:hover,
.bga-menu-bar-items__menu-item.bga-link.truncate.svelte-1duixkh:hover,
.pageheader_menuitem:hover,
.bga-latest-news__item.bga-button-clean.svelte-1c7gchg.transition-opacity.duration-500:hover,
.block.overflow-hidden.rounded-md.bg-bga-gray-233.bga-hover-for-list.cursor-pointer:hover {
transform: scale(1.03) translateY(-0.125rem) !important;
backdrop-filter: blur(1.25em) !important;
box-shadow:
0 0.5rem 1.5rem rgba(0, 0, 0, 0.3),
0 0.25rem 0.5rem rgba(0, 0, 0, 0.2) !important;
}
.bga-popup-modal__holder.relative.bg-white.dark\:bg-black.rounded-md.bga-modal-shadow.desktop\:w-fit.svelte-onjxky,
.homepage-section__content.rounded-md.mt-2.bg-bga-whitebg.p-3.bga-page-section-shadow,
.p-3.bg-bga-whitebg.rounded-md.bga-page-section-shadow,
.standard_popin {
box-shadow:
0 0.25rem 0.5rem rgba(0, 0, 0, 0.1),
0 0.5rem 1.5rem rgba(0, 0, 0, 0.2),
0 1rem 2.5rem rgba(0, 0, 0, 0.15) !important;
}
.bga-popup-modal__holder.relative.bg-white.dark\:bg-black.rounded-md.bga-modal-shadow.desktop\:w-fit.svelte-onjxky:hover,
.homepage-section__content.rounded-md.mt-2.bg-bga-whitebg.p-3.bga-page-section-shadow:hover {
box-shadow:
0 0.5rem 1rem rgba(0, 0, 0, 0.15),
0 1rem 2rem rgba(0, 0, 0, 0.25),
0 1.5rem 3rem rgba(0, 0, 0, 0.2) !important;
}
.player_score,
.fa.fa-volume-up.visible_if_logged.fa-lg,
.globalaction.globalaction_fullscreen.icon20.icon20_fullscreen_white.self-center,
.icon32.icon32_notes.self-center.top-0,
.fa.fa-bars.fa-lg,
.bgabutton_blue,
.bgabutton_gray {
transition: all 0.3s ease-in-out !important;
transform-origin: center !important;
}
.player_score:hover,
.fa.fa-volume-up.visible_if_logged.fa-lg:hover,
.globalaction.globalaction_fullscreen.icon20.icon20_fullscreen_white.self-center:hover,
.icon32.icon32_notes.self-center.top-0:hover,
.fa.fa-bars.fa-lg:hover {
transform: scale(1.4) !important;
}
.bga-table-list-item__progress-bar-inner.svelte-1yag60g.svelte-1yag60g,
.bga-game-option-item-bool.svelte-n7lgf1,
.switcher_zone {
background-image:
linear-gradient(180deg,
rgba(255, 255, 255, 0.1) 0%,
transparent 20%,
transparent 80%,
rgba(0, 0, 0, 0.2) 100%) !important;
transition: all 0.3s ease-in-out !important;
}
.bga-table-list-item__progress-bar-inner.svelte-1yag60g.svelte-1yag60g:hover {
background-image:
linear-gradient(180deg,
rgba(255, 255, 255, 0.15) 0%,
transparent 25%,
transparent 75%,
rgba(0, 0, 0, 0.3) 100%) !important;
transform: translateY(-0.0625rem) !important;
}
.bga-link,
.playername,
.text-bga-username,
.gamename {
transition: all 0.2s ease-in-out !important;
position: relative !important;
}
.bga-link:hover,
.playername:hover,
.text-bga-username:hover,
.gamename:hover {
transform: translateY(-0.0625rem) !important;
text-shadow: 0 0.125rem 0.25rem rgba(255, 255, 255, 0.3) !important;
}
.mcompact .player_area,
.whiteblock,
.roundedbox.bga-game-zoom {
backdrop-filter: blur(0.75em) !important;
background: rgba(45, 45, 45, 0.8) !important;
border: 0.0625rem solid rgba(255, 255, 255, 0.05) !important;
transition: all 0.3s ease-in-out !important;
}
.mcompact .player_area:hover,
.whiteblock:hover {
transform: scale(1.02) !important;
backdrop-filter: blur(1em) !important;
box-shadow:
0 0.375rem 1rem rgba(0, 0, 0, 0.2),
0 0.125rem 0.375rem rgba(255, 255, 255, 0.1) !important;
}
.bgabutton_blue,
.bgabutton_gray,
.wannaplay_mask_button.del_favorite,
.wannaplay_mask_button.wannaplayauto_pref {
backdrop-filter: blur(0.5em) !important;
border: 0.0625rem solid rgba(255, 255, 255, 0.1) !important;
transition: all 0.3s ease-in-out !important;
position: relative !important;
overflow: hidden !important;
}
.bgabutton_blue:hover,
.bgabutton_gray:hover,
.wannaplay_mask_button.del_favorite:hover,
.wannaplay_mask_button.wannaplayauto_pref:hover {
transform: scale(1.05) translateY(-0.125rem) !important;
box-shadow:
0 0.375rem 1rem rgba(0, 0, 0, 0.3),
0 0.125rem 0.5rem rgba(255, 255, 255, 0.1) !important;
}
.chatinput,
.bga-dropdown-button-value.svelte-szfc5g.svelte-szfc5g,
.bga-dropdown__options {
backdrop-filter: blur(0.75em) !important;
background: rgba(45, 45, 45, 0.7) !important;
border: 0.0625rem solid rgba(255, 255, 255, 0.1) !important;
transition: all 0.3s ease-in-out !important;
}
.chatinput:focus,
.bga-dropdown-button-value.svelte-szfc5g.svelte-szfc5g:hover {
transform: scale(1.02) !important;
backdrop-filter: blur(1em) !important;
box-shadow:
0 0 0 0.125rem rgba(255, 255, 255, 0.1),
0 0.25rem 0.75rem rgba(0, 0, 0, 0.2) !important;
}
.bga-latest-news__item.bga-button-clean.svelte-1c7gchg.transition-opacity.duration-500,
.bga-game-panel--status-tournaments.svelte-r3yse2 .bga-game-panel__content-divider-background.svelte-r3yse2 {
animation: fadeInUp 0.5s ease-out !important;
}
@keyframes fadeInUp {
from {
opacity: 0;
transform: translateY(1rem);
}
to {
opacity: 1;
transform: translateY(0);
}
}
#pageheader_lobbymenunav_wrap,
.pageheader_mobile_switcher_wrap,
.pageheader_big_switch_dropdown,
.pageheader_menuitem,
.pageheader {
background-color: #2d2d2d !important;
color: #00FFFF !important;
}
.chatwindowavatar,
.roundedboxinner,
.bga-menu-bar-items__menu-item.bga-link.truncate.svelte-1duixkh {
background: #000000 !important;
}
.bg-bga-gray-211 {
background: #000000 !important;
}
.bga-menu-subbar.svelte-1edikia.svelte-1edikia {
background: linear-gradient(to bottom, #2d2d2d, #1a1a1a) !important;
}
#loader_mask {
background-color: #000 !important;
}
body {
text-shadow: 0 0 1rem rgba(0, 0, 0, 0.7) !important;
background-color: #000000 !important;
background: #000000 !important;
}
.text-2xl.desktop\:text-3xl.font-extrabold.text-gray-600.dark\:text-gray-300 {
color: #ffff00 !important;
}
.panel-block--buttons__play-wrapper--glow.svelte-g0rhr9 {
background-image: linear-gradient(180deg, #3a3a3a 0%, #3a3a3a 70%, transparent 70%) !important;
}
.bga-game-browser__panel.svelte-x617ll.svelte-x617ll {
background: linear-gradient(180deg, #000 0%, #000 100%) !important;
}
.arrow.svelte-e257fk.svelte-e257fk {
background-color: rgba(45, 45, 45, 0.9) !important;
--bga-game-browser-bg-color: rgba(45, 45, 45, 0.9) !important;
}
.player_area_name {
text-shadow: 0 0 0.0625rem #fff, 0 0 0.0625rem #fff, 0 0 0.0625rem #fff, 0 0 0.0625rem #fff;
letter-spacing: 0.075rem;
transition: all 0.3s ease-in-out !important;
}
.player_area_name:hover {
transform: scale(1.05) !important;
text-shadow: 0 0 0.125rem #fff, 0 0 0.25rem #fff !important;
}
.switcher_zone {
background: linear-gradient(#a0c4ff, #7aa6ff) !important;
backdrop-filter: blur(0.5em) !important;
transition: all 0.3s ease-in-out !important;
}
.switcher_zone:hover {
transform: translateY(-0.125rem) !important;
box-shadow: 0 0.25rem 0.75rem rgba(122, 166, 255, 0.3) !important;
}
.player_score {
transform: scale(1.15);
transition: all 0.3s ease-in-out !important;
}
.player_score:hover {
transform: scale(1.25) !important;
}
.player-board.roundedboxdisabled {
background: none !important;
}
.mcompact .player_area_name {
background: none !important;
}
.playerIconBlock,
.withProductionBlock,
.brickBlock,
.text-gray-600.pl-6.mb-3.mt-1.text-sm.desktop\:text-lg {
color: #ffffff !important;
font-size: 110% !important;
transition: all 0.2s ease-in-out !important;
}
.playerIconBlock:hover,
.withProductionBlock:hover,
.brickBlock:hover {
transform: scale(1.1) !important;
}
.sectiontitle_dropdown_menu.sectiontitle_dropdown_menu_visible {
background: rgba(45, 45, 45, 0.9) !important;
color: #ffffff !important;
border: 0.0625rem solid #ffffff26 !important;
backdrop-filter: blur(1em) !important;
transition: all 0.3s ease-in-out !important;
}
.card_cost {
color: #000000 !important;
}
.h-full.overflow-hidden.svelte-lurk2c {
color: #000000 !important;
}
.boardblock doubletime_infos,
.text-bga-gray-78 {
color: #ffffff !important;
}
.bga-latest-news__item.bga-button-clean.svelte-1c7gchg.transition-opacity.duration-500 {
background-color: rgba(45, 45, 45, 0.9) !important;
color: #ffffff !important;
}
.bga-game-option-item-bool.svelte-n7lgf1 {
background-image: linear-gradient(0deg, #2a2a2a 0%, #333333 30%, #252525 100%) !important;
transition: all 0.3s ease-in-out !important;
}
.bga-game-option-item-bool.svelte-n7lgf1:hover {
transform: scale(1.02) !important;
box-shadow: inset 0 0 0.5rem rgba(255, 255, 255, 0.1) !important;
}
.bga-popup-modal__holder.relative.bg-white.dark\:bg-black.rounded-md.bga-modal-shadow.desktop\:w-fit.svelte-onjxky {
color: #ffffff !important;
--main-bg-colour: #1a1a1a !important;
background-color: #2d2d2d !important;
}
.bga-toggle__slider.svelte-116k02m.svelte-116k02m {
background: linear-gradient(180deg, #1a1a1a 0%, #2d2d2d 40%, #2d2d2d 60%, #1a1a1a 100%) !important;
transition: all 0.3s ease-in-out !important;
}
.bga-toggle.svelte-116k02m.svelte-116k02m {
background: none !important;
}
.bga-page-section>.bga-page-section__content {
background-color: #2d2d2d !important;
background-image: linear-gradient(180deg, #1a1a1a, #2d2d2d 1.875rem, #2d2d2d calc(100% - 0.9375rem), #333) !important;
}
.p-5.pb-0 {
color: #ffffff;
}
.factory-center {
background-color: #2d2d2d;
}
.bga-checkbox__label.flex-1.text-lg.svelte-14fymqj {
font-size: 1.29375rem;
}
.bga-checkbox--checked.svelte-14fymqj .bga-checkbox.svelte-14fymqj {
background-color: #e0e0e0 !important;
}
.ml-3.my-4.tablet\:my-3.text-sm.font-bold.text-bga-blue.line-clamp-2 {
color: #00aaff !important;
transition: all 0.2s ease-in-out !important;
}
.ml-3.my-4.tablet\:my-3.text-sm.font-bold.text-bga-blue.line-clamp-2:hover {
transform: translateX(0.25rem) !important;
}
.bga-dropdown-option.bg-gray-200.px-3.svelte-szfc5g {
background-color: #2d2d2d !important;
}
.bga-dropdown-button-value.overflow-hidden.flex-1.relative.overflow-ellipsis.svelte-szfc5g {
background: linear-gradient(#555, #333) !important;
}
.bga-quick-play-widget.flex.items-center.mt-0\\.5.cursor-pointer {
background-color: #000000 !important;
}
.rank {
color: #ffffff;
}
.arena_points {
color: #ffffff;
font-size: 1.1em;
font-weight: bold;
letter-spacing: 0.03125rem;
transition: all 0.3s ease-in-out !important;
}
.arena_points:hover {
transform: scale(1.1) !important;
text-shadow: 0 0 0.5rem rgba(255, 255, 255, 0.5) !important;
}
.whiteblock.wikifootnote {
color: #f0f0f0 !important;
}
.whiteblock.wikifootnote a {
color: #4da6ff !important;
text-decoration: none;
transition: all 0.2s ease-in-out !important;
}
.whiteblock.wikifootnote a:hover {
color: #80c1ff !important;
text-decoration: underline;
transform: translateY(-0.0625rem) !important;
}
.whiteblock {
background: #2d2d2d;
}
.mcompact .player_area {
background: linear-gradient(-35deg,
rgba(20, 20, 20, .9),
rgba(51, 51, 51, .7) 24%,
rgba(30, 30, 30, .8) 82%,
rgba(40, 40, 40, .9)) !important;
backdrop-filter: blur(0.5em) !important;
}
.standard_popin_underlay {
background-color: #000;
}
.pagesection.reduced_width {
background-color: #1a1a1a !important;
}
.mw-parser-output {
color: #ffffff !important;
background-color: #1a1a1a !important;
}
.player-board, .roundedbox.player-board.spectator-mode * {
background-color: #000000;
}
.standard_popin_closeicon, .standard_popin_helpicon {
color: #0099ff !important;
transition: all 0.3s ease-in-out !important;
}
.standard_popin_closeicon:hover, .standard_popin_helpicon:hover {
transform: scale(1.3) rotate(90deg) !important;
}
.card_tt {
color: #000000 !important;
font-size: calc(var(--card-width) * .0575) !important;
overflow: visible !important;
}
.tooltiptitle {
font-size: 140% !important;
}
.card_title {
color: #ffffff !important;
font-weight: bold !important;
text-shadow: 0.0625rem 0.0625rem 0.125rem #000000, -0.0625rem -0.0625rem 0.125rem #000000, 0.0625rem -0.0625rem 0.125rem #000000, -0.0625rem 0.0625rem 0.125rem #000000 !important;
}
.tooltipcontainer {
background: #1a1a1a !important;
color: #ffffff !important;
background-image: none !important;
backdrop-filter: blur(0.75em) !important;
border: 0.0625rem solid rgba(255, 255, 255, 0.1) !important;
}
.standard_popin {
background: linear-gradient(180deg, #000000, #000000) !important;
}
.ingame.topbar_new_version {
background: linear-gradient(180deg, #000000, #000000) !important;
}
.fa.fa-volume-up.visible_if_logged.fa-lg,
.globalaction.globalaction_fullscreen.icon20.icon20_fullscreen_white.self-center,
.icon32.icon32_notes.self-center.top-0,
.fa.fa-bars.fa-lg {
color: #ffffff !important;
filter: brightness(2) !important;
transform: scale(1.3) !important;
}
.bgabutton_gray {
color: #ffffff !important;
background: #000000 !important;
}
#pagemaintitletext {
font-weight: bold;
color: var(--color-mapping_773300);
border: 0.0625rem solid #ffffff30;
text-shadow: 0 0 0.0625rem #ffffff, 0 0 0.125rem #ffffff;
transition: all 0.3s ease-in-out !important;
}
#pagemaintitletext:hover {
transform: scale(1.02) !important;
text-shadow: 0 0 0.125rem #ffffff, 0 0 0.25rem #ffffff !important;
}
#pagemaintitletext {
color: #ffffff !important;
}
.roundedbox.bga-game-zoom {
background-color: #1a1a1a !important;
}
.ingame.topbar_new_version.hide-alpha-banner {
background: none !important;
background-color: transparent !important;
background-image: none !important;
}
.roundedbox.bga-game-zoom {
zoom: 1.5 !important;
}
.desktop_version .season-progress-bar-wrap, .mobile_version .season-progress-bar-wrap {
background-color: #2d2d2d !important;
}
.pagesection__content, .portlet__content, .tips__content {
background-color: #000000 !important;
}
.bga-menu-bar.flex.svelte-1edikia {
background: #000000!important;
color: #000000;
--main-bg-colour: #000000;
--bga-hover-animated-border-color: #fff3;
--tw-shadow: 0 0 #0000;
margin: 0;
padding: 0;
font-family: Roboto,Arial,sans-serif;
font-size: 1rem;
}
.main-content, .content-area, #main-content {
background: #1a1a1a !important;
}
.homepage-section__content.rounded-md.mt-2.bg-bga-whitebg.p-3.bga-page-section-shadow {
color: #fff;
--main-bg-colour: #2d2d2d;
--bga-hover-animated-border-size: 0.1875rem;
--bga-hover-animated-border-speed: 300ms;
--bga-hover-animated-border-color: #fff3;
--fa-style-family-brands: "Font Awesome 6 Brands";
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
--fa-style-family-classic: "Font Awesome 6 Free";
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
font-family: Roboto,Arial,sans-serif;
font-size: 1rem;
visibility: visible;
--homepage-side-margins: 1.5rem;
--homepage-col-gap: 2.5rem;
--homepage-row-gap: 1.25rem;
--tw-shadow: 0 0 #0000;
margin: 0;
margin-top: .5rem;
border-radius: .375rem;
--tw-bg-opacity: 1;
background-color: #2d2d2d !important;
padding: .75rem;
box-shadow: 0.2rem 0.3rem 0.4rem 0.1rem rgba(255, 255, 255, 0.1);
}
.post.bga-hover-for-list {
--main-bg-colour: #2d2d2d;
--bga-hover-animated-border-size: 0.1875rem;
--bga-hover-animated-border-speed: 300ms;
--bga-hover-animated-border-color: #fff3;
--fa-style-family-brands: "Font Awesome 6 Brands";
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
--fa-style-family-classic: "Font Awesome 6 Free";
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
font-family: Roboto,Arial,sans-serif;
font-size: 1rem;
visibility: visible;
--homepage-side-margins: 1.5rem;
--homepage-col-gap: 2.5rem;
--homepage-row-gap: 1.25rem;
--tw-bg-opacity: 1;
--tw-text-opacity: 1;
color: #e0e0e0 !important;
--tw-shadow: 0 0 #0000;
clear: both;
position: relative;
border: unset;
margin: unset;
min-height: 4.75rem;
padding: unset;
padding-left: 0.3125rem;
padding-top: 0.25rem;
background: linear-gradient(180deg, #3d3d3d 20%, #2d2d2d 80%) !important;
cursor: pointer;
}
.p-3.bg-bga-whitebg.rounded-md.bga-page-section-shadow {
--main-bg-colour: #121212;
--bga-hover-animated-border-size: 0.1875rem;
--bga-hover-animated-border-speed: 300ms;
--bga-hover-animated-border-color: #fff3;
--fa-style-family-brands: "Font Awesome 6 Brands";
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
--fa-style-family-classic: "Font Awesome 6 Free";
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
font-family: Roboto,Arial,sans-serif;
font-size: 1rem;
visibility: visible;
--homepage-side-margins: 1.5rem;
--homepage-col-gap: 2.5rem;
--homepage-row-gap: 1.25rem;
font-weight: 700;
--tw-text-opacity: 1;
color: #ffffff !important;
--tw-shadow: 0 0 #0000;
margin: 0;
border-radius: .375rem;
--tw-bg-opacity: 1;
background-color: #121212 !important;
padding: .75rem;
box-shadow: 0.2rem 0.3rem 0.4rem 0.1rem rgba(255, 255, 255, 0.1);
}
.block.overflow-hidden.rounded-md.bg-bga-gray-233.bga-hover-for-list.cursor-pointer {
--main-bg-colour: #0a0a0a;
--bga-hover-animated-border-size: 0.1875rem;
--bga-hover-animated-border-speed: 300ms;
--bga-hover-animated-border-color: #fff3;
--fa-style-family-brands: "Font Awesome 6 Brands";
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
--fa-style-family-classic: "Font Awesome 6 Free";
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
font-family: Roboto,Arial,sans-serif;
font-size: 1rem;
visibility: visible;
--homepage-side-margins: 1.5rem;
--homepage-col-gap: 2.5rem;
--homepage-row-gap: 1.25rem;
font-weight: 700;
--tw-text-opacity: 1;
--tw-shadow: 0 0 #0000;
display: block;
cursor: pointer;
overflow: hidden;
border-radius: .375rem;
--tw-bg-opacity: 1;
background-color: #0a0a0a !important;
color: #ffffff !important;
text-decoration: none;
}
.gamename {
color: #a0d2ff !important;
}
.bg-bga-whitebg {
--tw-bg-opacity: 1;
background-color: #0a0a0a !important;
}
.bga-player-menu__top.bg-bga-whitebg.dark\:bg-bga-blackbg.svelte-1ri87l2 {
color: #ffffff !important;
--main-bg-colour: #f2f2f2;
--bga-hover-animated-border-size: 0.1875rem;
--bga-hover-animated-border-speed: 300ms;
--bga-hover-animated-border-color: #fff3;
--fa-style-family-brands: "Font Awesome 6 Brands";
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
--fa-style-family-classic: "Font Awesome 6 Free";
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
font-family: Roboto,Arial,sans-serif;
font-size: 1rem;
--tw-shadow: 0 0 #0000;
margin: 0;
padding: 0;
--tw-bg-opacity: 1;
background-color: #0a0a0a !important;
border-radius: 0 0 0.625rem 0.625rem;
box-shadow: rgba(255, 255, 255, 0.1) 0 0 0.3125rem;
}
.bga-link {
color: #4d8ee6 !important;
}
.text-bga-username {
--tw-text-opacity: 1;
color: #00e5de !important;
}
.text-gray-500 {
color: inherit !important;
}
.text-bga-gray-141 {
--tw-text-opacity: 1;
color: #e0e0e0 !important;
}
.bg-bga-gray-204 {
background-color: #111111 !important;
}
.bga-collapse-icon.svelte-1sfzrz0 {
background-image: none !important;
}
.bgabutton_blue {
color: #fff;
}
.even\:bg-bga-gray-233:nth-child(2n) {
background: none !important;
}
.bg-bga-gray-233 {
background: none !important;
}
.bga-progress-list__tournament-item-holder.svelte-1q31ptq {
min-width: 25rem;
flex: 1;
border-radius: 0.5rem;
overflow: hidden;
background: none !important;
}
.bga-omni-bar-panel-players__list.svelte-11apq7r > .svelte-11apq7r {
background: none !important;
}
.search-item--game.svelte-4occeg {
--tw-bg-opacity: 0 !important;
background-color: transparent !important;
}
.bga-omni-bar-results.svelte-ebwhm1.svelte-ebwhm1 {
top: 3.3125rem;
background-color: rgba(5, 5, 5, 0.6);
backdrop-filter: blur(1em) !important;
}
.pagesection__content.newsabstract {
color: #ffffff !important;
--main-bg-colour: #1a1a1a;
--bga-hover-animated-border-size: 0.1875rem;
--bga-hover-animated-border-speed: 300ms;
--bga-hover-animated-border-color: #fff3;
--fa-style-family-brands: "Font Awesome 6 Brands";
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
--fa-style-family-classic: "Font Awesome 6 Free";
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
font-family: Roboto,Arial,sans-serif;
visibility: visible;
font-size: 0.875rem;
--tw-shadow: 0 0 #0000;
margin: 0;
background-color: #1a1a1a !important;
border-radius: 0.3125rem;
box-shadow: 0.3125rem 0.3125rem 0.3125rem 0 rgba(255, 255, 255, 0.1);
padding: 0.75rem;
}
.portlet__content {
color: #ffffff !important;
--main-bg-colour: #1a1a1a;
--bga-hover-animated-border-size: 0.1875rem;
--bga-hover-animated-border-speed: 300ms;
--bga-hover-animated-border-color: #fff3;
--fa-style-family-brands: "Font Awesome 6 Brands";
--fa-font-brands: normal 400 1em/1 "Font Awesome 6 Brands";
--fa-font-regular: normal 400 1em/1 "Font Awesome 6 Free";
--fa-style-family-classic: "Font Awesome 6 Free";
--fa-font-solid: normal 900 1em/1 "Font Awesome 6 Free";
font-family: Roboto,Arial,sans-serif;
visibility: visible;
font-size: 0.875rem;
--tw-shadow: 0 0 #0000;
margin: 0;
background-color: #1a1a1a !important;
border-radius: 0.3125rem;
box-shadow: 0.3125rem 0.3125rem 0.3125rem 0 rgba(255, 255, 255, 0.1);
padding: 0.75rem;
}
.portlet__content {
color: #ffffff !important;
background-color: #1a1a1a !important;
}
.portlet__content * {
color: #ffffff !important;
}
.game_box_wrap, .tiny_verycompactlobby .game_box_wrap.expandedgame_box_wrap {
border: none !important;
}
.pagesection {
background-color: #000000d9;
}
.w-full.text-center.box-border {
background: rgba(45, 45, 45, 0.9) !important;
color: #ffffff !important;
}
[class*="bga-quick-play"] {
background: #000000 !important;
}
.chatwindowlogs {
background-color: #2d2d2d !important;
color: #ffffff !important;
border: 0.0625rem solid #666 !important;
backdrop-filter: blur(0.5em) !important;
}
.chatinput {
background-color: #2d2d2d !important;
color: #cccccc !important;
border-color: #666 !important;
transition: all 0.3s ease-in-out !important;
}
.chatinput:focus {
transform: scale(1.02) !important;
box-shadow: 0 0 0 0.125rem rgba(255, 255, 255, 0.1) !important;
}
.chatwindowlogs_zone {
scrollbar-color: #666 #2d2d2d !important;
}
.chatwindowlogs_zone::-webkit-scrollbar {
background-color: #2d2d2d !important;
}
.chatwindowlogs_zone::-webkit-scrollbar-thumb {
background-color: #666 !important;
}
.bga-dropdown-button-wrap.flex.svelte-szfc5g {
background: #2d2d2d !important;
}
.bga-dropdown-button-value.svelte-szfc5g.svelte-szfc5g {
background: linear-gradient(#555, #333) !important;
}
.bga-page-section>.bga-page-section__content {
background-color: #2d2d2d !important;
background-image: linear-gradient(180deg, #1a1a1a, #2d2d2d 1.875rem, #2d2d2d calc(100% - 0.9375rem), #333) !important;
}
.p-5.pb-0 {
color: #ffffff !important;
}
.bga-game-option-messages__option-description.svelte-13ocvdr {
background: linear-gradient(180deg, #2a2a2a 0rem, #333333 0.9375rem) !important;
}
.bga-game-option-item-choice__selector.svelte-1th7ay1 {
background-image: linear-gradient(0deg, #2a2a2a 0%, #333333 30%, #252525 100%) !important;
}
.bga-game-panel--status-tournaments.svelte-r3yse2 .bga-game-panel__content-divider-background.svelte-r3yse2, .bga-game-panel--status-quick-play.svelte-r3yse2 .bga-game-panel__content-divider-background.svelte-r3yse2, .bga-game-panel--status-arena.svelte-r3yse2 .bga-game-panel__content-divider-background.svelte-r3yse2 {
background: linear-gradient(rgb(45, 45, 45, 1), rgb(45, 45, 45, 0) 18.75rem) !important;
}
.flex-1.w-1 {
color: #ffffff !important;
}
.game-info__label.svelte-i1k73e {
color: #ffffff !important;
}
.game-info__value.flex.svelte-i1k73e {
color: #ffffff !important;
}
.w-16.pr-3.text-right {
color: #ffffff !important;
}
.bga-dropdown__options {
background: #2d2d2d !important;
color: #ffffff !important;
border: 0.0625rem solid #666 !important;
backdrop-filter: blur(0.75em) !important;
}
.bg-gray-200 {
background-color: rgba(45, 45, 45, var(--tw-bg-opacity)) !important;
}
.text-bga-blue {
color: rgba(0, 191, 255, var(--tw-text-opacity)) !important;
}
.even\:bg-bga-gray-211:nth-child(2n) {
background-color: rgba(45, 45, 45, var(--tw-bg-opacity)) !important;
}
[class*="pl-2"][class*="font-bold"] {
color: #ffffff !important;
}
.bga-lobby-table-item.svelte-1bum8hm.svelte-1bum8hm {
background: linear-gradient(to top, #000000 0%, #000000 100%) !important;
}
.text-gray-500 {
color: #ffffff !important;
}
.bg-bga-gray-244 {
background-color: rgba(45, 45, 45, var(--tw-bg-opacity)) !important;
}
.flex-1.text-center {
color: #00ffff !important;
}
.uppercase {
color: #00ffff !important;
}
.hover\:bg-bga-gray-211:hover {
background-color: rgba(25, 25, 112, var(--tw-bg-opacity)) !important;
}
.m-4.italic {
color: #ffffff !important;
}
.table_ref_item,
.link_lang,
.cf_tooltip_quote,
.rankdetails,
.score,
.pagesection__title,
.bga-game-option-item-major__option-text.svelte-1v1wtnj,
.bga-dropdown-button-value div,
.bga-dropdown-button-value div[slot="option-selected"],
.bga-dropdown-button-wrap flex svelte-szfc5g,
.bga-page-section__title,
.ml-7.text-bga-gray-171.bga-game-option-messages__option-description.cursor-default.svelte-13ocvdr.mr-24,
.px-4.desktop\:px-24.mb-3.text-xl.desktop\:text-2xl.font-bold.text-gray-600,
.flex.whitespace-nowrap.items-center {
color: #ffff00 !important;
}
.bga-game-option-item-major__option.svelte-1v1wtnj.bga-game-option-item-major__option--selected {
background-image: linear-gradient(to bottom, rgba(58, 42, 106, 0.9), transparent) !important;
}
.bga-game-option-item-major__subtitle.flex-1.w-0.svelte-1v1wtnj {
background-image: linear-gradient(0deg, #2a2a2a 0%, #333333 30%, #252525 100%) !important;
color: #ffffff !important;
}
.text-bga-gray-171,
.whitespace-pre-wrap {
color: #ffffff !important;
}
.bga-popup-modal__holder.relative.bg-white.dark\:bg-black.rounded-md.bga-modal-shadow.desktop\:w-fit.svelte-onjxky {
background: #1a1a1a !important;
background-color: #1a1a1a !important;
color: #ffffff !important;
box-shadow: 0 0.375rem 1.25rem #000 !important;
--main-bg-colour: #0a0a0a !important;
--bga-hover-animated-border-color: #fff3 !important;
}
.text-center mt-4,
.px-3,
.row-label,
.smalltext,
.pagesection__content,
.pr-4,
.postmessage {
color: #ffffff !important;
}
.statstable th {
background-color: #2d2d2d !important;
}
.tundra .dijitSelect .dijitButtonContents,
.grid.svelte-1utb1ny>div.svelte-1utb1ny:nth-child(6n-2),
.grid.svelte-1utb1ny>div.svelte-1utb1ny:nth-child(6n) {
background: #000000 !important;
}
.bg-gradient-to-b {
background-image: linear-gradient(to bottom, #1a1a1a, #2d2d2d) !important;
}
.bga-homepage-games-recommandations__menu-item.bga-homepage-games-recommandations__menu-item--highlighted.svelte-n13xz2,
.bga-homepage-achievements__label.svelte-117xadk.svelte-117xadk.svelte-117xadk {
color: rgba(255, 255, 0, var(--tw-text-opacity)) !important;
}
.bga-premium-page-section--full.order-2.svelte-1lcvrll {
background: linear-gradient(0deg, #2a2a2a 0%, #1a1a1a 5%, #1a1a1a 95%, #2a2a2a) !important;
}
.text-gray-600.mt-2.text-sm {
color: rgba(255, 255, 0, var(--tw-text-opacity)) !important;
}
.roundedboxinner {
color: white !important;
font-weight: 300 !important;
}
.player_score {
color: white !important;
font-weight: 300 !important;
}
#page-title {
background-image:
linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
url(img/background_grey.jpg);
background-blend-mode: darken;
}
.mns_special_button {
color: white !important;
}
.mns_panel_toggle_text {
color: white !important;
}
.player-board {
background:
linear-gradient(rgba(0, 0, 0, 0.6), rgba(0, 0, 0, 0.6)),
url(img/background_grey.jpg) !important;
}
.cf_title {
background: black !important;
}
.cf_tooltip {
background: #111 !important;
color: white !important;
}
.row-value {
color: white !important;
}
.board_readonly .comment {
background: #1a1a1a !important;
}
.bga-mobile-sub-bar .text-xl {
font-size: 1.5rem !important;
}
.bubblebanner.bga-link-inside {
background-color: #2c2c2c !important;
}
html {
color: #ffffff !important;
background: #000 !important;
}
.beta-banner__gradient .topbar_left_content {
background: linear-gradient(to bottom, #4c1d95, #581c87, #3b0764)
}
#topbar.beta-banner__gradient .alpha-beta-banner__triangle-corner {
background: linear-gradient(135deg, #fbbf24, #fbbf24 50%, rgba(215, 159, 23, 0.7) 0, #d79f1740 62%);
box-shadow: 0 0.1875rem 0.625rem rgba(251, 191, 36, 0.3);
}
.wannaplay_mask_button.del_favorite {
background-color: #8a2be2 !important;
font-size: 1.5625rem;
transition: all 0.3s ease-in-out !important;
}
.wannaplay_mask_button.del_favorite:hover {
transform: scale(1.1) rotate(5deg) !important;
}
.del_favorite i.fa-heart {
color: #ffd700 !important;
}
.gamerank_apprentice {
background-color: #74bed1 !important;
}
.wannaplay_mask_button.wannaplayauto_pref {
background: linear-gradient(135deg, #2c3e50, #4a5f7a) !important;
}
.mobile_version.chatbar_ontop #chatbar_inner:before {
background: transparent !important;
}
.bga-menu-bar-items__menu-item.bga-link.truncate.svelte-1duixkh {
background-image: none !important;
background: none !important;
}
.bga-table-list-item__status-mode-icon.svelte-1yag60g.svelte-1yag60g {
background-color: #000000 !important;
color: rgba(255, 255, 255, 0.9) !important;
}
.bga-table-list-item__main.svelte-1yag60g.svelte-1yag60g {
background-color: #000000 !important;
}
.bga-table-list-item__progress-bar-inner.svelte-1yag60g.svelte-1yag60g {
background: linear-gradient(to bottom, rgba(128, 0, 128, 0.8) 85%, rgba(88, 0, 88, 0.9) 100%) !important;
}
.bga-table-list-item__progress-bar-inner.svelte-1yag60g.svelte-1yag60g * {
color: #ffd700 !important;
}
.bga-table-list-item__players-list.svelte-1yag60g.svelte-1yag60g {
background: linear-gradient(to bottom, #2a2a2a, #1a1a1a) !important;
}
.playername {
color: #00FFFF !important;
transition: all 0.2s ease-in-out !important;
}
.playername:hover {
color: #ffd700 !important;
transform: translateY(-0.0625rem) !important;
}
.head_info {
background-color: rgba(0, 0, 0, 0.8) !important;
border-radius: 0.5em !important;
backdrop-filter: blur(0.5em) !important;
}
.notouch-device .bga-hover-for-list:hover {
background:
url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='90'%3E%3Ctext x='50%' y='50%' font-family='Arial' font-size='72' font-weight='bold' fill='black' text-anchor='middle' dominant-baseline='middle' opacity='0.2'%3EBGA%3C/text%3E%3C/svg%3E"),
linear-gradient(to bottom, rgba(0, 0, 0, 0.9), rgba(40, 40, 40, 0.8)) !important;
background-size: 11.25rem 5.625rem, 100% 100% !important;
background-repeat: no-repeat !important;
background-position: center !important;
transform: translateY(-0.125rem) scale(1.02) !important;
box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.3) !important;
}
#topbar {
background: linear-gradient(135deg,
#0a0a0a 0%,
#111111 25%,
#1a1a1a 50%,
#111111 75%,
#0a0a0a 100%) !important;
}
.roundedbox_topmain,
.roundedbox .roundedbox_bottommain {
background-color: #2d2a24 !important;
}
