/* Generated by Remnawave Customizer. Token-first compatibility layer. */
:root, [data-mantine-color-scheme="dark"] {
  --rwc-background: rgb(11 12 14);
  --rwc-surface: rgb(24 26 30);
  --rwc-surface-deep: rgb(19 20 23);
  --rwc-surface-hover: rgb(33 35 39);
  --rwc-border: rgb(45 47 50);
  --rwc-accent: rgb(129 140 159);
  --rwc-accent-rgb: 129, 140, 159;
  --rwc-text: rgb(238 241 245);
  --rwc-dimmed: rgb(157 166 179);
  --rwc-muted: rgb(112 122 137);
  --mantine-color-body: rgb(11 12 14) !important;
  --mantine-color-text: rgb(238 241 245) !important;
  --mantine-color-dimmed: rgb(157 166 179) !important;
  --mantine-color-bright: rgb(238 241 245) !important;
  --mantine-color-placeholder: rgb(112 122 137) !important;
  --mantine-color-default: var(--mantine-color-dark-6) !important;
  --mantine-color-default-hover: var(--rwc-surface-hover) !important;
  --mantine-color-default-color: var(--rwc-text) !important;
  --mantine-color-default-border: var(--mantine-color-dark-4) !important;
  --mantine-color-anchor: var(--rwc-accent) !important;
  --mantine-color-gray-outline-hover: var(--rwc-surface-hover) !important;
  --mantine-color-cyan-0: rgb(245 246 247) !important;
  --mantine-color-cyan-1: rgb(232 234 238) !important;
  --mantine-color-cyan-2: rgb(217 220 226) !important;
  --mantine-color-cyan-3: rgb(200 204 213) !important;
  --mantine-color-cyan-4: rgb(179 186 197) !important;
  --mantine-color-cyan-5: rgb(160 169 183) !important;
  --mantine-color-cyan-6: rgb(144 154 171) !important;
  --mantine-color-cyan-7: rgb(129 140 159) !important;
  --mantine-color-cyan-8: rgb(129 140 159) !important;
  --mantine-color-cyan-9: rgb(111 120 137) !important;
  --mantine-color-cyan-filled: rgb(129 140 159) !important;
  --mantine-color-cyan-filled-hover: rgb(111 120 137) !important;
  --mantine-color-cyan-light: rgba(var(--rwc-accent-rgb), 0.14) !important;
  --mantine-color-cyan-light-hover: rgba(var(--rwc-accent-rgb), 0.20) !important;
  --mantine-color-cyan-light-color: rgb(179 186 197) !important;
  --mantine-color-cyan-outline: rgb(129 140 159) !important;
  --mantine-color-cyan-outline-hover: rgba(var(--rwc-accent-rgb), 0.10) !important;
  --mantine-color-blue-0: rgb(245 246 247) !important;
  --mantine-color-blue-1: rgb(232 234 238) !important;
  --mantine-color-blue-2: rgb(217 220 226) !important;
  --mantine-color-blue-3: rgb(200 204 213) !important;
  --mantine-color-blue-4: rgb(179 186 197) !important;
  --mantine-color-blue-5: rgb(160 169 183) !important;
  --mantine-color-blue-6: rgb(144 154 171) !important;
  --mantine-color-blue-7: rgb(129 140 159) !important;
  --mantine-color-blue-8: rgb(129 140 159) !important;
  --mantine-color-blue-9: rgb(111 120 137) !important;
  --mantine-color-blue-filled: rgb(129 140 159) !important;
  --mantine-color-blue-filled-hover: rgb(111 120 137) !important;
  --mantine-color-blue-light: rgba(var(--rwc-accent-rgb), 0.14) !important;
  --mantine-color-blue-light-hover: rgba(var(--rwc-accent-rgb), 0.20) !important;
  --mantine-color-blue-light-color: rgb(179 186 197) !important;
  --mantine-color-blue-outline: rgb(129 140 159) !important;
  --mantine-color-blue-outline-hover: rgba(var(--rwc-accent-rgb), 0.10) !important;
  --mantine-color-indigo-0: rgb(245 246 247) !important;
  --mantine-color-indigo-1: rgb(232 234 238) !important;
  --mantine-color-indigo-2: rgb(217 220 226) !important;
  --mantine-color-indigo-3: rgb(200 204 213) !important;
  --mantine-color-indigo-4: rgb(179 186 197) !important;
  --mantine-color-indigo-5: rgb(160 169 183) !important;
  --mantine-color-indigo-6: rgb(144 154 171) !important;
  --mantine-color-indigo-7: rgb(129 140 159) !important;
  --mantine-color-indigo-8: rgb(129 140 159) !important;
  --mantine-color-indigo-9: rgb(111 120 137) !important;
  --mantine-color-indigo-filled: rgb(129 140 159) !important;
  --mantine-color-indigo-filled-hover: rgb(111 120 137) !important;
  --mantine-color-indigo-light: rgba(var(--rwc-accent-rgb), 0.14) !important;
  --mantine-color-indigo-light-hover: rgba(var(--rwc-accent-rgb), 0.20) !important;
  --mantine-color-indigo-light-color: rgb(179 186 197) !important;
  --mantine-color-indigo-outline: rgb(129 140 159) !important;
  --mantine-color-indigo-outline-hover: rgba(var(--rwc-accent-rgb), 0.10) !important;
  --mantine-color-dark-0: rgb(232 236 242) !important;
  --mantine-color-dark-1: rgb(204 210 219) !important;
  --mantine-color-dark-2: rgb(168 176 188) !important;
  --mantine-color-dark-3: rgb(126 136 150) !important;
  --mantine-color-dark-4: rgb(45 47 50) !important;
  --mantine-color-dark-5: rgb(34 36 40) !important;
  --mantine-color-dark-6: rgb(24 26 30) !important;
  --mantine-color-dark-7: rgb(19 20 23) !important;
  --mantine-color-dark-8: rgb(11 12 14) !important;
  --mantine-color-dark-9: rgb(9 10 12) !important;
  --mantine-primary-color-filled: var(--mantine-color-cyan-8) !important;
  --mantine-primary-color-filled-hover: var(--mantine-color-cyan-9) !important;
  --mantine-primary-color-light: rgba(var(--rwc-accent-rgb), 0.14) !important;
  --mantine-primary-color-light-hover: rgba(var(--rwc-accent-rgb), 0.20) !important;
  --mantine-primary-color-light-color: var(--mantine-color-cyan-4) !important;
  --mantine-radius-xs: 0px !important;
  --mantine-radius-sm: 3px !important;
  --mantine-radius-md: 6px !important;
  --mantine-radius-lg: 10px !important;
  --mantine-radius-xl: 14px !important;
  --mantine-radius-default: 6px !important;
}

