html,
body,
#root {
  min-height: 100%;
  background: #05070b !important;
}

body {
  color: #e8fbff !important;
  overflow-x: hidden !important;
  background:
    linear-gradient(115deg, rgba(38, 255, 210, .08), transparent 31%),
    linear-gradient(245deg, rgba(91, 141, 255, .12), transparent 36%),
    linear-gradient(180deg, #05070b 0%, #071018 48%, #03070b 100%) !important;
}

body:before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(120, 255, 232, .055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(120, 255, 232, .055) 1px, transparent 1px);
  background-size: 40px 40px;
  mask-image: linear-gradient(to bottom, rgba(0, 0, 0, .82), transparent 92%);
}

.semi-layout,
.semi-layout-content,
.semi-navigation,
.semi-navigation-list-wrapper,
.semi-tabs-content,
.semi-tabs-pane,
main {
  background: transparent !important;
}

.semi-layout-header,
header.text-semi-color-text-0,
.semi-navigation-header,
.semi-navigation-footer,
.sidebar-container,
.sidebar-nav {
  background: rgba(5, 10, 17, .86) !important;
  border-color: rgba(113, 255, 226, .14) !important;
  box-shadow: 0 14px 40px rgba(0, 0, 0, .28) !important;
  backdrop-filter: blur(18px);
}

.semi-layout-header a,
.semi-layout-header span,
.semi-layout-header .semi-typography {
  color: rgba(229, 251, 255, .82) !important;
}

