html.wb-dm {
  --wb-bfc: #c9c9ce;
  --wb-fcs: #f4f4f5;
  --wb-wk: #8b8b92;
  --wb-wke: #a8a8ae;
  --wb-bgc: #151517;
  --wb-bbc: #2a2a2e;
  --wb-bgcl: #0b0b0c;
  --wb-footer-bgc: #080809;
  --wb-page-bgc: #050505;
  --wb-theme-color: #c8ff00;
  --wb-theme-hover-color: #ddff59;
  background: #050505;
  color-scheme: dark;
}

.wb-dm body {
  background-color: var(--wb-page-bgc);
  color: var(--wb-bfc);
}

.wb-dm a {
  color: var(--wb-bfc);
}

.wb-dm a:hover,
.wb-dm .link,
.wb-dm .more-link {
  color: var(--wb-theme-color);
}

.wb-dm ::selection {
  background: var(--wb-theme-color);
  color: #050505;
}

.wb-dm .header {
  background-color: #080809;
  box-shadow: 0 1px 0 var(--wb-bbc);
}

.wb-dm .logo a,
.wb-dm .logo strong {
  color: #f7f7f8;
}

.wb-dm .header .search-form {
  background-color: #171719;
  border-color: #303034;
}

.wb-dm .header .search-form .form-control,
.wb-dm .header .search-form .ux-drop-value span {
  color: #c9c9ce;
}

.wb-dm .header .search-form .form-control::placeholder {
  color: #727278;
}

.wb-dm .header .search-form .ux-select,
.wb-dm .nav-top .sub-menu,
.wb-dm .nav-top .sub-menu::after,
.wb-dm .nav-top .sub-menu::before,
.wb-dm .more-info-panel,
.wb-dm .more-info-panel::after,
.wb-dm .more-info-panel::before {
  background-color: #121214;
  border-color: #303034;
  box-shadow: 0 10px 30px rgba(0, 0, 0, .45);
}

.wb-dm .top-links .link,
.wb-dm .top-links .user-name,
.wb-dm .nav-top .nav > li > a {
  color: #b9b9bf;
}

.wb-dm .nav-top .nav > li.active > a,
.wb-dm .nav-top .nav > li.active > a:hover {
  color: #fff;
}

.wb-dm .nav-top .nav > li > a:hover,
.wb-dm .top-links .link:hover,
.wb-dm .top-links .user-name:hover {
  color: var(--wb-theme-color);
}

.wb-dm .top-links .btn-join-vip,
.wb-dm .top-links .btn-join-vip:hover {
  background-color: var(--wb-theme-color);
  border-color: var(--wb-theme-color);
  color: #050505;
}

.wb-dm .site-promo-shell {
  background: #080809;
}

.wb-dm .site-promo {
  background: var(--wb-theme-color);
  border: 1px solid var(--wb-theme-color);
  color: #050505;
}

.wb-dm .site-promo-badge {
  background: #050505;
  color: #fff;
}

.wb-dm .site-promo-copy b,
.wb-dm .site-promo-copy span {
  color: #050505;
}

.wb-dm .site-promo-action {
  background: #050505;
  border-color: #050505;
  color: #fff;
}

.wb-dm .site-promo-action:hover {
  background: #202024;
  border-color: #202024;
  color: #fff;
}

.wb-dm .site-promo-close span::before,
.wb-dm .site-promo-close span::after {
  background: #050505;
}

html.wb-dm body .header > .inner .search-form > input.form-control {
  appearance: none;
  background: transparent;
  border: 0;
  box-shadow: none;
  display: block;
  margin: 0;
}

html.wb-dm body .header > .inner .search-form > input.form-control:focus {
  background: transparent;
  box-shadow: none;
}

.wb-dm .container,
.wb-dm .container-index,
.wb-dm .container-archive,
.wb-dm .main-detail,
.wb-dm .main-list {
  background-color: var(--wb-page-bgc);
}

.wb-dm .aside-tool,
.wb-dm .widget,
.wb-dm .widget-hot-app .inner,
.wb-dm .with-border-box,
.wb-dm .media-pic,
.wb-dm .detail-box,
.wb-dm .res-detail-box,
.wb-dm .post-detail,
.wb-dm .sc-comments,
.wb-dm .comment-form,
.wb-dm .wbui-dialog .wbui-child {
  background-color: var(--wb-bgcl);
  border-color: var(--wb-bbc);
}

.wb-dm .aside-tool,
.wb-dm .widget,
.wb-dm .widget-hot-app .inner,
.wb-dm .detail-box,
.wb-dm .res-detail-box {
  box-shadow: none;
}

/* Knowledge lists inherit a light-theme hover fill from channel.css. Keep
 * pointer, touch and keyboard interaction on the same dark surface. */