/* Page canvas. Remove top-level outlines/shadows that become visible on
   strongly tinted themes even though stock Remnawave hides them. */
html, body, #root, .mantine-AppShell-root, .mantine-AppShell-main {
  background-color: var(--rwc-background) !important;
  border: 0 !important;
  outline: 0 !important;
}
.mantine-AppShell-root { box-shadow: none !important; }
.mantine-AppShell-header { border-top: 0 !important; }

/* Sidebar ambient glow and icon glow follow the selected accent. */
.mantine-AppShell-navbar::before {
  background: radial-gradient(circle at 20% 20%, rgba(var(--rwc-accent-rgb), 0.065) 0%, transparent 52%) !important;
}
.mantine-AppShell-navbar a:hover svg, .mantine-AppShell-navbar [data-active="true"] svg {
  filter: drop-shadow(0 2px 4px rgba(var(--rwc-accent-rgb), 0.28)) !important;
}

/* Mantine NavigationProgress shares Progress track styles. With a custom
   dark palette its transparent top track can become visible as a 2-3px
   line. Force only the navigation progress track itself transparent. */
.mantine-Progress-root[style*="--nprogress-z-index"] {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.mantine-Progress-root[style*="--nprogress-z-index"]:not([data-mounted]) {
  opacity: 0 !important;
}
.mantine-Progress-root[style*="--nprogress-z-index"] .mantine-Progress-section::before {
  box-shadow: 0 0 8px rgba(var(--rwc-accent-rgb), 0.42), 0 0 4px rgba(var(--rwc-accent-rgb), 0.24) !important;
}

/* Mantine React Table hard-codes #1b2027 as an inline CSS variable in
   Users, HWID/SRH inspectors and Torrent Blocker tables. Inline custom
   properties beat normal theme variables, so override that one variable
   with !important instead of filtering the JavaScript bundle. */
[style*="--mrt-base-background-color"] {
  --mrt-base-background-color: var(--rwc-surface) !important;
  background-color: var(--rwc-surface) !important;
}

/* Inline legacy surfaces from a handful of React components. */
[style*="#1b1f26" i], [style*="rgb(27, 31, 38)" i] {
  background-color: var(--rwc-surface) !important;
}
[style*="#161b23" i], [style*="rgb(22, 27, 35)" i] {
  background-color: var(--rwc-surface-deep) !important;
}

/* Some Remnawave components hard-code indigo/cyan/blue decoration in
   inline styles instead of theme variables. Normalize only background
   and border properties; semantic status colors stay untouched. */
[style*="background: rgba(99, 102, 241"], [style*="background-color: rgba(99, 102, 241"],
[style*="background: rgba(59, 130, 246"], [style*="background-color: rgba(59, 130, 246"],
[style*="background: rgba(6, 182, 212"], [style*="background-color: rgba(6, 182, 212"] {
  background-color: rgba(var(--rwc-accent-rgb), 0.08) !important;
}
[style*="border: 1px solid rgba(99, 102, 241"], [style*="border-color: rgba(99, 102, 241"],
[style*="border: 1px solid rgba(59, 130, 246"], [style*="border-color: rgba(59, 130, 246"],
[style*="border: 1px solid rgba(6, 182, 212"], [style*="border-color: rgba(6, 182, 212"] {
  border-color: rgba(var(--rwc-accent-rgb), 0.20) !important;
}

/* Scrollbars should not keep Remnawave cyan/teal when another accent is selected. */
::-webkit-scrollbar-track, ::-webkit-scrollbar-corner {
  background: var(--rwc-background) !important;
}
::-webkit-scrollbar-thumb {
  background: var(--rwc-accent) !important;
  border-color: var(--rwc-background) !important;
}
* { scrollbar-color: var(--rwc-accent) var(--rwc-background); }
::selection {
  background: rgba(var(--rwc-accent-rgb), 0.24) !important;
  color: var(--rwc-text) !important;
}


/* Remnawave Customizer: decorative accent compatibility. */
.mantine-ActionIcon-root[style*="mantine-color-cyan"],
.mantine-ActionIcon-root[style*="mantine-color-blue"],
.mantine-ActionIcon-root[style*="mantine-color-indigo"] {
  --ai-color: var(--rwc-accent) !important;
  --ai-hover-color: var(--rwc-accent) !important;
  --ai-bd: 1px solid rgba(var(--rwc-accent-rgb), 0.42) !important;
}

.mantine-ActionIcon-root[data-variant="light"][style*="mantine-color-cyan"],
.mantine-ActionIcon-root[data-variant="light"][style*="mantine-color-blue"],
.mantine-ActionIcon-root[data-variant="light"][style*="mantine-color-indigo"],
.mantine-ActionIcon-root[data-variant="soft"][style*="mantine-color-cyan"],
.mantine-ActionIcon-root[data-variant="soft"][style*="mantine-color-blue"],
.mantine-ActionIcon-root[data-variant="soft"][style*="mantine-color-indigo"] {
  --ai-bg: rgba(var(--rwc-accent-rgb), 0.10) !important;
  --ai-hover: rgba(var(--rwc-accent-rgb), 0.18) !important;
}

.mantine-ActionIcon-root[data-variant="outline"][style*="mantine-color-cyan"],
.mantine-ActionIcon-root[data-variant="outline"][style*="mantine-color-blue"],
.mantine-ActionIcon-root[data-variant="outline"][style*="mantine-color-indigo"] {
  --ai-bg: transparent !important;
  --ai-hover: rgba(var(--rwc-accent-rgb), 0.10) !important;
}

.mantine-ThemeIcon-root[style*="mantine-color-cyan"],
.mantine-ThemeIcon-root[style*="mantine-color-blue"],
.mantine-ThemeIcon-root[style*="mantine-color-indigo"] {
  --ti-color: var(--rwc-accent) !important;
  --ti-bg: rgba(var(--rwc-accent-rgb), 0.09) !important;
  --ti-bd: 1px solid rgba(var(--rwc-accent-rgb), 0.36) !important;
}

.mantine-AppShell-navbar a:hover svg,
.mantine-AppShell-navbar button:hover svg,
.mantine-AppShell-navbar [data-active="true"] svg {
  filter: drop-shadow(0 2px 4px rgba(var(--rwc-accent-rgb), 0.28)) !important;
}

.mantine-AppShell-navbar a:hover::before,
.mantine-AppShell-navbar button:hover::before,
.mantine-AppShell-navbar [data-active="true"]::before {
  background: linear-gradient(135deg, transparent 0%, rgba(var(--rwc-accent-rgb), 0.08) 50%, transparent 100%) !important;
}

.mantine-AppShell-navbar [data-active="true"] {
  border-color: var(--rwc-accent) !important;
  box-shadow: inset 0 0 0 1px rgba(var(--rwc-accent-rgb), 0.05), 0 0 14px rgba(var(--rwc-accent-rgb), 0.04) !important;
}

.mantine-AppShell-navbar [data-active="true"]::after {
  background: var(--rwc-accent) !important;
  box-shadow: 0 0 8px rgba(var(--rwc-accent-rgb), 0.42) !important;
}

/* Remnawave Customizer: dedicated compositor-friendly visual effects layer. */
:root { --rwc-fx-accent: var(--rwc-accent-rgb); }
#rwc-effects {
  position: fixed;
  inset: 0;
  z-index: 4;
  overflow: hidden;
  pointer-events: none;
  user-select: none;
  contain: strict;
}
#rwc-effects > .rwc-fx {
  position: absolute;
  inset: 0;
  pointer-events: none;
}