.semi-layout-header nav a:not(.gb-nav-active):not(.gb-auth-login):not(.gb-auth-register),
header nav a:not(.gb-nav-active):not(.gb-auth-login):not(.gb-auth-register) {
  color: rgba(229, 251, 255, .82) !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

.semi-layout-header nav a.gb-nav-active:not(.gb-auth-login):not(.gb-auth-register),
header nav a.gb-nav-active:not(.gb-auth-login):not(.gb-auth-register) {
  color: #001815 !important;
  background: linear-gradient(90deg, rgba(45, 255, 210, .95), rgba(116, 168, 255, .95)) !important;
  border: 1px solid rgba(196, 255, 247, .64) !important;
  border-radius: 8px !important;
  box-shadow: 0 10px 26px rgba(45, 255, 215, .2) !important;
}

.semi-layout-header nav a.gb-nav-active:not(.gb-auth-login):not(.gb-auth-register) *,
header nav a.gb-nav-active:not(.gb-auth-login):not(.gb-auth-register) * {
  color: #001815 !important;
}

.semi-layout-header a.gb-auth-login,
header a.gb-auth-login {
  min-width: 72px !important;
  height: 34px !important;
  padding: 0 14px !important;
  margin-right: 10px !important;
  color: #001815 !important;
  font-weight: 800 !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
  border: 1px solid rgba(196, 255, 247, .78) !important;
  border-radius: 999px !important;
  box-shadow: 0 14px 34px rgba(45, 255, 215, .28), inset 0 1px rgba(255, 255, 255, .18) !important;
}

.semi-layout-header a.gb-auth-login *,
header a.gb-auth-login * {
  color: #001815 !important;
}

.semi-layout-header a.gb-auth-login .semi-button,
header a.gb-auth-login .semi-button {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

.semi-layout-header a.gb-auth-register,
header a.gb-auth-register {
  margin-left: 0 !important;
}

.semi-layout-header a.gb-auth-register .semi-button,
header a.gb-auth-register .semi-button {
  min-width: 82px !important;
  border-radius: 999px !important;
}

.semi-layout-header a:hover,
.semi-layout-header .semi-button:hover span,
.semi-layout-header .semi-button:hover svg {
  color: #7dffe9 !important;
}

.semi-card,
.semi-table,
.semi-table-container,
.semi-modal-content,
.semi-sidesheet-content,
.semi-collapse,
.semi-tabs-bar,
.table-scroll-card,
[class*="card"],
[class*="Card"] {
  background: linear-gradient(180deg, rgba(11, 25, 37, .92), rgba(4, 12, 20, .94)) !important;
  border: 1px solid rgba(128, 244, 230, .18) !important;
  box-shadow: 0 18px 54px rgba(0, 0, 0, .28), inset 0 1px rgba(255, 255, 255, .055) !important;
}

.semi-card,
.semi-table-container,
.semi-modal-content,
.semi-sidesheet-content,
.table-scroll-card {
  border-radius: 8px !important;
}

.semi-card-body,
.semi-card-header,
.semi-card-footer,
.semi-table-thead > .semi-table-row > .semi-table-row-head,
.semi-table-tbody > .semi-table-row > .semi-table-row-cell {
  background: transparent !important;
  border-color: rgba(132, 255, 233, .11) !important;
}

.semi-table-thead > .semi-table-row > .semi-table-row-head {
  color: rgba(190, 255, 244, .88) !important;
  background: rgba(35, 255, 214, .07) !important;
}

.semi-table-tbody > .semi-table-row:hover > .semi-table-row-cell,
.semi-list-item:hover,
.semi-navigation-item:hover,
.semi-tabs-tab:hover {
  background: rgba(51, 255, 218, .075) !important;
}

.semi-button-primary,
.semi-button-primary:not(.semi-button-disabled) {
  color: #03110f !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
  border-color: rgba(124, 255, 232, .45) !important;
  box-shadow: 0 12px 32px rgba(45, 255, 215, .2) !important;
}

.semi-button-primary *,
.semi-button-primary .semi-button-content,
.semi-button-primary .semi-button-content span {
  color: #03110f !important;
}

.semi-button-primary:hover,
.semi-button-primary:not(.semi-button-disabled):hover {
  background: linear-gradient(90deg, #84ffe9, #a6c4ff) !important;
  border-color: rgba(168, 255, 241, .7) !important;
}

form .semi-button-primary,
button.semi-button-primary.w-full {
  min-height: 38px !important;
  color: #001815 !important;
  font-weight: 900 !important;
  border: 1px solid rgba(188, 255, 245, .68) !important;
  box-shadow: 0 16px 38px rgba(45, 255, 215, .24), 0 0 0 1px rgba(255, 255, 255, .08) inset !important;
}

.semi-button-tertiary,
.semi-button-outline,
.semi-button-borderless {
  color: rgba(225, 250, 255, .86) !important;
  border-color: rgba(130, 255, 231, .16) !important;
}

.semi-button-tertiary:hover,
.semi-button-outline:hover,
.semi-button-borderless:hover {
  color: #f2fdff !important;
  background: rgba(42, 255, 215, .1) !important;
  border-color: rgba(126, 255, 232, .34) !important;
}

.semi-button,
.semi-input-wrapper,
.semi-select,
.semi-tagInput,
.semi-input-textarea-wrapper,
.semi-datepicker-range-input,
.semi-radio,
.semi-tabs-tab-button,
.semi-page-item {
  border-radius: 8px !important;
  border-color: rgba(130, 255, 231, .18) !important;
}

.semi-input-wrapper,
.semi-select,
.semi-tagInput,
.semi-input-textarea-wrapper,
.semi-datepicker-range-input {
  color: #e8fbff !important;
  background: rgba(5, 17, 27, .84) !important;
}

.semi-input,
.semi-input::placeholder,
.semi-select-selection-text,
.semi-form-field-label,
.semi-form-field-label-text {
  color: rgba(231, 250, 255, .78) !important;
}

.gb-login-note {
  margin: -2px 0 10px;
  padding: 9px 11px;
  color: rgba(207, 244, 250, .82);
  font-size: 12px;
  line-height: 18px;
  background: rgba(10, 31, 43, .72);
  border: 1px solid rgba(118, 255, 232, .22);
  border-radius: 8px;
}

.semi-tag,
[class*="badge"],
[class*="Badge"] {
  color: #dffaff !important;
  border-color: rgba(118, 255, 232, .34) !important;
  background: rgba(8, 28, 38, .86) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .06) !important;
}

h1,
h2,
h3,
h4,
.semi-typography,
.semi-card-header-wrapper-title {
  letter-spacing: 0 !important;
}

h1,
h2,
h3,
h4,
.text-gray-900,
.text-gray-800,
.text-semi-color-text-0,
.semi-typography-primary,
.semi-card-header-wrapper-title {
  color: #f1fdff !important;
}

.text-gray-700,
.text-gray-600,
.text-semi-color-text-1,
.semi-typography-secondary,
[style*="--semi-color-text-1"] {
  color: rgba(205, 233, 241, .78) !important;
}

.text-gray-500,
.text-gray-400,
.text-semi-color-text-2,
[style*="--semi-color-text-2"] {
  color: rgba(177, 212, 224, .64) !important;
}

.blur-ball,
.with-pastel-balls:before,
footer .absolute {
  display: none !important;
}

.semi-layout-footer,
.semi-layout-footer > div,
.semi-layout-footer footer,
footer.semi-layout-footer {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.custom-footer {
  display: none !important;
}

.gb-mobile-login-action {
  display: none;
}

.pricing-pagination-divider {
  border-color: rgba(120, 255, 232, .13) !important;
}

.semi-layout-content > .bg-white,
.pricing-layout {
  background:
    linear-gradient(180deg, rgba(4, 10, 16, .96), rgba(4, 10, 16, .9)),
    radial-gradient(circle at 74% 12%, rgba(72, 134, 255, .15), transparent 32%) !important;
}

.pricing-layout {
  min-height: calc(100vh - 64px);
}

.pricing-sidebar {
  background:
    linear-gradient(180deg, rgba(7, 18, 28, .96), rgba(4, 11, 17, .98)) !important;
  border-right: 1px solid rgba(120, 255, 232, .16) !important;
  box-shadow: 18px 0 54px rgba(0, 0, 0, .22) !important;
}

.pricing-sidebar .semi-layout-sider-children {
  background: transparent !important;
}

.pricing-sidebar .p-2 {
  padding: 12px 10px !important;
}

.pricing-sidebar .text-lg,
.pricing-sidebar .semi-divider_inner-text {
  color: #effdff !important;
}

.pricing-sidebar .semi-divider {
  border-color: rgba(120, 255, 232, .13) !important;
}

.pricing-sidebar .sbg-button {
  min-height: 30px !important;
  background: rgba(7, 24, 36, .74) !important;
  border: 1px solid rgba(121, 255, 232, .18) !important;
  color: rgba(224, 250, 255, .86) !important;
  padding-top: 5px !important;
  padding-bottom: 5px !important;
}

.pricing-sidebar .sbg-button.semi-button-primary,
.pricing-sidebar .semi-button-primary.sbg-button {
  color: #02110f !important;
  background: linear-gradient(90deg, #2dffd2, #75a8ff) !important;
  border-color: rgba(128, 255, 232, .48) !important;
}

.pricing-sidebar .sbg-button .sbg-content,
.pricing-sidebar .sbg-button .sbg-ellipsis,
.pricing-sidebar .sbg-button .sbg-badge {
  color: inherit !important;
}

.pricing-sidebar .sbg-badge {
  color: #c8f8ff !important;
  background: rgba(12, 35, 50, .96) !important;
  border: 1px solid rgba(126, 255, 232, .28) !important;
}

.pricing-sidebar .sbg-badge-active {
  color: #02201a !important;
  background: rgba(255, 255, 255, .34) !important;
}

main .grid .semi-card,
main [class*="grid"] .semi-card {
  min-height: 180px;
}

.sbg-compact,
.pricing-sidebar .mb-8 {
  margin-bottom: 12px !important;
}

.sbg-compact > div:first-child,
.pricing-sidebar .text-sm,
.pricing-sidebar .text-base {
  margin-bottom: 6px !important;
}

.pricing-sidebar .sbg-content {
  gap: 8px !important;
}

.pricing-sidebar .sbg-ellipsis {
  font-size: 13px !important;
  line-height: 18px !important;
}

.pricing-search-header {
  margin-bottom: 6px !important;
  padding: 0 !important;
  background: rgba(5, 13, 20, .98) !important;
  border-bottom: 1px solid rgba(120, 255, 232, .16) !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, .32) !important;
}

.pricing-search-header .semi-card {
  overflow: hidden !important;
  background:
    linear-gradient(180deg, rgba(8, 22, 33, .94), rgba(5, 14, 22, .96)),
    radial-gradient(circle at 82% 0%, rgba(45, 255, 210, .12), transparent 34%) !important;
}

.pricing-search-header .semi-card-cover {
  display: none !important;
  height: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

.pricing-search-header .semi-card-cover > .relative,
.pricing-search-header .semi-card-cover [class*="relative"] {
  background:
    linear-gradient(120deg, rgba(47, 255, 212, .12), transparent 34%),
    linear-gradient(90deg, rgba(116, 168, 255, .16), transparent 62%) !important;
}

.pricing-search-header .semi-card-cover img,
.pricing-search-header .semi-card-cover svg {
  opacity: .88 !important;
  filter: saturate(1.2) contrast(1.08) !important;
}

.pricing-search-header .semi-card-cover .z-10,
.pricing-search-header .semi-card-cover [class*="z-10"] {
  padding: 12px 16px !important;
}

.pricing-search-header .semi-card-body {
  padding: 8px 10px !important;
  background: rgba(4, 14, 22, .96) !important;
  border-top: 1px solid rgba(120, 255, 232, .12) !important;
}

.pricing-search-header h2 {
  font-size: 19px !important;
  line-height: 24px !important;
  color: #f4feff !important;
}

.pricing-search-header p {
  color: rgba(211, 244, 250, .78) !important;
  max-width: 560px !important;
  margin-top: 4px !important;
}

.pricing-search-header .semi-tag {
  color: #03110f !important;
  background: linear-gradient(90deg, #8ffff0, #b7ceff) !important;
  border-color: rgba(218, 255, 250, .78) !important;
  font-weight: 700 !important;
}

.pricing-view-container {
  gap: 10px !important;
  padding-top: 0 !important;
}

.pricing-view-container .semi-card {
  min-height: 0 !important;
  border-color: rgba(125, 255, 232, .18) !important;
}

.pricing-view-container .semi-card-body {
  padding: 14px !important;
}

.pricing-view-container .semi-card p {
  color: rgba(199, 232, 241, .7) !important;
  margin-top: 10px !important;
  min-height: 18px !important;
}

.pricing-view-container .semi-tag,
.pricing-view-container .semi-tag-light,
.pricing-view-container .semi-tag-violet-light,
.pricing-view-container .semi-tag-blue-light,
.pricing-view-container .semi-tag-grey-light {
  color: #e9fdff !important;
  background: rgba(6, 28, 39, .92) !important;
  border: 1px solid rgba(125, 255, 232, .32) !important;
}

.pricing-view-container .semi-tag-violet-light {
  color: #f7f2ff !important;
  background: linear-gradient(90deg, rgba(75, 46, 125, .82), rgba(38, 30, 82, .9)) !important;
  border-color: rgba(218, 198, 255, .58) !important;
}

.pricing-view-container .semi-tag-blue-light {
  color: #e6f4ff !important;
  background: rgba(24, 60, 106, .56) !important;
  border-color: rgba(138, 194, 255, .34) !important;
}

.pricing-view-container .semi-tag-lime-light,
.pricing-view-container .semi-tag-green-light,
.pricing-view-container .semi-tag-cyan-light,
.pricing-view-container .semi-tag-grey-light {
  color: #eaffff !important;
  background: rgba(5, 37, 45, .9) !important;
  border-color: rgba(125, 255, 232, .38) !important;
}

.pricing-view-container .semi-tag .semi-tag-content,
.pricing-view-container .semi-tag span {
  color: inherit !important;
}

.pricing-view-container [class*="text-xs"],
.pricing-view-container [class*="text-sm"] {
  color: rgba(212, 240, 247, .78) !important;
}

.pricing-view-container h3 {
  word-break: break-word !important;
}

main .semi-card h3,
main .semi-card .text-lg,
main .semi-card .font-bold {
  color: #f0fdff !important;
  text-shadow: 0 0 18px rgba(45, 255, 215, .12);
}

main .semi-card span,
main .semi-card p,
main .semi-card div {
  border-color: rgba(122, 255, 232, .13);
}

.semi-avatar-grey {
  color: #071018 !important;
  background: linear-gradient(135deg, #e7fbff, #7dffe9) !important;
}

.semi-page-item-active,
.semi-tabs-tab-active,
.semi-navigation-item-selected,
.semi-navigation-item-active {
  color: #03110f !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
}

.semi-page-item-active *,
.semi-tabs-tab-active *,
.semi-navigation-item-selected *,
.semi-navigation-item-active * {
  color: #03110f !important;
}

aside,
[class*="sidebar"],
[class*="filter"],
[class*="Filter"] {
  border-color: rgba(120, 255, 232, .14) !important;
}

@media (max-width: 768px) {
  html,
  body,
  #root {
    max-width: 100%;
    height: auto !important;
    min-height: 100% !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  body:before {
    background-size: 34px 34px;
  }

  .semi-layout-header .h-16 {
    height: 58px !important;
  }

  .semi-layout-header .md\:gap-3 {
    display: none !important;
  }

  .semi-layout-header nav {
    flex: 0 1 auto !important;
    gap: 0 !important;
    margin-left: 6px !important;
    margin-right: 0 !important;
  }

  .semi-layout-header nav a {
    padding: 6px !important;
    font-size: 14px !important;
  }

  .gb-mobile-login-action {
    display: inline-flex !important;
    position: fixed;
    right: 10px;
    bottom: 14px;
    z-index: 999;
    align-items: center;
    justify-content: center;
    min-width: 72px;
    height: 38px;
    padding: 0 16px;
    color: #001815 !important;
    font-size: 14px;
    font-weight: 900;
    text-decoration: none;
    background: linear-gradient(90deg, #2dffd2, #74a8ff);
    border: 1px solid rgba(196, 255, 247, .8);
    border-radius: 999px;
    box-shadow: 0 14px 34px rgba(45, 255, 215, .3), 0 6px 18px rgba(0, 0, 0, .38);
  }

  .app-layout,
  .semi-layout,
  .semi-layout-content,
  main,
  .pricing-layout,
  .pricing-content,
  .pricing-scroll-hide,
  .pricing-view-container,
  .pricing-view-container > div,
  .pricing-view-container .grid {
    height: auto !important;
    max-height: none !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  .pricing-layout {
    display: block !important;
    padding-bottom: 24px !important;
  }

  .pricing-content {
    background: #05070b !important;
  }

  .pricing-content > div,
  .pricing-content .sticky,
  .pricing-content [class*="sticky"],
  .pricing-content [class*="bg-white"] {
    background: rgba(5, 13, 20, .96) !important;
    color: #e8fbff !important;
  }

  .pricing-content .sticky,
  .pricing-content [class*="sticky"] {
    position: sticky !important;
    top: 58px !important;
    z-index: 20 !important;
    border-bottom: 1px solid rgba(120, 255, 232, .14) !important;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .28) !important;
  }

  .pricing-content .semi-input-wrapper,
  .pricing-content .semi-button,
  .pricing-content button {
    color: #e8fbff !important;
    background-color: rgba(6, 22, 32, .92) !important;
    border-color: rgba(120, 255, 232, .22) !important;
  }

  .pricing-content .semi-button-primary,
  .pricing-content button.semi-button-primary {
    color: #03110f !important;
    background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
  }
}

/* Console hardening: keep operational pages consistently dark and readable. */
.app-layout .semi-layout-sider,
.app-layout .semi-layout-sider-children,
.app-layout .semi-navigation,
.app-layout .semi-navigation-list,
.app-layout .semi-navigation-list-wrapper {
  color: rgba(221, 245, 251, .82) !important;
  background: linear-gradient(180deg, rgba(4, 10, 16, .98), rgba(3, 8, 14, .98)) !important;
  border-color: rgba(118, 255, 232, .12) !important;
}

.app-layout .semi-navigation-item,
.app-layout .semi-navigation-sub-title,
.app-layout .semi-navigation-item-text,
.app-layout .semi-navigation-item-icon,
.app-layout .semi-navigation-header,
.app-layout .semi-navigation-footer {
  color: rgba(210, 236, 244, .76) !important;
}

.app-layout .semi-navigation-item-selected,
.app-layout .semi-navigation-item-active {
  color: #03110f !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
  box-shadow: 0 12px 30px rgba(45, 255, 215, .22) !important;
}

.app-layout .semi-navigation-item-selected *,
.app-layout .semi-navigation-item-active * {
  color: #03110f !important;
}

.sidebar-collapse-button,
.app-layout .sidebar-collapse-button,
.app-layout [class*="collapse"] {
  color: rgba(221, 248, 255, .78) !important;
  background: rgba(4, 15, 23, .96) !important;
  border-color: rgba(120, 255, 232, .18) !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, .05) !important;
}

.app-layout .semi-table,
.app-layout .semi-table-container,
.app-layout .semi-table-wrapper,
.app-layout .semi-table-body,
.app-layout .semi-table-tbody,
.app-layout .semi-table-fixed,
.app-layout .semi-table-fixed-left,
.app-layout .semi-table-fixed-right,
.app-layout .semi-table-scroll-position-left,
.app-layout .semi-table-scroll-position-right {
  color: #e8fbff !important;
  background: rgba(5, 15, 23, .96) !important;
  border-color: rgba(120, 255, 232, .16) !important;
}

.app-layout .semi-table-thead,
.app-layout .semi-table-thead > .semi-table-row,
.app-layout .semi-table-thead > .semi-table-row > .semi-table-row-head,
.app-layout .semi-table-row-head {
  color: rgba(193, 255, 244, .92) !important;
  background: linear-gradient(180deg, rgba(13, 57, 64, .96), rgba(7, 41, 49, .96)) !important;
  border-color: rgba(129, 255, 232, .22) !important;
}

.app-layout .semi-table-tbody > .semi-table-row,
.app-layout tr.semi-table-row,
.app-layout .semi-table-row {
  color: rgba(230, 250, 255, .88) !important;
  background: rgba(6, 18, 28, .98) !important;
  border-color: rgba(120, 255, 232, .11) !important;
}

.app-layout .semi-table-tbody > .semi-table-row:nth-child(even),
.app-layout tbody > tr.semi-table-row:nth-child(even) {
  background: rgba(8, 25, 36, .98) !important;
}

.app-layout .semi-table-tbody > .semi-table-row:hover,
.app-layout tbody > tr.semi-table-row:hover {
  background: rgba(34, 255, 214, .12) !important;
}

.app-layout .semi-table-tbody > .semi-table-row > .semi-table-row-cell,
.app-layout .semi-table-row-cell,
.app-layout td.semi-table-row-cell,
.app-layout th.semi-table-row-head {
  color: rgba(230, 250, 255, .86) !important;
  background: transparent !important;
  border-color: rgba(120, 255, 232, .11) !important;
}

.app-layout .semi-table-cell-fixed-left,
.app-layout .semi-table-cell-fixed-right,
.app-layout .semi-table-cell-fixed-right-first,
.app-layout .semi-table-cell-fixed-left-last {
  background: rgba(7, 20, 30, .99) !important;
  box-shadow: -8px 0 18px rgba(0, 0, 0, .24) !important;
}

.app-layout .semi-table-cell-fixed-left:before,
.app-layout .semi-table-cell-fixed-right:before,
.app-layout .semi-table-cell-fixed-right-first:before,
.app-layout .semi-table-cell-fixed-left-last:before {
  background: transparent !important;
  box-shadow: none !important;
}

.app-layout .semi-table-placeholder,
.app-layout .semi-empty,
.app-layout .semi-spin,
.app-layout .semi-pagination,
.app-layout .semi-page,
.app-layout .semi-page-item,
.app-layout .semi-page-total,
.app-layout .semi-page-jump-next,
.app-layout .semi-page-jump-prev {
  color: rgba(204, 235, 244, .76) !important;
  background: rgba(5, 18, 27, .84) !important;
  border-color: rgba(120, 255, 232, .16) !important;
}

.app-layout .semi-page-item-active,
.app-layout .semi-page-item:hover {
  color: #03110f !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
}

.app-layout .semi-tag,
.app-layout .semi-tag-light,
.app-layout .semi-tag-default,
.app-layout .semi-tag-green-light,
.app-layout .semi-tag-blue-light,
.app-layout .semi-tag-red-light,
.app-layout .semi-tag-orange-light,
.app-layout .semi-tag-yellow-light,
.app-layout .semi-tag-violet-light,
.app-layout .semi-tag-grey-light,
.app-layout .semi-tag-cyan-light {
  color: #e9fdff !important;
  background: rgba(10, 36, 49, .94) !important;
  border: 1px solid rgba(125, 255, 232, .28) !important;
}

.app-layout .semi-tag *,
.app-layout .semi-tag-content {
  color: inherit !important;
}

.app-layout .semi-avatar,
.app-layout .semi-avatar-circle {
  color: #03110f !important;
  background: linear-gradient(135deg, #a9fff1, #74a8ff) !important;
}

.app-layout .semi-button-secondary,
.app-layout .semi-button-tertiary,
.app-layout .semi-button-light,
.app-layout .semi-button-borderless,
.app-layout .semi-button-outline {
  color: rgba(226, 250, 255, .86) !important;
  background: rgba(8, 28, 40, .78) !important;
  border: 1px solid rgba(120, 255, 232, .18) !important;
}

.app-layout .semi-button-danger,
.app-layout .semi-button-danger.semi-button-light {
  color: #ffb0a5 !important;
  background: rgba(78, 20, 24, .5) !important;
  border-color: rgba(255, 126, 108, .28) !important;
}

.app-layout .semi-button-disabled,
.app-layout .semi-button-disabled *,
.app-layout .semi-button-tertiary-disabled,
.app-layout .semi-button-danger-disabled {
  color: rgba(171, 207, 217, .4) !important;
  background: rgba(7, 19, 28, .5) !important;
  border-color: rgba(120, 255, 232, .08) !important;
}

.app-layout .semi-select-option,
.app-layout .semi-dropdown,
.app-layout .semi-dropdown-menu,
.app-layout .semi-popover,
.app-layout .semi-tooltip,
.app-layout .semi-datepicker,
.app-layout .semi-cascader,
.app-layout .semi-tree,
.app-layout .semi-list,
.app-layout .semi-list-item {
  color: #e8fbff !important;
  background: rgba(5, 17, 27, .98) !important;
  border-color: rgba(120, 255, 232, .16) !important;
}

.app-layout .semi-select-option:hover,
.app-layout .semi-dropdown-item:hover,
.app-layout .semi-list-item:hover {
  color: #f5feff !important;
  background: rgba(45, 255, 210, .12) !important;
}

.app-layout .semi-input-wrapper,
.app-layout .semi-input,
.app-layout .semi-select,
.app-layout .semi-select-selection,
.app-layout .semi-datepicker-range-input,
.app-layout .semi-tagInput,
.app-layout textarea {
  color: #e8fbff !important;
  background: rgba(4, 18, 28, .92) !important;
  border-color: rgba(120, 255, 232, .22) !important;
}

.app-layout .semi-input::placeholder,
.app-layout input::placeholder,
.app-layout textarea::placeholder {
  color: rgba(184, 220, 231, .58) !important;
}

.app-layout .semi-card,
.app-layout .semi-collapse,
.app-layout .semi-tabs,
.app-layout .semi-tabs-bar,
.app-layout .semi-tabs-content,
.app-layout .semi-modal-content,
.app-layout .semi-sidesheet-content {
  color: #e8fbff !important;
  background: linear-gradient(180deg, rgba(9, 24, 36, .96), rgba(4, 13, 22, .97)) !important;
  border-color: rgba(128, 244, 230, .18) !important;
}

/* Console readability overhaul: remove black/white jumps and raise contrast. */
.app-layout,
.app-layout .semi-layout,
.app-layout .semi-layout-content,
.app-layout main {
  color: #e8fbff !important;
  background-color: #06111a !important;
}

.app-layout h1,
.app-layout h2,
.app-layout h3,
.app-layout h4,
.app-layout h5,
.app-layout h6,
.app-layout label,
.app-layout .semi-form-field-label,
.app-layout .semi-typography,
.app-layout .semi-typography-primary,
.app-layout .semi-typography-secondary,
.app-layout .semi-form-extra,
.app-layout .semi-form-field-extra,
.app-layout .semi-checkbox-addon,
.app-layout .semi-radio-addon {
  color: rgba(232, 251, 255, .88) !important;
}

.app-layout .text-semi-color-text-0,
.app-layout .text-semi-color-text-1,
.app-layout .text-semi-color-text-2,
.app-layout .text-gray-400,
.app-layout .text-gray-500,
.app-layout .text-slate-400,
.app-layout [class*="text-semi-color-text"],
.app-layout [class*="text-gray"],
.app-layout [class*="text-slate"] {
  color: rgba(196, 226, 235, .7) !important;
}

.app-layout .semi-tabs-tab,
.app-layout .semi-tabs-tab-button,
.app-layout .semi-tabs-tab-text,
.app-layout .semi-tabs-tab-icon,
.app-layout .semi-radio-buttonRadioGroup .semi-radio,
.app-layout .semi-radioGroup-buttonRadio .semi-radio {
  color: rgba(210, 238, 246, .76) !important;
  background: rgba(6, 20, 31, .78) !important;
  border-color: rgba(121, 255, 232, .14) !important;
}

.app-layout .semi-tabs-tab-active,
.app-layout .semi-tabs-tab-active *,
.app-layout .semi-radio-buttonRadioGroup .semi-radio-checked,
.app-layout .semi-radioGroup-buttonRadio .semi-radio-checked {
  color: #03110f !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
  border-color: rgba(190, 255, 245, .62) !important;
}

.app-layout .semi-button-primary.semi-button-light:not(.semi-button-disabled),
.app-layout .semi-button-primary.semi-button-borderless:not(.semi-button-disabled),
.app-layout button.semi-button-primary.semi-button-light:not(.semi-button-disabled),
.app-layout button.semi-button-primary.semi-button-borderless:not(.semi-button-disabled) {
  color: #03110f !important;
  font-weight: 800 !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
  border-color: rgba(190, 255, 245, .62) !important;
  box-shadow: 0 10px 24px rgba(45, 255, 215, .2), inset 0 1px rgba(255, 255, 255, .18) !important;
}

.app-layout .semi-button-primary.semi-button-light:not(.semi-button-disabled) *,
.app-layout .semi-button-primary.semi-button-borderless:not(.semi-button-disabled) * {
  color: #03110f !important;
}

.app-layout .semi-button .semi-button-content,
.app-layout .semi-button .semi-button-content * {
  background: transparent !important;
}

.app-layout .semi-button-primary.semi-button-light:not(.semi-button-disabled):hover,
.app-layout .semi-button-primary.semi-button-borderless:not(.semi-button-disabled):hover {
  background: linear-gradient(90deg, #84ffe9, #a6c4ff) !important;
}

.app-layout .semi-button-disabled,
.app-layout .semi-button-disabled *,
.app-layout .semi-button-tertiary-disabled,
.app-layout .semi-button-tertiary-disabled *,
.app-layout .semi-button-danger-disabled,
.app-layout .semi-button-danger-disabled *,
.app-layout [disabled],
.app-layout [aria-disabled="true"] {
  color: rgba(181, 216, 226, .52) !important;
  opacity: 1 !important;
  background-color: rgba(7, 19, 29, .62) !important;
  border-color: rgba(120, 255, 232, .1) !important;
  box-shadow: none !important;
}

.app-layout input[type="number"] {
  -moz-appearance: textfield !important;
  appearance: textfield !important;
}

.app-layout input[type="number"]::-webkit-outer-spin-button,
.app-layout input[type="number"]::-webkit-inner-spin-button {
  margin: 0 !important;
  -webkit-appearance: none !important;
}

.app-layout .semi-switch,
.app-layout .semi-switch-handle,
.app-layout .semi-slider,
.app-layout .semi-slider-track,
.app-layout .semi-progress,
.app-layout .semi-progress-line-outer {
  border-color: rgba(120, 255, 232, .14) !important;
}

.app-layout .semi-banner,
.app-layout .semi-alert,
.app-layout .semi-notification,
.app-layout .semi-toast,
.app-layout .semi-popconfirm,
.app-layout .semi-popconfirm-content {
  color: #e8fbff !important;
  background: linear-gradient(180deg, rgba(10, 28, 39, .98), rgba(5, 17, 27, .98)) !important;
  border-color: rgba(120, 255, 232, .18) !important;
}

.app-layout [class*="bg-white"],
.app-layout [class*="bg-gray-50"],
.app-layout [class*="bg-slate-50"],
.app-layout [class*="bg-neutral-50"] {
  color: #e8fbff !important;
  background: rgba(6, 18, 28, .96) !important;
}

.app-layout canvas {
  border-radius: 4px !important;
  background-color: #071721 !important;
  filter: invert(1) hue-rotate(180deg) saturate(.96) brightness(.86) contrast(.94);
}

.app-layout [_echarts_instance_],
.app-layout [class*="echarts"],
.app-layout [class*="Echarts"],
.app-layout [class*="chart"],
.app-layout [class*="Chart"],
.app-layout [class*="recharts"],
.app-layout [class*="Recharts"] {
  color: #e8fbff !important;
  background: rgba(7, 18, 28, .94) !important;
  border-color: rgba(120, 255, 232, .12) !important;
}

.app-layout svg[class*="recharts"],
.app-layout svg[class*="chart"],
.app-layout svg[class*="Chart"] {
  background-color: #071721 !important;
}

.app-layout .semi-input-number,
.app-layout .semi-input-number-wrapper,
.app-layout .semi-input-number .semi-input-wrapper,
.app-layout .semi-input-number-suffix,
.app-layout .semi-input-number-suffix-btns {
  color: #e8fbff !important;
  background: rgba(4, 18, 28, .94) !important;
  border-color: rgba(120, 255, 232, .22) !important;
}

.app-layout .semi-input-number-suffix-btns {
  width: 18px !important;
  border-left: 1px solid rgba(120, 255, 232, .16) !important;
  border-radius: 0 8px 8px 0 !important;
}

.app-layout .semi-input-number-button,
.app-layout .semi-input-number-button-up,
.app-layout .semi-input-number-button-down {
  color: rgba(209, 244, 252, .76) !important;
  background: rgba(7, 24, 35, .9) !important;
  border-color: rgba(120, 255, 232, .12) !important;
}

.app-layout .semi-input-number-button:hover {
  color: #03110f !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
}

.app-layout .semi-input-number-button-disabled,
.app-layout .semi-input-number-button-up-disabled,
.app-layout .semi-input-number-button-down-disabled,
.app-layout .semi-input-number-button-up-not-allowed,
.app-layout .semi-input-number-button-down-not-allowed {
  color: rgba(181, 216, 226, .36) !important;
  background: rgba(7, 19, 29, .72) !important;
}

/* Runtime popups are mounted under body, not inside .app-layout. */
body .semi-portal,
body .semi-portal-inner,
body .semi-popover,
body .semi-popover-content,
body .semi-popover-wrapper,
body .semi-dropdown,
body .semi-dropdown-menu,
body .semi-select-option-list,
body .semi-select-option-list-wrapper,
body .semi-select-option-list-outer,
body .semi-cascader,
body .semi-cascader-option-list,
body .semi-tooltip,
body .semi-tooltip-content {
  color: #e8fbff !important;
  background: linear-gradient(180deg, rgba(7, 24, 36, .99), rgba(4, 13, 22, .99)) !important;
  border-color: rgba(120, 255, 232, .22) !important;
  box-shadow: 0 22px 60px rgba(0, 0, 0, .46), inset 0 1px rgba(255, 255, 255, .06) !important;
}

body .semi-select-option,
body .semi-select-option-empty,
body .semi-dropdown-item,
body .semi-cascader-option,
body .semi-tree-option-list .semi-tree-option {
  min-height: 36px !important;
  color: rgba(232, 251, 255, .9) !important;
  background: transparent !important;
  border-radius: 6px !important;
}

body .semi-select-option *,
body .semi-dropdown-item *,
body .semi-cascader-option *,
body .semi-select-option-selected *,
body .semi-select-option-focused * {
  color: inherit !important;
}

body .semi-select-option:hover,
body .semi-select-option-focused,
body .semi-dropdown-item:hover,
body .semi-cascader-option:hover {
  color: #03110f !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
}

body .semi-select-option-selected,
body .semi-dropdown-item-active,
body .semi-cascader-option-active {
  color: #03110f !important;
  font-weight: 800 !important;
  background: linear-gradient(90deg, rgba(45, 255, 210, .95), rgba(116, 168, 255, .95)) !important;
}

body .semi-select-selection,
body .semi-select-selection-text,
body .semi-select-single,
body .semi-select .semi-select-selection-placeholder {
  color: rgba(232, 251, 255, .9) !important;
}

body .semi-select-arrow,
body .semi-select-prefix,
body .semi-select-suffix {
  color: rgba(141, 255, 233, .86) !important;
}

/* Top-up page: keep payment and amount controls in the same readable dark system. */
body.gb-route-topup .app-layout,
body.gb-route-topup .app-layout main,
body.gb-route-topup .app-layout .semi-layout-content {
  color: #e8fbff !important;
  background:
    radial-gradient(circle at 86% 8%, rgba(45, 255, 210, .13), transparent 28%),
    linear-gradient(180deg, #06111a 0%, #040b13 100%) !important;
}

body.gb-route-topup .app-layout .semi-card,
body.gb-route-topup .app-layout [class*="bg-white"],
body.gb-route-topup .app-layout [class*="bg-gray"],
body.gb-route-topup .app-layout [class*="bg-slate"],
body.gb-route-topup .app-layout [class*="rounded"],
body.gb-route-topup .app-layout .semi-form,
body.gb-route-topup .app-layout .semi-form-field {
  color: #e8fbff !important;
  background: linear-gradient(180deg, rgba(9, 28, 41, .96), rgba(4, 14, 23, .98)) !important;
  border-color: rgba(120, 255, 232, .18) !important;
}

body.gb-route-topup .app-layout .semi-input-wrapper,
body.gb-route-topup .app-layout .semi-input-number,
body.gb-route-topup .app-layout .semi-input-number-wrapper,
body.gb-route-topup .app-layout input,
body.gb-route-topup .app-layout textarea {
  color: #e8fbff !important;
  caret-color: #8dffe9 !important;
  background: rgba(4, 18, 28, .94) !important;
  border-color: rgba(120, 255, 232, .28) !important;
}

body.gb-route-topup .app-layout .semi-button,
body.gb-route-topup .app-layout button,
body.gb-route-topup .app-layout [role="button"] {
  color: rgba(232, 251, 255, .9) !important;
  background: rgba(8, 30, 43, .86) !important;
  border-color: rgba(120, 255, 232, .22) !important;
}

body.gb-route-topup .app-layout .semi-button-primary,
body.gb-route-topup .app-layout button.semi-button-primary,
body.gb-route-topup .app-layout .semi-radio-checked,
body.gb-route-topup .app-layout .semi-radio-buttonRadioGroup .semi-radio-checked,
body.gb-route-topup .app-layout .semi-radioGroup-buttonRadio .semi-radio-checked {
  color: #03110f !important;
  font-weight: 900 !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
  border-color: rgba(190, 255, 245, .68) !important;
  box-shadow: 0 14px 34px rgba(45, 255, 215, .22), inset 0 1px rgba(255, 255, 255, .16) !important;
}

body.gb-route-topup .app-layout .semi-button-primary *,
body.gb-route-topup .app-layout button.semi-button-primary *,
body.gb-route-topup .app-layout .semi-radio-checked * {
  color: #03110f !important;
}

body.gb-route-topup .app-layout .semi-tag,
body.gb-route-topup .app-layout .semi-badge,
body.gb-route-topup .app-layout [class*="tag"],
body.gb-route-topup .app-layout [class*="Tag"],
body.gb-route-topup .app-layout [class*="badge"],
body.gb-route-topup .app-layout [class*="Badge"] {
  color: #e8fbff !important;
  background: rgba(6, 31, 42, .92) !important;
  border: 1px solid rgba(120, 255, 232, .28) !important;
}

body.gb-route-topup .app-layout .semi-typography,
body.gb-route-topup .app-layout .semi-form-field-label,
body.gb-route-topup .app-layout label,
body.gb-route-topup .app-layout p,
body.gb-route-topup .app-layout span,
body.gb-route-topup .app-layout div {
  border-color: rgba(120, 255, 232, .13) !important;
}

body.gb-route-token .app-layout .semi-select,
body.gb-route-token .app-layout .semi-select-selection,
body.gb-route-token .app-layout .semi-input-wrapper,
body.gb-route-token .app-layout .semi-tagInput {
  color: #e8fbff !important;
  background: rgba(4, 18, 28, .94) !important;
  border-color: rgba(120, 255, 232, .28) !important;
}

body.gb-route-token .app-layout button[aria-label="toggle token visibility"],
body.gb-route-token .app-layout button[aria-label="copy token key"] {
  width: 30px !important;
  height: 30px !important;
  min-width: 30px !important;
  color: #8dffe9 !important;
  background: rgba(8, 30, 43, .94) !important;
  border: 1px solid rgba(141, 255, 233, .42) !important;
  border-radius: 8px !important;
  box-shadow: 0 8px 18px rgba(45, 255, 210, .12), inset 0 1px rgba(255, 255, 255, .08) !important;
}

body.gb-route-token .app-layout button[aria-label="toggle token visibility"] *,
body.gb-route-token .app-layout button[aria-label="copy token key"] * {
  color: #8dffe9 !important;
  fill: currentColor !important;
  stroke: currentColor !important;
}

body.gb-route-token .app-layout button[aria-label="toggle token visibility"]:hover,
body.gb-route-token .app-layout button[aria-label="copy token key"]:hover {
  color: #03110f !important;
  background: linear-gradient(90deg, #2dffd2, #74a8ff) !important;
  border-color: rgba(190, 255, 245, .7) !important;
}

body.gb-route-token .app-layout button[aria-label="toggle token visibility"]:hover *,
body.gb-route-token .app-layout button[aria-label="copy token key"]:hover * {
  color: #03110f !important;
}