html.wb-dm body .knowledge .list-knowledge .inner:hover,
html.wb-dm body .knowledge .list-knowledge .inner:active,
html.wb-dm body .knowledge .list-knowledge .inner:focus-within,
html.wb-dm body .knowledge .list-blog.list-mode-b .inner:hover,
html.wb-dm body .knowledge .list-blog.list-mode-b .inner:active,
html.wb-dm body .knowledge .list-blog.list-mode-b .inner:focus-within {
  background-color: transparent !important;
  box-shadow: none !important;
}

.wb-dm .btn-load-more,
.wb-dm .btn-default,
.wb-dm .wbs-btn-reset,
.wb-dm .comment-form .form-control,
.wb-dm .textarea-comments,
.wb-dm input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="button"]),
.wb-dm select,
.wb-dm textarea {
  background-color: #121214;
  border-color: #303034;
  color: #e7e7e9;
}

.wb-dm input::placeholder,
.wb-dm textarea::placeholder {
  color: #707077;
}

.wb-dm .btn-load-more:hover,
.wb-dm .btn-default:hover {
  background-color: #1b1b1e;
  border-color: #444449;
  color: #fff;
}

.wb-dm .wb-btn.btn-primary,
.wb-dm .wb-btn-primary,
.wb-dm .wbs-btn-primary,
.wb-dm .wb-btn-download,
.wb-dm .wb-btn-download span,
.wb-dm button.btn-primary,
.wb-dm input[type="submit"] {
  color: #050505;
}

.wb-dm .wb-btn.btn-primary svg,
.wb-dm .wb-btn-primary svg,
.wb-dm .wbs-btn-primary svg,
.wb-dm .wb-btn-download svg,
.wb-dm button.btn-primary svg {
  fill: #050505;
  stroke: #050505;
}

/* Download controls have component-specific white text/icon rules. Keep the
 * bright dark-mode accent button readable in the download popup and widget. */
html.wb-dm .widget-download .wb-btn-download,
html.wb-dm .widget-download .wb-btn-download:hover,
html.wb-dm .widget-download .wb-btn-download:active,
html.wb-dm .widget-download .wb-btn-download:focus,
html.wb-dm .wbdl-dialog .wb-btn-download,
html.wb-dm .wbdl-dialog .wb-btn-download:hover,
html.wb-dm .wbdl-dialog .wb-btn-download:active,
html.wb-dm .wbdl-dialog .wb-btn-download:focus,
html.wb-dm .dlipp-cont-wp .wb-btn-download,
html.wb-dm .dlipp-cont-wp .wb-btn-download:hover,
html.wb-dm .dlipp-cont-wp .wb-btn-download:active,
html.wb-dm .dlipp-cont-wp .wb-btn-download:focus {
  color: #050505 !important;
}

html.wb-dm .widget-download .wb-btn-download span,
html.wb-dm .widget-download .wb-btn-download:hover span,
html.wb-dm .widget-download .wb-btn-download:active span,
html.wb-dm .widget-download .wb-btn-download:focus span,
html.wb-dm .wbdl-dialog .wb-btn-download span,
html.wb-dm .wbdl-dialog .wb-btn-download:hover span,
html.wb-dm .wbdl-dialog .wb-btn-download:active span,
html.wb-dm .wbdl-dialog .wb-btn-download:focus span,
html.wb-dm .dlipp-cont-wp .wb-btn-download span,
html.wb-dm .dlipp-cont-wp .wb-btn-download:hover span,
html.wb-dm .dlipp-cont-wp .wb-btn-download:active span,
html.wb-dm .dlipp-cont-wp .wb-btn-download:focus span {
  color: #050505 !important;
}

html.wb-dm .widget-download .wb-btn-download svg,
html.wb-dm .widget-download .wb-btn-download:hover svg,
html.wb-dm .widget-download .wb-btn-download:active svg,
html.wb-dm .widget-download .wb-btn-download:focus svg,
html.wb-dm .wbdl-dialog .wb-btn-download svg,
html.wb-dm .wbdl-dialog .wb-btn-download:hover svg,
html.wb-dm .wbdl-dialog .wb-btn-download:active svg,
html.wb-dm .wbdl-dialog .wb-btn-download:focus svg,
html.wb-dm .dlipp-cont-wp .wb-btn-download svg,
html.wb-dm .dlipp-cont-wp .wb-btn-download:hover svg,
html.wb-dm .dlipp-cont-wp .wb-btn-download:active svg,
html.wb-dm .dlipp-cont-wp .wb-btn-download:focus svg {
  fill: #050505 !important;
  stroke: #050505 !important;
}