/* Tiny ambient stars. Kept intentionally dim. */
.rwc-fx-particles::before,
.rwc-fx-particles::after {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: rgba(var(--rwc-fx-accent), 0.22);
  box-shadow:
    5vw 11vh 4px rgba(var(--rwc-fx-accent), .24), 12vw 36vh 3px rgba(var(--rwc-fx-accent), .16),
    18vw 68vh 5px rgba(var(--rwc-fx-accent), .18), 25vw 22vh 3px rgba(var(--rwc-fx-accent), .21),
    31vw 52vh 4px rgba(var(--rwc-fx-accent), .15), 38vw 14vh 4px rgba(var(--rwc-fx-accent), .20),
    45vw 76vh 3px rgba(var(--rwc-fx-accent), .18), 52vw 42vh 5px rgba(var(--rwc-fx-accent), .17),
    59vw 19vh 3px rgba(var(--rwc-fx-accent), .22), 66vw 61vh 4px rgba(var(--rwc-fx-accent), .15),
    73vw 31vh 3px rgba(var(--rwc-fx-accent), .21), 80vw 83vh 5px rgba(var(--rwc-fx-accent), .14),
    87vw 47vh 3px rgba(var(--rwc-fx-accent), .19), 94vw 16vh 4px rgba(var(--rwc-fx-accent), .23),
    9vw 88vh 3px rgba(var(--rwc-fx-accent), .14), 22vw 92vh 4px rgba(var(--rwc-fx-accent), .15),
    41vw 90vh 3px rgba(var(--rwc-fx-accent), .17), 62vw 8vh 4px rgba(var(--rwc-fx-accent), .19),
    78vw 6vh 3px rgba(var(--rwc-fx-accent), .20), 91vw 71vh 4px rgba(var(--rwc-fx-accent), .16);
  opacity: .45;
  animation: rwc-ambient-particles 6.8s ease-in-out infinite alternate;
}
.rwc-fx-particles::after {
  transform: translate3d(3vw, 2vh, 0) scale(.72);
  opacity: .24;
  animation-duration: 9.7s;
  animation-delay: -2.4s;
}
@keyframes rwc-ambient-particles {
  0%   { opacity: .18; transform: translate3d(0, 0, 0); }
  45%  { opacity: .52; }
  100% { opacity: .25; transform: translate3d(.8vw, -1.1vh, 0); }
}