/* Version-list buttons keep dark content on the bright download background. */
.wbdl-dialog-list .table-version .btn-sm,
.wbdl-dialog-list .table-version .btn-sm:hover,
.wbdl-dialog-list .table-version .btn-sm:active,
.wbdl-dialog-list .table-version .btn-sm:focus {
  --wbsico-bd-color-a: #050505;
  --wbsico-bd-color-b: #050505;
  color: #050505 !important;
}

.wbdl-dialog-list .table-version .btn-sm span,
.wbdl-dialog-list .table-version .btn-sm .wb-icon,
.wbdl-dialog-list .table-version .btn-sm svg,
.wbdl-dialog-list .table-version .btn-sm use {
  color: #050505 !important;
  fill: #050505 !important;
  stroke: #050505 !important;
}

html.wb-dm .wbdl-dialog-list .wbdl-main .link svg {
  color: #050505 !important;
  fill: #050505 !important;
  stroke: #050505 !important;
}

.wb-dm .widget-social,
.wb-dm .widget-social a,
.wb-dm .widget-social span,
.wb-dm .wb-share-poster,
.wb-dm .wb-share-list .share-logo {
  color: #a7a7ad;
}

.wb-dm .widget-social svg,
.wb-dm .wb-share-poster svg,
.wb-dm .wb-share-list .share-logo svg {
  fill: #a7a7ad;
}

.wb-dm .widget-social a:hover,
.wb-dm .wb-share-poster:hover,
.wb-dm .wb-share-list .share-logo:hover {
  color: var(--wb-theme-color);
}

.wb-dm .widget-social a:hover svg,
.wb-dm .wb-share-poster:hover svg,
.wb-dm .wb-share-list .share-logo:hover svg {
  fill: var(--wb-theme-color);
}

.wb-dm .section-title,
.wb-dm .aside-head h3,
.wb-dm .widget .widgettitle,
.wb-dm .widget h3,
.wb-dm .post-title,
.wb-dm .entry-title,
.wb-dm .detail-title,
.wb-dm .title-comments {
  color: var(--wb-fcs);
}

.wb-dm .post-metas,
.wb-dm .meta,
.wb-dm .description,
.wb-dm .en-text,
.wb-dm .copyright,
.wb-dm .copyright a {
  color: var(--wb-wk);
}

.wb-dm .bread-crumbs,
.wb-dm .bread-crumbs .inner,
.wb-dm .footer,
.wb-dm .footer .ft-inner {
  background-color: var(--wb-footer-bgc);
  border-color: var(--wb-bbc);
}

.wb-dm .tool-bar .tb-item,
.wb-dm .tool-bar .social-item {
  background-color: #0d0d0f;
  border-color: #303034;
}

.wb-dm .tool-bar .tb-item:hover {
  background-color: #1a1a1d;
}

.wb-dm .tool-bar .dm-switch,
.wb-dm .tool-bar .dm-switch:hover {
  background-color: var(--wb-theme-color);
  border-color: var(--wb-theme-color);
}

.wb-dm .tool-bar .dm-switch svg,
.wb-dm .tool-bar .dm-switch:hover svg {
  fill: #050505;
  --dms-color1: #050505;
  --dms-color2: var(--wb-theme-color);
}

.wb-dm .wb-navigation a.current,
.wb-dm .wb-navigation .current,
.wb-dm .pagination .current,
.wb-dm .tab-nav-item.current,
.wb-dm .active > a {
  border-color: var(--wb-theme-color);
  color: var(--wb-theme-color);
}

.wb-dm .wb-navigation a,
.wb-dm .wb-navigation span,
.wb-dm .wb-navigation strong,
.wb-dm .wb-navigation a.current,
.wb-dm .wb-navigation .current {
  color: #050505;
}

.wb-dm hr,
.wb-dm table td,
.wb-dm table th,
.wb-dm .nav-ft,
.wb-dm .sc-links,
.wb-dm .tab-navs::before {
  border-color: var(--wb-bbc);
}

.wb-dm svg {
  --dms-color1: #9a9aa0;
}

html.wb-dm body .container-member {
  background-color: var(--wb-page-bgc);
}

html.wb-dm body .container-member .side-mb,
html.wb-dm body .container-member .main-mb {
  background-color: var(--wb-bgcl);
  border: 1px solid var(--wb-bbc);
  box-shadow: none;
}

html.wb-dm body .container-member .wb-form-mb .form-control,
html.wb-dm body .container-member .wb-form-mb .form-textarea,
html.wb-dm body .container-member .wb-form-mb select,
html.wb-dm body .container-member .avatar-wrapper,
html.wb-dm body .container-member .main-new-ow .ass-items,
html.wb-dm body .container-member .main-new-ow .faq-tips {
  background-color: #121214;
  border-color: #303034;
  color: #e7e7e9;
  box-shadow: none;
}