/* Falling glowing dots: drift down only to around half the viewport and fade. */
.rwc-fx-snow::before,
.rwc-fx-snow::after {
  content: '';
  position: absolute;
  left: 0;
  top: -8vh;
  width: 2px;
  height: 2px;
  border-radius: 50%;
  background: rgba(var(--rwc-fx-accent), .30);
  box-shadow:
    3vw 2vh 3px rgba(var(--rwc-fx-accent), .34), 8vw 13vh 4px rgba(var(--rwc-fx-accent), .22),
    14vw 5vh 3px rgba(var(--rwc-fx-accent), .30), 20vw 18vh 5px rgba(var(--rwc-fx-accent), .19),
    27vw 9vh 3px rgba(var(--rwc-fx-accent), .28), 33vw 1vh 4px rgba(var(--rwc-fx-accent), .22),
    39vw 16vh 3px rgba(var(--rwc-fx-accent), .31), 46vw 7vh 5px rgba(var(--rwc-fx-accent), .20),
    52vw 20vh 3px rgba(var(--rwc-fx-accent), .27), 58vw 4vh 4px rgba(var(--rwc-fx-accent), .24),
    65vw 14vh 3px rgba(var(--rwc-fx-accent), .32), 71vw 8vh 5px rgba(var(--rwc-fx-accent), .18),
    77vw 19vh 3px rgba(var(--rwc-fx-accent), .27), 83vw 3vh 4px rgba(var(--rwc-fx-accent), .23),
    89vw 12vh 3px rgba(var(--rwc-fx-accent), .30), 95vw 17vh 5px rgba(var(--rwc-fx-accent), .18);
  opacity: 0;
  animation: rwc-soft-snow 13.5s linear infinite;
}
.rwc-fx-snow::after {
  left: 4vw;
  top: -19vh;
  transform: scale(.72);
  animation-duration: 17.2s;
  animation-delay: -6.1s;
  opacity: .72;
}
@keyframes rwc-soft-snow {
  0%   { opacity: 0; transform: translate3d(-1.5vw, -6vh, 0); }
  8%   { opacity: .72; }
  55%  { opacity: .56; transform: translate3d(.8vw, 22vh, 0); }
  78%  { opacity: .30; transform: translate3d(2.3vw, 38vh, 0); }
  100% { opacity: 0; transform: translate3d(3.6vw, 52vh, 0); }
}


/* Large soft accent haze. No blur filter: gradients stay cheap to render. */
.rwc-fx-aurora {
  opacity: .34;
  background:
    radial-gradient(55vw 38vh at 12% 8%, rgba(var(--rwc-fx-accent), .15), rgba(var(--rwc-fx-accent), .045) 38%, transparent 72%),
    radial-gradient(48vw 34vh at 88% 18%, rgba(var(--rwc-fx-accent), .11), rgba(var(--rwc-fx-accent), .03) 42%, transparent 74%);
  animation: rwc-soft-aurora 18s ease-in-out infinite alternate;
}
@keyframes rwc-soft-aurora {
  0%   { opacity: .22; transform: translate3d(-1.2vw, -.5vh, 0) scale(1.01); }
  50%  { opacity: .38; }
  100% { opacity: .25; transform: translate3d(1.8vw, 1.2vh, 0) scale(1.045); }
}


/* Floating soft circles around the edges. */
.rwc-fx-orbs {
  opacity: .30;
  background:
    radial-gradient(circle 85px at 8% 28%, rgba(var(--rwc-fx-accent), .12) 0 18%, rgba(var(--rwc-fx-accent), .045) 42%, transparent 72%),
    radial-gradient(circle 120px at 92% 68%, rgba(var(--rwc-fx-accent), .10) 0 17%, rgba(var(--rwc-fx-accent), .035) 45%, transparent 74%),
    radial-gradient(circle 70px at 72% 12%, rgba(var(--rwc-fx-accent), .09) 0 20%, transparent 70%);
  animation: rwc-floating-orbs 15s ease-in-out infinite alternate;
}
@keyframes rwc-floating-orbs {
  0%   { transform: translate3d(-.8vw, 1vh, 0) scale(.99); opacity: .20; }
  50%  { opacity: .34; }
  100% { transform: translate3d(1.2vw, -1.5vh, 0) scale(1.035); opacity: .24; }
}


/* Rare diagonal light sweep, subtle enough not to distract from tables/forms. */
.rwc-fx-sweep::before {
  content: '';
  position: absolute;
  top: -35vh;
  left: -36vw;
  width: 24vw;
  height: 170vh;
  opacity: 0;
  transform: rotate(18deg) translate3d(0, 0, 0);
  background: linear-gradient(90deg, transparent, rgba(var(--rwc-fx-accent), .055), rgba(var(--rwc-fx-accent), .12), rgba(var(--rwc-fx-accent), .055), transparent);
  animation: rwc-soft-sweep 14s ease-in-out infinite;
}
@keyframes rwc-soft-sweep {
  0%, 38%  { opacity: 0; transform: rotate(18deg) translate3d(0, 0, 0); }
  45%      { opacity: .42; }
  68%      { opacity: .22; }
  76%,100% { opacity: 0; transform: rotate(18deg) translate3d(175vw, 0, 0); }
}


@media (prefers-reduced-motion: reduce) {
  #rwc-effects .rwc-fx,
  #rwc-effects .rwc-fx::before,
  #rwc-effects .rwc-fx::after {
    animation: none !important;
  }
  .rwc-fx-snow, .rwc-fx-sweep { display: none !important; }
}