html.wb-dm body .container-member .table-data-list tbody,
html.wb-dm body .container-member .favorites-list .post {
  background-color: var(--wb-bgcl);
}

html.wb-dm body .container-member .table-data-list tbody tr:hover td,
html.wb-dm body .container-member .table-data-list tbody tr:hover th,
html.wb-dm body .container-member .favorites-list .post:hover,
html.wb-dm body .container-member .mb-nav-cells li:active {
  background-color: #171719;
}

html.wb-dm body .container-member .table-data-list .order-status.no-pay,
html.wb-dm body .container-member .favorites-list .post .media-pic {
  background-color: #1b1b1e;
}

/* Archive headers should stay within the dark palette; reserve the theme
 * color for a restrained accent instead of filling the entire banner. */
.wb-dm .title-list,
.wb-dm .title-list-box {
  background-color: #1f1d1a !important;
  background-image: none !important;
  border-bottom: 1px solid #36322e;
  color: #f2f4f7;
}

.wb-dm .title-list::before,
.wb-dm .title-list-box::before {
  background-color: transparent;
}

.wb-dm .title-list .description,
.wb-dm .title-list-box .description {
  color: #8d98a8;
}

html.wb-dm {
  scrollbar-color: #55575b #151515;
  scrollbar-width: thin;
}

html.wb-dm::-webkit-scrollbar {
  background: #151515;
  height: 8px;
  width: 8px;
}

html.wb-dm::-webkit-scrollbar-track {
  background: #151515;
}

html.wb-dm::-webkit-scrollbar-thumb {
  background: #55575b;
  border: 2px solid #151515;
  border-radius: 4px;
}

html.wb-dm::-webkit-scrollbar-thumb:hover {
  background: #696b70;
}

/* Magicpost actions use their own theme variable; keep them neutral in dark mode. */
html.wb-dm .wbp-cbm-magicpost,
html.wb-dm .wbp-dwqr-sticky {
  --dwqr-theme: #b8bdc6;
  --dwqr-theme-color: #b8bdc6;
  --dwqr-theme-hover-color: var(--wb-theme-color);
  --baseBgColor: var(--wb-bbc);
}

html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr {
  background-color: #121214 !important;
  border-color: #4a4d52 !important;
}

html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr span,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr span {
  color: #b8bdc6 !important;
}

html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr svg,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr svg {
  fill: #b8bdc6 !important;
}

html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr:hover,
html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr:active,
html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr.active,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr:hover,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr:active,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr.active {
  background-color: var(--wb-theme-color) !important;
  border-color: var(--wb-theme-color) !important;
}

html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr:hover span,
html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr:active span,
html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr.active span,
html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr:hover svg,
html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr:active svg,
html.wb-dm .wbp-cbm-magicpost .wb-btn-dwqr.active svg,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr:hover span,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr:active span,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr.active span,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr:hover svg,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr:active svg,
html.wb-dm .wbp-dwqr-sticky .wb-btn-dwqr.active svg {
  color: #050505 !important;
  fill: #050505 !important;
}

@media (max-width: 768px) {
  .wb-dm .nav-top-m {
    background: #09090a;
    border-right: 1px solid var(--wb-bbc);
  }

  .wb-dm .nav-m a {
    color: #c9c9ce;
  }
}

/* Keep only version download buttons readable; footer notice links stay themed. */
html.wb-dm .wbui.wbdl-dialog .wbui-child.wbdl-dialog-list #WB_versionTable a.wb-btn.btn-sm,
html.wb-dm .wbui.wbdl-dialog .wbui-child.wbdl-dialog-list #WB_versionTable a.wb-btn.btn-sm:hover,
html.wb-dm .wbui.wbdl-dialog .wbui-child.wbdl-dialog-list #WB_versionTable a.wb-btn.btn-sm:active,
html.wb-dm .wbui.wbdl-dialog .wbui-child.wbdl-dialog-list #WB_versionTable a.wb-btn.btn-sm:focus {
  --wbsico-bd-color-a: #050505;
  --wbsico-bd-color-b: #050505;
  color: #050505 !important;
}

html.wb-dm .wbui.wbdl-dialog .wbui-child.wbdl-dialog-list #WB_versionTable a.wb-btn.btn-sm span,
html.wb-dm .wbui.wbdl-dialog .wbui-child.wbdl-dialog-list #WB_versionTable a.wb-btn.btn-sm svg,
html.wb-dm .wbui.wbdl-dialog .wbui-child.wbdl-dialog-list #WB_versionTable a.wb-btn.btn-sm use {
  color: #050505 !important;
  fill: #050505 !important;
  stroke: #050505 !important;
}