:root{
  --rc-glass: rgba(20, 22, 28, .55);
  --rc-glass-strong: rgba(24, 27, 35, .72);
  --rc-glass-soft: rgba(255, 255, 255, .07);
  --rc-glass-line: rgba(255, 255, 255, .16);
  --rc-glass-highlight: rgba(255, 255, 255, .22);
  --rc-glass-shadow: 0 24px 70px rgba(0, 0, 0, .38), inset 0 1px 0 rgba(255, 255, 255, .12);
}

/* Cross-project blocking dialog: same liquid glass as the player picker. */
html.rc-app-bg .modal:has(.rcc-ban-modal){
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.13), transparent 46%),
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.032)) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.17) !important;
  -webkit-backdrop-filter: blur(34px) saturate(180%) !important;
  backdrop-filter: blur(34px) saturate(180%) !important;
}

html.rc-app-bg .rcc-ban-modal,
html.rc-app-bg .rcc-ban-modal > .divided-card,
html.rc-app-bg .rcc-ban-modal > .divided-card > .header,
html.rc-app-bg .rcc-ban-modal > .divided-card > .content,
html.rc-app-bg .rcc-ban-modal > .divided-card > .footer{
  border-color: rgba(255,255,255,.10) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg .rcc-ban-modal > .divided-card > .header{
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.008)) !important;
}

html.rc-app-bg .rcc-ban-modal .items-row > .item{
  border: 1px solid rgba(255,255,255,.15) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.11), transparent 48%),
    linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.025)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 10px 26px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(18px) saturate(150%) !important;
  backdrop-filter: blur(18px) saturate(150%) !important;
}

html.rc-app-bg .rcc-ban-modal .ra-button{
  border: 1px solid rgba(255,255,255,.15) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.03)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 20px rgba(0,0,0,.18) !important;
}

/* Alert details: VPN/IP and cross-project ban dialogs. */
html.rc-app-bg .modal:has(.ip-details-modal),
html.rc-app-bg .modal:has(.ban-view-modal),
html.rc-app-bg .modal:has(.rcc-ban-modal),
html.rc-app-bg .ip-details-modal,
html.rc-app-bg .ban-view-modal,
html.rc-app-bg .rcc-ban-modal{
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 19px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.10), transparent 38%),
    linear-gradient(150deg, rgba(27,30,38,.72), rgba(6,8,12,.64)) !important;
  box-shadow: 0 30px 85px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.13) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .rcc-ban-modal .items-row > .item.rc-project-link{
  cursor: pointer !important;
  transition: border-color .17s ease, background .17s ease, transform .17s ease !important;
}

html.rc-app-bg .rcc-ban-modal .items-row > .item.rc-project-link:hover,
html.rc-app-bg .rcc-ban-modal .items-row > .item.rc-project-link:focus-visible{
  transform: translateY(-1px) !important;
  border-color: rgba(255,255,255,.24) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.12), rgba(255,255,255,.038)) !important;
  outline: none !important;
}

html.rc-app-bg .rcc-ban-modal .items-row > .item .message:empty,
html.rc-app-bg .rcc-ban-modal .items-row > .item .skeleton{
  display: none !important;
}

html.rc-app-bg .rcc-ban-modal .items-row > .item img{
  opacity: 1 !important;
}

/* Mute and ban details: compact neutral liquid glass. */
html.rc-app-bg body .modal:has(.mute-view-modal),
html.rc-app-bg body .modal:has(.ban-view-modal){
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255,255,255,.13), transparent 47%),
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.032)) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.17) !important;
  -webkit-backdrop-filter: blur(34px) saturate(180%) !important;
  backdrop-filter: blur(34px) saturate(180%) !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal),
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .modal-border:has(.rcc-ban-modal){
  transition: opacity .14s ease, transform .14s ease !important;
}

html.rc-app-bg.rc-closing-ban-dialog #app > .base{
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
}

/* Vue keeps the backdrop node briefly after this alert closes.  A leaving
   backdrop must never continue dimming or intercepting the page. */
html.rc-app-bg #app > .base.fade-leave-active,
html.rc-app-bg #app > .base.fade-leave-to{
  display: none !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: none !important;
}

/* Statistics — neutral liquid glass, with only the large surfaces blurred.
   Containment and deferred off-screen charts keep the dashboard responsive. */
html.rc-app-bg[data-rc-stats-page] .titled-layout{
  --rc-stat-glass: linear-gradient(145deg, rgba(255,255,255,.080), rgba(255,255,255,.025));
  --rc-stat-glass-soft: linear-gradient(145deg, rgba(255,255,255,.052), rgba(255,255,255,.014));
  --rc-stat-line: rgba(255,255,255,.115);
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .tabbed-navigation > .header,
html.rc-app-bg[data-rc-stats-page] .titled-layout .card-wrapper > .card,
html.rc-app-bg[data-rc-stats-page] .titled-layout .chart,
html.rc-app-bg[data-rc-stats-page] .titled-layout [class*="top-list"],
html.rc-app-bg[data-rc-stats-page] .titled-layout [class*="reason"]{
  background: var(--rc-stat-glass) !important;
  border: 1px solid var(--rc-stat-line) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 46px rgba(0,0,0,.22) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .tabbed-navigation > .header{
  width: fit-content;
  padding: 4px !important;
  border-radius: 13px !important;
  -webkit-backdrop-filter: blur(20px) saturate(135%) !important;
  backdrop-filter: blur(20px) saturate(135%) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .tabbed-navigation > .header .element{
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  background: transparent !important;
  color: rgba(255,255,255,.58) !important;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .tabbed-navigation > .header .element:hover,
html.rc-app-bg[data-rc-stats-page] .titled-layout .tabbed-navigation > .header .element.selected{
  color: rgba(255,255,255,.94) !important;
  border-color: rgba(255,255,255,.12) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .card-wrapper{
  gap: 12px !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .card-wrapper > .card{
  overflow: hidden !important;
  border-radius: 16px !important;
  contain: layout paint style;
  /* Several simultaneous GPU blur layers made the charts stutter badly on
     integrated graphics. The glass gradient/border remains, without a live
     full-card backdrop repaint on every chart frame. */
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .card-wrapper > .card .gradient{
  opacity: .18 !important;
  filter: saturate(.55) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .chart{
  overflow: hidden !important;
  border-radius: 18px !important;
  background: var(--rc-stat-glass-soft) !important;
  contain: layout paint style;
  content-visibility: auto;
  contain-intrinsic-size: auto 340px;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .chart > .header{
  padding: 14px 16px !important;
  background: rgba(255,255,255,.025) !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .select,
html.rc-app-bg[data-rc-stats-page] .titled-layout .p-inputtext,
html.rc-app-bg[data-rc-stats-page] .titled-layout .rounded-md:has(.p-calendar){
  color: rgba(255,255,255,.84) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018)) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 11px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .select:hover,
html.rc-app-bg[data-rc-stats-page] .titled-layout .rounded-md:has(.p-calendar):hover{
  border-color: rgba(255,255,255,.20) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.025)) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .divider-wrapper .line,
html.rc-app-bg[data-rc-stats-page] .titled-layout .apexcharts-gridline{
  border-color: rgba(255,255,255,.07) !important;
  stroke: rgba(255,255,255,.07) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .apexcharts-text,
html.rc-app-bg[data-rc-stats-page] .titled-layout .apexcharts-legend-text{
  fill: rgba(255,255,255,.55) !important;
  color: rgba(255,255,255,.55) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .apexcharts-tooltip{
  border: 1px solid rgba(255,255,255,.13) !important;
  background: rgba(14,15,18,.72) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .card-wrapper > .card,
html.rc-app-bg[data-rc-stats-page] .titled-layout .chart,
html.rc-app-bg[data-rc-stats-page] .titled-layout .apexcharts-series path,
html.rc-app-bg[data-rc-stats-page] .titled-layout .apexcharts-canvas{
  animation: none !important;
  transition: none !important;
}

/* Remaining statistics surfaces: player capacity, geo/verdict/top cards and menus. */
html.rc-app-bg[data-rc-stats-page] .titled-layout .online-card,
html.rc-app-bg[data-rc-stats-page] .titled-layout .geo{
  overflow: visible !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 17px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.075), transparent 46%),
    linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 18px 46px rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .online-card{
  padding: 16px !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .geo{
  padding: 18px 0 !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .geo > .flex:first-child{
  padding-bottom: 14px !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .geo .max-h-\[396px\]{
  border-top: 1px solid rgba(255,255,255,.065) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.018), transparent 55%) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .geo .max-h-\[396px\] > .flex > div:not(.icon),
html.rc-app-bg[data-rc-stats-page] .titled-layout .geo .max-h-\[396px\] > div > div:not(.icon){
  border-color: rgba(255,255,255,.075) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.040), rgba(255,255,255,.012)) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .progress-bar{
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 999px !important;
  background: rgba(2,3,5,.45) !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.48), 0 1px 0 rgba(255,255,255,.035) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .select .activator{
  border-radius: 10px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018)) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .select .activator:hover,
html.rc-app-bg[data-rc-stats-page] .titled-layout .select .activator.-opened{
  border-color: rgba(255,255,255,.20) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.028)) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .select .options-list{
  overflow: hidden !important;
  padding: 5px !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 12px !important;
  background:
    radial-gradient(circle at 14% 0%, rgba(255,255,255,.095), transparent 48%),
    rgba(14,15,18,.72) !important;
  box-shadow: 0 20px 55px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.08) !important;
  -webkit-backdrop-filter: blur(26px) saturate(145%) !important;
  backdrop-filter: blur(26px) saturate(145%) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .select .options-list .option{
  min-height: 32px !important;
  padding: 7px 9px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: rgba(255,255,255,.68) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .select .options-list .option:hover,
html.rc-app-bg[data-rc-stats-page] .titled-layout .select .options-list .option.-selected{
  color: rgba(255,255,255,.95) !important;
  border-color: rgba(255,255,255,.11) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.025)) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .button-select-container{
  padding: 3px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 10px !important;
  background: rgba(3,4,6,.34) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .button-select{
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: rgba(255,255,255,.42) !important;
}

html.rc-app-bg[data-rc-stats-page] .titled-layout .button-select:hover,
html.rc-app-bg[data-rc-stats-page] .titled-layout .button-select.-active{
  color: rgba(255,255,255,.88) !important;
  border-color: rgba(255,255,255,.10) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.025)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06) !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .header{
  min-height: 72px !important;
  padding: 15px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.045), transparent) !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header{
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  gap: 14px !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header .header-title{
  display: block !important;
  color: rgba(255,255,255,.94) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header .header-subtitle{
  display: block !important;
  margin-top: 2px !important;
  color: rgba(226,232,240,.52) !important;
  font-size: 12px !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .content{
  padding: 14px !important;
  background: transparent !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .row{
  min-height: 38px !important;
  margin: 0 !important;
  padding: 8px 10px !important;
  border: 1px solid rgba(255,255,255,.095) !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.07), rgba(255,255,255,.02)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .rows,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .flex.flex-col{
  gap: 7px !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) :is(.comment,.ban-view-comment,blockquote){
  padding: 11px 12px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 11px !important;
  color: rgba(248,250,252,.82) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.065), rgba(255,255,255,.018)) !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .footer{
  padding: 12px 14px 14px !important;
  border-top: 1px solid rgba(255,255,255,.08) !important;
  background: linear-gradient(0deg, rgba(0,0,0,.13), transparent) !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ra-button{
  min-height: 38px !important;
  padding: 8px 13px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.86) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.03)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 8px 20px rgba(0,0,0,.17) !important;
  transition: transform .17s ease, border-color .17s ease, background .17s ease !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ra-button:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(255,255,255,.23) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important;
}

/* Remove native black header/avatar outlines from mute and ban dialogs. */
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .header,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .content,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .footer{
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .header{
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.085) !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header .append,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header .image,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header .img-box,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header img{
  outline: 0 !important;
  border-color: rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 7px 18px rgba(0,0,0,.18) !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header .append{
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 50% !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .header,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .header.apply-border,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header{
  border: 0 !important;
  outline: 0 !important;
  background-color: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .header::before,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) > .divided-card > .header::after,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header::before,
html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header::after{
  display: none !important;
  content: none !important;
}

html.rc-app-bg body :is(.mute-view-modal,.ban-view-modal) .ban-view-header :is(.append,.image,.img-box,img){
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* VPN details uses the same single-layer glass surface as blocking details. */
html.rc-app-bg body .modal:has(.ip-details-modal){
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255,255,255,.13), transparent 47%),
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.032)) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.17) !important;
  -webkit-backdrop-filter: blur(34px) saturate(180%) !important;
  backdrop-filter: blur(34px) saturate(180%) !important;
}

html.rc-app-bg body .ip-details-modal{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Blocking alert uses a separate modal component. */
html.rc-app-bg .rcc-ban-modal > .divided-card{
  overflow: hidden !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg .rcc-ban-modal > .divided-card > .header,
html.rc-app-bg .rcc-ban-modal > .divided-card > .content,
html.rc-app-bg .rcc-ban-modal > .divided-card > .footer{
  background: transparent !important;
}

html.rc-app-bg .rcc-ban-modal > .divided-card > .header{
  padding: 14px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.045), transparent) !important;
}

html.rc-app-bg .rcc-ban-modal > .divided-card > .content{
  padding: 14px 16px !important;
}

html.rc-app-bg .rcc-ban-modal > .divided-card > .footer{
  padding: 12px 16px 14px !important;
  border-top: 1px solid rgba(255,255,255,.075) !important;
  background: linear-gradient(0deg, rgba(0,0,0,.13), transparent) !important;
}

html.rc-app-bg .rcc-ban-modal .items-row{
  gap: 7px !important;
  overflow: visible !important;
  margin-top: 9px !important;
  background: transparent !important;
}

html.rc-app-bg .rcc-ban-modal .items-row > .item{
  padding: 8px 10px !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.022)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 9px 24px rgba(0,0,0,.14) !important;
}

html.rc-app-bg .rcc-ban-modal .items-row > .item .image-lines-container{
  padding: 0 !important;
  background: transparent !important;
}

html.rc-app-bg .rcc-ban-modal .label{
  color: rgba(248,250,252,.9) !important;
}

html.rc-app-bg .rcc-ban-modal .text-grey-600,
html.rc-app-bg .rcc-ban-modal .message{
  color: rgba(226,232,240,.55) !important;
}

html.rc-app-bg .rcc-ban-modal .ra-button{
  min-height: 38px !important;
  padding: 8px 13px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.84) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.03)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 8px 20px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
}

html.rc-app-bg .rcc-ban-modal .ra-button:hover{
  border-color: rgba(255,255,255,.22) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important;
}

html.rc-app-bg .ip-details-modal > .header,
html.rc-app-bg .ban-view-modal > .header,
html.rc-app-bg .modal:has(.ip-details-modal) > .header,
html.rc-app-bg .modal:has(.ban-view-modal) > .header{
  min-height: 58px !important;
  padding: 14px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,.085) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.045), transparent) !important;
}

html.rc-app-bg .ip-details-modal .content,
html.rc-app-bg .ban-view-modal .content{
  padding: 14px 16px !important;
  background: transparent !important;
}

html.rc-app-bg .ip-details-modal > .divided-card,
html.rc-app-bg .ban-view-modal > .divided-card{
  overflow: hidden !important;
  border: 0 !important;
  border-radius: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .ip-details-modal > .divided-card > .content,
html.rc-app-bg .ban-view-modal > .divided-card > .content{
  padding: 14px 16px !important;
  background: transparent !important;
}

html.rc-app-bg .ip-details-modal > .divided-card > .content > .content,
html.rc-app-bg .ban-view-modal > .divided-card > .content > .content{
  padding: 0 !important;
}

html.rc-app-bg .ip-details-modal .rows{
  gap: 6px !important;
}

html.rc-app-bg .ip-details-modal .rows .row,
html.rc-app-bg .ban-view-modal .row{
  min-height: 36px !important;
  margin: 0 !important;
  padding: 7px 9px !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.065), rgba(255,255,255,.018)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html.rc-app-bg .ip-details-modal .rows .row .name,
html.rc-app-bg .ban-view-modal .row .name{
  color: rgba(226,232,240,.58) !important;
}

html.rc-app-bg .ip-details-modal .rows .row .value,
html.rc-app-bg .ban-view-modal .row .value{
  color: rgba(248,250,252,.89) !important;
  font-weight: 500 !important;
}

html.rc-app-bg .ip-details-modal .rows + p,
html.rc-app-bg .ban-view-modal .rows + p{
  margin-top: 14px !important;
}

html.rc-app-bg .ip-details-modal .footer,
html.rc-app-bg .ban-view-modal .footer{
  padding: 12px 16px 14px !important;
  border-top: 1px solid rgba(255,255,255,.075) !important;
  background: linear-gradient(0deg, rgba(0,0,0,.13), transparent) !important;
}

html.rc-app-bg .ip-details-modal :is(.bg-grey-900,.bg-grey-850,.bg-grey-800,.bg-grey-750),
html.rc-app-bg .ban-view-modal :is(.bg-grey-900,.bg-grey-850,.bg-grey-800,.bg-grey-750),
html.rc-app-bg .ip-details-modal .items-row .item,
html.rc-app-bg .ban-view-modal .items-row .item{
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.065), rgba(255,255,255,.022)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

html.rc-app-bg .ip-details-modal .items-row,
html.rc-app-bg .ban-view-modal .items-row{
  gap: 5px !important;
  overflow: visible !important;
  border-radius: 0 !important;
}

html.rc-app-bg .ip-details-modal .player-box,
html.rc-app-bg .ban-view-modal .player-box,
html.rc-app-bg .ban-view-modal .project-box,
html.rc-app-bg .ban-view-modal [class*="project"]:has(.image-lines-container){
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 8px 22px rgba(0,0,0,.13) !important;
}

html.rc-app-bg .ip-details-modal .player-box{
  margin-top: 8px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.05), rgba(255,255,255,.012)) !important;
}

html.rc-app-bg .ip-details-modal .player-box .player-box{
  margin-top: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg .ip-details-modal .image-lines-container,
html.rc-app-bg .ban-view-modal .image-lines-container{
  padding: 8px !important;
  background: transparent !important;
}

html.rc-app-bg .ip-details-modal .title,
html.rc-app-bg .ban-view-modal .title,
html.rc-app-bg .ban-view-modal .header-title{
  color: rgba(255,255,255,.93) !important;
}

html.rc-app-bg .ip-details-modal .subtitle,
html.rc-app-bg .ban-view-modal .subtitle,
html.rc-app-bg .ip-details-modal .message,
html.rc-app-bg .ban-view-modal .message{
  color: rgba(226,232,240,.57) !important;
}

html.rc-app-bg .ip-details-modal svg,
html.rc-app-bg .ban-view-modal svg{
  fill: currentColor !important;
  color: rgba(226,232,240,.62) !important;
}

html.rc-app-bg .ip-details-modal .ra-button,
html.rc-app-bg .ban-view-modal .ra-button{
  min-height: 38px !important;
  padding: 8px 13px !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.84) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.09), rgba(255,255,255,.03)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 8px 20px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
  transition: transform .17s ease, border-color .17s ease, background .17s ease !important;
}

html.rc-app-bg .ip-details-modal .ra-button:hover,
html.rc-app-bg .ban-view-modal .ra-button:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(255,255,255,.22) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.14), rgba(255,255,255,.045)) !important;
}

html.rc-app-bg .ip-details-modal .ra-button:active,
html.rc-app-bg .ban-view-modal .ra-button:active{
  transform: scale(.98) !important;
}

html.rc-app-bg .ip-details-modal .skeleton,
html.rc-app-bg .ban-view-modal .skeleton{
  background: linear-gradient(90deg, rgba(255,255,255,.045), rgba(255,255,255,.10), rgba(255,255,255,.045)) !important;
}

@media (max-width: 520px){
  html.rc-app-bg .ip-details-modal,
  html.rc-app-bg .ban-view-modal{
    width: calc(100vw - 22px) !important;
    border-radius: 17px !important;
  }
}

/* Project switcher: neutral liquid glass instead of flat grey. */
html.rc-app-bg .select-wrapper .select.project-selector{
  width: fit-content !important;
  max-width: 100% !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .activator{
  position: relative !important;
  overflow: hidden !important;
  min-height: 34px !important;
  padding: 6px 9px !important;
  width: fit-content !important;
  max-width: 100% !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.91) !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: border-color .18s ease, background .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .activator span{
  overflow: visible !important;
  max-width: none !important;
  text-overflow: clip !important;
  white-space: nowrap !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .activator:hover,
html.rc-app-bg .select-wrapper .select.project-selector .activator:active,
html.rc-app-bg .select-wrapper .select.project-selector .activator:focus-visible,
html.rc-app-bg .select-wrapper .select.project-selector .activator.-opened{
  border-color: rgba(255,255,255,.22) !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.17), transparent 44%),
    linear-gradient(145deg, rgba(255,255,255,.115), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.17), 0 14px 34px rgba(0,0,0,.24) !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list{
  isolation: isolate !important;
  min-width: 190px !important;
  margin-top: 8px !important;
  padding: 7px !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 15px !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.13), transparent 42%),
    linear-gradient(155deg, rgba(28,31,39,.66), rgba(7,9,14,.54)) !important;
  box-shadow: 0 24px 58px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.13) !important;
  -webkit-backdrop-filter: blur(28px) saturate(145%) !important;
  backdrop-filter: blur(28px) saturate(145%) !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list .select-label{
  margin: 2px 6px 6px !important;
  color: rgba(232,236,244,.48) !important;
  font-size: 12px !important;
  letter-spacing: .02em !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list .option{
  min-height: 34px !important;
  margin: 2px 0 !important;
  padding: 6px 8px !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  color: rgba(244,246,250,.72) !important;
  background: transparent !important;
  transition: color .16s ease, border-color .16s ease, background .16s ease, transform .16s ease !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list .option:hover,
html.rc-app-bg .select-wrapper .select.project-selector .options-list .option.-active,
html.rc-app-bg .select-wrapper .select.project-selector .options-list .option.-selected{
  color: rgba(255,255,255,.96) !important;
  border-color: rgba(255,255,255,.12) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.115), rgba(255,255,255,.04)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 7px 18px rgba(0,0,0,.14) !important;
  transform: translateX(1px) !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list .option .icon{
  fill: currentColor !important;
  opacity: .72 !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .avatar{
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

/* Drawings: compact, neutral Frosted Glass cards. */
html.rc-app-bg .signage-card{
  position: relative !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .10), transparent 34%),
    linear-gradient(150deg, rgba(255, 255, 255, .075), rgba(8, 10, 15, .48) 58%, rgba(4, 6, 10, .60)) !important;
  box-shadow:
    0 22px 55px rgba(0, 0, 0, .30),
    inset 0 1px 0 rgba(255, 255, 255, .12) !important;
  -webkit-backdrop-filter: blur(22px) saturate(135%) !important;
  backdrop-filter: blur(22px) saturate(135%) !important;
  transition: transform .22s ease, border-color .22s ease, box-shadow .22s ease !important;
}

html.rc-app-bg .signage-card:hover{
  transform: translateY(-3px) !important;
  border-color: rgba(255, 255, 255, .22) !important;
  box-shadow:
    0 28px 70px rgba(0, 0, 0, .38),
    inset 0 1px 0 rgba(255, 255, 255, .16) !important;
}

html.rc-app-bg .signage-card::after{
  content: "";
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
  border-radius: inherit;
  background: linear-gradient(125deg, rgba(255,255,255,.07), transparent 24%, transparent 76%, rgba(255,255,255,.025));
}

html.rc-app-bg .signage-card > :first-child{
  position: relative !important;
  margin: 10px 10px 0 !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 13px !important;
  background: rgba(4, 6, 10, .34) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 12px 28px rgba(0,0,0,.20) !important;
}

html.rc-app-bg .signage-card .gallery,
html.rc-app-bg .signage-card .gallery img{
  border-radius: 12px !important;
}

html.rc-app-bg .signage-card .gallery img{
  transition: transform .35s ease, filter .35s ease !important;
}

html.rc-app-bg .signage-card:hover .gallery img{
  transform: scale(1.018) !important;
  filter: brightness(1.035) saturate(1.04) !important;
}

html.rc-app-bg .signage-card .footer{
  position: relative !important;
  z-index: 4 !important;
  display: flex !important;
  flex-direction: column !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  padding: 12px 14px 10px !important;
  border: 0 !important;
  background: transparent !important;
}

html.rc-app-bg .signage-card .footer > .flex{
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 10px !important;
  width: 100% !important;
}

html.rc-app-bg .signage-card .player-box{
  min-width: 0 !important;
  flex: 1 1 auto !important;
}

html.rc-app-bg .signage-card .player-box .image-lines-container{
  min-height: 38px !important;
  padding: 4px 6px !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.035) !important;
  transition: background-color .18s ease !important;
}

html.rc-app-bg .signage-card .player-box .image-lines-container:hover{
  background: rgba(255,255,255,.075) !important;
}

html.rc-app-bg .signage-card .buttons{
  flex: 0 0 auto !important;
  width: auto !important;
  margin: 0 !important;
}

html.rc-app-bg .signage-card .buttons .ra-button.preset.destructive{
  width: 40px !important;
  min-width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.76) !important;
  fill: currentColor !important;
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 8px 22px rgba(0,0,0,.20) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  backdrop-filter: blur(12px) !important;
  transition: transform .18s ease, color .18s ease, border-color .18s ease, background .18s ease !important;
}

html.rc-app-bg .signage-card .buttons .ra-button.preset.destructive:hover{
  transform: translateY(-1px) !important;
  color: rgba(255, 226, 226, .96) !important;
  border-color: rgba(255, 126, 126, .30) !important;
  background: linear-gradient(145deg, rgba(255,90,90,.18), rgba(255,255,255,.045)) !important;
}

html.rc-app-bg .signage-card .buttons .ra-button.preset.destructive:active{
  transform: translateY(0) scale(.96) !important;
}

html.rc-app-bg .signage-card .buttons .ra-button.preset.destructive svg{
  width: 18px !important;
  height: 18px !important;
  fill: currentColor !important;
}

html.rc-app-bg .signage-card .meta-info{
  position: relative !important;
  z-index: 4 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 10px 11px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 13px !important;
  background: rgba(3, 5, 9, .24) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

html.rc-app-bg .signage-card .meta-info .row{
  min-height: 25px !important;
  gap: 12px !important;
}

html.rc-app-bg .signage-card .meta-info .text{
  color: rgba(226, 231, 239, .52) !important;
}

html.rc-app-bg .signage-card .meta-info .value{
  color: rgba(248, 250, 252, .88) !important;
  font-weight: 500 !important;
}

@media (prefers-reduced-motion: reduce){
  html.rc-app-bg .signage-card,
  html.rc-app-bg .signage-card .gallery img,
  html.rc-app-bg .signage-card .buttons .ra-button.preset.destructive{
    transition: none !important;
  }
}

/* Stable employee profile: prevent the native transition and late restyling flash. */
html.rc-app-bg .client-details-modal:not(.rc-employee-ready){
  visibility: hidden !important;
}

html.rc-app-bg .client-details-modal.rc-employee-ready{
  visibility: visible !important;
}

html.rc-app-bg .modal-border:has(.client-details-modal),
html.rc-app-bg .modal-border.pop-enter-active:has(.client-details-modal),
html.rc-app-bg .modal-border.pop-enter-from:has(.client-details-modal),
html.rc-app-bg .modal-border.pop-enter-to:has(.client-details-modal),
html.rc-app-bg .modal-border.pop-leave-active:has(.client-details-modal),
html.rc-app-bg .modal-border.pop-leave-from:has(.client-details-modal),
html.rc-app-bg .modal-border.pop-leave-to:has(.client-details-modal),
html.rc-app-bg body:has(.client-details-modal) .modal-backdrop{
  animation: none !important;
  transition: none !important;
  transform: none !important;
  will-change: auto !important;
}

html.rc-app-bg .modal-border:has(.client-details-modal){
  opacity: 1 !important;
}

/* Alerts page: neutral liquid glass without the blue cast. */
body[data-checkapp-page*="/alerts"] #rc-app-bg,
html.rc-app-bg body[data-checkapp-page*="/alerts"]{
  background:
    radial-gradient(circle at 18% 3%, rgba(255,255,255,.075), transparent 35%),
    radial-gradient(circle at 86% 12%, rgba(255,255,255,.035), transparent 31%),
    linear-gradient(155deg, #111318 0%, #080a0e 54%, #050608 100%) !important;
}

body[data-checkapp-page*="/alerts"] #rc-app-bg .bg{
  background:
    radial-gradient(ellipse 72% 52% at 16% 4%, rgba(255,255,255,.075), transparent 67%),
    radial-gradient(ellipse 66% 48% at 90% 6%, rgba(255,255,255,.035), transparent 70%),
    linear-gradient(155deg, #111318 0%, #080a0e 54%, #050608 100%) !important;
}

body[data-checkapp-page*="/alerts"] #rc-app-bg .bg::before{
  background: radial-gradient(circle at 36% 18%, rgba(255,255,255,.065), transparent 31%) !important;
  opacity: .58 !important;
  animation: none !important;
}

body[data-checkapp-page*="/alerts"] #rc-app-bg :is(.orb,.ring){
  display: none !important;
}

body[data-checkapp-page*="/alerts"] .alerts{
  padding: 8px !important;
  background: transparent !important;
}

body[data-checkapp-page*="/alerts"] .alerts > div:not(.empty),
body[data-checkapp-page*="/alerts"] .alerts > div > div:not(.alert-skeleton){
  border-color: rgba(255,255,255,.075) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.055), rgba(255,255,255,.012)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

body[data-checkapp-page*="/alerts"] .alerts .icon{
  border: 1px solid rgba(255,255,255,.12) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 18px rgba(0,0,0,.18) !important;
}

html.rc-app-bg .ip-details-modal .rc-ip-updated-value{
  width: auto !important;
  height: auto !important;
  margin-left: auto !important;
  color: rgba(248,250,252,.86) !important;
  font-weight: 500 !important;
  white-space: nowrap !important;
}

/* Original player profile{
  background: linear-gradient(145deg, rgba(28,28,28,.82), rgba(7,7,7,.90)) !important;
  -webkit-backdrop-filter: blur(28px) saturate(125%) !important;
  backdrop-filter: blur(28px) saturate(125%) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.08) !important;
}

html.rc-app-bg #rc-app-bg .bg,
#rc-home .bg,
#rc-profile-bg .bg{
  background:
    radial-gradient(circle at 18% 12%, rgba(86, 156, 255, .28), transparent 36%),
    radial-gradient(circle at 83% 18%, rgba(174, 112, 255, .22), transparent 34%),
    radial-gradient(circle at 52% 82%, rgba(66, 208, 190, .13), transparent 38%),
    linear-gradient(145deg, #0c1019 0%, #080a10 48%, #030407 100%) !important;
}

/* Login and registration */
#rc-home .card,
#rc-home .control-pill,
#rc-home .chip,
#rc-home .social{
  background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035)) !important;
  border: 1px solid var(--rc-glass-line) !important;
  box-shadow: var(--rc-glass-shadow) !important;
  -webkit-backdrop-filter: blur(28px) saturate(165%) !important;
  backdrop-filter: blur(28px) saturate(165%) !important;
}

#rc-home .card{
  position: relative;
  overflow: hidden;
}

#rc-home .card::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(125deg, rgba(255,255,255,.14), transparent 28%, transparent 70%, rgba(120,170,255,.06));
}

#rc-home .input,
#rc-home .input:focus-within{
  background-color: rgba(255,255,255,.018) !important;
  background-image:
    radial-gradient(115% 150% at 14% -72%, rgba(255,255,255,.13), rgba(255,255,255,.018) 48%, transparent 72%),
    linear-gradient(180deg,rgba(255,255,255,.022),rgba(255,255,255,.006)) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.23) !important;
  border-bottom-color: rgba(255,255,255,.055) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075) !important;
  -webkit-backdrop-filter: blur(18px) saturate(100%) !important;
  backdrop-filter: blur(18px) saturate(100%) !important;
}

#rc-home .input:focus-within{
  background-color: rgba(255,255,255,.032) !important;
  border-color: rgba(255,255,255,.22) !important;
  border-top-color: rgba(255,255,255,.34) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

#rc-home .input input:-webkit-autofill,
#rc-home .input input:-webkit-autofill:hover,
#rc-home .input input:-webkit-autofill:focus{
  -webkit-box-shadow: 0 0 0 1000px rgba(255,255,255,.018) inset !important;
  box-shadow: 0 0 0 1000px rgba(255,255,255,.018) inset !important;
}

/* Main application shell */
html.rc-app-bg .layout .navigation-wrapper,
html.rc-app-bg .content.ignore-side > .header,
html.rc-app-bg .layout-page > .header,
html.rc-app-bg .content > .header{
  background: rgba(11, 14, 21, .48) !important;
  border-color: var(--rc-glass-line) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 18px 50px rgba(0,0,0,.2) !important;
  -webkit-backdrop-filter: blur(30px) saturate(170%) !important;
  backdrop-filter: blur(30px) saturate(170%) !important;
}

html.rc-app-bg .content .divided-card,
html.rc-app-bg .content .settings-container,
html.rc-app-bg .content .n-card,
html.rc-app-bg .content .n-data-table-wrapper,
html.rc-app-bg .content .n-data-table,
html.rc-app-bg .page-tip,
#rc-panel-home .rph-stat,
#rc-panel-home .rph-list-wrap,
#rc-panel-home .rph-server,
#rc-dash .glass-card,
#rc-dash .modal-card,
#rc-dash .settings-card,
html.rc-profile-on .profile:not(.signage-card):not(.client-edit-modal){
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.035)) !important;
  border: 1px solid var(--rc-glass-line) !important;
  box-shadow: var(--rc-glass-shadow) !important;
  -webkit-backdrop-filter: blur(26px) saturate(160%) !important;
  backdrop-filter: blur(26px) saturate(160%) !important;
}

html.rc-app-bg .search-input .input-box,
html.rc-app-bg .search-input .n-input,
html.rc-app-bg .search-input input,
html.rc-app-bg .content input,
html.rc-app-bg .content textarea,
html.rc-app-bg .content .n-base-selection,
#rc-dash .form-input,
#rc-dash .input-with-prefix,
#rc-dash .settings-field input,
#rc-dash .settings-field textarea{
  background: rgba(6, 9, 15, .43) !important;
  border-color: rgba(255,255,255,.13) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
}

html.rc-app-bg .navigation .item-row.router-link-active,
html.rc-app-bg .navigation a.router-link-active .item-row,
html.rc-app-bg .navigation .item-row.active,
html.rc-app-bg .content .n-tabs-tab.n-tabs-tab--active{
  background: linear-gradient(135deg, rgba(167,204,255,.18), rgba(255,255,255,.07)) !important;
  border: 1px solid rgba(193, 219, 255, .18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 8px 24px rgba(0,0,0,.16) !important;
}

.vfm__content,
.n-modal,
.n-popover,
.n-dropdown-menu,
.n-base-select-menu,
[role="dialog"]{
  background: rgba(18, 21, 28, .7) !important;
  border: 1px solid var(--rc-glass-line) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.11) !important;
  -webkit-backdrop-filter: blur(32px) saturate(175%) !important;
  backdrop-filter: blur(32px) saturate(175%) !important;
}

@supports not ((backdrop-filter: blur(2px)) or (-webkit-backdrop-filter: blur(2px))){
  #rc-home .card,
  html.rc-app-bg .layout .navigation-wrapper,
  html.rc-app-bg .content .n-card,
  html.rc-app-bg .content .divided-card,
  .vfm__content,
  .n-modal{ background: rgba(20, 23, 30, .94) !important; }
}

@media (prefers-reduced-motion: reduce){
  #rc-app-bg .orb,
  #rc-app-bg .ring{ animation: none !important; }
}

/* Disabled: experimental player-profile redesigns. The original profile styles
   from rc-ui-polish.css and rc-requested.css are active again. */
@media not all{
/* Player profile modal: match the personal-profile frosted glass language. */
html.rc-app-bg .modal-border:has(.player-modal) .modal,
html.rc-app-bg .player-modal {
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 22px !important;
  background:
    radial-gradient(circle at 82% 4%, rgba(255,255,255,.085), transparent 38%),
    linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.018)) !important;
  box-shadow: 0 34px 105px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.14) !important;
  -webkit-backdrop-filter: blur(22px) saturate(145%) !important;
  backdrop-filter: blur(22px) saturate(145%) !important;
}

html.rc-app-bg .player-modal .modal-menu-extended {
  height: 100% !important;
  background: transparent !important;
}

html.rc-app-bg .player-modal .modal-menu-extended > .nav {
  width: 224px !important;
  min-width: 224px !important;
  padding: 14px 10px !important;
  border-right: 1px solid rgba(255,255,255,.11) !important;
  background: linear-gradient(160deg, rgba(255,255,255,.075), rgba(255,255,255,.018)) !important;
  -webkit-backdrop-filter: blur(16px) !important;
  backdrop-filter: blur(16px) !important;
}

html.rc-app-bg .player-modal .nav .header {
  margin: 0 2px 12px !important;
  padding: 12px 8px 16px !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
  background: transparent !important;
}

html.rc-app-bg .player-modal .nav .header-bg {
  opacity: .10 !important;
  filter: grayscale(1) !important;
}

html.rc-app-bg .player-modal .nav .menu-item {
  min-height: 42px !important;
  margin: 3px 0 !important;
  padding: 10px 12px !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  color: rgba(240,240,240,.58) !important;
  background: transparent !important;
}

html.rc-app-bg .player-modal .nav .menu-item:hover {
  color: rgba(255,255,255,.86) !important;
  background: rgba(255,255,255,.055) !important;
  border-color: rgba(255,255,255,.07) !important;
}

html.rc-app-bg .player-modal .nav .menu-item.-active,
html.rc-app-bg .player-modal .nav .menu-item.active {
  color: rgba(255,255,255,.94) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.14), rgba(255,255,255,.055)) !important;
  border-color: rgba(255,255,255,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 22px rgba(0,0,0,.16) !important;
}

html.rc-app-bg .player-modal .nav .menu-item svg {
  fill: currentColor !important;
  opacity: .86 !important;
}

html.rc-app-bg .player-modal .modal-menu-extended > .content {
  min-width: 0 !important;
  padding: 0 !important;
  background: transparent !important;
}

html.rc-app-bg .player-modal .content-controls {
  background: rgba(255,255,255,.035) !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
}

html.rc-app-bg .player-modal .content-inner {
  padding: 18px !important;
  background: transparent !important;
  animation: none !important;
}

html.rc-app-bg .player-modal .modal-menu-page-layout,
html.rc-app-bg .player-modal .modal-menu-page-layout-content,
html.rc-app-bg .player-modal .general {
  background: transparent !important;
}

html.rc-app-bg .player-modal .tags {
  display: flex !important;
  flex-wrap: wrap !important;
  gap: 7px !important;
  margin-bottom: 14px !important;
}

html.rc-app-bg .player-modal .player-tag {
  min-height: 28px !important;
  padding: 5px 9px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.095), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
}

html.rc-app-bg .player-modal .table-card {
  margin-bottom: 14px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 14px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.022)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 14px 35px rgba(0,0,0,.13) !important;
}

html.rc-app-bg .player-modal .table-card > .flex,
html.rc-app-bg .player-modal .table-card > .header,
html.rc-app-bg .player-modal .table-card > .title {
  min-height: 42px !important;
  padding: 10px 13px !important;
  border-bottom: 1px solid rgba(255,255,255,.09) !important;
  color: rgba(255,255,255,.91) !important;
  background: rgba(255,255,255,.025) !important;
}

html.rc-app-bg .player-modal .table-card .cells {
  gap: 1px !important;
  background: rgba(255,255,255,.07) !important;
}

html.rc-app-bg .player-modal .table-card .cell,
html.rc-app-bg .player-modal .table-card .list-item {
  min-height: 54px !important;
  padding: 10px 12px !important;
  border: 0 !important;
  background: rgba(5,5,5,.20) !important;
}

html.rc-app-bg .player-modal .table-card .cell .title,
html.rc-app-bg .player-modal .table-card .list-item .title {
  color: rgba(242,242,242,.47) !important;
  font-size: 12px !important;
}

html.rc-app-bg .player-modal .table-card .cell .subtitle,
html.rc-app-bg .player-modal .table-card .list-item .subtitle {
  color: rgba(252,252,252,.88) !important;
  font-weight: 600 !important;
}

html.rc-app-bg .player-modal .actions .btn,
html.rc-app-bg .player-modal .nav-controls .controls-button,
html.rc-app-bg .player-modal .content-controls .controls-button {
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 10px !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

@media (max-width: 700px) {
  html.rc-app-bg .player-modal .modal-menu-extended > .nav {
    width: min(290px, 82vw) !important;
    min-width: min(290px, 82vw) !important;
  }
  html.rc-app-bg .player-modal .content-inner { padding: 12px !important; }
}

}

/* Billing history: keep the glass visible through every table row. */
html.rc-app-bg .content .bg-grey-1000,
html.rc-app-bg .content .bg-grey-950,
html.rc-app-bg .content .bg-grey-900,
html.rc-app-bg .content .bg-grey-850,
html.rc-app-bg .content .bg-grey-800,
html.rc-app-bg .content table,
html.rc-app-bg .content thead,
html.rc-app-bg .content tbody,
html.rc-app-bg .content tr,
html.rc-app-bg .content td,
html.rc-app-bg .content th{
  background-color: transparent !important;
}

html.rc-app-bg .content .n-data-table,
html.rc-app-bg .content .n-data-table-wrapper,
html.rc-app-bg .content table{
  background: linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 18px !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.1) !important;
  -webkit-backdrop-filter: blur(28px) saturate(165%) !important;
  backdrop-filter: blur(28px) saturate(165%) !important;
  overflow: hidden !important;
}

html.rc-app-bg .content tr:not(:last-child),
html.rc-app-bg .content .n-data-table-tr:not(:last-child){
  border-bottom: 1px solid rgba(255,255,255,.075) !important;
}

html.rc-app-bg .content tbody tr:hover,
html.rc-app-bg .content .n-data-table-tr:hover{
  background: rgba(255,255,255,.055) !important;
}

/* Staff cards and the staff Settings tab. */
html.rc-app-bg .content:has(a[href*="settings/clients"]) .divided-card,
html.rc-app-bg .content:has(a[href*="settings/clients"]) [class*="settings"],
html.rc-app-bg .content:has(a[href*="settings/clients"]) [class*="protection"],
#checkapp-staff-capacity .ca-staff-card,
.checkapp-native-staff-slot{
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.03)) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.1) !important;
  -webkit-backdrop-filter: blur(24px) saturate(160%) !important;
  backdrop-filter: blur(24px) saturate(160%) !important;
}

html.rc-app-bg .content .n-switch .n-switch__rail,
html.rc-app-bg .content [role="switch"]{
  background: rgba(5, 7, 11, .48) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: inset 0 1px 4px rgba(0,0,0,.4), 0 1px 0 rgba(255,255,255,.06) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
}

html.rc-app-bg .content img[src*="/uploads/"],
#checkapp-staff-capacity .ca-staff-avatar{
  border: 1px solid rgba(255,255,255,.22) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.32), 0 0 0 4px rgba(255,255,255,.045) !important;
}

/* Dashboard readability: stronger glass and WCAG-friendly text contrast. */
#rc-panel-home .rph-stat,
#rc-panel-home .rph-list-wrap,
#rc-panel-home .rph-server{
  background: linear-gradient(145deg, rgba(20,27,39,.76), rgba(18,15,31,.67)) !important;
  border-color: rgba(220,232,255,.24) !important;
  box-shadow: 0 18px 50px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.14) !important;
}

#rc-panel-home .rph-stat:hover,
#rc-panel-home .rph-server:hover{
  background: linear-gradient(145deg, rgba(29,38,54,.82), rgba(27,22,44,.74)) !important;
  border-color: rgba(220,232,255,.34) !important;
}

#rc-panel-home .rph-title,
#rc-panel-home .rph-list-title,
#rc-panel-home .rph-server-name,
#rc-panel-home .rph-stat-value{
  color: #fff !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.45);
}

#rc-panel-home .rph-sub,
#rc-panel-home .rph-stat-top,
#rc-panel-home .rph-list-sub,
#rc-panel-home .rph-slots,
#rc-panel-home .rph-players,
#rc-panel-home .rph-empty{
  color: rgba(235,241,252,.78) !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.35);
}

#rc-panel-home .rph-stat-hint,
#rc-panel-home .rph-upd{
  color: rgba(221,230,244,.68) !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.4);
}

#rc-panel-home .rph-head-icon,
#rc-panel-home .rph-list-ico{
  background: rgba(8,13,23,.62) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 8px 20px rgba(0,0,0,.2) !important;
}

#rc-panel-home .rph-ico{
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 5px 14px rgba(0,0,0,.22) !important;
}

#rc-panel-home .rph-badge.off{
  background: rgba(117,72,21,.72) !important;
  color: #ffd18b !important;
  border: 1px solid rgba(255,193,96,.22);
}

/* Chat controls and right-side settings. */
html.rc-app-bg body:has(.sidebar-content) .sidebar-content,
html.rc-app-bg body:has(.sidebar-content) *:has(> .sidebar-content),
html.rc-app-bg body:has(.sidebar-content) .sidebar-wrapper{
  background: linear-gradient(160deg, rgba(255,255,255,.07), rgba(255,255,255,.018)) !important;
  border-color: rgba(255,255,255,.13) !important;
  -webkit-backdrop-filter: blur(30px) saturate(165%) !important;
  backdrop-filter: blur(30px) saturate(165%) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content .settings-container{
  background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 17px !important;
  box-shadow: 0 18px 48px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.13) !important;
  -webkit-backdrop-filter: blur(25px) saturate(170%) !important;
  backdrop-filter: blur(25px) saturate(170%) !important;
  margin: 14px 18px !important;
}

/* Keep the collapse glyph outlined. Generic icon rules must not fill its paths. */
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn,
html.rc-app-bg .navigation-wrapper.closed .navigation .navigation-state-btn{
  color: rgba(255,255,255,.72) !important;
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn svg,
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn svg path{
  fill: none !important;
  stroke: rgba(255,255,255,.68) !important;
  color: rgba(255,255,255,.68) !important;
  opacity: 1 !important;
  filter: none !important;
}
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn:hover{
  color: #fff !important;
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.08) !important;
}
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn:hover svg path{
  stroke: #fff !important;
}

/* Slide-out settings rails: transparent liquid glass instead of an opaque slab. */
html.rc-app-bg .content-with-sidebar > .sidebar-wrapper,
html.rc-app-bg body:has(.sidebar-content) .sidebar-wrapper,
html.rc-app-bg body:has(.sidebar-content) *:has(> .sidebar-content){
  background: linear-gradient(155deg, rgba(24,24,25,.43), rgba(7,7,8,.30)) !important;
  background-color: transparent !important;
  border-color: rgba(255,255,255,.085) !important;
  box-shadow: -20px 0 55px rgba(0,0,0,.26), inset 1px 0 0 rgba(255,255,255,.06) !important;
  -webkit-backdrop-filter: blur(28px) saturate(112%) !important;
  backdrop-filter: blur(28px) saturate(112%) !important;
}
html.rc-app-bg body:has(.sidebar-content) .sidebar-content{
  background: rgba(255,255,255,.012) !important;
  background-color: transparent !important;
}
html.rc-app-bg body:has(.sidebar-content) .sidebar-content .settings-container{
  background: linear-gradient(145deg, rgba(255,255,255,.047), rgba(255,255,255,.011)) !important;
  background-color: transparent !important;
  border-color: rgba(255,255,255,.095) !important;
}

/* Server flow dialogs and webhook editor — visibly translucent liquid glass. */
html.rc-app-bg .modal-border .modal:has(.command-header),
html.rc-app-bg .modal-border .modal:has(.server-edit-modal),
html.rc-app-bg .modal-border .modal:has(.webhook-edit-modal),
html.rc-app-bg .vfm__content:has(.command-header),
html.rc-app-bg .vfm__content:has(.server-edit-modal),
html.rc-app-bg .vfm__content:has(.webhook-edit-modal){
  background:
    radial-gradient(110% 65% at 14% -5%, rgba(255,255,255,.105), transparent 58%),
    linear-gradient(145deg, rgba(24,24,25,.48), rgba(6,6,7,.34) 54%, rgba(18,18,19,.42)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 22px !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.15) !important;
  -webkit-backdrop-filter: blur(36px) saturate(115%) !important;
  backdrop-filter: blur(36px) saturate(115%) !important;
  overflow: hidden !important;
}
html.rc-app-bg .modal:has(.webhook-edit-modal) .webhook-edit-modal,
html.rc-app-bg .modal:has(.webhook-edit-modal) .divided-card,
html.rc-app-bg .modal:has(.webhook-edit-modal) .divided-card > *{
  background: transparent !important;
  background-color: transparent !important;
  border-color: rgba(255,255,255,.085) !important;
}
html.rc-app-bg .modal:has(.webhook-edit-modal) :is(input,.input-box,.page-tip){
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.09) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content .settings-container .title,
html.rc-app-bg body:has(.sidebar-content) .sidebar-content .settings-container label,
html.rc-app-bg body:has(.sidebar-content) .sidebar-content .settings-container p,
html.rc-app-bg body:has(.sidebar-content) .sidebar-content .settings-container span{
  color: rgba(248,248,248,.88) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content .page-tip{
  background: linear-gradient(135deg, rgba(255,255,255,.10), rgba(255,255,255,.04)) !important;
  border-color: rgba(255,255,255,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content select,
html.rc-app-bg body:has(.sidebar-content) .sidebar-content [class*="select"]{
  background-color: rgba(0,0,0,.18) !important;
  border-color: rgba(255,255,255,.12) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content .n-switch--active .n-switch__rail,
html.rc-app-bg body:has(.sidebar-content) .sidebar-content [role="switch"][aria-checked="true"]{
  background: linear-gradient(145deg, rgba(255,255,255,.28), rgba(255,255,255,.12)) !important;
  border-color: rgba(255,255,255,.24) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.17), 0 4px 14px rgba(0,0,0,.2) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content .n-switch--active .n-switch__button{
  background: rgba(255,255,255,.88) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,.3) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content .custom-switch .slider{
  background: rgba(0,0,0,.28) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 4px rgba(0,0,0,.28) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content .custom-switch input:checked + .slider{
  background: linear-gradient(145deg, rgba(255,255,255,.27), rgba(255,255,255,.11)) !important;
  border-color: rgba(255,255,255,.23) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 4px 14px rgba(0,0,0,.2) !important;
}

html.rc-app-bg body:has(.sidebar-content) .sidebar-content .custom-switch .slider::before{
  background: rgba(255,255,255,.9) !important;
  box-shadow: 0 2px 7px rgba(0,0,0,.3) !important;
}

/* Compact icon-only chat buttons at the top of the message feed. */
html.rc-app-bg body:has(.sidebar-content) .content button:has(> svg):not(.n-switch):not([role="switch"]),
html.rc-app-bg body:has(.sidebar-content) .content a:has(> svg):not(.item-row){
  background: linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.075)) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  border-radius: 9px !important;
  color: rgba(255,255,255,.92) !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.20), inset 0 1px 0 rgba(255,255,255,.24) !important;
  -webkit-backdrop-filter: blur(18px) saturate(180%) !important;
  backdrop-filter: blur(18px) saturate(180%) !important;
}

html.rc-app-bg body:has(.sidebar-content) .content button:has(> svg):not(.n-switch):not([role="switch"]):nth-of-type(2){
  background: linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.075)) !important;
  border-color: rgba(255,255,255,.28) !important;
  color: rgba(255,255,255,.92) !important;
}

html.rc-app-bg body:has(.sidebar-content) .content button:has(> svg):not(.n-switch):not([role="switch"]):nth-of-type(3){
  background: linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.075)) !important;
  border-color: rgba(255,255,255,.28) !important;
  color: rgba(255,255,255,.92) !important;
}

html.rc-app-bg body:has(.sidebar-content) .content button:has(> svg):not(.n-switch):not([role="switch"]):hover,
html.rc-app-bg body:has(.sidebar-content) .content a:has(> svg):not(.item-row):hover{
  filter: brightness(1.18);
  transform: translateY(-1px);
  box-shadow: 0 11px 28px rgba(77,130,220,.28), inset 0 1px 0 rgba(255,255,255,.24) !important;
}

html.rc-app-bg body:has(.sidebar-content) .content button svg,
html.rc-app-bg body:has(.sidebar-content) .content a > svg{
  fill: currentColor !important;
  color: inherit !important;
  filter: drop-shadow(0 2px 5px rgba(255,255,255,.18));
}

/* The three chat/date/player controls wrap their SVG in .wrapper. */
html.rc-app-bg .content button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger){
  background: linear-gradient(145deg, rgba(190,207,230,.14), rgba(94,111,137,.055)) !important;
  border: 1px solid rgba(210,224,244,.20) !important;
  color: rgba(224,232,242,.78) !important;
  border-radius: 9px !important;
  box-shadow: 0 7px 18px rgba(0,0,0,.19), inset 0 1px 0 rgba(255,255,255,.13) !important;
  -webkit-backdrop-filter: blur(20px) saturate(180%) !important;
  backdrop-filter: blur(20px) saturate(180%) !important;
}

html.rc-app-bg .content button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger) .wrapper,
html.rc-app-bg .content button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger) svg{
  color: rgba(224,232,242,.78) !important;
  fill: rgba(224,232,242,.78) !important;
  opacity: .92 !important;
  filter: drop-shadow(0 1px 3px rgba(160,190,230,.12)) !important;
}

/* Chat text filter modal. */
html.rc-app-bg .modal:has(.text-filter-modal){
  overflow: hidden !important;
  background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 17px !important;
  box-shadow: 0 28px 85px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.16) !important;
  -webkit-backdrop-filter: blur(30px) saturate(175%) !important;
  backdrop-filter: blur(30px) saturate(175%) !important;
}

html.rc-app-bg .text-filter-modal .divided-card,
html.rc-app-bg .text-filter-modal .header,
html.rc-app-bg .text-filter-modal .body,
html.rc-app-bg .text-filter-modal [class*="content"]{
  background: transparent !important;
  border-color: rgba(255,255,255,.12) !important;
}

html.rc-app-bg .text-filter-modal .title{ color: rgba(250,252,255,.94) !important; }
html.rc-app-bg .text-filter-modal input{
  color: rgba(248,251,255,.94) !important;
  background: rgba(0,0,0,.20) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 5px rgba(0,0,0,.25), 0 1px 0 rgba(255,255,255,.06) !important;
}
html.rc-app-bg .text-filter-modal input::placeholder{ color: rgba(220,229,243,.48) !important; }
html.rc-app-bg .text-filter-modal button{
  color: rgba(246,250,255,.88) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.13), rgba(255,255,255,.055)) !important;
  border: 1px solid rgba(255,255,255,.17) !important;
  border-radius: 10px !important;
}

/* Working frosted player picker for the third chat control. */
.rc-player-picker-overlay{
  position: fixed; inset: 0; z-index: 100000; display: grid; place-items: center; padding: 18px;
  background: rgba(0,0,0,.38); opacity: 0; transition: opacity .16s ease;
  -webkit-backdrop-filter: blur(9px); backdrop-filter: blur(9px);
}
.rc-player-picker-overlay.visible{ opacity: 1; }
.rc-player-picker{
  width: min(430px, calc(100vw - 28px)); max-height: min(620px, calc(100vh - 36px)); overflow: hidden;
  color: rgba(250,250,250,.92) !important; border: 1px solid rgba(255,255,255,.18) !important; border-radius: 20px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.032)) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.17) !important;
  -webkit-backdrop-filter: blur(34px) saturate(180%) !important; backdrop-filter: blur(34px) saturate(180%) !important;
  transform: translateY(8px) scale(.985); transition: transform .18s ease;
}
.visible .rc-player-picker{ transform: none; }
.rc-player-picker header{ display:flex; align-items:center; justify-content:space-between; padding:19px 20px 16px; border-bottom:1px solid rgba(255,255,255,.11); }
.rc-player-picker header div{ display:flex; flex-direction:column; gap:3px; }
.rc-player-picker header strong{ font-size:15px; }
.rc-player-picker header span,.rc-player-picker footer{ color:rgba(235,235,235,.56); font-size:12px; }
.rc-picker-close{ width:32px; height:32px; border:1px solid rgba(255,255,255,.12); border-radius:10px; background:rgba(255,255,255,.06); color:rgba(245,249,255,.75); font-size:22px; line-height:1; cursor:pointer; }
.rc-picker-search{ display:flex; align-items:center; gap:9px; margin:15px 16px 10px; padding:0 12px; border:1px solid rgba(255,255,255,.13); border-radius:12px; background:rgba(0,0,0,.18); }
.rc-picker-search svg{ width:17px; fill:rgba(240,240,240,.52); }
.rc-picker-search input{ width:100%; height:42px; outline:0; border:0; background:transparent; color:#f7faff; font-size:13px; }
.rc-picker-search input::placeholder{ color:rgba(220,229,243,.43); }
.rc-picker-list{ max-height:360px; overflow:auto; padding:4px 10px 10px; }
.rc-picker-person{ width:100%; display:flex; align-items:center; gap:11px; padding:10px; margin:3px 0; border:1px solid transparent; border-radius:13px; color:rgba(241,246,255,.87); background:transparent; text-align:left; cursor:pointer; }
.rc-picker-person:hover,.rc-picker-person.selected{ background:linear-gradient(135deg,rgba(255,255,255,.115),rgba(255,255,255,.045)); border-color:rgba(255,255,255,.16); }
.rc-picker-avatar{ display:grid; place-items:center; flex:0 0 36px; height:36px; border-radius:50%; background:linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.06)); border:1px solid rgba(255,255,255,.18); box-shadow:inset 0 1px 0 rgba(255,255,255,.14); font-weight:700; }
.rc-picker-person > span:nth-child(2){ display:flex; flex-direction:column; gap:2px; flex:1; min-width:0; }
.rc-picker-person b{ overflow:hidden; text-overflow:ellipsis; font-size:13px; }
.rc-picker-person small{ color:rgba(215,225,241,.48); font-size:11px; }
.rc-picker-person i{ color:rgba(255,255,255,.82); font-style:normal; opacity:0; }
.rc-picker-person.selected i{ opacity:1; }
.rc-picker-empty{ padding:24px; text-align:center; color:rgba(220,229,243,.5); font-size:13px; }
.rc-player-picker footer{ display:flex; align-items:center; justify-content:space-between; padding:12px 16px 15px; border-top:1px solid rgba(255,255,255,.09); }
.rc-picker-reset{ padding:8px 11px; border:1px solid rgba(255,255,255,.13); border-radius:10px; background:rgba(255,255,255,.05); color:rgba(245,245,245,.7); cursor:pointer; }

/* Players page summary cards: neutral, colourless frosted glass. */
html.rc-app-bg #rc-players-cards .rpc-card{
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: 0 18px 45px rgba(0,0,0,.25), inset 0 1px 0 rgba(255,255,255,.13) !important;
  -webkit-backdrop-filter: blur(28px) saturate(155%) !important;
  backdrop-filter: blur(28px) saturate(155%) !important;
}

html.rc-app-bg #rc-players-cards .rpc-ico,
html.rc-app-bg #rc-players-cards .rpc-ico.blue,
html.rc-app-bg #rc-players-cards .rpc-ico.green,
html.rc-app-bg #rc-players-cards .rpc-ico.slate{
  background: linear-gradient(145deg, rgba(255,255,255,.17), rgba(255,255,255,.055)) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 7px 18px rgba(0,0,0,.19) !important;
}

html.rc-app-bg #rc-players-cards .rpc-ico svg{
  fill: rgba(255,255,255,.86) !important;
  filter: drop-shadow(0 1px 3px rgba(0,0,0,.2));
}

/* Employee profile modal. */
html.rc-app-bg .modal:has(.client-details-modal){
  width: min(390px, calc(100vw - 28px)) !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 22px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.028)) !important;
  box-shadow: 0 32px 100px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.15) !important;
  -webkit-backdrop-filter: blur(34px) saturate(165%) !important;
  backdrop-filter: blur(34px) saturate(165%) !important;
}

html.rc-app-bg .client-details-modal{
  width: 100% !important;
  overflow: hidden !important;
  color: rgba(248,248,248,.92) !important;
  background: transparent !important;
}

html.rc-app-bg .client-details-modal > .header{
  position: relative !important;
  display: flex !important;
  align-items: center !important;
  gap: 16px !important;
  min-height: 124px !important;
  height: max-content !important;
  padding: 24px 58px 24px 24px !important;
  overflow: hidden !important;
  border-bottom: 1px solid rgba(255,255,255,.11) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.105), rgba(255,255,255,.025)) !important;
}

html.rc-app-bg .client-details-modal > .header::after{
  content: "";
  position: absolute;
  width: 150px;
  height: 150px;
  right: -55px;
  top: -75px;
  border-radius: 50%;
  background: rgba(255,255,255,.07);
  filter: blur(28px);
  pointer-events: none;
}

html.rc-app-bg .client-details-modal > .header > .avatar{
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  flex: 0 0 70px !important;
  width: 70px !important;
  height: 70px !important;
  max-width: 70px !important;
  object-fit: cover !important;
  border-radius: 50% !important;
  opacity: 1 !important;
  filter: none !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  box-shadow: 0 12px 30px rgba(0,0,0,.34), 0 0 0 5px rgba(255,255,255,.055) !important;
}

html.rc-app-bg .client-details-modal > .header > .bg-gradient{
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  background: linear-gradient(110deg, rgba(255,255,255,.035), transparent 65%) !important;
}

html.rc-app-bg .client-details-modal > .header > .name{
  position: relative !important;
  inset: auto !important;
  z-index: 2 !important;
  display: flex !important;
  min-width: 0 !important;
  flex-direction: column !important;
  gap: 3px !important;
  color: rgba(252,252,252,.96) !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.35) !important;
}

html.rc-app-bg .client-details-modal > .header > .name .text-20-500{
  overflow: hidden !important;
  font-size: 20px !important;
  font-weight: 650 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html.rc-app-bg .client-details-modal > .header > .name .opacity-50{
  color: rgba(238,238,238,.55) !important;
  opacity: 1 !important;
  font-size: 12px !important;
}

html.rc-app-bg .client-details-modal > .header > .close{
  position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  z-index: 4 !important;
  display: grid !important;
  place-items: center !important;
  width: 34px !important;
  height: 34px !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.075) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11) !important;
  -webkit-backdrop-filter: blur(15px) !important;
  backdrop-filter: blur(15px) !important;
}

html.rc-app-bg .client-details-modal > .header > .close svg{
  width: 18px !important;
  fill: rgba(255,255,255,.76) !important;
}

html.rc-app-bg .client-details-modal > .divided-card{
  margin: 14px !important;
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.045) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075) !important;
}

html.rc-app-bg .client-details-modal .divided-card .content.padding{
  padding: 16px !important;
  background: transparent !important;
}

html.rc-app-bg .client-details-modal .info{
  display: flex !important;
  flex-direction: column !important;
  gap: 12px !important;
}

html.rc-app-bg .client-details-modal .info .row{
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 0 !important;
}

html.rc-app-bg .client-details-modal .info .row .text,
html.rc-app-bg .client-details-modal .integrations > .title{
  color: rgba(235,235,235,.52) !important;
  font-size: 12px !important;
}

html.rc-app-bg .client-details-modal .info .row .value{
  color: rgba(252,252,252,.92) !important;
  font-size: 14px !important;
  font-weight: 600 !important;
}

html.rc-app-bg .client-details-modal .integrations > .integration,
html.rc-app-bg .client-details-modal .integrations > .flex{
  margin-top: 7px !important;
  padding: 10px 12px !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
}

html.rc-app-bg .client-details-modal .ca-int-ava-host,
html.rc-app-bg .client-details-modal .integrations img{
  border: 1px solid rgba(255,255,255,.17) !important;
  box-shadow: 0 5px 14px rgba(0,0,0,.24) !important;
}

/* Employee profile v2: lighter iOS-style composition. */
html.rc-app-bg .modal:has(.client-details-modal){
  width: min(376px, calc(100vw - 28px)) !important;
  height: auto !important;
  max-height: min(720px, calc(100vh - 28px)) !important;
  background: linear-gradient(155deg, rgba(255,255,255,.085), rgba(255,255,255,.018)) !important;
  border-color: rgba(255,255,255,.20) !important;
  box-shadow: 0 35px 110px rgba(0,0,0,.62), inset 0 1px 0 rgba(255,255,255,.16) !important;
}

html.rc-app-bg .client-details-modal{
  height: max-content !important;
  min-height: 0 !important;
  max-height: min(720px, calc(100vh - 28px)) !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
}

html.rc-app-bg .client-details-modal > .header{
  flex-direction: column !important;
  justify-content: center !important;
  gap: 12px !important;
  min-height: 178px !important;
  padding: 25px 58px 22px !important;
  border-bottom-color: rgba(255,255,255,.085) !important;
  background:
    radial-gradient(circle at 50% -15%, rgba(255,255,255,.13), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.035), transparent) !important;
}

html.rc-app-bg .client-details-modal > .header::before{
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  opacity: .16;
  background-image: radial-gradient(rgba(255,255,255,.30) .55px, transparent .55px);
  background-size: 5px 5px;
  -webkit-mask-image: linear-gradient(to bottom, #000, transparent 85%);
  mask-image: linear-gradient(to bottom, #000, transparent 85%);
}

html.rc-app-bg .client-details-modal > .header > .avatar{
  flex-basis: 76px !important;
  width: 76px !important;
  height: 76px !important;
  max-width: 76px !important;
  object-position: center !important;
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
  box-shadow: 0 14px 35px rgba(0,0,0,.38), 0 0 0 5px rgba(255,255,255,.045), inset 0 1px 0 rgba(255,255,255,.18) !important;
}

html.rc-app-bg .client-details-modal > .header > .name{
  align-items: center !important;
  text-align: center !important;
  gap: 1px !important;
}

html.rc-app-bg .client-details-modal > .header > .name .text-20-500{
  font-size: 19px !important;
  letter-spacing: -.01em !important;
}

html.rc-app-bg .client-details-modal > .header > .name .opacity-50::before{
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 6px 1px 0;
  border-radius: 50%;
  background: currentColor;
  box-shadow: 0 0 8px currentColor;
}

html.rc-app-bg .client-details-modal > .header > .close{
  top: 14px !important;
  right: 14px !important;
  width: 32px !important;
  height: 32px !important;
  border-radius: 50% !important;
  background: rgba(255,255,255,.065) !important;
}

html.rc-app-bg .client-details-modal > .divided-card{
  margin: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg .client-details-modal .divided-card .content.padding{
  padding: 16px !important;
}

html.rc-app-bg .client-details-modal .info{
  gap: 8px !important;
}

html.rc-app-bg .client-details-modal .info .row{
  gap: 3px !important;
  padding: 11px 13px !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  border-radius: 12px !important;
  background: linear-gradient(135deg, rgba(255,255,255,.065), rgba(255,255,255,.022)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

html.rc-app-bg .client-details-modal .info .row .text,
html.rc-app-bg .client-details-modal .integrations > .title{
  color: rgba(245,245,245,.46) !important;
  font-size: 11px !important;
  letter-spacing: .01em !important;
}

html.rc-app-bg .client-details-modal .info .row .value{
  font-size: 13px !important;
}

html.rc-app-bg .client-details-modal .integrations{
  margin-top: 14px !important;
}

html.rc-app-bg .client-details-modal .integrations > .title{
  display: block !important;
  margin: 0 2px 7px !important;
  text-transform: uppercase !important;
  letter-spacing: .075em !important;
}

html.rc-app-bg .client-details-modal .integrations > .integration,
html.rc-app-bg .client-details-modal .integrations > .flex{
  min-height: 54px !important;
  margin-top: 6px !important;
  padding: 9px 11px !important;
  border-color: rgba(255,255,255,.105) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.06), rgba(255,255,255,.02)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
  transition: border-color .18s ease, background .18s ease, transform .18s ease !important;
}

html.rc-app-bg .client-details-modal .integrations > .integration:hover,
html.rc-app-bg .client-details-modal .integrations > .flex:hover{
  transform: translateY(-1px) !important;
  border-color: rgba(255,255,255,.18) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.03)) !important;
}

/* Employee profile v3: strict alignment and smooth entrance. */
html.rc-app-bg .modal-border:has(.client-details-modal){
  transform-origin: 50% 46% !important;
  transform: none !important;
  will-change: opacity !important;
  animation: rc-employee-card-in .16s linear both !important;
}

html.rc-app-bg .modal-backdrop:has(+ * .client-details-modal),
html.rc-app-bg body:has(.client-details-modal) .modal-backdrop{
  animation: rc-employee-backdrop-in .18s ease-out both !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

@keyframes rc-employee-card-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes rc-employee-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

html.rc-app-bg .modal-border.pop-leave-active:has(.client-details-modal){
  animation: none !important;
  transform: none !important;
  transition: opacity .13s linear !important;
  will-change: opacity !important;
}

html.rc-app-bg .modal-border.pop-leave-to:has(.client-details-modal){
  opacity: 0 !important;
  transform: none !important;
}

html.rc-app-bg .modal-border.pop-enter-active:has(.client-details-modal){
  animation: none !important;
  transform: none !important;
  transition: opacity .16s linear !important;
  will-change: opacity !important;
}

html.rc-app-bg .modal-border.pop-enter-from:has(.client-details-modal){
  opacity: 0 !important;
  transform: none !important;
}

html.rc-app-bg .modal-border.pop-enter-to:has(.client-details-modal),
html.rc-app-bg .modal-border.pop-leave-from:has(.client-details-modal){
  opacity: 1 !important;
  transform: none !important;
}

html.rc-app-bg .modal:has(.client-details-modal){
  contain: paint !important;
  -webkit-backdrop-filter: blur(16px) saturate(135%) !important;
  backdrop-filter: blur(16px) saturate(135%) !important;
  box-shadow: 0 22px 65px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.14) !important;
}

html.rc-app-bg .client-details-modal.rc-employee-online > .header > .name .opacity-50{
  color: rgba(103, 240, 145, .94) !important;
  text-shadow: 0 0 12px rgba(65, 225, 120, .24) !important;
}

html.rc-app-bg .client-details-modal.rc-employee-online > .header > .name .opacity-50::before{
  background: #66ee91 !important;
  box-shadow: 0 0 5px rgba(102,238,145,.95), 0 0 12px rgba(102,238,145,.55) !important;
}

html.rc-app-bg .modal:has(.client-details-modal){
  width: min(360px, calc(100vw - 24px)) !important;
  border-radius: 20px !important;
}

html.rc-app-bg .client-details-modal > .header{
  flex-direction: row !important;
  justify-content: flex-start !important;
  gap: 14px !important;
  min-height: 116px !important;
  padding: 22px 58px 22px 22px !important;
}

html.rc-app-bg .client-details-modal > .header > .avatar{
  flex-basis: 66px !important;
  width: 66px !important;
  height: 66px !important;
  max-width: 66px !important;
}

html.rc-app-bg .client-details-modal > .header > .name{
  align-items: flex-start !important;
  text-align: left !important;
  gap: 2px !important;
}

html.rc-app-bg .client-details-modal > .header > .name .text-20-500{
  font-size: 18px !important;
}

html.rc-app-bg .client-details-modal .divided-card .content.padding{
  padding: 14px !important;
}

html.rc-app-bg .client-details-modal .info .row{
  width: 100% !important;
  min-height: 54px !important;
  padding: 10px 12px !important;
  border-radius: 11px !important;
}

html.rc-app-bg .client-details-modal .integrations{
  width: 100% !important;
  margin-top: 12px !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg .client-details-modal .integrations > .integration,
html.rc-app-bg .client-details-modal .integrations > .flex{
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 11px !important;
}

@media (prefers-reduced-motion: reduce){
  html.rc-app-bg .modal-border:has(.client-details-modal),
  html.rc-app-bg body:has(.client-details-modal) .modal-backdrop{
    animation: none !important;
  }
}

/* Player profile v305: pure clear glass, with no glow{
  background: rgba(10,10,12,.40) !important;
  background-color: rgba(10,10,12,.40) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(34px) saturate(100%) !important;
  backdrop-filter: blur(34px) saturate(100%) !important;
}

/* Player profile v308: truly colourless glass — blur only{
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: blur(24px) saturate(100%) contrast(102%) !important;
  backdrop-filter: blur(24px) saturate(100%) contrast(102%) !important;
}

/* Player profile v310: visible crystal glass{
  --tw-bg-opacity: 0 !important;
  background: rgba(255,255,255,.032) !important;
  background-color: rgba(255,255,255,.032) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(32px) saturate(108%) !important;
  backdrop-filter: blur(32px) saturate(108%) !important;
}

/* Disabled continuation of the experimental player-profile redesign. */
@media not all{
/* Player profile final tone: dark glass like the personal profile. */
html.rc-app-bg .modal-border:has(.player-modal) .modal,
html.rc-app-bg .player-modal {
  background:
    radial-gradient(circle at 88% 0%, rgba(96,76,125,.15), transparent 42%),
    linear-gradient(145deg, rgba(25,31,42,.93), rgba(17,15,25,.94)) !important;
  border-color: rgba(220,226,238,.16) !important;
  box-shadow: 0 34px 105px rgba(0,0,0,.64), inset 0 1px 0 rgba(255,255,255,.09) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
}

html.rc-app-bg .player-modal .modal-menu-extended > .nav {
  background: linear-gradient(160deg, rgba(31,39,51,.88), rgba(16,19,26,.84)) !important;
  border-right-color: rgba(225,231,241,.11) !important;
}

html.rc-app-bg .player-modal .modal-menu-extended > .content,
html.rc-app-bg .player-modal .content-inner,
html.rc-app-bg .player-modal .modal-menu-page-layout-content {
  background: rgba(7,9,14,.16) !important;
}

html.rc-app-bg .player-modal .nav .menu-item.-active,
html.rc-app-bg .player-modal .nav .menu-item.active {
  background: linear-gradient(135deg, rgba(146,160,183,.20), rgba(102,111,129,.10)) !important;
  border-color: rgba(224,231,242,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 8px 22px rgba(0,0,0,.20) !important;
}

html.rc-app-bg .player-modal .player-tag {
  background: linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  border-color: rgba(255,255,255,.095) !important;
}

html.rc-app-bg .player-modal .table-card,
html.rc-app-bg .player-modal .table-info {
  background: linear-gradient(145deg, rgba(28,31,39,.76), rgba(15,17,23,.70)) !important;
  border-color: rgba(225,231,241,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 14px 35px rgba(0,0,0,.18) !important;
}

html.rc-app-bg .player-modal .table-card > .flex,
html.rc-app-bg .player-modal .table-card > .header,
html.rc-app-bg .player-modal .table-card > .title,
html.rc-app-bg .player-modal .table-info > .header {
  background: rgba(255,255,255,.018) !important;
  border-bottom-color: rgba(255,255,255,.075) !important;
}

html.rc-app-bg .player-modal .table-card .cells {
  background: rgba(255,255,255,.045) !important;
}

html.rc-app-bg .player-modal .table-card .cell,
html.rc-app-bg .player-modal .table-card .list-item,
html.rc-app-bg .player-modal .table-info td,
html.rc-app-bg .player-modal .table-info .row {
  background: rgba(8,10,14,.27) !important;
  border-color: rgba(255,255,255,.055) !important;
}

html.rc-app-bg .player-modal .content-controls {
  background: rgba(12,14,20,.48) !important;
  border-bottom-color: rgba(255,255,255,.075) !important;
}

/* Player profile v2: completely neutral, low-glare frosted glass. */
html.rc-app-bg .modal-border:has(.player-modal) .modal,
html.rc-app-bg .player-modal {
  color: rgba(242,242,244,.88) !important;
  background:
    radial-gradient(circle at 78% -12%, rgba(255,255,255,.075), transparent 43%),
    linear-gradient(145deg, rgba(28,28,30,.91), rgba(11,11,13,.94)) !important;
  border-color: rgba(255,255,255,.15) !important;
  box-shadow: 0 30px 92px rgba(0,0,0,.64), inset 0 1px 0 rgba(255,255,255,.09) !important;
  -webkit-backdrop-filter: blur(20px) saturate(105%) !important;
  backdrop-filter: blur(20px) saturate(105%) !important;
}

html.rc-app-bg .player-modal .modal-menu-extended > .nav {
  background: linear-gradient(160deg, rgba(255,255,255,.065), rgba(255,255,255,.018)) !important;
  border-right-color: rgba(255,255,255,.10) !important;
}

html.rc-app-bg .player-modal .modal-menu-extended > .content,
html.rc-app-bg .player-modal .content-inner,
html.rc-app-bg .player-modal .modal-menu-page-layout-content {
  background: transparent !important;
}

html.rc-app-bg .player-modal .nav .menu-item {
  color: rgba(235,235,237,.55) !important;
}

html.rc-app-bg .player-modal .nav .menu-item:hover {
  color: rgba(250,250,250,.84) !important;
  background: rgba(255,255,255,.055) !important;
}

html.rc-app-bg .player-modal .nav .menu-item.-active,
html.rc-app-bg .player-modal .nav .menu-item.active {
  color: rgba(255,255,255,.92) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.125), rgba(255,255,255,.05)) !important;
  border-color: rgba(255,255,255,.14) !important;
}

html.rc-app-bg .player-modal .table-card,
html.rc-app-bg .player-modal .table-info,
html.rc-app-bg .player-modal .content-inner .rounded-lg,
html.rc-app-bg .player-modal .content-inner [class*="bg-grey-9"] {
  color: rgba(240,240,242,.86) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.022)) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 12px 30px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(14px) saturate(105%) !important;
  backdrop-filter: blur(14px) saturate(105%) !important;
}

html.rc-app-bg .player-modal .table-card > .flex,
html.rc-app-bg .player-modal .table-card > .header,
html.rc-app-bg .player-modal .table-card > .title,
html.rc-app-bg .player-modal .table-info > .header {
  color: rgba(248,248,250,.90) !important;
  background: rgba(255,255,255,.018) !important;
  border-bottom-color: rgba(255,255,255,.07) !important;
}

html.rc-app-bg .player-modal .table-card .cells {
  background: rgba(255,255,255,.035) !important;
}

html.rc-app-bg .player-modal .table-card .cell,
html.rc-app-bg .player-modal .table-card .list-item,
html.rc-app-bg .player-modal .table-info td,
html.rc-app-bg .player-modal .table-info .row {
  color: rgba(238,238,240,.84) !important;
  background: rgba(0,0,0,.16) !important;
  border-color: rgba(255,255,255,.05) !important;
}

html.rc-app-bg .player-modal .table-card .cell .title,
html.rc-app-bg .player-modal .table-card .list-item .title,
html.rc-app-bg .player-modal .text-grey-600,
html.rc-app-bg .player-modal [class*="text-grey-5"],
html.rc-app-bg .player-modal [class*="text-grey-6"] {
  color: rgba(228,228,231,.48) !important;
}

html.rc-app-bg .player-modal .table-card .cell .subtitle,
html.rc-app-bg .player-modal .table-card .list-item .subtitle,
html.rc-app-bg .player-modal .text-grey-50 {
  color: rgba(248,248,249,.88) !important;
}

html.rc-app-bg .player-modal .player-tag,
html.rc-app-bg .player-modal .actions .btn,
html.rc-app-bg .player-modal .nav-controls .controls-button,
html.rc-app-bg .player-modal .content-controls .controls-button,
html.rc-app-bg .player-modal button:not(.preset.primary):not(.destructive) {
  color: rgba(242,242,244,.78) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.085), rgba(255,255,255,.025)) !important;
  border-color: rgba(255,255,255,.11) !important;
}

html.rc-app-bg .player-modal .hyperlink,
html.rc-app-bg .player-modal a:not(.ra-button) {
  color: rgba(221,225,232,.82) !important;
  text-decoration-color: rgba(255,255,255,.22) !important;
}

html.rc-app-bg .player-modal .content-controls {
  background: rgba(0,0,0,.20) !important;
  border-bottom-color: rgba(255,255,255,.07) !important;
}

html.rc-app-bg .player-modal input,
html.rc-app-bg .player-modal textarea,
html.rc-app-bg .player-modal select {
  color: rgba(244,244,246,.88) !important;
  background: rgba(0,0,0,.22) !important;
  border: 1px solid #fff !important;
  box-shadow: inset 0 1px 4px rgba(0,0,0,.24) !important;
}

/* Player profile final: reuse the exact glass recipe from the player picker. */
html.rc-app-bg body:has(.player-modal) .modal-backdrop {
  background: rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(9px) !important;
  backdrop-filter: blur(9px) !important;
}

html.rc-app-bg .modal-border:has(.player-modal) .modal,
html.rc-app-bg .player-modal {
  color: rgba(250,250,250,.92) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.032)) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.17) !important;
  -webkit-backdrop-filter: blur(34px) saturate(180%) !important;
  backdrop-filter: blur(34px) saturate(180%) !important;
}

html.rc-app-bg .player-modal .modal-menu-extended > .nav {
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  border-right: 1px solid rgba(255,255,255,.11) !important;
  -webkit-backdrop-filter: blur(20px) saturate(150%) !important;
  backdrop-filter: blur(20px) saturate(150%) !important;
}

html.rc-app-bg .player-modal .nav .menu-item.-active,
html.rc-app-bg .player-modal .nav .menu-item.active {
  background: linear-gradient(135deg, rgba(255,255,255,.115), rgba(255,255,255,.045)) !important;
  border-color: rgba(255,255,255,.16) !important;
}

html.rc-app-bg .player-modal .table-card,
html.rc-app-bg .player-modal .table-info,
html.rc-app-bg .player-modal .content-inner .rounded-lg,
html.rc-app-bg .player-modal .content-inner [class*="bg-grey-9"] {
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.024)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 14px 34px rgba(0,0,0,.18) !important;
  -webkit-backdrop-filter: blur(18px) saturate(145%) !important;
  backdrop-filter: blur(18px) saturate(145%) !important;
}

html.rc-app-bg .player-modal .table-card .cell,
html.rc-app-bg .player-modal .table-card .list-item,
html.rc-app-bg .player-modal .table-info td,
html.rc-app-bg .player-modal .table-info .row {
  background: rgba(0,0,0,.16) !important;
  border-color: rgba(255,255,255,.055) !important;
}

html.rc-app-bg .player-modal .player-tag,
html.rc-app-bg .player-modal .actions .btn,
html.rc-app-bg .player-modal .nav-controls .controls-button,
html.rc-app-bg .player-modal .content-controls .controls-button,
html.rc-app-bg .player-modal button:not(.preset.primary):not(.destructive) {
  background: linear-gradient(145deg, rgba(255,255,255,.10), rgba(255,255,255,.035)) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

html.rc-app-bg .player-modal .content-controls {
  background: rgba(0,0,0,.18) !important;
  border-bottom-color: rgba(255,255,255,.09) !important;
  -webkit-backdrop-filter: blur(14px) !important;
  backdrop-filter: blur(14px) !important;
}

/* Perceptual match for the small picker on a much larger surface. */
html.rc-app-bg body:has(.player-modal) .modal-backdrop {
  background: rgba(0,0,0,.50) !important;
  -webkit-backdrop-filter: blur(5px) !important;
  backdrop-filter: blur(5px) !important;
}

html.rc-app-bg .modal-border:has(.player-modal) .modal,
html.rc-app-bg .player-modal {
  color: rgba(244,244,246,.87) !important;
  background-color: rgba(7,8,11,.78) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.01)) !important;
  border-color: rgba(255,255,255,.15) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.66), inset 0 1px 0 rgba(255,255,255,.09) !important;
  -webkit-backdrop-filter: blur(28px) saturate(115%) !important;
  backdrop-filter: blur(28px) saturate(115%) !important;
}

html.rc-app-bg .player-modal .modal-menu-extended > .nav {
  background-color: rgba(8,9,12,.34) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.012)) !important;
  border-right-color: rgba(255,255,255,.09) !important;
}

html.rc-app-bg .player-modal .nav .menu-item.-active,
html.rc-app-bg .player-modal .nav .menu-item.active {
  background: linear-gradient(135deg, rgba(255,255,255,.09), rgba(255,255,255,.035)) !important;
  border-color: rgba(255,255,255,.13) !important;
}

html.rc-app-bg .player-modal .table-card,
html.rc-app-bg .player-modal .table-info,
html.rc-app-bg .player-modal .content-inner .rounded-lg,
html.rc-app-bg .player-modal .content-inner [class*="bg-grey-9"] {
  background-color: rgba(5,6,8,.34) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.012)) !important;
  border-color: rgba(255,255,255,.095) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 14px 34px rgba(0,0,0,.20) !important;
  -webkit-backdrop-filter: blur(16px) saturate(110%) !important;
  backdrop-filter: blur(16px) saturate(110%) !important;
}

html.rc-app-bg .player-modal .table-card > .flex,
html.rc-app-bg .player-modal .table-card > .header,
html.rc-app-bg .player-modal .table-card > .title,
html.rc-app-bg .player-modal .table-info > .header {
  background: rgba(255,255,255,.012) !important;
  border-bottom-color: rgba(255,255,255,.06) !important;
}

html.rc-app-bg .player-modal .table-card .cells {
  background: rgba(255,255,255,.025) !important;
}

html.rc-app-bg .player-modal .player-tag,
html.rc-app-bg .player-modal .actions .btn,
html.rc-app-bg .player-modal .nav-controls .controls-button,
html.rc-app-bg .player-modal .content-controls .controls-button,
html.rc-app-bg .player-modal button:not(.preset.primary):not(.destructive) {
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.022)) !important;
  border-color: rgba(255,255,255,.105) !important;
}
}

/* Final blocking dialog tone — intentionally matches the player picker. */
html.rc-app-bg .modal:has(.rcc-ban-modal),
html.rc-app-bg .rcc-ban-modal{
  border: 1px solid rgba(255,255,255,.18) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(circle at 16% 0%, rgba(255,255,255,.13), transparent 47%),
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.032)) !important;
  box-shadow: 0 30px 100px rgba(0,0,0,.58), inset 0 1px 0 rgba(255,255,255,.17) !important;
  -webkit-backdrop-filter: blur(34px) saturate(180%) !important;
  backdrop-filter: blur(34px) saturate(180%) !important;
}

html.rc-app-bg .rcc-ban-modal > .divided-card{
  background: transparent !important;
}

html.rc-app-bg .rcc-ban-modal > .divided-card > .header,
html.rc-app-bg .rcc-ban-modal > .divided-card > .content,
html.rc-app-bg .rcc-ban-modal > .divided-card > .footer{
  background: transparent !important;
  border-color: rgba(255,255,255,.10) !important;
}

html.rc-app-bg .rcc-ban-modal .items-row > .item{
  border-color: rgba(255,255,255,.15) !important;
  background:
    radial-gradient(circle at 12% 0%, rgba(255,255,255,.11), transparent 48%),
    linear-gradient(135deg, rgba(255,255,255,.085), rgba(255,255,255,.025)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 10px 26px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(18px) saturate(150%) !important;
  backdrop-filter: blur(18px) saturate(150%) !important;
}

html.rc-app-bg .rcc-ban-modal .ra-button{
  border-color: rgba(255,255,255,.15) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.03)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 20px rgba(0,0,0,.18) !important;
}

html.rc-app-bg .rcc-ban-modal{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Final monochrome shell. Keep this last: older component themes must not
   restore the former blue/violet application background. */
html.rc-app-bg,
html.rc-app-bg body,
html.rc-app-bg body[data-checkapp-page]{
  background: #090909 !important;
  background-color: #090909 !important;
  background-image: none !important;
}

html.rc-app-bg #rc-app-bg{
  background: #090909 !important;
  background-image: none !important;
}

html.rc-app-bg #rc-app-bg .bg,
html.rc-app-bg body[data-checkapp-page] #rc-app-bg .bg{
  background:
    radial-gradient(ellipse 72% 58% at 18% 12%, rgba(255,255,255,.052) 0%, rgba(255,255,255,.018) 38%, transparent 72%),
    radial-gradient(ellipse 64% 54% at 84% 32%, rgba(255,255,255,.038) 0%, rgba(255,255,255,.012) 42%, transparent 74%),
    radial-gradient(ellipse 76% 50% at 48% 102%, rgba(255,255,255,.028) 0%, transparent 70%),
    #090909 !important;
}

html.rc-app-bg #rc-app-bg .bg::before,
html.rc-app-bg #rc-app-bg .bg::after,
html.rc-app-bg #rc-app-bg :is(.orb,.ring,.vignette,.noise){
  content: none !important;
  display: none !important;
  background: none !important;
}

html.rc-app-bg .layout .navigation-wrapper,
html.rc-app-bg .navigation,
html.rc-app-bg .navigation .header,
html.rc-app-bg .navigation .footer{
  background: linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.01)), rgba(9,9,9,.72) !important;
  background-color: rgba(9,9,9,.72) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
}

html.rc-app-bg .content.ignore-side > .header,
html.rc-app-bg .layout-page > .header,
html.rc-app-bg .content > .header,
html.rc-app-bg .page-content > .header{
  background: linear-gradient(180deg, rgba(255,255,255,.032), rgba(255,255,255,.01)), rgba(9,9,9,.66) !important;
  background-color: rgba(9,9,9,.66) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
}

html.rc-app-bg .navigation .item-row.router-link-active,
html.rc-app-bg .navigation a.router-link-active .item-row,
html.rc-app-bg .navigation .item-row.active,
html.rc-app-bg .navigation .item-row:hover{
  color: rgba(255,255,255,.90) !important;
  background: rgba(255,255,255,.065) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}

html.rc-app-bg #rc-panel-home,
html.rc-app-bg .content-wrapper,
html.rc-app-bg .page-content{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html.rc-app-bg #rc-panel-home .rph-stat,
html.rc-app-bg #rc-panel-home .rph-list-wrap,
html.rc-app-bg #rc-panel-home .rph-server,
html.rc-app-bg .content .divided-card,
html.rc-app-bg .content .settings-container,
html.rc-app-bg .content .n-card,
html.rc-app-bg .content .n-data-table-wrapper,
html.rc-app-bg .content .n-data-table{
  background: linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.014)), rgba(14,14,14,.56) !important;
  background-color: rgba(14,14,14,.56) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
}

html.rc-app-bg #rc-panel-home .rph-head-icon,
html.rc-app-bg #rc-panel-home .rph-list-ico,
html.rc-app-bg #rc-panel-home .rph-ico,
html.rc-app-bg #rc-panel-home .rph-ico.blue,
html.rc-app-bg #rc-panel-home .rph-ico.orange,
html.rc-app-bg #rc-panel-home .rph-ico.sky,
html.rc-app-bg #rc-panel-home .rph-ico.amber,
html.rc-app-bg #rc-panel-home .rph-ico.red{
  color: rgba(255,255,255,.72) !important;
  background: rgba(255,255,255,.07) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
}

html.rc-app-bg #rc-panel-home .rph-badge.on,
html.rc-app-bg #rc-panel-home .rph-badge.off{
  color: rgba(255,255,255,.72) !important;
  background: rgba(255,255,255,.07) !important;
}

/* Login/profile backgrounds use their own layers outside .rc-app-bg. */
html.checkapp-home,
html.checkapp-home body,
html.rc-home-on,
html.rc-home-on body,
#rc-home,
#rc-profile-bg{
  background: #090909 !important;
  background-color: #090909 !important;
  background-image: none !important;
}

#rc-home .bg,
#rc-profile-bg .bg{
  background:
    radial-gradient(ellipse 72% 58% at 18% 12%, rgba(255,255,255,.052) 0%, rgba(255,255,255,.018) 38%, transparent 72%),
    radial-gradient(ellipse 64% 54% at 84% 32%, rgba(255,255,255,.038) 0%, rgba(255,255,255,.012) 42%, transparent 74%),
    radial-gradient(ellipse 76% 50% at 48% 102%, rgba(255,255,255,.028) 0%, transparent 70%),
    #090909 !important;
}

#rc-home .bg::before,
#rc-home .bg::after,
#rc-profile-bg .bg::before,
#rc-profile-bg .bg::after,
#rc-home :is(.orb,.ring,.noise,.vignette),
#rc-profile-bg :is(.orb,.ring,.noise,.vignette){
  content: none !important;
  display: none !important;
  background: none !important;
}

#rc-home .card,
#rc-home .control-pill,
#rc-home .chip,
#rc-home .social{
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.014)), rgba(14,14,14,.58) !important;
  border-color: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 24px 70px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
}

#rc-home .card::before,
#rc-home .card::after{
  content: none !important;
  display: none !important;
}

/* Unified high-contrast neutral Liquid Glass. */
html.rc-app-bg{
  --rc-neutral-glass: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)), rgba(13,13,13,.64);
  --rc-neutral-glass-soft: linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.012)), rgba(12,12,12,.48);
  --rc-neutral-line: rgba(255,255,255,.10);
  --rc-neutral-highlight: inset 0 1px 0 rgba(255,255,255,.065);
}

html.rc-app-bg .select-wrapper .select.project-selector .activator{
  color: rgba(255,255,255,.88) !important;
  background: var(--rc-neutral-glass-soft) !important;
  background-color: rgba(12,12,12,.66) !important;
  border: 1px solid var(--rc-neutral-line) !important;
  box-shadow: var(--rc-neutral-highlight), 0 10px 28px rgba(0,0,0,.24) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .activator:hover,
html.rc-app-bg .select-wrapper .select.project-selector .activator:active,
html.rc-app-bg .select-wrapper .select.project-selector .activator:focus-visible,
html.rc-app-bg .select-wrapper .select.project-selector .activator.-opened{
  color: #fff !important;
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.028)), rgba(14,14,14,.72) !important;
  background-color: rgba(14,14,14,.72) !important;
  border-color: rgba(255,255,255,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 14px 36px rgba(0,0,0,.34) !important;
  outline: none !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list{
  color: rgba(255,255,255,.82) !important;
  background: var(--rc-neutral-glass) !important;
  background-color: rgba(10,10,10,.82) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.065), 0 24px 60px rgba(0,0,0,.52) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list .select-label{
  color: rgba(255,255,255,.58) !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list .option{
  color: rgba(255,255,255,.78) !important;
  background: transparent !important;
  border-color: transparent !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .options-list .option:hover,
html.rc-app-bg .select-wrapper .select.project-selector .options-list .option.-active,
html.rc-app-bg .select-wrapper .select.project-selector .options-list .option.-selected{
  color: #fff !important;
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  border-color: rgba(255,255,255,.11) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

html.rc-app-bg .navigation .footer :is(button,a,[role="button"]),
html.rc-app-bg .navigation .header .navigation-state-btn{
  color: rgba(255,255,255,.72) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 9px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
}

html.rc-app-bg .navigation .footer :is(button,a,[role="button"]):hover,
html.rc-app-bg .navigation .header .navigation-state-btn:hover{
  color: #fff !important;
  background: rgba(255,255,255,.085) !important;
  border-color: rgba(255,255,255,.15) !important;
}

html.rc-app-bg .navigation .footer svg,
html.rc-app-bg .navigation .header svg,
html.rc-app-bg .navigation .item-row svg{
  color: currentColor !important;
  fill: currentColor !important;
  opacity: .88 !important;
}

html.rc-app-bg :is(.vfm__content,.n-modal,.n-popover,.n-dropdown-menu,.n-base-select-menu,.p-overlaypanel,.p-contextmenu,[role="dialog"]),
html.rc-app-bg .content-with-sidebar > .sidebar-wrapper{
  color: rgba(255,255,255,.84) !important;
  background: var(--rc-neutral-glass) !important;
  background-color: rgba(10,10,10,.78) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.065), 0 24px 70px rgba(0,0,0,.48) !important;
  -webkit-backdrop-filter: blur(24px) !important;
  backdrop-filter: blur(24px) !important;
}

html.rc-app-bg :is(.input-box,.n-input,.n-base-selection,textarea,select),
html.rc-app-bg input:not([type="checkbox"]):not([type="radio"]),
html.rc-app-bg button:not(.preset.primary):not(.destructive){
  color: rgba(255,255,255,.84) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.022)) !important;
  background-color: rgba(15,15,15,.62) !important;
  border-color: rgba(255,255,255,.095) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

html.rc-app-bg :is(.input-box,.n-input,.n-base-selection,textarea,select):hover,
html.rc-app-bg input:not([type="checkbox"]):not([type="radio"]):hover,
html.rc-app-bg button:not(.preset.primary):not(.destructive):hover{
  background: linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.032)) !important;
  background-color: rgba(17,17,17,.68) !important;
  border-color: rgba(255,255,255,.15) !important;
}

html.rc-app-bg .navigation :is(.item-name,.section-name),
html.rc-app-bg #rc-panel-home :is(.rph-sub,.rph-stat-top,.rph-stat-hint,.rph-list-sub,.rph-slots,.rph-upd,.rph-players),
html.rc-app-bg :is(.text-grey-400,.text-grey-500,.text-grey-600){
  color: rgba(255,255,255,.64) !important;
  opacity: 1 !important;
}

html.rc-app-bg #rc-panel-home :is(.rph-title,.rph-stat-value,.rph-list-title,.rph-server-name),
html.rc-app-bg :is(h1,h2,h3,h4,.title){
  color: rgba(255,255,255,.92) !important;
}

/* Visibility balance: still monochrome, but no longer crushed into black. */
html.rc-app-bg #rc-app-bg .bg,
html.rc-app-bg body[data-checkapp-page] #rc-app-bg .bg,
#rc-home .bg,
#rc-profile-bg .bg{
  background:
    radial-gradient(ellipse 76% 62% at 14% 8%, rgba(255,255,255,.105) 0%, rgba(255,255,255,.036) 42%, transparent 74%),
    radial-gradient(ellipse 68% 58% at 88% 24%, rgba(255,255,255,.075) 0%, rgba(255,255,255,.024) 44%, transparent 76%),
    radial-gradient(ellipse 82% 55% at 48% 105%, rgba(255,255,255,.055) 0%, rgba(255,255,255,.014) 48%, transparent 74%),
    #090909 !important;
}

html.rc-app-bg .layout .navigation-wrapper,
html.rc-app-bg .navigation,
html.rc-app-bg .navigation .header,
html.rc-app-bg .navigation .footer{
  color: rgba(255,255,255,.78) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.024)), rgba(18,18,18,.76) !important;
  background-color: rgba(18,18,18,.76) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 8px 0 34px rgba(0,0,0,.18) !important;
}

html.rc-app-bg .navigation .item-row,
html.rc-app-bg .navigation .item-row .item-name,
html.rc-app-bg .navigation .item-row .icon,
html.rc-app-bg .navigation .item-row svg{
  color: rgba(255,255,255,.72) !important;
  fill: currentColor !important;
  opacity: 1 !important;
}

html.rc-app-bg .navigation .item-row.router-link-active,
html.rc-app-bg .navigation a.router-link-active .item-row,
html.rc-app-bg .navigation .item-row.active,
html.rc-app-bg .navigation .item-row:hover{
  color: rgba(255,255,255,.96) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.105), rgba(255,255,255,.042)) !important;
  border-color: rgba(255,255,255,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 8px 24px rgba(0,0,0,.16) !important;
}

html.rc-app-bg .navigation .item-row.router-link-active :is(.item-name,.icon,svg),
html.rc-app-bg .navigation a.router-link-active .item-row :is(.item-name,.icon,svg),
html.rc-app-bg .navigation .item-row.active :is(.item-name,.icon,svg),
html.rc-app-bg .navigation .item-row:hover :is(.item-name,.icon,svg){
  color: rgba(255,255,255,.96) !important;
}

html.rc-app-bg .content.ignore-side > .header,
html.rc-app-bg .layout-page > .header,
html.rc-app-bg .content > .header,
html.rc-app-bg .page-content > .header{
  background: linear-gradient(180deg, rgba(255,255,255,.065), rgba(255,255,255,.022)), rgba(17,17,17,.70) !important;
  background-color: rgba(17,17,17,.70) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 14px 36px rgba(0,0,0,.16) !important;
}

html.rc-app-bg #rc-panel-home .rph-stat,
html.rc-app-bg #rc-panel-home .rph-list-wrap,
html.rc-app-bg #rc-panel-home .rph-server,
html.rc-app-bg .content .divided-card,
html.rc-app-bg .content .settings-container,
html.rc-app-bg .content .n-card,
html.rc-app-bg .content .n-data-table-wrapper,
html.rc-app-bg .content .n-data-table{
  background: linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.028)), rgba(19,19,19,.66) !important;
  background-color: rgba(19,19,19,.66) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), 0 16px 42px rgba(0,0,0,.18) !important;
}

html.rc-app-bg .select-wrapper .select.project-selector .activator,
html.rc-app-bg .select-wrapper .select.project-selector .options-list,
html.rc-app-bg :is(.vfm__content,.n-modal,.n-popover,.n-dropdown-menu,.n-base-select-menu,.p-overlaypanel,.p-contextmenu,[role="dialog"]),
html.rc-app-bg .content-with-sidebar > .sidebar-wrapper{
  color: rgba(255,255,255,.88) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.032)), rgba(17,17,17,.80) !important;
  background-color: rgba(17,17,17,.80) !important;
  border-color: rgba(255,255,255,.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), 0 24px 62px rgba(0,0,0,.42) !important;
}

html.rc-app-bg #rc-panel-home :is(.rph-sub,.rph-stat-top,.rph-stat-hint,.rph-list-sub,.rph-slots,.rph-upd,.rph-players),
html.rc-app-bg :is(.text-grey-400,.text-grey-500,.text-grey-600),
html.rc-app-bg .navigation :is(.item-name,.section-name){
  color: rgba(255,255,255,.70) !important;
}
/* Final neutral glass overrides: intentionally last in this stylesheet. */
html.rc-app-bg body:has(.sidebar-content) .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger){
  background: linear-gradient(180deg, rgba(255,255,255,.095), rgba(255,255,255,.025)) !important;
  border-color: rgba(255,255,255,.15) !important;
  color: rgba(255,255,255,.9) !important;
  fill: rgba(255,255,255,.9) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 7px 18px rgba(0,0,0,.2) !important;
  -webkit-backdrop-filter: blur(18px) saturate(110%) !important;
  backdrop-filter: blur(18px) saturate(110%) !important;
}
html.rc-app-bg body:has(.sidebar-content) .player-message-page-header-container button.ra-button .wrapper,
html.rc-app-bg body:has(.sidebar-content) .player-message-page-header-container button.ra-button svg,
html.rc-app-bg body:has(.sidebar-content) .player-message-page-header-container button.ra-button svg *{
  color: rgba(255,255,255,.9) !important;
  fill: currentColor !important;
  filter: none !important;
  opacity: 1 !important;
}
html.rc-app-bg body:has(.sidebar-content) .player-message-page-header-container button.ra-button:hover{
  background: linear-gradient(180deg, rgba(255,255,255,.16), rgba(255,255,255,.055)) !important;
  border-color: rgba(255,255,255,.27) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 9px 23px rgba(0,0,0,.23) !important;
  filter: none !important;
}
html.rc-app-bg body:has(.sidebar-content) .sidebar-content,
html.rc-app-bg body:has(.sidebar-content) *:has(> .sidebar-content),
html.rc-app-bg body:has(.sidebar-content) .sidebar-wrapper{
  background: transparent !important;
  background-color: transparent !important;
  border-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Clear Liquid Glass controls in the sidebar header — no flat grey fill. */
html.rc-app-bg .navigation .header .select-wrapper .select.project-selector .activator,
html.rc-app-bg .navigation .header .navigation-state-btn{
  color: rgba(255,255,255,.9) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.026), rgba(255,255,255,.006)) !important;
  background-color: transparent !important;
  border-color: rgba(255,255,255,.10) !important;
  border-top-color: rgba(255,255,255,.19) !important;
  outline: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), inset 0 -1px 0 rgba(255,255,255,.012) !important;
  -webkit-backdrop-filter: blur(14px) saturate(108%) !important;
  backdrop-filter: blur(14px) saturate(108%) !important;
}

html.rc-app-bg .navigation .header .select-wrapper .select.project-selector .activator:hover,
html.rc-app-bg .navigation .header .select-wrapper .select.project-selector .activator:active,
html.rc-app-bg .navigation .header .select-wrapper .select.project-selector .activator:focus-visible,
html.rc-app-bg .navigation .header .select-wrapper .select.project-selector .activator.-opened,
html.rc-app-bg .navigation .header .navigation-state-btn:hover{
  background: rgba(255,255,255,.025) !important;
  background-color: rgba(255,255,255,.025) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.14) !important;
  border-top-color: rgba(255,255,255,.23) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
}
html.rc-app-bg body:has(.sidebar-content) .sidebar-content .settings-container{
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.014)) !important;
  border-color: rgba(255,255,255,.11) !important;
  box-shadow: 0 16px 40px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.085) !important;
  -webkit-backdrop-filter: blur(20px) saturate(112%) !important;
  backdrop-filter: blur(20px) saturate(112%) !important;
}

/* Discord three-dot setup wizard: same light liquid glass as webhook settings. */
html.rc-app-bg .modal-border .modal:has(.autokick-modal),
html.rc-app-bg .vfm__content:has(.autokick-modal){
  background:
    radial-gradient(110% 66% at 14% -4%, rgba(255,255,255,.11), transparent 58%),
    linear-gradient(145deg, rgba(24,24,25,.47), rgba(6,6,7,.32) 54%, rgba(18,18,19,.40)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 22px !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.15) !important;
  -webkit-backdrop-filter: blur(36px) saturate(115%) !important;
  backdrop-filter: blur(36px) saturate(115%) !important;
  overflow: hidden !important;
}
html.rc-app-bg .modal:has(.autokick-modal) :is(.autokick-modal,.card,.card-header,.card-body){
  background: transparent !important;
  background-color: transparent !important;
  border-color: rgba(255,255,255,.085) !important;
}
html.rc-app-bg .modal:has(.autokick-modal) :is(input,.input-box,.select,.select-wrapper .activator){
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}

/* Global background-customizer contract: one blur value for the whole app. */
html.rc-app-bg :is(
  .layout .navigation-wrapper > .navigation,
  .content.ignore-side > .header,
  .layout-page > .header,
  .content > .header,
  .page-content > .header,
  .content .divided-card,
  .content .settings-container,
  .content .n-card,
  .content .n-data-table-wrapper,
  .content .n-data-table,
  .webhooks .action,
  .vfm__content,
  .n-modal,
  .n-popover,
  .n-dropdown-menu,
  .n-base-select-menu,
  .p-overlaypanel,
  .p-contextmenu,
  [role="dialog"],
  .content-with-sidebar > .sidebar-wrapper,
  .sidebar-content .settings-container
){
  -webkit-backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
  backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
}

/* The right rail must be glass, not an empty transparent hole. */
html.rc-app-bg body:has(.sidebar-content) .sidebar-content,
html.rc-app-bg body:has(.sidebar-content) .sidebar-wrapper,
html.rc-app-bg .content-with-sidebar > .sidebar-wrapper{
  background: linear-gradient(160deg, rgba(28,28,29,.66), rgba(8,8,9,.58)) !important;
  background-color: rgba(11,11,12,.62) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: -18px 0 48px rgba(0,0,0,.30), inset 1px 0 rgba(255,255,255,.055) !important;
  -webkit-backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
  backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
}
html.rc-app-bg body:has(.sidebar-content) .sidebar-content .settings-container{
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.020)) !important;
  border-color: rgba(255,255,255,.12) !important;
}

/* Closed nav: a single clean white chevron, never the old square glyph. */
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn{
  position: relative !important;
  display: grid !important;
  place-items: center !important;
  width: 30px !important;
  height: 30px !important;
  padding: 0 !important;
  background: linear-gradient(145deg, rgba(255,255,255,.026), rgba(255,255,255,.006)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-top-color: rgba(255,255,255,.19) !important;
  border-radius: 9px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), inset 0 -1px 0 rgba(255,255,255,.012) !important;
  -webkit-backdrop-filter: blur(14px) saturate(108%) !important;
  backdrop-filter: blur(14px) saturate(108%) !important;
}
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn svg{
  display: none !important;
}
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn::before{
  content: "‹" !important;
  display: block !important;
  color: rgba(255,255,255,.94) !important;
  font-family: Arial, sans-serif !important;
  font-size: 25px !important;
  font-weight: 300 !important;
  line-height: 1 !important;
  text-shadow: 0 1px 5px rgba(0,0,0,.42) !important;
}
html.rc-app-bg .navigation-wrapper.closed .navigation .navigation-state-btn::before{
  content: "›" !important;
}
html.rc-app-bg .navigation-wrapper .navigation .navigation-state-btn:hover{
  background: rgba(255,255,255,.025) !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* Project settings: dense, readable liquid-glass groups instead of flat dark rows. */
html.rc-app-bg .content.pt-8 .section .settings{
  /* Select menus live inside the group and must not be clipped by its radius. */
  overflow: visible !important;
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.026)) !important;
  background-color: rgba(17,17,18,.64) !important;
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 48px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.12) !important;
  -webkit-backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
  backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
}
html.rc-app-bg .content.pt-8 .section .settings-container{
  overflow: visible !important;
}
html.rc-app-bg .content.pt-8 .section .settings > .switch-wrapper{
  min-height: 66px !important;
  padding: 11px 14px !important;
  background: linear-gradient(100deg, rgba(255,255,255,.022), rgba(255,255,255,.006)) !important;
  border-color: rgba(255,255,255,.085) !important;
  transition: background 160ms ease, box-shadow 160ms ease !important;
}
html.rc-app-bg .content.pt-8 .section .settings > .switch-wrapper:hover{
  background: linear-gradient(100deg, rgba(255,255,255,.065), rgba(255,255,255,.022)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .switch-text .title,
html.rc-app-bg .content.pt-8 .section .settings .switch-text .title p{
  color: rgba(255,255,255,.94) !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
}
html.rc-app-bg .content.pt-8 .section .settings .switch-text .subtitle{
  color: rgba(255,255,255,.58) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings .activator{
  min-width: 96px !important;
  padding: 7px 9px !important;
  color: rgba(255,255,255,.9) !important;
  background: rgba(0,0,0,.23) !important;
  border: 1px solid #fff !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings .activator:hover{
  background: rgba(255,255,255,.08) !important;
  border-color: rgba(255,255,255,.19) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings .arrow-icon{
  fill: rgba(255,255,255,.62) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings .options-list{
  z-index: 40 !important;
  min-width: 132px !important;
  margin-top: 7px !important;
  padding: 5px !important;
  color: rgba(255,255,255,.9) !important;
  background: linear-gradient(145deg, rgba(38,38,40,.96), rgba(14,14,15,.95)) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 12px !important;
  box-shadow: 0 18px 38px rgba(0,0,0,.44), inset 0 1px 0 rgba(255,255,255,.10) !important;
  -webkit-backdrop-filter: blur(max(var(--rc-user-glass-blur, 24px), 30px)) saturate(112%) !important;
  backdrop-filter: blur(max(var(--rc-user-glass-blur, 24px), 30px)) saturate(112%) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings .options-list .option{
  padding: 8px 9px !important;
  border-radius: 8px !important;
  color: rgba(255,255,255,.78) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings .options-list .option:hover{
  color: #fff !important;
  background: rgba(255,255,255,.10) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .custom-switch .slider{
  background: rgba(0,0,0,.42) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: inset 0 1px 3px rgba(0,0,0,.48), inset 0 1px 0 rgba(255,255,255,.045) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .custom-switch input:checked + .slider,
html.rc-app-bg .content.pt-8 .section .settings .custom-switch .peer:checked + .slider{
  background: linear-gradient(135deg, rgba(255,255,255,.98), rgba(215,215,215,.88)) !important;
  border-color: rgba(255,255,255,.78) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,.10), inset 0 1px 0 rgba(255,255,255,.88) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .custom-switch .slider::before{
  background: linear-gradient(145deg, #fbfbfb, #bdbdbd) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.9) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .custom-switch input:checked + .slider::before,
html.rc-app-bg .content.pt-8 .section .settings .custom-switch .peer:checked + .slider::before{
  background: linear-gradient(145deg, #303030, #0e0e0e) !important;
  box-shadow: 0 1px 4px rgba(0,0,0,.42), inset 0 1px 0 rgba(255,255,255,.14) !important;
}
html.rc-app-bg .content.pt-8 .tabbed-navigation{
  padding: 3px !important;
  background: rgba(10,10,11,.47) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 14px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075) !important;
  -webkit-backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
  backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
}
html.rc-app-bg .content.pt-8 .tabbed-navigation :is(a,button){
  border-radius: 10px !important;
}

/* Settings follow-up: keep an opened selector above neighbouring rows. */
html.rc-app-bg .content.pt-8 .section .settings{
  position: relative !important;
  background: linear-gradient(145deg, rgba(255,255,255,.050), rgba(255,255,255,.015)) !important;
  background-color: rgba(13,13,14,.48) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: 0 22px 52px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.085) !important;
}
html.rc-app-bg .content.pt-8 .section .settings > .switch-wrapper{
  position: relative !important;
  background: linear-gradient(100deg, rgba(255,255,255,.014), rgba(255,255,255,.004)) !important;
}
html.rc-app-bg .content.pt-8 .section .settings > .switch-wrapper:has(.options-list){
  z-index: 60 !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings{
  position: relative !important;
  z-index: 1 !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings:has(.options-list){
  z-index: 61 !important;
}

/* Same dark glass switches as Integrations: no solid white tracks. */
html.rc-app-bg .content.pt-8 .section .settings .custom-switch .slider{
  background: rgba(0,0,0,.34) !important;
  border-color: rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 4px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.035) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .custom-switch input:checked + .slider,
html.rc-app-bg .content.pt-8 .section .settings .custom-switch .peer:checked + .slider{
  background: linear-gradient(145deg, rgba(255,255,255,.27), rgba(255,255,255,.11)) !important;
  border-color: rgba(255,255,255,.23) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), 0 4px 14px rgba(0,0,0,.20) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .custom-switch .slider::before,
html.rc-app-bg .content.pt-8 .section .settings .custom-switch input:checked + .slider::before,
html.rc-app-bg .content.pt-8 .section .settings .custom-switch .peer:checked + .slider::before{
  background: rgba(255,255,255,.90) !important;
  box-shadow: 0 2px 7px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.55) !important;
}

/* Settings-only dialogs, lists, inputs and actions share one translucent shell. */
html.rc-app-bg body:has(.content.pt-8) .modal > .divided-card,
html.rc-app-bg body:has(.content.pt-8) .modal .divided-card{
  background: linear-gradient(145deg, rgba(37,37,39,.74), rgba(13,13,14,.70)) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 18px !important;
  box-shadow: 0 26px 72px rgba(0,0,0,.52), inset 0 1px 0 rgba(255,255,255,.12) !important;
  -webkit-backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
  backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(112%) !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal .divided-card > .header{
  background: linear-gradient(90deg, rgba(255,255,255,.055), rgba(255,255,255,.012)) !important;
  border-color: rgba(255,255,255,.10) !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal :is(input, textarea, .select .activator, .input, .input-wrapper){
  background: rgba(0,0,0,.24) !important;
  border-color: rgba(255,255,255,.10) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal :is(.project, .action, .template, .item, .subscription){
  background: linear-gradient(135deg, rgba(255,255,255,.060), rgba(255,255,255,.018)) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal :is(.project, .action, .template, .item, .subscription):hover{
  background: linear-gradient(135deg, rgba(255,255,255,.090), rgba(255,255,255,.030)) !important;
  border-color: rgba(255,255,255,.16) !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal button:not(.close){
  border-radius: 9px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

/* Pure liquid glass: remove bright white halos and edge shine everywhere. */
html.rc-app-bg :is(
  .divided-card,
  .settings-container,
  .section .settings,
  .webhooks .action,
  .n-card,
  .n-popover,
  .n-dropdown-menu,
  .n-base-select-menu,
  .p-overlaypanel,
  .p-contextmenu,
  .vfm__content,
  [role="dialog"],
  .content-with-sidebar > .sidebar-wrapper,
  .sidebar-content
){
  border-color: rgba(255,255,255,.065) !important;
  box-shadow: 0 22px 58px rgba(0,0,0,.38) !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal > .divided-card,
html.rc-app-bg body:has(.content.pt-8) .modal .divided-card{
  background: linear-gradient(145deg, rgba(28,28,30,.70), rgba(10,10,11,.66)) !important;
  border-color: rgba(255,255,255,.065) !important;
  box-shadow: 0 28px 76px rgba(0,0,0,.58) !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal .divided-card > .header{
  background: rgba(255,255,255,.018) !important;
  border-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal :is(.project, .action, .template, .item, .subscription){
  background: linear-gradient(135deg, rgba(255,255,255,.032), rgba(255,255,255,.010)) !important;
  border-color: rgba(255,255,255,.060) !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.18) !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal :is(.project, .action, .template, .item, .subscription):hover{
  background: linear-gradient(135deg, rgba(255,255,255,.052), rgba(255,255,255,.016)) !important;
  border-color: rgba(255,255,255,.085) !important;
}
html.rc-app-bg .content.pt-8 .section .settings{
  border-color: rgba(255,255,255,.060) !important;
  box-shadow: 0 24px 54px rgba(0,0,0,.32) !important;
}
html.rc-app-bg .content.pt-8 .section .settings > .switch-wrapper,
html.rc-app-bg .content.pt-8 .section .settings > .switch-wrapper:hover{
  border-color: rgba(255,255,255,.045) !important;
  box-shadow: none !important;
}
html.rc-app-bg .content.pt-8 .tabbed-navigation,
html.rc-app-bg .content.pt-8 .section .settings .select.settings .activator,
html.rc-app-bg .content.pt-8 .section .settings .select.settings .options-list{
  border-color: rgba(255,255,255,.065) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.30) !important;
}
html.rc-app-bg :is(button, .button, .btn, .activator, .navigation-state-btn){
  text-shadow: none !important;
}
html.rc-app-bg body:has(.content.pt-8) .modal button:not(.close),
html.rc-app-bg body:has(.content.pt-8) .modal :is(input, textarea, .select .activator, .input, .input-wrapper){
  box-shadow: none !important;
  border-color: rgba(255,255,255,.060) !important;
}

/* Settings v4: zero white halo. Glass is defined by blur and dark depth only. */
html.rc-app-bg .tabbed-navigation > .header,
html.rc-app-bg .content.pt-8 .section .settings,
html.rc-app-bg .content.pt-8 .section .settings-container,
html.rc-app-bg .content.pt-8 .section .settings .select.settings .activator,
html.rc-app-bg .content.pt-8 .section .settings .select.settings .options-list{
  border-color: transparent !important;
  outline: 0 !important;
  text-shadow: none !important;
}
html.rc-app-bg .tabbed-navigation > .header{
  background: rgba(14,14,15,.50) !important;
  box-shadow: 0 14px 34px rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(108%) !important;
  backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(108%) !important;
}
html.rc-app-bg .tabbed-navigation > .header .element{
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  text-shadow: none !important;
}
html.rc-app-bg .tabbed-navigation > .header .element.selected{
  background: rgba(255,255,255,.075) !important;
  border: 0 !important;
  box-shadow: none !important;
}
html.rc-app-bg .content.pt-8 .section .settings{
  background: linear-gradient(145deg, rgba(30,30,32,.54), rgba(9,9,10,.48)) !important;
  box-shadow: 0 24px 60px rgba(0,0,0,.42) !important;
}
html.rc-app-bg .content.pt-8 .section .settings > .switch-wrapper{
  border-color: rgba(255,255,255,.030) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings .activator{
  background: rgba(0,0,0,.30) !important;
  box-shadow: 0 7px 18px rgba(0,0,0,.22) !important;
}
html.rc-app-bg .content.pt-8 .section .settings .select.settings .options-list{
  box-shadow: 0 20px 46px rgba(0,0,0,.55) !important;
}

/* Exact Integrations switch geometry and states across every Settings tab/modal. */
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .slider{
  width: 42px !important;
  height: 24px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  background: rgba(0,0,0,.38) !important;
  box-shadow: inset 0 2px 5px rgba(0,0,0,.40) !important;
}
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .slider::before{
  content: none !important;
  display: none !important;
}
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .slider::after{
  content: "" !important;
  position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  width: 18px !important;
  height: 18px !important;
  border-radius: 9999px !important;
  background: #8a8a8a !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.25) !important;
}
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .peer:checked + .slider{
  border-color: rgba(72,255,137,.38) !important;
  background: linear-gradient(135deg, rgba(31,205,97,.92), rgba(66,226,126,.78)) !important;
  box-shadow: 0 0 14px rgba(45,220,111,.18), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .peer:checked + .slider::after{
  transform: translateX(18px) !important;
  background: #fff !important;
  box-shadow: 0 2px 7px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.90) !important;
}

html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .modal > .divided-card,
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .modal .divided-card,
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .modal :is(.project, .action, .template, .item, .subscription){
  border-color: transparent !important;
  outline: 0 !important;
}

/* Specificity lock: Settings switches must remain pixel-identical to Integrations. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings .custom-switch .slider,
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .modal .custom-switch .slider{
  width: 42px !important;
  height: 24px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  background: rgba(0,0,0,.38) !important;
  box-shadow: inset 0 2px 5px rgba(0,0,0,.40) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings .custom-switch .slider::after,
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .modal .custom-switch .slider::after{
  content: "" !important;
  top: 3px !important;
  left: 3px !important;
  width: 18px !important;
  height: 18px !important;
  background: #8a8a8a !important;
  box-shadow: 0 2px 6px rgba(0,0,0,.45), inset 0 1px 0 rgba(255,255,255,.25) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings .custom-switch .peer:checked + .slider,
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .modal .custom-switch .peer:checked + .slider{
  border-color: rgba(72,255,137,.38) !important;
  background: linear-gradient(135deg, rgba(31,205,97,.92), rgba(66,226,126,.78)) !important;
  box-shadow: 0 0 14px rgba(45,220,111,.18), inset 0 1px 0 rgba(255,255,255,.28) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings .custom-switch .peer:checked + .slider::after,
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .modal .custom-switch .peer:checked + .slider::after{
  transform: translateX(18px) !important;
  background: #fff !important;
  box-shadow: 0 2px 7px rgba(0,0,0,.34), inset 0 1px 0 rgba(255,255,255,.90) !important;
}

/* Selects sit inside several backdrop-filter stacking contexts. Raise the whole
   active branch so following Settings sections cannot paint over its menu. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section:has(.select.settings .options-list),
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings-container:has(.select.settings .options-list),
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings:has(.select.settings .options-list){
  position: relative !important;
  z-index: 200 !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .select.settings:has(.options-list),
html.rc-app-bg .tabbed-navigation .content.pt-8 .select.settings .options-list{
  z-index: 210 !important;
}

/* Confirmation and warning dialogs: compact, dark liquid glass. */
html.rc-app-bg .relative:has(> .modal-border .confirm) > .modal-backdrop{
  background: rgba(0,0,0,.62) !important;
  -webkit-backdrop-filter: blur(7px) !important;
  backdrop-filter: blur(7px) !important;
}
html.rc-app-bg .modal-border:has(.confirm){
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
html.rc-app-bg .modal-border:has(.confirm) > .modal,
html.rc-app-bg .modal-border:has(.confirm) .confirm{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html.rc-app-bg .modal-border:has(.confirm) > .modal{
  overflow: hidden !important;
  border-radius: 20px !important;
  background: rgba(3,3,4,.52) !important;
  outline: 1px solid rgba(255,255,255,.045) !important;
  outline-offset: -1px !important;
  box-shadow: 0 32px 90px rgba(0,0,0,.62) !important;
  -webkit-backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(102%) !important;
  backdrop-filter: blur(var(--rc-user-glass-blur, 24px)) saturate(102%) !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .content{
  padding: 22px 22px 20px !important;
  background: transparent !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .icon-warn{
  display: grid !important;
  place-items: center !important;
  width: 72px !important;
  height: 66px !important;
  margin: 0 auto 14px !important;
  border-radius: 18px !important;
  background: transparent !important;
  box-shadow: none !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .icon-warn svg{
  width: 64px !important;
  height: 56px !important;
  filter: none !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .title{
  margin: 0 0 6px !important;
  color: rgba(255,255,255,.94) !important;
  font-size: 17px !important;
  font-weight: 650 !important;
  letter-spacing: -.015em !important;
  text-shadow: none !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .subtitle{
  color: rgba(255,255,255,.58) !important;
  line-height: 1.35 !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .buttons{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  margin-top: 18px !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .buttons .ra-button{
  width: 100% !important;
  min-height: 38px !important;
  border: 0 !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.86) !important;
  background: rgba(255,255,255,.050) !important;
  outline: 1px solid rgba(255,255,255,.030) !important;
  outline-offset: -1px !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.16) !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .buttons .ra-button:hover{
  background: rgba(255,255,255,.055) !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .buttons .ra-button.primary{
  color: rgba(255,255,255,.96) !important;
  background: rgba(255,255,255,.10) !important;
}
html.rc-app-bg .modal-border:has(.confirm) .confirm .buttons .ra-button.primary:hover{
  background: rgba(255,255,255,.095) !important;
}

/* Public ban lists — readable, responsive iOS-style liquid glass. */
html.rc-app-bg .relative:has(.modal[internal-id="?ban-sync-available="]){
  position: fixed !important;
  inset: 0 !important;
  z-index: 1000 !important;
  display: grid !important;
  place-items: center !important;
  padding: clamp(10px, 2.4vw, 28px) !important;
}
html.rc-app-bg .relative:has(.modal[internal-id="?ban-sync-available="]) > .modal-backdrop{
  background: rgba(0, 0, 0, .34) !important;
  -webkit-backdrop-filter: blur(5px) saturate(108%) !important;
  backdrop-filter: blur(5px) saturate(108%) !important;
}
html.rc-app-bg .modal-border:has(.modal[internal-id="?ban-sync-available="]){
  width: min(560px, calc(100vw - 20px)) !important;
  max-width: 100% !important;
  max-height: calc(100dvh - 20px) !important;
  border: 0 !important;
  border-radius: 26px !important;
  background: linear-gradient(150deg, rgba(255,255,255,.25) 0%, rgba(255,255,255,.075) 38%, rgba(255,255,255,.025) 76%, rgba(255,255,255,.09) 100%) !important;
  padding: 1px !important;
  overflow: hidden !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.48), 0 5px 18px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.24), inset 0 -1px 0 rgba(255,255,255,.025) !important;
}
html.rc-app-bg .modal-border:has(.modal[internal-id="?ban-sync-available="]) > .modal,
html.rc-app-bg .modal[internal-id="?ban-sync-available="]{
  width: 100% !important;
  max-width: none !important;
  height: auto !important;
  max-height: calc(100dvh - 22px) !important;
  border: 0 !important;
  border-radius: 25px !important;
  overflow: hidden !important;
  position: relative !important;
  isolation: isolate !important;
  background:
    radial-gradient(120% 38% at 18% -8%, rgba(255,255,255,.13), transparent 48%),
    radial-gradient(50% 22% at 102% 16%, rgba(255,255,255,.065), transparent 62%),
    rgba(25, 25, 28, .24) !important;
  -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
  backdrop-filter: blur(20px) saturate(140%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16), inset 1px 0 0 rgba(255,255,255,.045), inset -1px 0 0 rgba(255,255,255,.025), inset 0 -1px 0 rgba(0,0,0,.18) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="]::before{
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 1px !important;
  border-radius: 24px !important;
  pointer-events: none !important;
  background:
    linear-gradient(110deg, rgba(255,255,255,.07), transparent 14% 84%, rgba(255,255,255,.025)),
    radial-gradient(36% 8% at 28% 0%, rgba(255,255,255,.12), transparent 100%) !important;
  opacity: .72 !important;
  transition: opacity 220ms ease !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="]:hover::before{
  opacity: .96 !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card{
  display: flex !important;
  flex-direction: column !important;
  max-height: calc(100dvh - 22px) !important;
  border: 0 !important;
  background: transparent !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .header{
  flex: 0 0 auto !important;
  min-height: 64px !important;
  padding: 0 20px !important;
  border-color: rgba(255,255,255,.075) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.045), transparent 72%) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .header .title{
  color: rgba(255,255,255,.96) !important;
  font-size: 17px !important;
  font-weight: 650 !important;
  letter-spacing: -.018em !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .header .close{
  box-sizing: content-box !important;
  width: 17px !important;
  height: 17px !important;
  padding: 8px !important;
  border-radius: 999px !important;
  fill: rgba(255,255,255,.68) !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
  transition: background-color .18s ease, fill .18s ease, transform .18s ease !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .header .close:hover{
  fill: #fff !important;
  background: rgba(255,255,255,.105) !important;
  transform: scale(1.04) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .content{
  min-height: 0 !important;
  overflow-y: auto !important;
  overscroll-behavior: contain !important;
  background: transparent !important;
  scrollbar-gutter: stable !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects{
  gap: 12px !important;
  padding: 16px !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .tip{
  margin: 0 0 2px !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 16px !important;
  color: rgba(255,255,255,.88) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.07), rgba(25,25,28,.10) 56%, rgba(255,255,255,.018)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), inset 1px 0 0 rgba(255,255,255,.025), 0 8px 24px rgba(0,0,0,.08) !important;
  transition: background-color 220ms ease, border-color 220ms ease, box-shadow 220ms ease !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .tip .icon{
  fill: rgba(255,255,255,.72) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .tip:hover{
  border-color: rgba(255,255,255,.11) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.085), rgba(25,25,28,.12) 56%, rgba(255,255,255,.025)) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .project{
  position: relative !important;
  isolation: isolate !important;
  gap: 11px !important;
  padding: 14px !important;
  border: 1px solid rgba(255,255,255,.065) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(60% 22% at 18% 0%, rgba(255,255,255,.08), transparent 72%),
    rgba(25,25,28,.13) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), inset 1px 0 0 rgba(255,255,255,.022), inset 0 -1px 0 rgba(0,0,0,.13), 0 10px 24px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(12px) saturate(118%) !important;
  backdrop-filter: blur(12px) saturate(118%) !important;
  transition: background-color 220ms ease, border-color 220ms ease, box-shadow 220ms ease, transform 220ms ease !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .project::after{
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 1px !important;
  border-radius: 17px !important;
  pointer-events: none !important;
  background: linear-gradient(112deg, rgba(255,255,255,.035), transparent 18% 82%, rgba(255,255,255,.015)) !important;
  opacity: .55 !important;
  transition: opacity 220ms ease !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .project:hover{
  border-color: rgba(255,255,255,.095) !important;
  background: radial-gradient(60% 22% at 18% 0%, rgba(255,255,255,.105), transparent 72%), rgba(32,32,35,.17) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.095), inset 1px 0 0 rgba(255,255,255,.03), inset 0 -1px 0 rgba(0,0,0,.11), 0 13px 28px rgba(0,0,0,.13) !important;
  transform: translateY(-1px) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .project:hover::after{
  opacity: .9 !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .divider-wrapper .line{
  background: rgba(255,255,255,.07) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .lower{
  gap: 10px !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .lower > div{
  min-width: 0 !important;
  flex: 1 1 0 !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .lower .text{
  color: rgba(255,255,255,.48) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .lower .value{
  color: rgba(255,255,255,.82) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .ra-button{
  min-height: 34px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075) !important;
  transition: background-color 200ms ease, border-color 200ms ease, box-shadow 200ms ease, transform 200ms ease !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .ra-button:not(.primary):hover{
  border-color: rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.095) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .ra-button.primary{
  border-color: rgba(112,202,255,.42) !important;
  background: linear-gradient(180deg, #35b5ff, #078bea) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.34), 0 7px 18px rgba(0,142,235,.22) !important;
}
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .ra-button.primary:hover{
  border-color: rgba(155,222,255,.58) !important;
  background: linear-gradient(180deg, #49bdff, #0b93ef) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.42), 0 9px 22px rgba(0,142,235,.28) !important;
  transform: translateY(-1px) !important;
}

@media (max-width: 560px){
  html.rc-app-bg .relative:has(.modal[internal-id="?ban-sync-available="]){
    align-items: end !important;
    padding: 8px !important;
  }
  html.rc-app-bg .modal-border:has(.modal[internal-id="?ban-sync-available="]){
    width: 100% !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 26px !important;
  }
  html.rc-app-bg .modal[internal-id="?ban-sync-available="]{
    max-height: calc(100dvh - 18px) !important;
  }
  html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card{
    max-height: calc(100dvh - 18px) !important;
  }
  html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .header{
    min-height: 58px !important;
    padding: 0 16px !important;
  }
  html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects{
    gap: 10px !important;
    padding: 12px !important;
  }
  html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .project{
    padding: 12px !important;
  }
  html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .lower{
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px 14px !important;
  }
}

/* Final nesting lock: never draw a second rectangle inside a glass control. */
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .suggester-input-wrapper > .input-box,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .suggester-input-wrapper > .input-box:hover,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .suggester-input-wrapper > .input-box:focus-within,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .select-wrapper > .select.modal > .activator,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .input-container > .input-box > input{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .tip > .gradient{
  display: none !important;
}

/* Reports / Checks / Bans / Ban-list / Auto-kick: match the restrained
   dark glass used by the Actions tab. Kept last to neutralise older,
   brighter white-glass declarations without changing component layout. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .settings-container > .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container > .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > div:has(.suggester-input-wrapper.dark.suggester),
html.rc-app-bg .tabbed-navigation .settings-container > .settings:has(.switch-wrapper){
  border-color: rgba(255,255,255,.075) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(60% 24% at 14% 0%, rgba(255,255,255,.075), transparent 72%),
    rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), inset 1px 0 0 rgba(255,255,255,.022), inset 0 -1px 0 rgba(0,0,0,.13), 0 12px 28px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.items,.subscriptions) > :is(.item,.subscription),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > :is(.normal-action,.destructive-action),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .items-row,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.tip,.page-tip,.ra-card){
  border-color: rgba(255,255,255,.075) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(55% 42% at 12% 0%, rgba(255,255,255,.075), transparent 70%),
    rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), inset 0 -1px 0 rgba(0,0,0,.13), 0 12px 28px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.items,.subscriptions) > :is(.item,.subscription):hover,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > :is(.normal-action,.destructive-action):hover{
  border-color: rgba(255,255,255,.115) !important;
  background: radial-gradient(55% 42% at 12% 0%, rgba(255,255,255,.10), transparent 70%), rgba(29,29,32,.19) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), inset 0 -1px 0 rgba(0,0,0,.11), 0 15px 32px rgba(0,0,0,.13) !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.input-container > .input-box,.suggester-input-wrapper,.select-wrapper > .select,.select.modal,.number-input),
html.rc-app-bg .tabbed-navigation .suggester-input-wrapper.dark.suggester{
  border-color: rgba(255,255,255,.07) !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), inset 0 -1px 0 rgba(0,0,0,.12) !important;
  -webkit-backdrop-filter: blur(14px) saturate(130%) !important;
  backdrop-filter: blur(14px) saturate(130%) !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.input-container > .input-box,.suggester-input-wrapper,.select-wrapper > .select,.select.modal,.number-input):is(:hover,:focus-within),
html.rc-app-bg .tabbed-navigation .suggester-input-wrapper.dark.suggester:is(:hover,:focus-within){
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.04) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 9px 24px rgba(0,0,0,.09) !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 .section .ra-button:not(.primary):not(:has(.custom-switch)){
  border-color: rgba(255,255,255,.075) !important;
  background: rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), 0 8px 22px rgba(0,0,0,.09) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}

/* Remove nested grey rectangles: only the outer control owns the glass. */
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .suggester-input-wrapper > .input-box,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .select-wrapper > .select.modal > .activator,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .input-container > .input-box > input{
  border: 0 !important;
  outline: 0 !important;
  border-radius: inherit !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .suggester-input-wrapper > .input-box{
  flex: 1 1 auto !important;
  min-width: 0 !important;
}

/* Reports / Checks / Bans / Ban-list / Auto-kick — one exact iOS glass system. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .settings-container > .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > div:has(.suggester-input-wrapper.dark.suggester){
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.25) !important;
  border-radius: 28px !important;
  color: #fff !important;
  background:
    radial-gradient(58% 18% at 16% 0%, rgba(255,255,255,.11), transparent 72%),
    rgba(255,255,255,.08) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,.10), inset 0 1px 1px rgba(255,255,255,.20), inset 1px 0 0 rgba(255,255,255,.055), inset -1px 0 0 rgba(255,255,255,.018), inset 0 -1px 0 rgba(0,0,0,.12) !important;
  -webkit-backdrop-filter: blur(24px) saturate(140%) !important;
  backdrop-filter: blur(24px) saturate(140%) !important;
}

/* Rows are transparent parts of their parent pane, not stacked grey cards. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings > :is(.switch-wrapper,.switch-text,.normal-action,.destructive-action),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings > div,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container > .settings > div{
  border-color: rgba(255,255,255,.075) !important;
  background: transparent !important;
  box-shadow: none !important;
  transition: background-color 210ms ease, box-shadow 210ms ease !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings > :is(.switch-wrapper,.normal-action,.destructive-action):hover,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container > .settings > .switch-wrapper:hover{
  background: rgba(255,255,255,.055) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.07) !important;
}

/* Standalone widgets and subscription rows. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.items,.subscriptions) > :is(.item,.subscription),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > :is(.normal-action,.destructive-action),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .items-row{
  border: 1px solid rgba(255,255,255,.25) !important;
  border-radius: 28px !important;
  color: #fff !important;
  background:
    radial-gradient(58% 34% at 14% 0%, rgba(255,255,255,.10), transparent 72%),
    rgba(255,255,255,.08) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,.10), inset 0 1px 1px rgba(255,255,255,.20) !important;
  -webkit-backdrop-filter: blur(24px) saturate(140%) !important;
  backdrop-filter: blur(24px) saturate(140%) !important;
  transition: border-color 210ms ease, background-color 210ms ease, transform 210ms ease !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.items,.subscriptions) > :is(.item,.subscription):hover,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > :is(.normal-action,.destructive-action):hover{
  border-color: rgba(255,255,255,.32) !important;
  background: radial-gradient(58% 34% at 14% 0%, rgba(255,255,255,.14), transparent 72%), rgba(255,255,255,.11) !important;
  transform: translateY(-1px) !important;
}

/* Tips and small informative cards use the same material, not a grey fill. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.tip,.page-tip,.ra-card){
  border: 1px solid rgba(255,255,255,.25) !important;
  border-radius: 28px !important;
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,.10), inset 0 1px 1px rgba(255,255,255,.20) !important;
  -webkit-backdrop-filter: blur(24px) saturate(140%) !important;
  backdrop-filter: blur(24px) saturate(140%) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.tip,.page-tip) .icon{
  fill: rgba(255,255,255,.80) !important;
}

/* Form controls across the requested tabs. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.input-container > .input-box,.suggester-input-wrapper,.select-wrapper > .select,.select.modal,.number-input){
  border: 1px solid rgba(255,255,255,.25) !important;
  border-radius: 15px !important;
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,.10), inset 0 1px 1px rgba(255,255,255,.16) !important;
  -webkit-backdrop-filter: blur(24px) saturate(140%) !important;
  backdrop-filter: blur(24px) saturate(140%) !important;
  transition: border-color 210ms ease, background-color 210ms ease, box-shadow 210ms ease !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.input-container > .input-box,.suggester-input-wrapper,.select-wrapper > .select,.select.modal,.number-input):is(:hover,:focus-within){
  border-color: rgba(255,255,255,.34) !important;
  background: rgba(255,255,255,.12) !important;
  box-shadow: 0 6px 30px rgba(0,0,0,.11), inset 0 1px 1px rgba(255,255,255,.22) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .suggester-input-wrapper > .input-box,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .select-wrapper > .select > .activator,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .input-container > .input-box > input,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .suggester-input-wrapper input{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(input,textarea,.activator){
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.30) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(input,textarea)::placeholder{
  color: rgba(255,255,255,.38) !important;
}

/* Buttons and icons stay clean and high-contrast. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .ra-button:not(:has(.custom-switch)){
  border: 1px solid rgba(255,255,255,.25) !important;
  border-radius: 14px !important;
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,.10), inset 0 1px 1px rgba(255,255,255,.18) !important;
  -webkit-backdrop-filter: blur(24px) saturate(140%) !important;
  backdrop-filter: blur(24px) saturate(140%) !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.30) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .ra-button.primary:not(:has(.custom-switch)){
  border-color: rgba(122,207,255,.54) !important;
  background: linear-gradient(180deg, rgba(53,181,255,.96), rgba(7,139,234,.92)) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.35), 0 7px 18px rgba(0,142,235,.20) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.title,p,label,span){
  text-shadow: 0 1px 3px rgba(0,0,0,.30);
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.title,.value){
  color: #fff !important;
}

@media (max-width: 640px){
  html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .settings,
  html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .settings-container > .settings,
  html.rc-app-bg .tabbed-navigation .content.pt-8 .section > div:has(.suggester-input-wrapper.dark.suggester),
  html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.tip,.page-tip,.ra-card){
    border-radius: 22px !important;
  }
}

@media (max-width: 380px){
  html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .top{
    align-items: flex-start !important;
    gap: 8px !important;
  }
  html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .top .right{
    margin-right: 0 !important;
  }
  html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .ra-button{
    padding-left: 8px !important;
    padding-right: 8px !important;
    font-size: 12px !important;
  }
}

/* Settings details — light monochrome liquid-glass surfaces. */
html.rc-app-bg .tabbed-navigation .section > div:has(.suggester-input-wrapper.dark.suggester){
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(60% 22% at 18% 0%, rgba(255,255,255,.085), transparent 72%),
    rgba(25,25,28,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), inset 1px 0 0 rgba(255,255,255,.025), inset 0 -1px 0 rgba(0,0,0,.14), 0 14px 34px rgba(0,0,0,.11) !important;
  -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
  backdrop-filter: blur(20px) saturate(140%) !important;
}
html.rc-app-bg .tabbed-navigation .suggester-input-wrapper.dark.suggester{
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-radius: 13px !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), inset 0 -1px 0 rgba(0,0,0,.12) !important;
  transition: border-color 220ms ease, background-color 220ms ease, box-shadow 220ms ease !important;
}
html.rc-app-bg .tabbed-navigation .suggester-input-wrapper.dark.suggester:focus-within,
html.rc-app-bg .tabbed-navigation .suggester-input-wrapper.dark.suggester:hover{
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.04) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 9px 24px rgba(0,0,0,.09) !important;
}
html.rc-app-bg .tabbed-navigation .suggester-input-wrapper.dark.suggester .value{
  border-color: rgba(255,255,255,.045) !important;
  background: rgba(255,255,255,.025) !important;
}
html.rc-app-bg .tabbed-navigation .suggester-input-wrapper.dark.suggester .item{
  color: rgba(255,255,255,.80) !important;
}

/* Auto-kick groups: one clear pane with translucent rows. */
html.rc-app-bg .tabbed-navigation .settings-container > .settings:has(.switch-wrapper){
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 20px !important;
  background:
    radial-gradient(70% 20% at 16% 0%, rgba(255,255,255,.08), transparent 72%),
    rgba(25,25,28,.16) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09), inset 1px 0 0 rgba(255,255,255,.022), inset 0 -1px 0 rgba(0,0,0,.14), 0 14px 34px rgba(0,0,0,.11) !important;
  -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
  backdrop-filter: blur(20px) saturate(140%) !important;
}
html.rc-app-bg .tabbed-navigation .settings-container > .settings:has(.switch-wrapper) > .switch-wrapper{
  border-color: rgba(255,255,255,.055) !important;
  background: rgba(255,255,255,.012) !important;
  transition: background-color 210ms ease, box-shadow 210ms ease !important;
}
html.rc-app-bg .tabbed-navigation .settings-container > .settings:has(.switch-wrapper) > .switch-wrapper:hover{
  background: rgba(255,255,255,.045) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

/* Custom actions and their two creation controls. */
html.rc-app-bg .tabbed-navigation .section .actions > .action{
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 16px !important;
  background:
    radial-gradient(55% 42% at 12% 0%, rgba(255,255,255,.075), transparent 70%),
    rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), inset 0 -1px 0 rgba(0,0,0,.13), 0 12px 28px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
  transition: border-color 220ms ease, background-color 220ms ease, box-shadow 220ms ease, transform 220ms ease !important;
}
html.rc-app-bg .tabbed-navigation .section .actions > .action:hover{
  border-color: rgba(255,255,255,.115) !important;
  background: radial-gradient(55% 42% at 12% 0%, rgba(255,255,255,.10), transparent 70%), rgba(29,29,32,.19) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), inset 0 -1px 0 rgba(0,0,0,.11), 0 15px 32px rgba(0,0,0,.13) !important;
  transform: translateY(-1px) !important;
}
html.rc-app-bg .tabbed-navigation .section .actions > .btn-group > .add-action{
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 15px !important;
  background:
    radial-gradient(60% 42% at 16% 0%, rgba(255,255,255,.07), transparent 72%),
    rgba(25,25,28,.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075), inset 0 -1px 0 rgba(0,0,0,.12), 0 10px 24px rgba(0,0,0,.08) !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%) !important;
  backdrop-filter: blur(16px) saturate(130%) !important;
  transition: border-color 210ms ease, background-color 210ms ease, box-shadow 210ms ease, transform 210ms ease !important;
}
html.rc-app-bg .tabbed-navigation .section .actions > .btn-group > .add-action:hover{
  border-color: rgba(255,255,255,.12) !important;
  background: radial-gradient(60% 42% at 16% 0%, rgba(255,255,255,.095), transparent 72%), rgba(30,30,33,.18) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 13px 28px rgba(0,0,0,.11) !important;
  transform: translateY(-1px) !important;
}
html.rc-app-bg .tabbed-navigation .section .actions + .buttons .ra-button,
html.rc-app-bg .tabbed-navigation .section .buttons:has(+ .actions) .ra-button,
html.rc-app-bg .tabbed-navigation .section .actions .ra-button:not(:has(.custom-switch)){
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 14px !important;
  background: rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075) !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%) !important;
  backdrop-filter: blur(16px) saturate(130%) !important;
}

html.rc-app-bg .tabbed-navigation .section > .tip{
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 16px !important;
  color: rgba(255,255,255,.84) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.065), rgba(25,25,28,.11) 58%, rgba(255,255,255,.018)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), 0 9px 25px rgba(0,0,0,.08) !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%) !important;
  backdrop-filter: blur(16px) saturate(130%) !important;
}
html.rc-app-bg .tabbed-navigation .section > .tip .icon{
  fill: rgba(255,255,255,.70) !important;
}

/* Subscription settings modal — the same thin glass as the public list. */
html.rc-app-bg .relative:has(.sync-edit-modal[internal-id="?ban-sync-edit="]) > .modal-backdrop{
  background: rgba(0,0,0,.34) !important;
  -webkit-backdrop-filter: blur(5px) saturate(108%) !important;
  backdrop-filter: blur(5px) saturate(108%) !important;
}
html.rc-app-bg .modal-border:has(.sync-edit-modal[internal-id="?ban-sync-edit="]){
  border: 0 !important;
  border-radius: 24px !important;
  padding: 1px !important;
  overflow: hidden !important;
  background: linear-gradient(150deg, rgba(255,255,255,.24), rgba(255,255,255,.065) 42%, rgba(255,255,255,.025) 78%, rgba(255,255,255,.08)) !important;
  box-shadow: 0 30px 90px rgba(0,0,0,.46), 0 5px 18px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.22) !important;
}
html.rc-app-bg .modal-border:has(.sync-edit-modal[internal-id="?ban-sync-edit="]) > .modal{
  border-radius: 23px !important;
  overflow: hidden !important;
  background:
    radial-gradient(110% 34% at 18% -6%, rgba(255,255,255,.12), transparent 50%),
    rgba(25,25,28,.24) !important;
  -webkit-backdrop-filter: blur(20px) saturate(140%) !important;
  backdrop-filter: blur(20px) saturate(140%) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), inset 1px 0 0 rgba(255,255,255,.035), inset 0 -1px 0 rgba(0,0,0,.17) !important;
}
html.rc-app-bg .sync-edit-modal[internal-id="?ban-sync-edit="]{
  border: 0 !important;
  background: transparent !important;
}
html.rc-app-bg .sync-edit-modal[internal-id="?ban-sync-edit="] > :is(.header,.footer){
  border-color: rgba(255,255,255,.07) !important;
  background: rgba(255,255,255,.018) !important;
}
html.rc-app-bg .sync-edit-modal[internal-id="?ban-sync-edit="] .content{
  background: transparent !important;
}
html.rc-app-bg .sync-edit-modal[internal-id="?ban-sync-edit="] .image-lines-container{
  border: 1px solid rgba(255,255,255,.06) !important;
  border-radius: 14px !important;
  background: rgba(255,255,255,.035) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}
html.rc-app-bg .sync-edit-modal[internal-id="?ban-sync-edit="] .ra-button{
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 11px !important;
  background: rgba(255,255,255,.055) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075) !important;
  transition: background-color 200ms ease, border-color 200ms ease, transform 200ms ease !important;
}
html.rc-app-bg .sync-edit-modal[internal-id="?ban-sync-edit="] .ra-button:hover{
  border-color: rgba(255,255,255,.13) !important;
  background: rgba(255,255,255,.095) !important;
}
html.rc-app-bg .sync-edit-modal[internal-id="?ban-sync-edit="] .ra-button.primary{
  border-color: rgba(112,202,255,.42) !important;
  background: linear-gradient(180deg,#35b5ff,#078bea) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.34), 0 7px 18px rgba(0,142,235,.22) !important;
}

/* Actions: the switch is already its own control; its button must stay invisible. */
html.rc-app-bg .tabbed-navigation .section .actions > .action .right > .ra-button:has(.custom-switch){
  width: 42px !important;
  min-width: 42px !important;
  height: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg .tabbed-navigation .section .actions > .action .right > .ra-button:has(.custom-switch):is(:hover,:focus,:active){
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  transform: none !important;
}
html.rc-app-bg .tabbed-navigation .section .actions > .action .right > .ra-button:has(.custom-switch) > .wrapper{
  width: 42px !important;
  height: 24px !important;
  padding: 0 !important;
  overflow: visible !important;
  background: transparent !important;
}

/* Action creator — ultra-realistic Liquid Glass / iOS material. */
html.rc-app-bg .relative:has(.command-create-modal[internal-id="?command-create="]) > .modal-backdrop,
html.rc-app-bg .relative:has(.command-preset-modal[internal-id="?command-preset="]) > .modal-backdrop{
  background: rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter: blur(6px) saturate(110%) !important;
  backdrop-filter: blur(6px) saturate(110%) !important;
}
html.rc-app-bg .modal-border:has(.command-create-modal[internal-id="?command-create="]),
html.rc-app-bg .modal-border:has(.command-preset-modal[internal-id="?command-preset="]){
  border: 0 !important;
  border-radius: 29px !important;
  padding: 1px !important;
  overflow: hidden !important;
  background: linear-gradient(145deg, rgba(255,255,255,.30) 0%, rgba(255,255,255,.16) 27%, rgba(255,255,255,.055) 68%, rgba(255,255,255,.10) 100%) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,.10), 0 28px 80px rgba(0,0,0,.36), inset 0 1px 1px rgba(255,255,255,.20) !important;
}
html.rc-app-bg .modal-border:has(.command-create-modal[internal-id="?command-create="]) > .modal,
html.rc-app-bg .modal-border:has(.command-preset-modal[internal-id="?command-preset="]) > .modal{
  position: relative !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  background:
    radial-gradient(62% 19% at 18% 0%, rgba(255,255,255,.13), transparent 72%),
    radial-gradient(26% 30% at 100% 12%, rgba(255,255,255,.055), transparent 78%),
    rgba(255,255,255,.08) !important;
  -webkit-backdrop-filter: blur(24px) saturate(140%) !important;
  backdrop-filter: blur(24px) saturate(140%) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.20), inset 1px 0 0 rgba(255,255,255,.06), inset -1px 0 0 rgba(255,255,255,.025), inset 0 -1px 0 rgba(0,0,0,.14) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="],
html.rc-app-bg .command-create-modal[internal-id="?command-create="] > .card,
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="]{
  border: 0 !important;
  border-radius: 28px !important;
  background: transparent !important;
  box-shadow: none !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] > .card{
  overflow: hidden !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.card-header,.card-footer),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] > :is(.header,.footer){
  border-color: rgba(255,255,255,.085) !important;
  background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.015)) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.card-header,.card-content,.card-footer),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] :is(.header,.content,.footer){
  color: #fff !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.30) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.header,.label),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .title,
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .action .title{
  color: #fff !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.subheader,.exception),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .action .message{
  color: rgba(255,255,255,.62) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .card-header .append > svg,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .card-header .append > .append > svg{
  border: 1px solid rgba(255,255,255,.15) !important;
  border-radius: 13px !important;
  fill: rgba(255,255,255,.70) !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.14), 0 4px 16px rgba(0,0,0,.08) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.input-box,.suggester-input-wrapper,.select.modal){
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 14px !important;
  color: #fff !important;
  background: rgba(255,255,255,.065) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.10), inset 0 -1px 0 rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(14px) saturate(130%) !important;
  backdrop-filter: blur(14px) saturate(130%) !important;
  transition: border-color 210ms ease, background-color 210ms ease, box-shadow 210ms ease !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.input-box,.suggester-input-wrapper,.select.modal):is(:hover,:focus-within){
  border-color: rgba(255,255,255,.25) !important;
  background: rgba(255,255,255,.095) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.15), 0 8px 22px rgba(0,0,0,.08) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.input-box input,.suggester-input-wrapper input){
  color: #fff !important;
  background: transparent !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.30) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.input-box input,.suggester-input-wrapper input)::placeholder{
  color: rgba(255,255,255,.38) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .checkbox-mark{
  border-color: rgba(255,255,255,.25) !important;
  border-radius: 6px !important;
  background: rgba(255,255,255,.07) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.10) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .checkbox-container{
  color: rgba(255,255,255,.76) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .card-footer .step{
  background: rgba(255,255,255,.20) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .card-footer .step.active{
  background: #fff !important;
  box-shadow: 0 1px 5px rgba(255,255,255,.18) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .ra-button,
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .ra-button{
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 13px !important;
  color: #fff !important;
  background: rgba(255,255,255,.08) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.12), 0 4px 16px rgba(0,0,0,.08) !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.30) !important;
  transition: border-color 210ms ease, background-color 210ms ease, box-shadow 210ms ease, transform 210ms ease !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .ra-button:not(.disabled):hover,
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .ra-button:hover{
  border-color: rgba(255,255,255,.25) !important;
  background: rgba(255,255,255,.13) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.18), 0 7px 20px rgba(0,0,0,.10) !important;
  transform: translateY(-1px) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .ra-button.primary:not(.disabled),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .ra-button.primary{
  border-color: rgba(122,207,255,.52) !important;
  background: linear-gradient(180deg, rgba(53,181,255,.96), rgba(7,139,234,.92)) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.35), 0 7px 18px rgba(0,142,235,.20) !important;
}
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .ra-button.disabled{
  color: rgba(255,255,255,.34) !important;
  background: rgba(255,255,255,.035) !important;
  border-color: rgba(255,255,255,.07) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}

/* Preset actions: airy glass cards inside a glass sheet. */
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] > .content{
  background: transparent !important;
}
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .actions{
  display: grid !important;
  gap: 10px !important;
}
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .actions > div{
  overflow: visible !important;
  border-radius: 18px !important;
}
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .action{
  position: relative !important;
  overflow: hidden !important;
  min-height: 68px !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-radius: 18px !important;
  background:
    radial-gradient(58% 48% at 13% 0%, rgba(255,255,255,.10), transparent 72%),
    rgba(255,255,255,.06) !important;
  box-shadow: 0 4px 30px rgba(0,0,0,.10), inset 0 1px 1px rgba(255,255,255,.16) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
  transition: border-color 210ms ease, background-color 210ms ease, box-shadow 210ms ease, transform 210ms ease !important;
}
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .action:hover{
  border-color: rgba(255,255,255,.25) !important;
  background: radial-gradient(58% 48% at 13% 0%, rgba(255,255,255,.14), transparent 72%), rgba(255,255,255,.09) !important;
  box-shadow: 0 7px 30px rgba(0,0,0,.12), inset 0 1px 1px rgba(255,255,255,.20) !important;
  transform: translateY(-1px) !important;
}
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .action .img-box{
  border: 1px solid rgba(255,255,255,.14) !important;
  background: rgba(255,255,255,.07) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.11) !important;
}
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .action .img-box svg{
  fill: rgba(255,255,255,.66) !important;
}
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .header .close{
  box-sizing: content-box !important;
  width: 17px !important;
  height: 17px !important;
  padding: 8px !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 999px !important;
  fill: rgba(255,255,255,.70) !important;
  background: rgba(255,255,255,.07) !important;
  box-shadow: inset 0 1px 1px rgba(255,255,255,.11) !important;
  transition: border-color 200ms ease, background-color 200ms ease, fill 200ms ease, transform 200ms ease !important;
}
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .header .close:hover{
  border-color: rgba(255,255,255,.24) !important;
  fill: #fff !important;
  background: rgba(255,255,255,.12) !important;
  transform: scale(1.04) !important;
}

@media (max-width: 560px){
  html.rc-app-bg .modal-border:has(.command-create-modal[internal-id="?command-create="]),
  html.rc-app-bg .modal-border:has(.command-preset-modal[internal-id="?command-preset="]){
    max-width: calc(100vw - 16px) !important;
    max-height: calc(100dvh - 16px) !important;
    border-radius: 25px !important;
  }
  html.rc-app-bg .modal-border:has(.command-create-modal[internal-id="?command-create="]) > .modal,
  html.rc-app-bg .modal-border:has(.command-preset-modal[internal-id="?command-preset="]) > .modal,
  html.rc-app-bg .command-create-modal[internal-id="?command-create="],
  html.rc-app-bg .command-create-modal[internal-id="?command-create="] > .card,
  html.rc-app-bg .command-preset-modal[internal-id="?command-preset="]{
    border-radius: 24px !important;
  }
}

/* Cascade-final nesting lock for command controls. */
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .suggester-input-wrapper > .input-box,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .suggester-input-wrapper > .input-box:hover,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .suggester-input-wrapper > .input-box:focus-within,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .select-wrapper > .select.modal > .activator,
html.rc-app-bg .command-create-modal[internal-id="?command-create="] .input-container > .input-box > input{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .tip > .gradient{
  display: none !important;
}

/* Cascade-final brightness correction: requested settings tabs use the same
   restrained graphite glass as the Actions cards. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container > .settings,
html.rc-app-bg .tabbed-navigation .settings-container > .settings:has(.switch-wrapper),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section div:has(> .suggester-input-wrapper.dark.suggester){
  border-color: rgba(255,255,255,.075) !important;
  border-radius: 20px !important;
  background: radial-gradient(60% 24% at 14% 0%, rgba(255,255,255,.075), transparent 72%), rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), inset 1px 0 0 rgba(255,255,255,.022), inset 0 -1px 0 rgba(0,0,0,.13), 0 12px 28px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.items,.subscriptions) > :is(.item,.subscription),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > :is(.normal-action,.destructive-action),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .items-row,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.tip,.page-tip,.ra-card){
  border-color: rgba(255,255,255,.075) !important;
  border-radius: 16px !important;
  background: radial-gradient(55% 42% at 12% 0%, rgba(255,255,255,.075), transparent 70%), rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), inset 0 -1px 0 rgba(0,0,0,.13), 0 12px 28px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section :is(.input-container > .input-box,.suggester-input-wrapper,.select-wrapper > .select,.select.modal,.number-input){
  border-color: rgba(255,255,255,.07) !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), inset 0 -1px 0 rgba(0,0,0,.12) !important;
  -webkit-backdrop-filter: blur(14px) saturate(130%) !important;
  backdrop-filter: blur(14px) saturate(130%) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .ra-button:not(.primary):not(:has(.custom-switch)){
  border-color: rgba(255,255,255,.075) !important;
  background: rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), 0 8px 22px rgba(0,0,0,.09) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 :is(.tip,.page-tip,.ra-card){
  border: 1px solid rgba(255,255,255,.075) !important;
  border-radius: 16px !important;
  background: radial-gradient(55% 42% at 12% 0%, rgba(255,255,255,.075), transparent 70%), rgba(25,25,28,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), inset 0 -1px 0 rgba(0,0,0,.13), 0 12px 28px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(135%) !important;
  backdrop-filter: blur(18px) saturate(135%) !important;
}

/* Final flat deep-glass system for every settings tab.
   No white inset lighting and no radial/linear highlight gradients. */
html.rc-app-bg .tabbed-navigation .content.pt-8 :is(
  .settings,
  .settings-container,
  .actions > .action,
  .items-row,
  .items > .item,
  .subscriptions > .subscription,
  .normal-action,
  .destructive-action,
  .tip,
  .page-tip,
  .ra-card
){
  border: 1px solid rgba(255,255,255,.05) !important;
  background: rgba(15,15,15,.45) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
  backdrop-filter: blur(20px) saturate(130%) !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 :is(
  .settings,
  .settings-container,
  .actions > .action,
  .items-row,
  .items > .item,
  .subscriptions > .subscription,
  .normal-action,
  .destructive-action,
  .tip,
  .page-tip,
  .ra-card
):hover{
  border-color: rgba(255,255,255,.07) !important;
  background: rgba(18,18,18,.50) !important;
  box-shadow: 0 14px 30px rgba(0,0,0,.18) !important;
}

/* Rows stay clear inside the shared glass sheet, with only quiet separators. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings > :is(.switch-wrapper,.switch-text,.normal-action,.destructive-action,div),
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings-container > .settings > :is(.switch-wrapper,div){
  border-color: rgba(255,255,255,.045) !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Real preset DOM depth: remove its legacy divided-card gradient completely. */
html.rc-app-bg body:has(.content.pt-8) .modal .command-preset-modal[internal-id="?command-preset="],
html.rc-app-bg body:has(.content.pt-8) .modal .command-preset-modal[internal-id="?command-preset="] > :is(.header,.content,.footer){
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .command-preset-modal[internal-id="?command-preset="] .actions > div{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .command-preset-modal[internal-id="?command-preset="] .actions .action,
html.rc-app-bg body:has(.content.pt-8) .modal .command-preset-modal[internal-id="?command-preset="] .actions .action:hover{
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 16px !important;
  outline: 0 !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: 0 8px 32px 0 rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
  transform: none !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .command-preset-modal[internal-id="?command-preset="] .action .ra-button{
  border: 1px solid rgba(94,200,255,.26) !important;
  background: #129fe8 !important;
  box-shadow: none !important;
}

/* Chat mode buttons use the same quiet color treatment as the page icon. */
html.rc-app-bg .player-message-page-header-container > .flex.flex-shrink-0 > .ra-button{
  border: 1px solid rgba(255,255,255,.10) !important;
  color: rgba(255,255,255,.88) !important;
  background: rgba(255,255,255,.06) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
}

html.rc-app-bg .player-message-page-header-container > .flex.flex-shrink-0 > .ra-button:hover{
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.085) !important;
  box-shadow: none !important;
}

html.rc-app-bg .player-message-page-header-container > .flex.flex-shrink-0 > .ra-button svg{
  fill: rgba(255,255,255,.88) !important;
  color: rgba(255,255,255,.88) !important;
}

/* All three chat scope controls have different DOM wrappers. */
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger){
  border: 1px solid rgba(255,255,255,.10) !important;
  color: rgba(255,255,255,.88) !important;
  background: rgba(255,255,255,.06) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
}
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger):hover{
  border-color: rgba(255,255,255,.12) !important;
  background: rgba(255,255,255,.085) !important;
  box-shadow: none !important;
}
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger) svg{
  fill: rgba(255,255,255,.88) !important;
  color: rgba(255,255,255,.88) !important;
}

html.rc-app-bg body:has(.sidebar-content) .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger),
html.rc-app-bg body:has(.sidebar-content) .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger):hover,
html.rc-app-bg body:has(.sidebar-content) .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger):focus,
html.rc-app-bg body:has(.sidebar-content) .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger):focus-visible,
html.rc-app-bg body:has(.sidebar-content) .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger):active{
  border: 1px solid rgb(255,255,255) !important;
  outline: 0 !important;
  color: rgb(242,242,242) !important;
  background: rgba(255,255,255,.06) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
}
html.rc-app-bg body:has(.sidebar-content) .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger) svg{
  fill: rgb(242,242,242) !important;
  color: rgb(242,242,242) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings > :is(.switch-wrapper,.normal-action,.destructive-action):hover,
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings-container > .settings > .switch-wrapper:hover{
  background: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
}

/* Flat dark controls: no nested grey boxes or reflected white rims. */
html.rc-app-bg .tabbed-navigation .content.pt-8 :is(
  .input-box,
  .suggester-input-wrapper,
  .select-wrapper > .select,
  .select.modal,
  .number-input,
  .select.settings .activator,
  .select.settings .options-list,
  .ra-button:not(.primary):not(:has(.custom-switch))
){
  border-color: rgba(255,255,255,.05) !important;
  background: rgba(15,15,15,.45) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
  backdrop-filter: blur(20px) saturate(130%) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 :is(
  .input-box,
  .suggester-input-wrapper,
  .select-wrapper > .select,
  .select.modal,
  .number-input,
  .select.settings .activator,
  .ra-button:not(.primary):not(:has(.custom-switch))
):is(:hover,:focus-within){
  border-color: rgba(255,255,255,.075) !important;
  background: rgba(20,20,20,.52) !important;
  box-shadow: none !important;
}

/* Toggles match Actions: neutral dark rail and a clean green active state. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .custom-switch .slider{
  border: 1px solid rgba(255,255,255,.05) !important;
  background: rgba(8,8,8,.66) !important;
  box-shadow: none !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .custom-switch .slider::before,
html.rc-app-bg .tabbed-navigation .content.pt-8 .custom-switch .slider::after{
  box-shadow: 0 1px 3px rgba(0,0,0,.40) !important;
}
html.rc-app-bg .tabbed-navigation .content.pt-8 .custom-switch :is(input,.peer):checked + .slider{
  border-color: rgba(34,197,94,.34) !important;
  background: #22c55e !important;
  box-shadow: none !important;
}

/* Specificity lock for the final flat switch treatment. */
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .slider,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings .custom-switch .slider{
  border: 1px solid rgba(255,255,255,.05) !important;
  background: rgba(8,8,8,.66) !important;
  box-shadow: none !important;
}
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .slider::after,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings .custom-switch .slider::after{
  background: #8a8a8a !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.40) !important;
}
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .peer:checked + .slider,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings .custom-switch .peer:checked + .slider{
  border-color: rgba(34,197,94,.34) !important;
  background: #22c55e !important;
  box-shadow: none !important;
}
html.rc-app-bg body:has(.tabbed-navigation .content.pt-8) .custom-switch .peer:checked + .slider::after,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings .custom-switch .peer:checked + .slider::after{
  background: #f4f4f4 !important;
  box-shadow: 0 1px 3px rgba(0,0,0,.40) !important;
}

/* High-specificity final lock against legacy bright settings sheets. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container > .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container{
  border: 1px solid rgba(255,255,255,.05) !important;
  background: rgba(15,15,15,.45) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(20px) saturate(130%) !important;
  backdrop-filter: blur(20px) saturate(130%) !important;
}

/* Seamless liquid-glass panels: one uniform micro-edge, no bottom stroke. */
html.rc-app-bg .tabbed-navigation .content.pt-8 :is(
  .settings,
  .settings-container,
  .actions > .action,
  .items-row,
  .items > .item,
  .subscriptions > .subscription,
  .normal-action,
  .destructive-action,
  .tip,
  .page-tip,
  .ra-card
),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container,
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container > .settings{
  border: 1px solid rgba(255,255,255,.04) !important;
  border-bottom-color: rgba(255,255,255,.04) !important;
  outline: 0 !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: 0 8px 32px 0 rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

/* Keep structural wrappers invisible even while the pointer is over them. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container:has(> .settings),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container:has(> .settings):hover{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Structural wrappers must not create a second outline/shadow around a card. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container:has(> .settings){
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 :is(
  .settings,
  .settings-container,
  .actions > .action,
  .items-row,
  .items > .item,
  .subscriptions > .subscription,
  .normal-action,
  .destructive-action,
  .tip,
  .page-tip,
  .ra-card
):hover{
  border-color: rgba(255,255,255,.04) !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: 0 8px 32px 0 rgba(0,0,0,.15) !important;
}

/* No dark divider or underline beneath inner rows. Spacing provides grouping. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings > :is(.switch-wrapper,.switch-text,.normal-action,.destructive-action,div),
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings-container > .settings > :is(.switch-wrapper,div),
html.rc-app-bg .tabbed-navigation .content.pt-8 .actions > .action > *{
  border-top: 0 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
}

/* Form surfaces follow the same continuous material without a bottom edge. */
html.rc-app-bg .tabbed-navigation .content.pt-8 :is(
  .input-box,
  .suggester-input-wrapper,
  .select-wrapper > .select,
  .select.modal,
  .number-input,
  .select.settings .activator,
  .select.settings .options-list,
  .ra-button:not(.primary):not(:has(.custom-switch))
){
  border: 1px solid rgba(255,255,255,.04) !important;
  border-bottom-color: rgba(255,255,255,.04) !important;
  outline: 0 !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

/* Absolute final wrapper reset: prevent a nested second bottom edge. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container:has(> .settings),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section .settings-container:has(> .settings):hover,
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings-container:has(> .settings),
html.rc-app-bg .tabbed-navigation .content.pt-8 .settings-container:has(> .settings):hover{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Ban reasons: the same single-layer seamless glass used by settings panels. */
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .flex.flex-col.gap-5:has(.suggester-input-wrapper.dark.suggester),
html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .flex.flex-col.gap-5:has(.suggester-input-wrapper.dark.suggester):hover{
  overflow: hidden !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 20px !important;
  outline: 0 !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: 0 8px 32px 0 rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .flex.flex-col.gap-5:has(.suggester-input-wrapper.dark.suggester) > div{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .tabbed-navigation .content.pt-8 .section > .flex.flex-col.gap-5:has(.suggester-input-wrapper.dark.suggester) .suggester-input-wrapper.dark.suggester{
  border: 1px solid rgba(255,255,255,.04) !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

/* Public ban-lists modal: seamless single-layer glass, matching settings. */
html.rc-app-bg .modal-border:has(.modal[internal-id="?ban-sync-available="]){
  border: 0 !important;
  padding: 0 !important;
  border-radius: 20px !important;
  background: transparent !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.38) !important;
}

html.rc-app-bg .modal-border:has(.modal[internal-id="?ban-sync-available="]) > .modal,
html.rc-app-bg .modal[internal-id="?ban-sync-available="],
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card{
  border: 1px solid rgba(255,255,255,.085) !important;
  border-top-color: rgba(255,255,255,.15) !important;
  border-radius: 20px !important;
  outline: 0 !important;
  background: linear-gradient(150deg, rgba(255,255,255,.055), rgba(255,255,255,.018) 42%, rgba(8,10,12,.30)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
  -webkit-backdrop-filter: blur(34px) saturate(120%) !important;
  backdrop-filter: blur(34px) saturate(120%) !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="]::before,
html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > .project::after{
  display: none !important;
  content: none !important;
}

/* Only the modal shell owns the glass edge; internal layout wrappers stay clear. */
html.rc-app-bg .modal-border:has(.modal[internal-id="?ban-sync-available="]) > .modal,
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .header,
html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .content{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .header{
  padding: 18px 20px 14px !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="] > .divided-card > .content{
  padding: 0 16px 16px !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects{
  gap: 10px !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > :is(.tip,.project){
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.105) !important;
  border-radius: 14px !important;
  outline: 0 !important;
  background: linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,255,255,.009)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  -webkit-backdrop-filter: blur(20px) saturate(112%) !important;
  backdrop-filter: blur(20px) saturate(112%) !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="] .projects > :is(.tip,.project):hover{
  border-color: rgba(255,255,255,.10) !important;
  border-top-color: rgba(255,255,255,.16) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.052), rgba(255,255,255,.014)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
  transform: none !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="] .project .divider-wrapper .line{
  border: 0 !important;
  background: rgba(255,255,255,.035) !important;
  box-shadow: none !important;
}

html.rc-app-bg .modal[internal-id="?ban-sync-available="] :is(.project .ra-button:not(.primary),.header .close){
  border: 1px solid rgba(255,255,255,.09) !important;
  border-top-color: rgba(255,255,255,.16) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.012)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter: blur(18px) saturate(115%) !important;
  backdrop-filter: blur(18px) saturate(115%) !important;
}

/* Specificity lock for project cards and actions inside the public list. */
html.rc-app-bg body .modal[internal-id="?ban-sync-available="] .projects > .project,
html.rc-app-bg body .modal[internal-id="?ban-sync-available="] .projects > .project:hover,
html.rc-app-bg body:has(.content.pt-8) .modal[internal-id="?ban-sync-available="] .projects > .project,
html.rc-app-bg body:has(.content.pt-8) .modal[internal-id="?ban-sync-available="] .projects > .project:hover{
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.105) !important;
  border-radius: 14px !important;
  outline: 0 !important;
  background: linear-gradient(135deg, rgba(255,255,255,.035), rgba(255,255,255,.009)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  -webkit-backdrop-filter: blur(20px) saturate(112%) !important;
  backdrop-filter: blur(20px) saturate(112%) !important;
  transform: translateY(0) !important;
}

html.rc-app-bg body .modal[internal-id="?ban-sync-available="] .project .ra-button.primary,
html.rc-app-bg body .modal[internal-id="?ban-sync-available="] .project .ra-button.primary:hover{
  color: rgba(255,255,255,.94) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  border-top-color: rgba(255,255,255,.27) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.035)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10), 0 8px 20px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(18px) saturate(120%) !important;
  backdrop-filter: blur(18px) saturate(120%) !important;
  transform: none !important;
}

html.rc-app-bg body .modal[internal-id="?ban-sync-available="] .projects > .project:hover{
  border-color: rgba(255,255,255,.10) !important;
  border-top-color: rgba(255,255,255,.16) !important;
  background: linear-gradient(135deg, rgba(255,255,255,.052), rgba(255,255,255,.014)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
}

/* Action create/preset modals: transparent seamless liquid glass, no glow. */
html.rc-app-bg .modal-border:has(.command-create-modal[internal-id="?command-create="]),
html.rc-app-bg .modal-border:has(.command-preset-modal[internal-id="?command-preset="]){
  border: 0 !important;
  padding: 0 !important;
  border-radius: 22px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg .modal-border:has(.command-create-modal[internal-id="?command-create="]) > .modal,
html.rc-app-bg .modal-border:has(.command-preset-modal[internal-id="?command-preset="]) > .modal{
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 22px !important;
  outline: 0 !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: 0 8px 32px 0 rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .command-create-modal[internal-id="?command-create="],
html.rc-app-bg .command-create-modal[internal-id="?command-create="] > .card,
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="]{
  border: 0 !important;
  border-radius: 22px !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.card-header,.card-content,.card-footer),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] :is(.header,.content,.footer){
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.input-box,.suggester-input-wrapper,.select.modal),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .actions > .action{
  border: 1px solid rgba(255,255,255,.04) !important;
  outline: 0 !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.input-box,.suggester-input-wrapper,.select.modal):is(:hover,:focus-within),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .actions > .action:hover{
  border-color: rgba(255,255,255,.06) !important;
  background: rgba(20,20,20,.40) !important;
  box-shadow: none !important;
  transform: none !important;
}

html.rc-app-bg .command-create-modal[internal-id="?command-create="] :is(.ra-button,.card-header .append > svg),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] :is(.ra-button,.header .close,.action .img-box){
  border: 1px solid rgba(255,255,255,.04) !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: none !important;
}

html.rc-app-bg .command-create-modal[internal-id="?command-create="] .checkbox-mark{
  border: 1px solid rgba(255,255,255,.08) !important;
  background: rgba(20,20,20,.35) !important;
  box-shadow: none !important;
}

html.rc-app-bg .command-create-modal[internal-id="?command-create="] .ra-button.primary:not(.disabled),
html.rc-app-bg .command-preset-modal[internal-id="?command-preset="] .ra-button.primary{
  border: 1px solid rgba(94,200,255,.26) !important;
  background: #129fe8 !important;
  box-shadow: none !important;
}

/* Cascade-final chat scope color lock. */
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger),
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger):hover,
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger):focus,
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger):focus-visible,
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger):active{
  border: 1px solid rgba(255,255,255,.10) !important;
  outline: 0 !important;
  color: rgb(242,242,242) !important;
  background: rgba(255,255,255,.06) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
}
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container .ra-button:not(.rc-filter-trigger) svg{
  fill: rgb(242,242,242) !important;
  color: rgb(242,242,242) !important;
}

/* Project settings: preserve the outer card, remove only the nested card and row stripes. */
html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings-container,
html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings > :is(.logo-uploader,.settings-item){
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings-item .input-box,
html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings-item .input-box:hover,
html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings-item .input-box:focus,
html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings-item .input-box:focus-within{
  border: 1px solid rgba(255,255,255,.07) !important;
  border-top-color: rgba(255,255,255,.15) !important;
  border-left-color: rgba(255,255,255,.10) !important;
  border-right-color: rgba(255,255,255,.06) !important;
  border-bottom-color: rgba(255,255,255,.035) !important;
  outline: 0 !important;
  background: rgba(255,255,255,.018) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
  transition: border-color .2s ease, background-color .2s ease !important;
}

html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings-item .input-box:hover,
html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings-item .input-box:focus-within{
  border-top-color: rgba(255,255,255,.20) !important;
  border-left-color: rgba(255,255,255,.13) !important;
  border-right-color: rgba(255,255,255,.08) !important;
  border-bottom-color: rgba(255,255,255,.05) !important;
  background: rgba(255,255,255,.028) !important;
}

html.rc-app-bg.rc-project-settings-page .titled-layout .section .settings-item .input-box > input{
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Staff context menu: a single glass panel without grey boxes around each action. */
html.rc-app-bg:has(.staff-page) .p-contextmenu .p-menuitem .ra-button,
html.rc-app-bg:has(.staff-page) .p-contextmenu .p-menuitem .ra-button:hover,
html.rc-app-bg:has(.staff-page) .p-contextmenu .p-menuitem .ra-button:focus,
html.rc-app-bg:has(.staff-page) .p-contextmenu .p-menuitem .ra-button:focus-visible,
html.rc-app-bg:has(.staff-page) .p-contextmenu .p-menuitem .ra-button:active{
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg:has(.staff-page) .p-contextmenu .p-menuitem:not(.p-disabled) .ra-button:hover{
  background: rgba(255,255,255,.045) !important;
}

/* Add/edit staff modal: one light, dark liquid-glass surface. */
html.rc-app-bg .modal:has(> .permissions-modal[internal-id="?client-permissions="]){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .permissions-modal[internal-id="?client-permissions="]{
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 22px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
  overflow: hidden !important;
}

html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] :is(.card,.card-header,.buttons){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .input-box,
html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .input-box:hover,
html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .input-box:focus,
html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .input-box:focus-within{
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .input-box::before,
html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .input-box::after,
html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .input-box input{
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-appearance: none !important;
  appearance: none !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .permissions-modal[internal-id="?client-permissions="] .input-box > input.bg-grey-1000{
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .permissions-modal[internal-id="?client-permissions="] .input-container > .input-box{
  background: rgba(255,255,255,.018) !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-top-color: rgba(255,255,255,.16) !important;
  border-left-color: rgba(255,255,255,.10) !important;
  border-right-color: rgba(255,255,255,.055) !important;
  border-bottom-color: rgba(255,255,255,.035) !important;
  border-radius: 10px !important;
  outline: 0 !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
  transition: border-color .2s ease, background-color .2s ease !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .permissions-modal[internal-id="?client-permissions="] .input-container > .input-box:is(:hover,:focus-within){
  background: rgba(255,255,255,.018) !important;
  border-top-color: rgba(255,255,255,.15) !important;
  border-left-color: rgba(255,255,255,.10) !important;
  border-right-color: rgba(255,255,255,.06) !important;
  border-bottom-color: rgba(255,255,255,.035) !important;
}

/* Billing cards: remove the redundant inner panels behind payment details. */
html.rc-app-bg.rc-billing-page .payments-tab-general .card .info{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-general > .divider-wrapper{
  display: none !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card{
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
  transition: background-color .22s ease, border-color .22s ease !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card:hover{
  background: rgba(20,20,20,.40) !important;
  border-color: rgba(255,255,255,.055) !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-general .card .ra-button.preset.white,
html.rc-app-bg.rc-billing-page .payments-tab-general .card .ra-button.preset.white:hover,
html.rc-app-bg.rc-billing-page .payments-tab-general .card .ra-button.preset.white:focus{
  background: #eee !important;
  color: #111 !important;
  border: 1px solid #fff !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

/* Tariff picker: layered dark Liquid Glass. */
html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .checkapp-plan-overlay{
  background: rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter: blur(8px) saturate(115%) !important;
  backdrop-filter: blur(8px) saturate(115%) !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-rustapp{
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 22px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-rustapp-grid{
  gap: 12px !important;
  padding: 0 18px 18px !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-rustapp-plan{
  background: rgba(255,255,255,.022) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 16px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(18px) saturate(130%) !important;
  backdrop-filter: blur(18px) saturate(130%) !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-rustapp-plan:last-child{
  border: 1px solid rgba(255,255,255,.04) !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-rustapp-close{
  width: 32px !important;
  height: 32px !important;
  padding: 0 !important;
  display: grid !important;
  place-items: center !important;
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 50% !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-plan-btn{
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(14px) saturate(125%) !important;
  backdrop-filter: blur(14px) saturate(125%) !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-plan-btn.pick{
  background: rgba(34,197,94,.16) !important;
  border-color: rgba(80,220,125,.16) !important;
  color: #83f5a6 !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-plan-btn.current{
  background: rgba(255,255,255,.065) !important;
  color: rgba(255,255,255,.78) !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-plan-divider{
  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.045) !important;
}

html.rc-app-bg body.checkapp-plan-open #checkapp-plan-modal .cpm-rustapp-foot{
  background: rgba(255,255,255,.018) !important;
  border-top: 1px solid rgba(255,255,255,.04) !important;
}

/* Billing notices: match the tariff picker's Liquid Glass. */
html.rc-app-bg body #checkapp-notice-root .ck-notice-overlay{
  background: rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter: blur(8px) saturate(115%) !important;
  backdrop-filter: blur(8px) saturate(115%) !important;
}

html.rc-app-bg body #checkapp-notice-root .ck-notice-box{
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 22px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg body #checkapp-notice-root .ck-notice-icon{
  width: auto !important;
  height: auto !important;
  margin: 0 auto 14px !important;
  display: block !important;
  font-size: 32px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body #checkapp-notice-root .ck-notice-btn{
  background: rgba(255,255,255,.055) !important;
  color: rgba(255,255,255,.88) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(14px) saturate(125%) !important;
  backdrop-filter: blur(14px) saturate(125%) !important;
}

html.rc-app-bg body #checkapp-notice-root .ck-notice-btn:hover{
  background: rgba(255,255,255,.085) !important;
}

/* Balance top-up modal: clean layered Liquid Glass. */
html.rc-app-bg .modal:has(> .payments-modal[internal-id="?payments=show"]){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .divided-card{
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 22px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] :is(.header,.footer){
  background: rgba(255,255,255,.012) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .methods{
  background: rgba(255,255,255,.015) !important;
  border: 1px solid rgba(255,255,255,.035) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .method{
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(255,255,255,.035) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(14px) saturate(125%) !important;
  backdrop-filter: blur(14px) saturate(125%) !important;
  transition: background-color .2s ease, border-color .2s ease !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .method:hover{
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.055) !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .method.selected{
  background: rgba(30,145,220,.13) !important;
  border-color: rgba(80,185,245,.24) !important;
  box-shadow: none !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .input-box,
html.rc-app-bg .payments-modal[internal-id="?payments=show"] .input-box:is(:hover,:focus-within){
  background: rgba(255,255,255,.02) !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.11) !important;
  border-radius: 10px !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(128%) !important;
  backdrop-filter: blur(16px) saturate(128%) !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .input-box :is(input,textarea){
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .ra-button:not(.primary){
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

html.rc-app-bg .payments-modal[internal-id="?payments=show"] .ra-button.primary{
  background: #129fe8 !important;
  border: 1px solid rgba(100,205,255,.22) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] > .divided-card{
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 22px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .footer .ra-button:not(.primary){
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .footer .ra-button.primary{
  background: #129fe8 !important;
  border: 1px solid rgba(100,205,255,.22) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

/* Balance top-up modal: spacious premium composition. */
html.rc-app-bg body:has(.content.pt-8) .modal:has(> .payments-modal[internal-id="?payments=show"]){
  width: min(94vw, 470px) !important;
  max-width: 470px !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"]{
  width: 100% !important;
  min-width: 100% !important;
  max-width: 100% !important;
  flex: 1 1 100% !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] > .divided-card{
  overflow: hidden !important;
  border-radius: 24px !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .header{
  min-height: 0 !important;
  padding: 22px 24px 17px !important;
  background: rgba(255,255,255,.016) !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .header p{
  margin: 0 !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
  font-weight: 650 !important;
  letter-spacing: -.015em !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .content.padding{
  padding: 18px 20px 22px !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .payments-content{
  display: flex !important;
  flex-direction: column !important;
  gap: 17px !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .methods{
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
  padding: 8px !important;
  border-radius: 16px !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .method{
  min-width: 0 !important;
  min-height: 66px !important;
  padding: 11px 12px !important;
  border-radius: 12px !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .method.selected{
  background: rgba(24,132,198,.16) !important;
  border-color: rgba(108,205,255,.23) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .input-container{
  margin: 0 !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .input-container > label{
  display: block !important;
  margin: 0 0 7px !important;
  color: rgba(255,255,255,.72) !important;
  font-size: 13px !important;
  line-height: 1.2 !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .input-box{
  width: 100% !important;
  height: 44px !important;
  min-height: 44px !important;
  border-radius: 12px !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .footer{
  padding: 16px 20px 20px !important;
  gap: 9px !important;
  background: rgba(255,255,255,.018) !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .footer .ra-button{
  min-height: 40px !important;
  padding: 9px 16px !important;
  border-radius: 12px !important;
}

@media (max-width: 520px){
  html.rc-app-bg body:has(.content.pt-8) .modal:has(> .payments-modal[internal-id="?payments=show"]){
    width: calc(100vw - 24px) !important;
  }

  html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .header{
    padding: 19px 18px 15px !important;
  }

  html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .content.padding{
    padding: 15px 14px 18px !important;
  }

  html.rc-app-bg body:has(.content.pt-8) .modal .payments-modal[internal-id="?payments=show"] .method{
    min-height: 62px !important;
    padding: 9px !important;
  }
}

/* Billing transaction history: floating Liquid Glass ledger. */
html.rc-app-bg.rc-billing-page .payments-tab-history .payments-table{
  padding: 1px !important;
  background: rgba(20,20,20,.24) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-radius: 22px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.14) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
  overflow: hidden !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .table-base{
  padding: 0 0 8px !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 21px !important;
  box-shadow: none !important;
  scrollbar-color: rgba(255,255,255,.14) transparent !important;
  scrollbar-width: thin !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .table-base > .header{
  position: sticky !important;
  top: 0 !important;
  z-index: 4 !important;
  min-height: 52px !important;
  width: 100% !important;
  margin: 0 0 8px !important;
  padding: 0 8px !important;
  box-sizing: border-box !important;
  background: rgba(24,24,24,.62) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.035) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(24px) saturate(135%) !important;
  backdrop-filter: blur(24px) saturate(135%) !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .table-base > .header p{
  color: rgba(255,255,255,.48) !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  letter-spacing: .02em !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .content-layer{
  display: flex !important;
  flex-direction: column !important;
  gap: 6px !important;
  padding: 0 8px !important;
  box-sizing: border-box !important;
  background: transparent !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .content-layer > .row{
  min-height: 66px !important;
  background: rgba(255,255,255,.018) !important;
  border: 1px solid rgba(255,255,255,.032) !important;
  border-radius: 14px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(15px) saturate(125%) !important;
  backdrop-filter: blur(15px) saturate(125%) !important;
  transition: background-color .18s ease, border-color .18s ease, transform .18s ease !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .content-layer > .row::before,
html.rc-app-bg.rc-billing-page .payments-tab-history .content-layer > .row::after{
  display: none !important;
  content: none !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .content-layer > .row:hover{
  background: rgba(255,255,255,.036) !important;
  border-color: rgba(255,255,255,.055) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .row > .element{
  padding-top: 13px !important;
  padding-bottom: 13px !important;
  border: 0 !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .row .text-grey-50{
  color: rgba(255,255,255,.9) !important;
  font-weight: 600 !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .row .text-grey-400{
  color: rgba(255,255,255,.48) !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .row .sum{
  color: rgba(255,255,255,.82) !important;
  font-weight: 650 !important;
  letter-spacing: -.01em !important;
}

html.rc-app-bg.rc-billing-page .payments-tab-history .row .sum.income{
  color: #83e75c !important;
  text-shadow: 0 0 16px rgba(96,220,65,.13) !important;
}

/* Sidebar: retain button shells, remove only grey divider strokes. */
html.rc-app-bg .navigation,
html.rc-app-bg .navigation .header,
html.rc-app-bg .navigation .footer{
  border-color: transparent !important;
  box-shadow: none !important;
}

/* The project button keeps its glass shell; only the grey header tile is removed. */
html.rc-app-bg .navigation .header{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .navigation .footer{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .navigation .divider-wrapper,
html.rc-app-bg .navigation .divider-wrapper .line,
html.rc-app-bg .navigation .divider-footer,
html.rc-app-bg .navigation .divider-footer .line{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Webhook settings: deep, seamless Liquid Glass modal. */
html.rc-app-bg .modal:has(> .webhook-edit-modal[internal-id="?webhook="]){
  width: min(94vw, 500px) !important;
  max-width: 500px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="]{
  width: 100% !important;
  max-width: 100% !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .webhook-edit-modal[internal-id="?webhook="] > .divided-card,
html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] > .divided-card{
  overflow: hidden !important;
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 24px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .header{
  min-height: 0 !important;
  padding: 22px 24px 17px !important;
  background: rgba(255,255,255,.016) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .header p{
  margin: 0 !important;
  color: rgba(255,255,255,.94) !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
  font-weight: 650 !important;
  letter-spacing: -.015em !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .content.padding{
  padding: 20px 22px 22px !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .content > .text-grey-400{
  color: rgba(255,255,255,.62) !important;
  font-size: 13px !important;
  line-height: 1.42 !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .input-box,
html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .input-box:is(:hover,:focus-within){
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.105) !important;
  border-radius: 12px !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(128%) !important;
  backdrop-filter: blur(16px) saturate(128%) !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .input-box input{
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .tip.warning{
  margin-top: 12px !important;
  padding: 12px 13px !important;
  background: rgba(245,172,45,.075) !important;
  border: 1px solid rgba(245,185,70,.11) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(15px) saturate(125%) !important;
  backdrop-filter: blur(15px) saturate(125%) !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .tip.warning .gradient{
  display: none !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .tip.warning span{
  color: rgba(255,255,255,.72) !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .tip.warning .icon{
  color: #ffc24b !important;
  fill: #ffc24b !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .docs{
  min-height: 46px !important;
  margin-top: 12px !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  background: rgba(255,255,255,.022) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.62) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(15px) saturate(125%) !important;
  backdrop-filter: blur(15px) saturate(125%) !important;
  transition: background-color .18s ease, border-color .18s ease !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .docs:hover{
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.07) !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .footer{
  padding: 16px 20px 20px !important;
  gap: 9px !important;
  background: rgba(255,255,255,.016) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .footer .ra-button{
  min-height: 40px !important;
  padding: 9px 16px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .footer .ra-button:not(.primary){
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .footer .ra-button.primary{
  background: #129fe8 !important;
  border: 1px solid rgba(100,205,255,.22) !important;
}

html.rc-app-bg .webhook-edit-modal[internal-id="?webhook="] .footer .ra-button.disabled{
  background: rgba(255,255,255,.055) !important;
  border-color: rgba(255,255,255,.035) !important;
  color: rgba(255,255,255,.28) !important;
}

/* Discord integration wizard: premium Liquid Glass. */
html.rc-app-bg .modal:has(> .autokick-modal[internal-id="?discord-webhook="]){
  width: min(94vw, 500px) !important;
  max-width: 500px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="]{
  width: 100% !important;
  max-width: 100% !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .autokick-modal[internal-id="?discord-webhook="] > .card,
html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] > .card{
  overflow: hidden !important;
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 24px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-header{
  min-height: 0 !important;
  padding: 21px 22px 18px !important;
  background: rgba(255,255,255,.016) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-header .header{
  color: rgba(255,255,255,.94) !important;
  font-size: 17px !important;
  line-height: 1.25 !important;
  font-weight: 650 !important;
  letter-spacing: -.015em !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-header .subheader{
  margin-top: 3px !important;
  color: rgba(255,255,255,.42) !important;
  font-size: 11px !important;
  font-weight: 600 !important;
  letter-spacing: .025em !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-header .append svg{
  width: 38px !important;
  height: 38px !important;
  padding: 9px !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-radius: 12px !important;
  fill: rgba(255,255,255,.64) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(14px) saturate(125%) !important;
  backdrop-filter: blur(14px) saturate(125%) !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-content.add-padding{
  padding: 20px 22px 22px !important;
  background: transparent !important;
  border: 0 !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-content > .content{
  display: flex !important;
  flex-direction: column !important;
  gap: 17px !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] :is(.select-label,.input-label label){
  display: block !important;
  margin: 0 0 7px !important;
  color: rgba(255,255,255,.64) !important;
  font-size: 13px !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .select.modal,
html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .select.modal .activator,
html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .input-box,
html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .input-box:is(:hover,:focus-within){
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.105) !important;
  border-radius: 12px !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(128%) !important;
  backdrop-filter: blur(16px) saturate(128%) !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .select.modal{
  border: 0 !important;
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .input-box input{
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-footer{
  padding: 16px 20px 20px !important;
  background: rgba(255,255,255,.016) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-footer .steps{
  gap: 6px !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-footer .step{
  width: 7px !important;
  height: 7px !important;
  background: rgba(255,255,255,.23) !important;
  border: 0 !important;
  border-radius: 50% !important;
  box-shadow: none !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-footer .step.active{
  width: 20px !important;
  background: rgba(255,255,255,.9) !important;
  border-radius: 999px !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-footer .buttons{
  gap: 9px !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-footer .ra-button{
  min-height: 40px !important;
  padding: 9px 16px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-footer .ra-button.default{
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
}

html.rc-app-bg .autokick-modal[internal-id="?discord-webhook="] .card-footer .ra-button.primary{
  background: #129fe8 !important;
  border: 1px solid rgba(100,205,255,.22) !important;
}

/* Audit filters: compact Liquid Glass controls and menus. */
html.rc-app-bg body:has(.page-content .btn-group) .btn-group{
  gap: 9px !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .select.tonal,
html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .select.tonal .activator{
  min-height: 38px !important;
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.82) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(20px) saturate(132%) !important;
  backdrop-filter: blur(20px) saturate(132%) !important;
  transition: background-color .18s ease, border-color .18s ease !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .select.tonal{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .select.tonal .activator{
  padding: 8px 12px !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .select.tonal .activator:hover{
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.075) !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .activator .icon{
  color: rgba(255,255,255,.62) !important;
  fill: rgba(255,255,255,.62) !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .options-list{
  min-width: 100% !important;
  margin-top: 7px !important;
  padding: 7px !important;
  background: rgba(20,20,20,.48) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.18) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
  scrollbar-color: rgba(255,255,255,.16) transparent !important;
  scrollbar-width: thin !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .options-list .option{
  min-height: 38px !important;
  padding: 8px 10px !important;
  gap: 9px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .options-list .option:hover{
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.04) !important;
  color: rgba(255,255,255,.94) !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .options-list .option:first-child{
  background: rgba(255,255,255,.028) !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .options-list .option :is(.icon,.avatar){
  width: 18px !important;
  height: 18px !important;
  flex: 0 0 18px !important;
  border-radius: 6px !important;
}

html.rc-app-bg body:has(.page-content .btn-group) .btn-group .select-wrapper .options-list .option .icon{
  color: rgba(255,255,255,.58) !important;
  fill: rgba(255,255,255,.58) !important;
}

@media (max-width: 680px){
  html.rc-app-bg.rc-billing-page .payments-tab-history .payments-table{
    border-radius: 18px !important;
  }

  html.rc-app-bg.rc-billing-page .payments-tab-history .content-layer > .row{
    min-height: 62px !important;
    border-radius: 12px !important;
  }
}

html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .ra-button:not(.primary){
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  box-shadow: none !important;
}

html.rc-app-bg .permissions-modal[internal-id="?client-permissions="] .ra-button.primary.disabled{
  background: rgba(255,255,255,.06) !important;
  border: 1px solid rgba(255,255,255,.035) !important;
  box-shadow: none !important;
}

/* Final audit filter specificity override. */
html.rc-app-bg body:has(#page-content .btn-group) #page-content .btn-group .select-wrapper.select-mobile .select.tonal > .activator{
  min-height: 38px !important;
  padding: 8px 12px !important;
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(20px) saturate(132%) !important;
  backdrop-filter: blur(20px) saturate(132%) !important;
}

html.rc-app-bg body:has(#page-content .btn-group) #page-content .btn-group .select-wrapper.select-mobile .select.tonal > .activator:hover,
html.rc-app-bg body:has(#page-content .btn-group) #page-content .btn-group .select-wrapper.select-mobile .select.tonal > .activator.-opened{
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.075) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.12) !important;
}

html.rc-app-bg body:has(#page-content .btn-group) #page-content .btn-group .select-wrapper.select-mobile .select.tonal > .options-list{
  padding: 7px !important;
  background: rgba(20,20,20,.48) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.18) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg body:has(#page-content .btn-group) #page-content .btn-group .select-wrapper.select-mobile .select.tonal > .options-list > .option{
  min-height: 38px !important;
  padding: 8px 10px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(#page-content .btn-group) #page-content .btn-group .select-wrapper.select-mobile .select.tonal > .options-list > .option:hover{
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.04) !important;
}

/* Server gear menu: one glass surface, no grey boxes around entries. */
html.rc-app-bg .p-contextmenu{
  padding: 7px !important;
  background: rgba(20,20,20,.48) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.18) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .p-contextmenu :is(.p-contextmenu-root-list,.p-menuitem,.p-menuitem-content){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .p-contextmenu .p-menuitem-content > .ra-button,
html.rc-app-bg .p-contextmenu .p-menuitem-content > .ra-button:is(:hover,:focus,:active){
  width: 100% !important;
  min-height: 36px !important;
  padding: 8px 9px !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  color: rgba(255,255,255,.76) !important;
}

html.rc-app-bg .p-contextmenu .p-menuitem-content > .ra-button:hover{
  background: rgba(255,255,255,.045) !important;
  color: rgba(255,255,255,.96) !important;
}

html.rc-app-bg .p-contextmenu .p-menuitem.destructive .ra-button{
  color: #ff625c !important;
}

/* Server edit modal: clean compact Liquid Glass. */
html.rc-app-bg .modal:has(> .server-edit-modal[internal-id="?server-edit="]){
  width: min(94vw, 500px) !important;
  max-width: 500px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="]{
  width: 100% !important;
  max-width: 100% !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .server-edit-modal[internal-id="?server-edit="] > .divided-card,
html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] > .divided-card{
  overflow: hidden !important;
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 24px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .header{
  padding: 22px 24px 17px !important;
  background: rgba(255,255,255,.016) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .modal-header{
  color: rgba(255,255,255,.94) !important;
  font-size: 17px !important;
  font-weight: 650 !important;
  letter-spacing: -.015em !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .content.padding{
  padding: 20px 22px 22px !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .input-label label{
  display: block !important;
  margin-bottom: 7px !important;
  color: rgba(255,255,255,.64) !important;
  font-size: 13px !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .input-box,
html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .input-box:is(:hover,:focus-within){
  width: 100% !important;
  height: 46px !important;
  min-height: 46px !important;
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.105) !important;
  border-radius: 12px !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(128%) !important;
  backdrop-filter: blur(16px) saturate(128%) !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .input-box input{
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .footer{
  padding: 16px 20px 20px !important;
  background: rgba(255,255,255,.016) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .footer .ra-button{
  min-height: 40px !important;
  padding: 9px 16px !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .footer .ra-button.default{
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .footer .ra-button.primary{
  background: #129fe8 !important;
  border: 1px solid rgba(100,205,255,.22) !important;
}

html.rc-app-bg .server-edit-modal[internal-id="?server-edit="] .footer .ra-button.disabled{
  background: rgba(255,255,255,.055) !important;
  border-color: rgba(255,255,255,.035) !important;
  color: rgba(255,255,255,.28) !important;
}

/* Pair and re-pair server dialogs: shared Liquid Glass treatment. */
html.rc-app-bg .modal:has(> .server-pair[internal-id="?server-pair="]){
  width: min(94vw, 520px) !important;
  max-width: 520px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="]{
  width: 100% !important;
  max-width: 100% !important;
}

html.rc-app-bg body:has(.content.pt-8) .modal .server-pair[internal-id="?server-pair="] > .divided-card,
html.rc-app-bg .server-pair[internal-id="?server-pair="] > .divided-card{
  overflow: hidden !important;
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 26px !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .header{
  padding: 24px 24px 20px !important;
  background: rgba(255,255,255,.016) !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .project-connect{
  gap: 8px !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .project-connect > .avatar-box{
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  box-shadow: none !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .content.padding{
  padding: 20px 22px 24px !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .tip.warning{
  margin-bottom: 18px !important;
  padding: 12px 13px !important;
  background: rgba(245,172,45,.075) !important;
  border: 1px solid rgba(245,185,70,.11) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(15px) saturate(125%) !important;
  backdrop-filter: blur(15px) saturate(125%) !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .tip.warning .gradient{
  display: none !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .command{
  min-height: 44px !important;
  padding: 11px 13px !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.085) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(15px) saturate(125%) !important;
  backdrop-filter: blur(15px) saturate(125%) !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .step-text{
  color: rgba(255,255,255,.62) !important;
  line-height: 1.4 !important;
}

html.rc-app-bg .server-pair[internal-id="?server-pair="] .step-text .bright{
  color: rgba(255,255,255,.92) !important;
}

/* Context-menu entries: remove the remaining button skin from every nested layer. */
html.rc-app-bg body .p-contextmenu[data-pc-name="contextmenu"] .p-menuitem .p-menuitem-content > button.ra-button.button,
html.rc-app-bg body .p-contextmenu[data-pc-name="contextmenu"] .p-menuitem .p-menuitem-content > button.ra-button.button > .wrapper,
html.rc-app-bg body .p-contextmenu[data-pc-name="contextmenu"] .p-menuitem .p-menuitem-content > button.ra-button.button > .wrapper > div{
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body .p-contextmenu[data-pc-name="contextmenu"] .p-menuitem .p-menuitem-content > button.ra-button.button:hover{
  background: rgba(255,255,255,.045) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Statistics controls: unified compact Liquid Glass. */
html.rc-app-bg body:has(.no-plan-content .p-calendar) .tabbed-navigation > .header{
  width: fit-content !important;
  padding: 4px !important;
  gap: 3px !important;
  background: rgba(20,20,20,.34) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 14px !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(20px) saturate(132%) !important;
  backdrop-filter: blur(20px) saturate(132%) !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .tabbed-navigation > .header > .element{
  min-height: 34px !important;
  padding: 7px 13px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  color: rgba(255,255,255,.48) !important;
  box-shadow: none !important;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .tabbed-navigation > .header > .element:hover{
  background: rgba(255,255,255,.035) !important;
  color: rgba(255,255,255,.72) !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .tabbed-navigation > .header > .element.selected{
  background: rgba(255,255,255,.075) !important;
  border-color: rgba(255,255,255,.055) !important;
  color: rgba(255,255,255,.94) !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .select-wrapper .select.default,
html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .select-wrapper .select.default > .activator{
  min-height: 38px !important;
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.8) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(20px) saturate(132%) !important;
  backdrop-filter: blur(20px) saturate(132%) !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .select-wrapper .select.default{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .select-wrapper .select.default > .activator{
  padding: 8px 12px !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .select-wrapper .options-list{
  margin-top: 7px !important;
  padding: 7px !important;
  background: rgba(20,20,20,.48) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  box-shadow: 0 12px 36px rgba(0,0,0,.18) !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .select-wrapper .options-list > .option{
  min-height: 38px !important;
  padding: 8px 10px !important;
  background: transparent !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .select-wrapper .options-list > .option:hover{
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.04) !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .p-calendar{
  width: 150px !important;
  min-height: 38px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .no-plan-content .p-calendar .p-inputtext{
  width: 150px !important;
  height: 38px !important;
  padding: 8px 38px 8px 12px !important;
  background: rgba(20,20,20,.35) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.8) !important;
  outline: 0 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.10) !important;
  -webkit-backdrop-filter: blur(20px) saturate(132%) !important;
  backdrop-filter: blur(20px) saturate(132%) !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .p-datepicker{
  padding: 12px !important;
  background: rgba(20,20,20,.52) !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.20) !important;
  -webkit-backdrop-filter: blur(30px) saturate(140%) !important;
  backdrop-filter: blur(30px) saturate(140%) !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .p-datepicker .p-datepicker-header{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .p-datepicker :is(.p-datepicker-prev,.p-datepicker-next){
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .p-datepicker td > span{
  border-radius: 9px !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.no-plan-content .p-calendar) .p-datepicker td > span[data-p-highlight="true"]{
  background: rgba(18,159,232,.22) !important;
  color: #fff !important;
}

/* Ban and mute details: calm, layered Liquid Glass. */
html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal){
  width: min(500px, calc(100vw - 28px)) !important;
  overflow: hidden !important;
  background: rgba(16,16,18,.88) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.035), transparent 42%) !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.11) !important;
  border-radius: 24px !important;
  box-shadow: 0 28px 80px rgba(0,0,0,.38) !important;
  -webkit-backdrop-filter: blur(30px) saturate(142%) !important;
  backdrop-filter: blur(30px) saturate(142%) !important;
}

html.rc-app-bg body .mute-view-modal > .divided-card,
html.rc-app-bg body .ban-view-modal.divided-card{
  overflow: hidden !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: inherit !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .header.apply-border{
  min-height: 78px !important;
  padding: 18px 20px !important;
  background: rgba(255,255,255,.018) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.045) !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .ban-view-header{
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .header-title{
  color: rgba(255,255,255,.94) !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: -.01em !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .header-subtitle{
  margin-top: 3px !important;
  color: rgba(255,255,255,.42) !important;
  font-size: 11px !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .ban-view-header .append{
  width: 48px !important;
  height: 48px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 26px rgba(0,0,0,.14) !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) > .content.padding,
html.rc-app-bg body .mute-view-modal > .divided-card > .content.padding{
  padding: 14px 16px !important;
  background: transparent !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .content.padding .row{
  min-height: 42px !important;
  margin: 0 !important;
  padding: 10px 12px !important;
  background: rgba(255,255,255,.027) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.76) !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .content.padding .row:first-child{
  background: rgba(20,178,145,.075) !important;
  border-color: rgba(45,205,170,.12) !important;
  color: rgba(90,225,193,.92) !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .row .name{
  color: rgba(255,255,255,.48) !important;
  font-weight: 550 !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .row .value{
  color: rgba(255,255,255,.88) !important;
  font-weight: 650 !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .content.padding .comment{
  min-height: 44px !important;
  padding: 12px 14px !important;
  background: rgba(255,255,255,.03) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .footer{
  padding: 10px 16px 14px !important;
  background: rgba(0,0,0,.055) !important;
  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.035) !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .footer .ra-button{
  min-height: 38px !important;
  padding: 8px 15px !important;
  background: rgba(255,255,255,.06) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.86) !important;
  box-shadow: 0 8px 20px rgba(0,0,0,.12) !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .footer .ra-button:hover{
  background: rgba(255,255,255,.09) !important;
  border-color: rgba(255,255,255,.09) !important;
}

/* Final neutral pass: the wrapper must not add a second bright/coloured layer. */
html.rc-app-bg body .modal:has(.ban-view-modal),
html.rc-app-bg body .modal:has(.mute-view-modal){
  overflow: visible !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal),
html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal)::before,
html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal)::after{
  background-image: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal)::before,
html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal)::after{
  display: none !important;
  content: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal){
  background-color: rgba(15,15,17,.82) !important;
  border-color: rgba(255,255,255,.06) !important;
  border-top-color: rgba(255,255,255,.105) !important;
  box-shadow: 0 26px 74px rgba(0,0,0,.42) !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .content.padding .row:first-child{
  background: rgba(255,255,255,.032) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.052) !important;
  color: rgba(255,255,255,.84) !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .content.padding .row{
  background: rgba(255,255,255,.025) !important;
  border-color: rgba(255,255,255,.042) !important;
  box-shadow: none !important;
}

html.rc-app-bg body :is(.ban-view-modal,.mute-view-modal) .content.padding .comment{
  background: rgba(255,255,255,.026) !important;
  border-color: rgba(255,255,255,.042) !important;
}

/* Mute details follow the exact same geometry as ban details. */
html.rc-app-bg body .mute-view-modal,
html.rc-app-bg body .ban-view-modal{
  width: min(460px, calc(100vw - 28px)) !important;
}

html.rc-app-bg body .mute-view-modal > .divided-card,
html.rc-app-bg body .ban-view-modal{
  display: flex !important;
  flex-direction: column !important;
}

html.rc-app-bg body .mute-view-modal > .divided-card > .header,
html.rc-app-bg body .ban-view-modal > .header{
  min-height: 84px !important;
  padding: 18px 18px !important;
  background: rgba(255,255,255,.012) !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.038) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .mute-view-modal > .divided-card > .content.padding,
html.rc-app-bg body .ban-view-modal > .content.padding{
  padding: 14px 16px !important;
}

html.rc-app-bg body .mute-view-modal > .divided-card > .footer,
html.rc-app-bg body .ban-view-modal > .footer{
  min-height: 64px !important;
  padding: 10px 16px 14px !important;
  background: rgba(0,0,0,.055) !important;
  border: 0 !important;
  border-top: 1px solid rgba(255,255,255,.035) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .mute-view-modal .content.padding .flex.flex-col,
html.rc-app-bg body .ban-view-modal .content.padding .flex.flex-col{
  gap: 7px !important;
}

/* Bans page controls: clear dark glass, no flat grey skins. */
html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content > .header .search-input{
  width: 220px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content > .header .search-input .input-box{
  height: 40px !important;
  overflow: hidden !important;
  background: rgba(8,10,14,.34) !important;
  background-image: linear-gradient(135deg, rgba(255,255,255,.025), transparent 55%) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 13px !important;
  outline: 0 !important;
  box-shadow: 0 9px 26px rgba(0,0,0,.13) !important;
  -webkit-backdrop-filter: blur(22px) saturate(135%) !important;
  backdrop-filter: blur(22px) saturate(135%) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content > .header .search-input input{
  height: 100% !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  color: rgba(255,255,255,.86) !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content > .header .search-input input::placeholder{
  color: rgba(255,255,255,.30) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content .rc-filter-trigger{
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  background: rgba(8,10,14,.34) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 13px !important;
  color: rgba(255,255,255,.60) !important;
  outline: 0 !important;
  box-shadow: 0 9px 24px rgba(0,0,0,.12) !important;
  -webkit-backdrop-filter: blur(22px) saturate(135%) !important;
  backdrop-filter: blur(22px) saturate(135%) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content .rc-filter-trigger:hover{
  background: rgba(255,255,255,.045) !important;
  color: rgba(255,255,255,.88) !important;
  border-color: rgba(255,255,255,.07) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content .content-layer .row > .element:nth-last-child(2) .container[title]{
  width: fit-content !important;
  min-height: 30px !important;
  padding: 5px 9px !important;
  background: rgba(8,10,14,.30) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.038) !important;
  border-top-color: rgba(255,255,255,.07) !important;
  border-radius: 9px !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(125%) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
}

/* Notifications / alerts: project-independent neutral liquid glass. */
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  align-content: start !important;
  gap: 10px !important;
  padding: 12px 14px 24px !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover{
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 72px !important;
  margin: 0 !important;
  overflow: hidden !important;
  background-color: rgba(255, 255, 255, .028) !important;
  background-image:
    radial-gradient(120% 95% at 8% -24%, rgba(255, 255, 255, .14) 0%, rgba(255, 255, 255, .035) 35%, transparent 66%),
    linear-gradient(145deg, rgba(255, 255, 255, .055), rgba(255, 255, 255, .012)) !important;
  border: 1px solid rgba(255, 255, 255, .085) !important;
  border-top-color: rgba(255, 255, 255, .18) !important;
  border-radius: 18px !important;
  outline: 0 !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    inset 0 -1px 0 rgba(255, 255, 255, .018),
    0 16px 38px rgba(0, 0, 0, .16) !important;
  -webkit-backdrop-filter: blur(30px) saturate(105%) !important;
  backdrop-filter: blur(30px) saturate(105%) !important;
  transition: transform .2s ease, border-color .2s ease, background-color .2s ease, box-shadow .2s ease !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover:hover{
  transform: translateY(-2px) !important;
  background-color: rgba(255, 255, 255, .045) !important;
  border-color: rgba(255, 255, 255, .14) !important;
  border-top-color: rgba(255, 255, 255, .24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .11),
    0 20px 48px rgba(0, 0, 0, .2) !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover > .element > .flex{
  min-height: 70px !important;
  padding: 11px 13px !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  gap: 12px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon{
  width: 42px !important;
  height: 42px !important;
  display: grid !important;
  place-items: center !important;
  overflow: hidden !important;
  background-color: rgba(255, 255, 255, .04) !important;
  background-image: radial-gradient(circle at 32% 15%, rgba(255, 255, 255, .17), transparent 58%) !important;
  border: 1px solid rgba(255, 255, 255, .09) !important;
  border-top-color: rgba(255, 255, 255, .18) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08), 0 8px 20px rgba(0, 0, 0, .14) !important;
  -webkit-backdrop-filter: blur(18px) saturate(100%) !important;
  backdrop-filter: blur(18px) saturate(100%) !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon img{
  width: 27px !important;
  height: 27px !important;
  border-radius: 8px !important;
  filter: grayscale(1) brightness(1.14) contrast(.92) !important;
  opacity: .9 !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover p.row{
  gap: 2px 5px !important;
  color: rgba(255, 255, 255, .66) !important;
  font-size: 13px !important;
  line-height: 1.38 !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover p.row .bright{
  color: rgba(255, 255, 255, .96) !important;
  font-weight: 680 !important;
  letter-spacing: -.01em !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .date{
  width: fit-content !important;
  margin-top: 4px !important;
  padding: 2px 7px !important;
  color: rgba(255, 255, 255, .42) !important;
  font-size: 9px !important;
  font-weight: 560 !important;
  letter-spacing: .02em !important;
  background: rgba(255, 255, 255, .025) !important;
  border: 1px solid rgba(255, 255, 255, .04) !important;
  border-radius: 999px !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover::before,
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover::after{
  display: none !important;
  content: none !important;
}

@media (max-width: 680px){
  html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer{
    gap: 8px !important;
    padding: 9px 9px 18px !important;
  }

  html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover{
    border-radius: 16px !important;
  }
}

/* ========================================================================== */
/* Unified Liquid Glass Design System                                         */
/* ========================================================================== */
html.rc-app-bg{
  --rc-lg-canvas: #101113;
  --rc-lg-panel: linear-gradient(145deg, rgba(255,255,255,.048), rgba(255,255,255,.012));
  --rc-lg-panel-strong: linear-gradient(145deg, rgba(255,255,255,.068), rgba(255,255,255,.018));
  --rc-lg-control: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.012));
  --rc-lg-line: rgba(255,255,255,.075);
  --rc-lg-line-top: rgba(255,255,255,.145);
  --rc-lg-text: rgba(250,251,253,.94);
  --rc-lg-text-2: rgba(231,235,241,.76);
  --rc-lg-text-3: rgba(208,214,223,.58);
  --rc-lg-radius: 14px;
  --rc-lg-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 14px 34px rgba(0,0,0,.16);
}

/* Consistent readable type hierarchy. */
html.rc-app-bg body{ color: var(--rc-lg-text-2) !important; }
html.rc-app-bg :is(h1,h2,h3,h4,h5,h6,.title,.header-title,.modal-title){ color: var(--rc-lg-text) !important; }
html.rc-app-bg :is(.subtitle,.description,.placeholder,.date,.time,[class*="text-grey-5"],[class*="text-grey-6"]){
  color: var(--rc-lg-text-3) !important;
}
html.rc-app-bg :is(input,textarea)::placeholder{ color: rgba(215,220,228,.42) !important; opacity: 1 !important; }

/* Shared glass vocabulary: panels, controls and interactive rows. */
html.rc-app-bg :is(
  .settings-container,
  .sidebar-content > .section,
  .content-with-sidebar .sidebar-content > div,
  .modal-border > .modal,
  .vfm__content > .modal,
  .summary-card,
  .stat-card,
  .empty-card
){
  background: var(--rc-lg-panel) !important;
  border: 1px solid var(--rc-lg-line) !important;
  border-top-color: var(--rc-lg-line-top) !important;
  box-shadow: var(--rc-lg-shadow) !important;
  -webkit-backdrop-filter: blur(24px) saturate(112%) !important;
  backdrop-filter: blur(24px) saturate(112%) !important;
}

html.rc-app-bg :is(
  .select > .activator,
  .input-box,
  .number-input,
  .ra-button.preset.default,
  .content-layer > .row,
  .table-base .row
){
  border-color: var(--rc-lg-line) !important;
}

html.rc-app-bg :is(.select > .activator,.input-box,.number-input,.ra-button.preset.default):is(:hover,:focus-within){
  border-color: rgba(255,255,255,.14) !important;
  border-top-color: rgba(255,255,255,.20) !important;
}

/* Filters: clearer groups, more air and one glass language on every page. */
html.rc-app-bg .content-with-sidebar .sidebar-wrapper{
  background: rgba(8,10,12,.22) !important;
  border-left: 1px solid rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter: blur(24px) saturate(108%) !important;
  backdrop-filter: blur(24px) saturate(108%) !important;
}
html.rc-app-bg .content-with-sidebar .sidebar-content{
  padding: 18px 14px !important;
  gap: 12px !important;
}
html.rc-app-bg .content-with-sidebar .sidebar-content > .settings-container{
  padding: 16px !important;
  border-radius: var(--rc-lg-radius) !important;
}
html.rc-app-bg .settings-container .switch-wrapper{
  min-height: 42px !important;
  gap: 12px !important;
}
html.rc-app-bg .settings-container .switch-text :is(.title,p:first-child){
  color: rgba(240,243,248,.84) !important;
  line-height: 1.25 !important;
}

/* Empty states: intentional glass object instead of text floating in space. */
html.rc-app-bg .content-layer > .w-full.h-full.flex.flex-col.items-center.justify-center{
  width: min(460px, calc(100% - 32px)) !important;
  height: auto !important;
  min-height: 230px !important;
  margin: auto !important;
  padding: 34px 28px !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-top-color: rgba(255,255,255,.12) !important;
  border-radius: 20px !important;
  background: linear-gradient(145deg, rgba(255,255,255,.038), rgba(255,255,255,.009)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  -webkit-backdrop-filter: blur(20px) saturate(108%) !important;
  backdrop-filter: blur(20px) saturate(108%) !important;
}

/* Confirmation dialog — clear graphite liquid glass without a white glow. */
html.rc-app-bg .modal-border:has(> .modal > .confirm){
  border-radius: 24px !important;
  padding: 1px !important;
  background: rgba(255, 255, 255, 0.12) !important;
  box-shadow: 0 24px 64px rgba(0, 0, 0, 0.34) !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) > .modal{
  position: relative !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 23px !important;
  background: rgba(13, 14, 16, 0.24) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.09),
    inset 0 -1px 0 rgba(255, 255, 255, 0.02) !important;
  filter: none !important;
  -webkit-backdrop-filter: blur(13px) saturate(1.02) !important;
  backdrop-filter: blur(13px) saturate(1.02) !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) > .modal::before{
  content: none !important;
  display: none !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .confirm{
  position: relative !important;
  z-index: 1 !important;
  padding: 28px 20px 18px !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .icon-warn{
  margin-top: 0 !important;
  margin-bottom: 12px !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .icon-warn svg{
  width: 76px !important;
  height: 66px !important;
  filter: drop-shadow(0 8px 16px rgba(245, 188, 35, 0.16)) !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .title{
  color: rgba(250, 251, 253, 0.96) !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .description{
  max-width: 245px !important;
  margin: 6px auto 0 !important;
  color: rgba(220, 224, 230, 0.73) !important;
  line-height: 1.35 !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .buttons{
  gap: 10px !important;
  padding-top: 16px !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .buttons .ra-button{
  min-height: 38px !important;
  border: 1px solid rgba(255, 255, 255, 0.09) !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, 0.045) !important;
  color: rgba(241, 243, 247, 0.88) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.055) !important;
  transition: background-color 160ms ease, border-color 160ms ease, transform 160ms ease !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .buttons .ra-button:hover{
  border-color: rgba(255, 255, 255, 0.16) !important;
  background: rgba(255, 255, 255, 0.105) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg .modal-border:has(> .modal > .confirm) .buttons .ra-button.primary{
  border-color: rgba(255, 255, 255, 0.20) !important;
  background: rgba(255, 255, 255, 0.10) !important;
  color: #fff !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.14),
    0 8px 20px rgba(0, 0, 0, 0.13) !important;
}
html.rc-app-bg .content-layer > .w-full.h-full.flex.flex-col.items-center.justify-center svg{
  opacity: .66 !important;
  filter: none !important;
}

/* Neutral, visible fallback avatars; real images remain untouched. */
html.rc-app-bg :is(img.avatar,img[class*="avatar"]):not([src]),
html.rc-app-bg :is(img.avatar,img[class*="avatar"])[src=""],
html.rc-app-bg :is(.avatar,.player-avatar,.user-avatar):not(img):empty{
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.16), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.095), rgba(255,255,255,.025)) !important;
  border: 1px solid rgba(255,255,255,.105) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html.rc-app-bg :is(.avatar,.player-avatar,.user-avatar){
  color: rgba(245,247,250,.78) !important;
}

/* Tablet: keep the content usable, turn side settings into a compact drawer. */
@media (max-width: 1024px){
  html.rc-app-bg .page-content,
  html.rc-app-bg #page-content { min-width: 0 !important; }
  html.rc-app-bg .content-with-sidebar { grid-template-columns: minmax(0,1fr) min(320px,38vw) !important; }
  html.rc-app-bg .content-with-sidebar .sidebar-content { padding: 12px 10px !important; }
  html.rc-app-bg .table-base { overflow-x: auto !important; overscroll-behavior-inline: contain; }
  html.rc-app-bg .table-base > .header,
  html.rc-app-bg .table-base > .content-layer:has(> .row) { min-width: 760px; }
  html.rc-app-bg .modal-border { max-width: calc(100vw - 32px) !important; }
}

/* Phone: single content column, bottom-sheet filters and touch-sized controls. */
@media (max-width: 700px){
  html.rc-app-bg { --rc-lg-radius: 12px; }
  html.rc-app-bg .navigation-wrapper { width: 58px !important; min-width: 58px !important; }
  html.rc-app-bg .navigation-wrapper.closed .navigation .header .select-wrapper { display: none !important; }
  html.rc-app-bg .page-content,
  html.rc-app-bg #page-content { margin-left: 0 !important; width: 100% !important; }
  html.rc-app-bg .page-header,
  html.rc-app-bg #page-content > .header { min-height: 56px !important; padding-inline: 12px !important; }
  html.rc-app-bg .content-with-sidebar { display: block !important; }
  html.rc-app-bg .content-with-sidebar .sidebar-wrapper {
    position: relative !important;
    z-index: 1 !important;
    inset: auto !important;
    width: 100% !important;
    max-height: none !important;
    margin-top: 12px !important;
    border: 1px solid rgba(255,255,255,.08) !important;
    border-top-color: rgba(255,255,255,.15) !important;
    border-radius: 18px !important;
    overflow: auto !important;
    box-shadow: 0 18px 42px rgba(0,0,0,.26) !important;
  }
  html.rc-app-bg :is(button,.ra-button,.select>.activator) { min-height: 40px; }
  html.rc-app-bg .modal-border,
  html.rc-app-bg .vfm__content { width: calc(100vw - 16px) !important; max-width: none !important; }
  html.rc-app-bg .modal-border > .modal { max-height: calc(100vh - 20px) !important; overflow: auto !important; }
  html.rc-app-bg .content-layer > .w-full.h-full.flex.flex-col.items-center.justify-center {
    box-sizing: border-box !important;
    width: calc(100% - 16px) !important;
    max-width: 460px !important;
    min-height: 190px !important;
    margin-inline: auto !important;
    padding: 26px 18px !important;
  }
}

@media (max-width: 430px){
  html.rc-app-bg .navigation-wrapper{ width: 52px !important; min-width: 52px !important; }
  html.rc-app-bg .content-with-sidebar .sidebar-wrapper{ left: auto !important; }
  html.rc-app-bg .page-header .title,
  html.rc-app-bg #page-content > .header .title{ font-size: 16px !important; }
  html.rc-app-bg .table-base > .header,
  html.rc-app-bg .table-base > .content-layer:has(> .row){ min-width: 680px; }
}

/* Inspection workspace: clearer rows and editable data without heavy blocks. */
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .table-base > .header{
  position: sticky !important;
  top: 0 !important;
  z-index: 4 !important;
  background: rgba(15,17,20,.58) !important;
  border-bottom: 1px solid rgba(255,255,255,.065) !important;
  -webkit-backdrop-filter: blur(20px) saturate(110%) !important;
  backdrop-filter: blur(20px) saturate(110%) !important;
}
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .content-layer > .row{
  min-height: 70px !important;
  background: linear-gradient(90deg, rgba(255,255,255,.018), transparent 72%) !important;
  border-bottom: 1px solid rgba(255,255,255,.045) !important;
  transition: background-color .18s ease, border-color .18s ease !important;
}
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .content-layer > .row:hover{
  background: linear-gradient(90deg, rgba(255,255,255,.048), rgba(255,255,255,.012) 72%) !important;
  border-bottom-color: rgba(255,255,255,.085) !important;
}
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .content-layer > .row :is(.container[title],.badge){
  border: 1px solid rgba(255,255,255,.06) !important;
  border-top-color: rgba(255,255,255,.11) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.012)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

/* Empty states must stay weightless: no oversized card around the message. */
html.rc-app-bg .content-layer > .w-full.h-full.flex.flex-col.items-center.justify-center{
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  height: 100% !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 24px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Keep the native, user-configurable background visible. */
#rc-app-bg{
  display: block !important;
}

/* Account/profile settings: transparent liquid glass without bloom. */
html.rc-dash-modal body #rc-dash .settings-card{
  background: rgba(16,17,19,.38) !important;
  background-color: rgba(16,17,19,.38) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(32px) saturate(112%) !important;
  backdrop-filter: blur(32px) saturate(112%) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content .content-layer .row > .element:last-child > .flex > div{
  width: 38px !important;
  height: 38px !important;
  align-items: center !important;
  background: rgba(4,135,105,.12) !important;
  background-image: none !important;
  border: 1px solid rgba(35,210,165,.07) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%) !important;
  backdrop-filter: blur(16px) saturate(130%) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content .content-layer .row > .element:last-child .ra-button{
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  background: rgba(8,10,14,.28) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.58) !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(125%) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content .content-layer .row > .element:last-child .ra-button:hover{
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.065) !important;
  color: rgba(255,255,255,.9) !important;
}

/* Bans search: colourless crystal glass. */
html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content > .header .search-input .input-box{
  background: rgba(255,255,255,.018) !important;
  background-image: linear-gradient(155deg, rgba(255,255,255,.028), transparent 58%) !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.105) !important;
  outline: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 10px 28px rgba(0,0,0,.08) !important;
  -webkit-backdrop-filter: blur(26px) saturate(118%) !important;
  backdrop-filter: blur(26px) saturate(118%) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content > .header .search-input:focus-within .input-box{
  background: rgba(255,255,255,.025) !important;
  border-color: rgba(255,255,255,.095) !important;
  border-top-color: rgba(255,255,255,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 12px 30px rgba(0,0,0,.09) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content > .header .search-input input{
  color: rgba(255,255,255,.9) !important;
  caret-color: rgba(255,255,255,.8) !important;
}

html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content > .header .search-input input::placeholder{
  color: rgba(255,255,255,.34) !important;
}

/* Mutes page: mirror the colourless glass search and action icons from bans. */
html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content > .header .search-input{
  width: 220px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content > .header .search-input .input-box{
  height: 40px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.018) !important;
  background-image: linear-gradient(155deg, rgba(255,255,255,.028), transparent 58%) !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.105) !important;
  border-radius: 13px !important;
  outline: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025), 0 10px 28px rgba(0,0,0,.08) !important;
  -webkit-backdrop-filter: blur(26px) saturate(118%) !important;
  backdrop-filter: blur(26px) saturate(118%) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content > .header .search-input:focus-within .input-box{
  background: rgba(255,255,255,.025) !important;
  border-color: rgba(255,255,255,.095) !important;
  border-top-color: rgba(255,255,255,.15) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content > .header .search-input input{
  height: 100% !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  color: rgba(255,255,255,.9) !important;
  caret-color: rgba(255,255,255,.8) !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content > .header .search-input input::placeholder{
  color: rgba(255,255,255,.34) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content .content-layer .row > .element:nth-last-child(2) .container[title]{
  width: fit-content !important;
  min-height: 30px !important;
  padding: 5px 9px !important;
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 9px !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(118%) !important;
  backdrop-filter: blur(16px) saturate(118%) !important;
}

/* Final background/profile correction — must win over the legacy theme layer. */
html.rc-app-bg body #rc-app-bg{
  display: block !important;
}

html.rc-dash-modal body #rc-dash .settings-card{
  background: rgba(16,17,19,.38) !important;
  background-color: rgba(16,17,19,.38) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(32px) saturate(112%) !important;
  backdrop-filter: blur(32px) saturate(112%) !important;
}

/* Absolute final no-bloom overrides. */
html.rc-dash-modal body #rc-dash .settings-card{
  background: rgba(16,17,19,.38) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-dash-modal body #rc-dash .settings-sidebar{
  background: rgba(255,255,255,.008) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-dash-modal body #rc-dash :is(.integration-item,.settings-field,.interface-option,.session-item,.action-item){
  background: rgba(255,255,255,.012) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > div.row.relative.defaultHover{
  background: rgba(255,255,255,.014) !important;
  background-color: rgba(255,255,255,.014) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > div.row.relative.defaultHover:hover{
  background: rgba(255,255,255,.026) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > div.row.relative.defaultHover .icon{
  background: rgba(255,255,255,.018) !important;
  background-color: rgba(255,255,255,.018) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Final colourless sidebar layer: keep legacy late rules from restoring grey. */
html.rc-app-bg body #page-content .content-with-sidebar > .sidebar-wrapper{
  background: rgba(0,0,0,.08) !important;
  background-color: rgba(0,0,0,.08) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(30px) saturate(106%) !important;
  backdrop-filter: blur(30px) saturate(106%) !important;
}

html.rc-app-bg body #page-content .content-with-sidebar > .sidebar-wrapper > .sidebar-content{
  background: rgba(255,255,255,.01) !important;
  background-color: rgba(255,255,255,.01) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.035) !important;
  border-top-color: rgba(255,255,255,.065) !important;
  box-shadow: none !important;
}

html.rc-app-bg body #page-content .content-with-sidebar .sidebar-content .page-tip{
  background: rgba(255,255,255,.012) !important;
  background-color: rgba(255,255,255,.012) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.03) !important;
  border-top-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
}

/* Default graphite background supplied for the whole application. */
html{
  min-height: 100%;
  background: #101113 !important;
}

body{
  margin: 0;
  min-height: 100vh;
  isolation: isolate;
  background: transparent !important;
}

html.rc-app-bg{
  background-color: #101113 !important;
  background-image: none !important;
}

html.rc-app-bg body{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

#rc-app-bg{
  display: block !important;
}

.graphite-background{
  position: fixed;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #101113;
}

html.rc-app-bg body > #app{
  position: relative !important;
  z-index: 1 !important;
  background: transparent !important;
  background-image: none !important;
}

.graphite-background::before,
.graphite-background::after{
  content: "";
  position: absolute;
  inset: -25%;
  will-change: transform;
}

.graphite-background::before{
  background: radial-gradient(
    ellipse at 25% 20%,
    rgba(110,113,120,.22) 0%,
    rgba(65,68,75,.10) 35%,
    transparent 65%
  );
  animation: graphite-light 32s ease-in-out infinite alternate;
}

.graphite-background::after{
  background: radial-gradient(
    ellipse at 80% 85%,
    rgba(78,82,90,.16) 0%,
    rgba(40,43,49,.08) 40%,
    transparent 65%
  );
  animation: graphite-shadow 40s ease-in-out infinite alternate;
}

.graphite-background__vignette{
  position: absolute;
  inset: 0;
  background: radial-gradient(
    ellipse at center,
    transparent 20%,
    rgba(0,0,0,.32) 100%
  );
}

@keyframes graphite-light {
  from { transform: translate(-3%,-2%) scale(1); }
  to { transform: translate(6%,4%) scale(1.08); }
}

@keyframes graphite-shadow {
  from { transform: translate(4%,3%) scale(1.05); }
  to { transform: translate(-5%,-4%) scale(1); }
}

/* Player profile: colourless Liquid Glass{
  overflow: hidden !important;
  color: rgba(255,255,255,.82) !important;
  background: rgba(10,11,13,.38) !important;
  background-color: rgba(10,11,13,.38) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 24px !important;
  outline: 0 !important;
  box-shadow: 0 24px 70px rgba(0,0,0,.24) !important;
  -webkit-backdrop-filter: blur(34px) saturate(110%) !important;
  backdrop-filter: blur(34px) saturate(110%) !important;
}

/* Player profile — clearer neutral Liquid Glass{
  background:
    linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.014) 42%, rgba(255,255,255,.025)),
    rgba(15,16,18,.54) !important;
  background-color: rgba(15,16,18,.54) !important;
  border-color: rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 28px 72px rgba(0,0,0,.28) !important;
  -webkit-backdrop-filter: blur(38px) saturate(108%) !important;
  backdrop-filter: blur(38px) saturate(108%) !important;
}

@media (prefers-reduced-motion: reduce){
  .graphite-background::before,
  .graphite-background::after{
    animation: none;
    will-change: auto;
  }
}

/* No white bloom in the account settings window. */
html.rc-dash-modal #rc-dash .settings-card{
  background: rgba(16,17,19,.38) !important;
  background-color: rgba(16,17,19,.38) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(32px) saturate(106%) !important;
  backdrop-filter: blur(32px) saturate(106%) !important;
}

html.rc-dash-modal #rc-dash .settings-sidebar{
  background: rgba(255,255,255,.008) !important;
  background-color: rgba(255,255,255,.008) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
}

html.rc-dash-modal #rc-dash :is(.settings-content,.settings-main,.settings-tab,.settings-section){
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-dash-modal #rc-dash :is(.integration-item,.settings-field,.interface-option,.session-item,.action-item){
  background: rgba(255,255,255,.012) !important;
  background-color: rgba(255,255,255,.012) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.035) !important;
  border-top-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
}

html.rc-dash-modal #rc-dash :is(.integration-item,.settings-field,.interface-option,.session-item,.action-item):hover{
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-dash-modal #rc-dash .settings-card::before,
html.rc-dash-modal #rc-dash .settings-card::after,
html.rc-dash-modal #rc-dash .settings-sidebar::before,
html.rc-dash-modal #rc-dash .settings-sidebar::after{
  display: none !important;
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* Alerts: remove the repeated white bloom from every notification row. */
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover{
  background: rgba(255,255,255,.014) !important;
  background-color: rgba(255,255,255,.014) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover:hover{
  background: rgba(255,255,255,.026) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon{
  background: rgba(255,255,255,.018) !important;
  background-color: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.04) !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover::before,
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover::after{
  display: none !important;
  content: none !important;
  background: none !important;
  box-shadow: none !important;
}

/* Reports filters: one clean glass sheet, no glow and no stacked boxes. */
html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .sidebar-wrapper{
  width: 390px !important;
  padding: 20px !important;
  background: rgba(10,10,12,.34) !important;
  background-image: none !important;
  border: 0 !important;
  border-left: 1px solid rgba(255,255,255,.03) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(30px) saturate(110%) !important;
  backdrop-filter: blur(30px) saturate(110%) !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .sidebar-content{
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 9px 18px !important;
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 24px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(26px) saturate(112%) !important;
  backdrop-filter: blur(26px) saturate(112%) !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] :is(.sidebar-wrapper,.sidebar-content,.settings-container)::before,
html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] :is(.sidebar-wrapper,.sidebar-content,.settings-container)::after{
  display: none !important;
  content: none !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .settings-container{
  gap: 2px !important;
  margin: 0 !important;
  padding: 14px 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.035) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .settings-container:last-child{
  border-bottom: 0 !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .settings-container > .title{
  margin: 0 0 6px !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] :is(.switch-wrapper,.numeric-wrapper){
  min-height: 39px !important;
  padding: 5px 0 !important;
  gap: 12px !important;
  background: transparent !important;
  border: 0 !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] :is(.switch-text,.numeric-text) > .title{
  color: rgba(255,255,255,.68) !important;
  font-size: 13px !important;
  font-weight: 520 !important;
  line-height: 1.25 !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] :is(.select-wrapper,.select.settings,.input-container,.input-box){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .select.settings > .activator{
  min-height: 32px !important;
  padding: 6px 11px !important;
  background: rgba(255,255,255,.02) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.065) !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,.82) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .numeric-wrapper .input-box{
  display: grid !important;
  grid-template-columns: 29px minmax(22px,auto) 29px !important;
  align-items: center !important;
  min-height: 31px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.018) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.06) !important;
  border-radius: 999px !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .numeric-wrapper input{
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 22px !important;
  height: 29px !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  color: rgba(255,255,255,.86) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .numeric-wrapper .control{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 29px !important;
  height: 29px !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,.62) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .numeric-wrapper .control.minus{
  grid-column: 1 !important;
  grid-row: 1 !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .numeric-wrapper .control.plus{
  grid-column: 3 !important;
  grid-row: 1 !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .numeric-wrapper .control.disabled{
  opacity: .25 !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .custom-switch .slider{
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar[sidebar-type="/crystalrust/reports"] .custom-switch input:checked + .slider{
  background: rgba(38,185,140,.22) !important;
  border-color: rgba(70,210,165,.16) !important;
  box-shadow: none !important;
}

/* Every right sidebar uses the same clean, unified Liquid Glass language. */
html.rc-app-bg body .content-with-sidebar > .sidebar-wrapper{
  width: 390px !important;
  padding: 20px !important;
  background: rgba(10,10,12,.34) !important;
  background-image: none !important;
  border: 0 !important;
  border-left: 1px solid rgba(255,255,255,.03) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(30px) saturate(110%) !important;
  backdrop-filter: blur(30px) saturate(110%) !important;
}

html.rc-app-bg body .content-with-sidebar > .sidebar-wrapper > .sidebar-content{
  display: flex !important;
  flex-direction: column !important;
  gap: 0 !important;
  padding: 9px 18px !important;
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 24px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(26px) saturate(112%) !important;
  backdrop-filter: blur(26px) saturate(112%) !important;
}

html.rc-app-bg body .content-with-sidebar :is(.sidebar-wrapper,.sidebar-content,.settings-container)::before,
html.rc-app-bg body .content-with-sidebar :is(.sidebar-wrapper,.sidebar-content,.settings-container)::after{
  display: none !important;
  content: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content > .settings-container{
  gap: 2px !important;
  margin: 0 !important;
  padding: 14px 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255,255,255,.035) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content > .settings-container:last-child{
  border-bottom: 0 !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content > .settings-container > .title{
  margin: 0 0 6px !important;
  color: rgba(255,255,255,.92) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content :is(.switch-wrapper,.numeric-wrapper){
  min-height: 39px !important;
  padding: 5px 0 !important;
  gap: 12px !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content :is(.switch-text,.numeric-text) > .title{
  color: rgba(255,255,255,.68) !important;
  font-size: 13px !important;
  font-weight: 520 !important;
  line-height: 1.25 !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content :is(.select-wrapper,.select.settings,.input-container,.input-box){
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .select.settings > .activator{
  min-height: 32px !important;
  padding: 6px 11px !important;
  background: rgba(255,255,255,.02) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.065) !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,.82) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .numeric-wrapper .input-box{
  display: grid !important;
  grid-template-columns: 29px minmax(22px,auto) 29px !important;
  align-items: center !important;
  min-height: 31px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.018) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.06) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .numeric-wrapper input{
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: 100% !important;
  min-width: 22px !important;
  height: 29px !important;
  background: transparent !important;
  border: 0 !important;
  outline: 0 !important;
  color: rgba(255,255,255,.86) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .numeric-wrapper .control{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 29px !important;
  height: 29px !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 999px !important;
  color: rgba(255,255,255,.62) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .numeric-wrapper .control.minus{
  grid-column: 1 !important;
  grid-row: 1 !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .numeric-wrapper .control.plus{
  grid-column: 3 !important;
  grid-row: 1 !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .numeric-wrapper .control.disabled{
  opacity: .25 !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .custom-switch .slider{
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.05) !important;
  border-radius: 999px !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .custom-switch input:checked + .slider{
  background: rgba(38,185,140,.22) !important;
  border-color: rgba(70,210,165,.16) !important;
  box-shadow: none !important;
}

@media (max-width: 760px){
  html.rc-app-bg body .content-with-sidebar > .sidebar-wrapper{
    width: min(390px,100vw) !important;
    padding: 12px !important;
  }
}

/* Chat composer: clean Liquid Glass without the solid grey strip. */
html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container{
  padding: 0 12px 12px !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container .input-field-container{
  overflow: visible !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 20px !important;
  box-shadow: none !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container .input-field{
  display: flex !important;
  align-items: center !important;
  min-height: 40px !important;
  padding: 4px 11px 4px 6px !important;
  gap: 10px !important;
  overflow: hidden !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  border-radius: 16px !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: background-color .18s ease, border-color .18s ease !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container .input-field:is(.focused,:focus-within){
  background: transparent !important;
  border-color: rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.18) !important;
  box-shadow: none !important;
  filter: none !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container .input-field::before,
html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container .input-field::after{
  display: none !important;
  content: none !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container .input-field .avatar{
  width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px !important;
  object-fit: cover !important;
  background: transparent !important;
  border: 1px solid rgba(255,255,255,.06) !important;
  border-top-color: rgba(255,255,255,.09) !important;
  border-radius: 50% !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container .input-field .expanding-textarea{
  width: 100% !important;
  min-height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(255,255,255,.86) !important;
  caret-color: rgba(255,255,255,.9) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-footer-container .input-field .expanding-textarea::placeholder{
  color: rgba(255,255,255,.30) !important;
  opacity: 1 !important;
}

/* Active check chat composer: separate component, keep the glass fully clear. */
html.rc-app-bg body .check-footer .input-container,
html.rc-app-bg body .check-footer .input-box{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

html.rc-app-bg body .check-footer .input-box{
  min-height: 40px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-top-color: rgba(255,255,255,.14) !important;
  border-radius: 16px !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .check-footer .input-box:focus-within{
  border-color: rgba(255,255,255,.14) !important;
  border-top-color: rgba(255,255,255,.20) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body .check-footer .input-box > input[placeholder="Введите сообщение"]{
  height: 38px !important;
  color: rgba(241,244,248,.88) !important;
  caret-color: rgba(255,255,255,.92) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .check-footer .input-box > input[placeholder="Введите сообщение"]::placeholder{
  color: rgba(214,219,227,.38) !important;
  opacity: 1 !important;
}

/* Active-check player sidebar only: fit the complete profile without scrolling or clipping. */
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper{
  width: 360px !important;
  min-width: 360px !important;
  max-width: 360px !important;
  overflow: hidden !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper > .h-full{
  width: 100% !important;
  min-width: 0 !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .overflow-y-auto.grow{
  min-height: 0 !important;
  overflow: hidden !important;
}

/* Active check: stretch only the right menu surface to the available bottom edge. */
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .overflow-y-auto.grow > .player-modal{
  min-height: 100% !important;
}


html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .modal-menu-extended,
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .modal-menu-extended > .content,
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .content-inner,
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .modal-menu-page-layout,
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .modal-menu-page-layout-content,
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general{
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .content-inner{
  padding: 12px 0 !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .modal-menu-page-layout-content{
  padding-left: 0 !important;
  padding-right: 0 !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general{
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .tags{
  min-height: 30px !important;
  margin: 0 !important;
  gap: 7px !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card{
  width: 100% !important;
  margin: 0 !important;
  border-radius: 15px !important;
  background-color: rgba(8,7,6,.08) !important;
  background-image: linear-gradient(135deg, rgba(255,248,238,.025), transparent 46%) !important;
  border: 1px solid rgba(255,248,238,.052) !important;
  border-top-color: rgba(255,248,238,.075) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(22px) saturate(76%) !important;
  backdrop-filter: blur(22px) saturate(76%) !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card :is(.cells,.cell,.list-item),
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card > :is(.flex,.header,.title){
  background: rgba(255,255,255,.008) !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card .list-item :is(.title,.subtitle){
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card > :is(.flex,.header,.title){
  min-height: 28px !important;
  height: 28px !important;
  padding: 4px 9px !important;
  font-size: 13px !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card > .cells{
  height: auto !important;
  min-height: 0 !important;
  overflow: visible !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card:nth-child(2) > .cells,
html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card:nth-child(3) > .cells{
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card:nth-child(n+4) > .cells{
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card .cell{
  min-width: 0 !important;
  min-height: 44px !important;
  height: 44px !important;
  padding: 5px 8px !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card .list-item{
  min-width: 0 !important;
  min-height: 34px !important;
  height: 34px !important;
  padding: 0 !important;
}

html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card .list-item :is(.title,.subtitle){
  width: 100% !important;
  min-width: 0 !important;
  font-size: 12px !important;
  line-height: 16px !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

@media (max-width: 1050px){
  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper{
    width: 340px !important;
    min-width: 340px !important;
    max-width: 340px !important;
  }
}

/* On tall screens enlarge the cards themselves, not the sidebar. */
@media (min-height: 850px){
  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .content-inner {
    padding: 12px 0 !important;
  }

  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general {
    gap: 7px !important;
  }

  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .tags {
    min-height: 32px !important;
    gap: 7px !important;
  }

  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .tags .player-tag {
    min-height: 27px !important;
    padding: 5px 8px !important;
    font-size: 12px !important;
  }

  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card {
    border-radius: 13px !important;
  }

  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card > :is(.flex,.header,.title) {
    min-height: 30px !important;
    height: 30px !important;
    padding: 5px 9px !important;
    font-size: 14px !important;
  }

  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card .cell {
    min-height: 46px !important;
    height: 46px !important;
    padding: 5px 8px !important;
  }

  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card .list-item {
    min-height: 36px !important;
    height: 36px !important;
  }

  html.rc-app-bg body:has(.check-footer) .content-with-sidebar > .sidebar-wrapper .general > .table-card .list-item :is(.title,.subtitle) {
    font-size: 12px !important;
    line-height: 16px !important;
  }
}

/* Active check controls: colourless Liquid Glass, including the primary action. */
html.rc-app-bg body:has(.check-footer) .check-header button.ra-button{
  color: rgba(255,252,248,.88) !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.07) !important;
  border-radius: 11px !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(20px) saturate(100%) !important;
  backdrop-filter: blur(20px) saturate(100%) !important;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease, transform .18s ease !important;
}

html.rc-app-bg body:has(.check-footer) .check-header button.ra-button.preset.primary{
  color: rgba(255,252,248,.88) !important;
  background: transparent !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.07) !important;
}

html.rc-app-bg body:has(.check-footer) .check-header button.ra-button:is(:hover,:focus-visible){
  color: #fff !important;
  background: transparent !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.09) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  box-shadow: none !important;
  filter: none !important;
}

html.rc-app-bg body:has(.check-footer) .check-header button.ra-button:active{
  transform: translateY(1px) !important;
  background: transparent !important;
}

/* Chat toolbar icons: match the quiet glass title icon, never a white outline. */
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger),
html.rc-app-bg body:has(.sidebar-content) .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger){
  width: 34px !important;
  height: 34px !important;
  min-width: 34px !important;
  min-height: 34px !important;
  padding: 7px !important;
  color: rgba(255,255,255,.78) !important;
  fill: currentColor !important;
  background: rgba(255,255,255,.035) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 11px !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(18px) saturate(112%) !important;
  backdrop-filter: blur(18px) saturate(112%) !important;
  transition: color .18s ease, background-color .18s ease, border-color .18s ease !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger):is(:hover,:focus,:focus-visible,:active),
html.rc-app-bg body:has(.sidebar-content) .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger):is(:hover,:focus,:focus-visible,:active){
  color: rgba(255,255,255,.94) !important;
  fill: currentColor !important;
  background: rgba(255,255,255,.065) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.065) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter: none !important;
}

html.rc-app-bg body .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger) .wrapper,
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger) svg,
html.rc-app-bg body .player-message-chat-root .player-message-page-header-container button.ra-button.preset.default[class~="!p-1.5"]:not(.rc-filter-trigger) svg *{
  width: 18px !important;
  height: 18px !important;
  color: inherit !important;
  fill: currentColor !important;
  opacity: 1 !important;
  filter: none !important;
}

/* Date picker: colourless Liquid Glass, no grey slab or blue selected tile. */
html.rc-app-bg body .p-datepicker[role="dialog"]{
  padding: 10px !important;
  color: rgba(255,255,255,.78) !important;
  background: rgba(8,8,10,.24) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 18px !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(30px) saturate(108%) !important;
  backdrop-filter: blur(30px) saturate(108%) !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] :is(.p-datepicker-group-container,.p-datepicker-group,.p-datepicker-calendar-container,.p-datepicker-calendar,thead,tbody,tr,th,td){
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] .p-datepicker-header{
  margin-bottom: 7px !important;
  padding: 3px !important;
  background: rgba(255,255,255,.015) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.035) !important;
  border-top-color: rgba(255,255,255,.06) !important;
  border-radius: 12px !important;
  box-shadow: none !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] :is(.p-datepicker-prev,.p-datepicker-next,.p-datepicker-month,.p-datepicker-year){
  color: rgba(255,255,255,.76) !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 9px !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] :is(.p-datepicker-prev,.p-datepicker-next):hover{
  color: rgba(255,255,255,.96) !important;
  background: rgba(255,255,255,.045) !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] td{
  padding: 2px !important;
  border-radius: 9px !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] td > span{
  color: rgba(255,255,255,.62) !important;
  background: transparent !important;
  background-image: none !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  box-shadow: none !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] td > span:not(.p-disabled):hover{
  color: rgba(255,255,255,.92) !important;
  background: rgba(255,255,255,.04) !important;
  border-color: rgba(255,255,255,.045) !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] td > span[aria-selected="true"]{
  color: rgba(255,255,255,.96) !important;
  background: rgba(255,255,255,.075) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] td > span.p-disabled,
html.rc-app-bg body .p-datepicker[role="dialog"] .p-datepicker-other-month > span{
  color: rgba(255,255,255,.20) !important;
  background: transparent !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] .p-timepicker{
  margin-top: 8px !important;
  padding-top: 8px !important;
  background: transparent !important;
  background-image: none !important;
  border-top: 1px solid rgba(255,255,255,.035) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .p-datepicker[role="dialog"] .p-timepicker button{
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.035) !important;
  border-radius: 8px !important;
  outline: 0 !important;
  box-shadow: none !important;
}

/* Sidebars: fully colourless glass — no grey column, cards or notice fills. */
html.rc-app-bg body .content-with-sidebar > .sidebar-wrapper{
  background: rgba(0,0,0,.08) !important;
  background-image: none !important;
  border-left-color: rgba(255,255,255,.025) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(30px) saturate(106%) !important;
  backdrop-filter: blur(30px) saturate(106%) !important;
}

html.rc-app-bg body .content-with-sidebar > .sidebar-wrapper > .sidebar-content{
  background: rgba(255,255,255,.01) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.035) !important;
  border-top-color: rgba(255,255,255,.065) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content :is(.page-tip,.tip,.notice,[class*="notice"],[class*="tip"]){
  color: rgba(255,255,255,.68) !important;
  background: rgba(255,255,255,.015) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.035) !important;
  border-top-color: rgba(255,255,255,.06) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(18px) saturate(108%) !important;
  backdrop-filter: blur(18px) saturate(108%) !important;
}

html.rc-app-bg body .content-with-sidebar .sidebar-content .select.settings > .activator{
  background: rgba(255,255,255,.012) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.03) !important;
  border-top-color: rgba(255,255,255,.055) !important;
  box-shadow: none !important;
}

/* Alerts page: repair the nested `.row` collision and present each alert as glass. */
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer{
  padding: 8px 14px 18px !important;
  background: transparent !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover{
  width: 100% !important;
  min-height: 78px !important;
  height: auto !important;
  margin: 0 0 8px !important;
  padding: 0 !important;
  overflow: hidden !important;
  align-items: stretch !important;
  background: rgba(255,255,255,.018) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.025), transparent 58%) !important;
  border: 1px solid rgba(255,255,255,.042) !important;
  border-top-color: rgba(255,255,255,.078) !important;
  border-radius: 16px !important;
  box-shadow: 0 10px 30px rgba(0,0,0,.09) !important;
  -webkit-backdrop-filter: blur(24px) saturate(120%) !important;
  backdrop-filter: blur(24px) saturate(120%) !important;
  transition: background-color .18s ease, border-color .18s ease, transform .18s ease !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover:hover{
  transform: translateY(-1px) !important;
  background: rgba(255,255,255,.028) !important;
  border-color: rgba(255,255,255,.065) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover > .element{
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  height: auto !important;
  flex: 1 1 auto !important;
  padding: 0 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover > .element > .flex{
  width: 100% !important;
  height: 100% !important;
  min-height: 76px !important;
  padding: 12px 14px !important;
  gap: 0 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  display: grid !important;
  grid-template-columns: 44px minmax(0,1fr) !important;
  align-items: center !important;
  gap: 13px !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  flex: 1 1 0 !important;
  flex-basis: 0 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .icon{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.085) !important;
  border-radius: 13px !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .icon img{
  width: 30px !important;
  height: 30px !important;
  object-fit: cover !important;
  border-radius: 9px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full > .w-full{
  width: 100% !important;
  min-width: 0 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover p.row{
  position: static !important;
  display: flex !important;
  flex-flow: row wrap !important;
  align-items: baseline !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  gap: 0 4px !important;
  overflow: visible !important;
  white-space: normal !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: rgba(255,255,255,.76) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover p.row > span{
  display: inline !important;
  width: auto !important;
  height: auto !important;
  line-height: 1.35 !important;
  white-space: normal !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .date{
  display: block !important;
  width: auto !important;
  height: auto !important;
  margin-top: 4px !important;
  color: rgba(255,255,255,.36) !important;
  font-size: 12px !important;
  line-height: 1.3 !important;
  white-space: nowrap !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .rc-filter-trigger{
  width: 40px !important;
  height: 40px !important;
  padding: 0 !important;
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.085) !important;
  border-radius: 13px !important;
  color: rgba(255,255,255,.62) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(22px) saturate(118%) !important;
  backdrop-filter: blur(22px) saturate(118%) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Alerts final visual: one compact glass surface, never a card inside a card. */
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer{
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  padding: 10px 14px 18px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover{
  min-height: 66px !important;
  margin: 0 !important;
  background: rgba(12,12,14,.76) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.026), transparent 48%) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.085) !important;
  border-radius: 15px !important;
  box-shadow: 0 10px 28px rgba(0,0,0,.14) !important;
  -webkit-backdrop-filter: blur(24px) saturate(112%) !important;
  backdrop-filter: blur(24px) saturate(112%) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover:hover{
  transform: translateY(-1px) !important;
  background: rgba(18,18,21,.80) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.032), transparent 48%) !important;
  border-color: rgba(255,255,255,.07) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover > .element > .flex{
  min-height: 64px !important;
  padding: 10px 12px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  grid-template-columns: 40px minmax(0,1fr) !important;
  gap: 12px !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full::before,
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full::after,
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .w-full::before,
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .w-full::after{
  display: none !important;
  content: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .icon{
  width: 40px !important;
  height: 40px !important;
  background: rgba(255,255,255,.028) !important;
  border: 1px solid rgba(255,255,255,.045) !important;
  border-top-color: rgba(255,255,255,.08) !important;
  border-radius: 12px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .icon img{
  width: 27px !important;
  height: 27px !important;
  border-radius: 8px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .w-full{
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover p.row{
  color: rgba(255,255,255,.78) !important;
  font-size: 14px !important;
  font-weight: 450 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover p.row .bright{
  color: rgba(255,255,255,.94) !important;
  font-weight: 650 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content .content-layer > .row.relative.defaultHover .date{
  margin-top: 3px !important;
  color: rgba(255,255,255,.34) !important;
  font-size: 11px !important;
}

/* Specificity guard: ban action styling must never paint the alert content row. */
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Alerts premium Liquid Glass: airy two-column cards instead of black strips. */
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer{
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0,1fr)) !important;
  align-content: start !important;
  gap: 12px !important;
  padding: 14px 16px 24px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover{
  position: relative !important;
  width: 100% !important;
  min-width: 0 !important;
  min-height: 88px !important;
  margin: 0 !important;
  overflow: hidden !important;
  background: rgba(255,255,255,.025) !important;
  background-image:
    radial-gradient(circle at 2% 0%, rgba(255,255,255,.105), transparent 42%),
    linear-gradient(145deg, rgba(255,255,255,.035), rgba(255,255,255,.008)) !important;
  border: 1px solid rgba(255,255,255,.065) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  border-radius: 19px !important;
  outline: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 14px 36px rgba(0,0,0,.12) !important;
  -webkit-backdrop-filter: blur(30px) saturate(132%) !important;
  backdrop-filter: blur(30px) saturate(132%) !important;
  transition: transform .2s ease, border-color .2s ease, background-color .2s ease, box-shadow .2s ease !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover:hover{
  transform: translateY(-2px) !important;
  background-color: rgba(255,255,255,.043) !important;
  border-color: rgba(255,255,255,.105) !important;
  border-top-color: rgba(255,255,255,.17) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055), 0 18px 44px rgba(0,0,0,.16) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover > .element > .flex{
  min-height: 86px !important;
  padding: 14px 15px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  display: grid !important;
  grid-template-columns: 48px minmax(0,1fr) !important;
  gap: 14px !important;
  width: 100% !important;
  min-width: 0 !important;
  height: auto !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon{
  position: relative !important;
  width: 48px !important;
  height: 48px !important;
  background: rgba(255,255,255,.045) !important;
  background-image: radial-gradient(circle at 30% 18%, rgba(255,255,255,.14), transparent 54%) !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.15) !important;
  border-radius: 15px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.065), 0 9px 22px rgba(0,0,0,.14) !important;
  -webkit-backdrop-filter: blur(18px) saturate(125%) !important;
  backdrop-filter: blur(18px) saturate(125%) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon img{
  width: 31px !important;
  height: 31px !important;
  border-radius: 9px !important;
  filter: brightness(1.08) contrast(.96) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover p.row{
  gap: 2px 5px !important;
  color: rgba(255,255,255,.67) !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover p.row .bright{
  color: rgba(255,255,255,.96) !important;
  font-weight: 680 !important;
  letter-spacing: -.01em !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .date{
  width: fit-content !important;
  margin-top: 7px !important;
  padding: 3px 7px !important;
  color: rgba(255,255,255,.42) !important;
  font-size: 10px !important;
  font-weight: 550 !important;
  letter-spacing: .015em !important;
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(255,255,255,.035) !important;
  border-radius: 7px !important;
}

@media (max-width: 980px){
  html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer{
    grid-template-columns: minmax(0,1fr) !important;
  }
}

/* Alerts compact list: one full-width row per notification. */
html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer{
  grid-template-columns: minmax(0,1fr) !important;
  gap: 7px !important;
  padding: 10px 14px 20px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover{
  min-height: 62px !important;
  border-radius: 15px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover > .element > .flex{
  min-height: 60px !important;
  padding: 9px 12px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  grid-template-columns: 38px minmax(0,1fr) !important;
  gap: 11px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon{
  width: 38px !important;
  height: 38px !important;
  border-radius: 11px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon img{
  width: 25px !important;
  height: 25px !important;
  border-radius: 7px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover p.row{
  font-size: 13px !important;
  line-height: 1.3 !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/alerts"][aria-current="page"]) #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .date{
  margin-top: 3px !important;
  padding: 2px 6px !important;
  font-size: 9px !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content .content-layer .row > .element:last-child > .flex > div{
  width: 38px !important;
  height: 38px !important;
  align-items: center !important;
  background: rgba(4,135,105,.12) !important;
  background-image: none !important;
  border: 1px solid rgba(35,210,165,.07) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(125%) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content .content-layer .row > .element:last-child .ra-button{
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.58) !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(118%) !important;
  backdrop-filter: blur(16px) saturate(118%) !important;
}

html.rc-app-bg body:has(a[href="/crystalrust/mutes"][aria-current="page"]) #page-content .content-layer .row > .element:last-child .ra-button:hover{
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.065) !important;
  color: rgba(255,255,255,.9) !important;
}

/* One shared surface for Ban and Mute reason chips. */
html.rc-app-bg body:has(#page-content .rc-filter-trigger) #page-content .content-layer .row > .element:nth-last-child(2) .container[title],
html.rc-app-bg body:has(a[href$="/mutes"][aria-current="page"]) #page-content .container[title][data-v-73c432de]{
  width: fit-content !important;
  min-height: 30px !important;
  padding: 5px 9px !important;
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 9px !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(118%) !important;
  backdrop-filter: blur(16px) saturate(118%) !important;
}

html.maintenance-active,
html.maintenance-active body{ min-height: 100%; overflow: hidden !important; background: #050505 !important; }
html.maintenance-active body > *:not(.maintenance-screen){ display: none !important; visibility: hidden !important; pointer-events: none !important; }
.maintenance-screen{ position: fixed; inset: 0; z-index: 2147483647; display: grid; place-items: center; overflow: hidden; color: #fff; background: radial-gradient(circle at 50% 45%, #1a1a1a 0, #090909 42%, #030303 100%); isolation: isolate; }
.maintenance-noise{ position: absolute; inset: 0; opacity: .12; background-image: url('/assets/noise-texture-Ddbds8zI.png'); mix-blend-mode: soft-light; pointer-events: none; }
.maintenance-orb{ position: absolute; width: 58vw; aspect-ratio: 1; border-radius: 50%; filter: blur(90px); opacity: .24; animation: maintenance-drift 14s ease-in-out infinite alternate; }
.maintenance-orb.one{ left: -20vw; top: -30vw; background: rgba(255,255,255,.22); }
.maintenance-orb.two{ right: -24vw; bottom: -34vw; background: rgba(255,255,255,.12); animation-delay: -6s; }
.maintenance-glass{ position: relative; width: min(680px, calc(100vw - 36px)); padding: clamp(36px, 7vw, 72px); text-align: center; border: 1px solid rgba(255,255,255,.13); border-top-color: rgba(255,255,255,.24); border-radius: 30px; background: rgba(255,255,255,.035); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 34px 100px rgba(0,0,0,.48); backdrop-filter: blur(34px) saturate(105%); -webkit-backdrop-filter: blur(34px) saturate(105%); }
.maintenance-mark{ display: grid; place-items: center; width: 64px; height: 64px; padding: 5px; margin: 0 auto 22px; overflow: hidden; border: 1px solid rgba(255,255,255,.16); border-top-color: rgba(255,255,255,.27); border-radius: 20px; background: rgba(255,255,255,.035); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
.maintenance-mark img{ display: block; width: 100%; height: 100%; border-radius: 15px; object-fit: cover; filter: saturate(.18) contrast(1.04) brightness(1.04); }
.maintenance-glass p{ margin: 0 0 18px; color: rgba(255,255,255,.46); font-size: 11px; font-weight: 700; letter-spacing: .32em; }
.maintenance-glass h1{ max-width: 530px; margin: 0 auto; font-size: clamp(30px, 5vw, 56px); line-height: 1.04; letter-spacing: -.035em; }
.maintenance-glass > span:last-child{ color: rgba(255,255,255,.58); font-size: 15px; }
.maintenance-line{ width: 170px; height: 2px; margin: 30px auto 22px; overflow: hidden; border-radius: 9px; background: rgba(255,255,255,.08); }
.maintenance-line i{ display: block; width: 45%; height: 100%; background: #fff; animation: maintenance-load 1.9s ease-in-out infinite; }
@keyframes maintenance-load { 0% { transform: translateX(-120%); opacity: .2; } 50% { opacity: .9; } 100% { transform: translateX(340%); opacity: .2; } }
@keyframes maintenance-drift { to { transform: translate3d(8vw, 6vw, 0) scale(1.12); } }
@media (prefers-reduced-motion: reduce){ .maintenance-orb,.maintenance-line i{ animation: none; } }

/* Keep the maintenance UI independent from the landing-page reveal engine. */
html.maintenance-active .maintenance-screen,
html.maintenance-active .maintenance-glass,
html.maintenance-active .maintenance-glass p,
html.maintenance-active .maintenance-glass h1,
html.maintenance-active .maintenance-glass > span,
html.maintenance-active .maintenance-mark,
html.maintenance-active .maintenance-line{
  opacity: 1 !important;
  visibility: visible !important;
}
html.maintenance-active .maintenance-glass{
  display: block !important;
  transform: none !important;
}
html.maintenance-active .maintenance-glass p{
  display: block !important;
  color: rgba(255,255,255,.48) !important;
  -webkit-text-fill-color: rgba(255,255,255,.48) !important;
  transform: none !important;
}
html.maintenance-active .maintenance-glass h1{
  display: block !important;
  color: #fff !important;
  -webkit-text-fill-color: #fff !important;
  transform: none !important;
  clip-path: none !important;
}
html.maintenance-active .maintenance-glass > span:last-child{
  display: block !important;
  color: rgba(255,255,255,.62) !important;
  -webkit-text-fill-color: rgba(255,255,255,.62) !important;
  transform: none !important;
}
html.maintenance-active .maintenance-mark img{
  width: 190% !important;
  height: 190% !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  opacity: 1 !important;
  visibility: visible !important;
  object-fit: cover !important;
}

/* Checks table: transparent clear glass, with its native scroll restored. */
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .table-base{
  background: rgba(255,255,255,.004) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.10) !important;
  border-radius: 16px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  min-height: 0 !important;
  scrollbar-width: auto !important;
  scrollbar-color: auto !important;
}
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .table-base > .header{
  background: rgba(36,36,36,.5) !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .table-base > .content-layer,
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .table-base > .content-layer > .row{
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}
html.rc-app-bg body[data-checkapp-page$="/checks"] #page-content .table-base > .content-layer > .row{
  border-bottom: 1px solid rgba(255,255,255,.045) !important;
  content-visibility: auto !important;
  contain-intrinsic-size: auto 70px !important;
}
/* Pending check: compact three-dot loader instead of the circular spinner. */
.verdict.Pending > .loader{
  width: 22px !important;
  height: 10px !important;
  min-width: 22px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 3px !important;
  position: relative !important;
  animation: none !important;
  transform: translateY(2px) !important;
}
.verdict.Pending > .loader > .line{
  display: none !important;
  position: static !important;
  inset: auto !important;
  width: 4px !important;
  height: 4px !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #3b82f6 !important;
  opacity: .18;
  transform: none !important;
}
.verdict.Pending > .loader > .line:nth-child(-n+3){
  display: block !important;
}
.verdict.Pending > .loader > .line:nth-child(1){
  opacity: 1 !important;
  animation: none !important;
}
.verdict.Pending > .loader > .line:nth-child(2){
  animation: rc-check-dot-two 1.2s steps(1, end) infinite !important;
}
.verdict.Pending > .loader > .line:nth-child(3){
  animation: rc-check-dot-three 1.2s steps(1, end) infinite !important;
}
@keyframes rc-check-dot-two {
  0%, 32% { opacity: .18; }
  33%, 100% { opacity: 1; }
}
@keyframes rc-check-dot-three {
  0%, 65% { opacity: .18; }
  66%, 100% { opacity: 1; }
}

/* Project switcher and nav toggle: colourless clear glass, no grey fill. */
html.rc-app-bg .navigation-wrapper .navigation .top .select.project-selector > .activator,
html.rc-app-bg .navigation-wrapper .navigation .top > .navigation-state-btn{
  background: rgba(255,255,255,.006) !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.095) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(18px) saturate(100%) !important;
  backdrop-filter: blur(18px) saturate(100%) !important;
}
html.rc-app-bg .navigation-wrapper .navigation .top .select.project-selector > .activator:hover,
html.rc-app-bg .navigation-wrapper .navigation .top > .navigation-state-btn:hover{
  background: rgba(255,255,255,.018) !important;
  border-color: rgba(255,255,255,.085) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .navigation-wrapper .navigation .top .navigation-state-btn{
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.095) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .navigation-wrapper .navigation .top .select.project-selector > .activator{
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.095) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

/* Bottom navigation controls match the colourless top glass buttons. */
html.rc-app-bg body #app .navigation-wrapper .navigation .footer :is(button,a,[role="button"]){
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.055) !important;
  border-top-color: rgba(255,255,255,.095) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}
html.rc-app-bg body #app .navigation-wrapper .navigation .footer :is(button,a,[role="button"]):hover{
  background: rgba(255,255,255,.018) !important;
  border-color: rgba(255,255,255,.085) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  box-shadow: none !important;
}

/* Billing loading card: remove the pale strip shown below the tabs. */
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card,
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card:hover{
  background-image: none !important;
  filter: none !important;
}
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card::before,
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card::after{
  content: none !important;
  display: none !important;
}
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card > .bg-grey-850{
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card .skeleton,
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card [class*="bg-grey-750"]{
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  animation: none !important;
}

/* Skeleton cards have an extra wrapper, so target the card itself as well. */
html.rc-app-bg.rc-billing-page .payments-tab-general .cards .card,
html.rc-app-bg.rc-billing-page .payments-tab-general .cards .card:hover{
  background: rgba(20,20,20,.35) !important;
  background-image: none !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  filter: none !important;
}
html.rc-app-bg.rc-billing-page .payments-tab-general .cards .card::before,
html.rc-app-bg.rc-billing-page .payments-tab-general .cards .card::after{
  content: none !important;
  display: none !important;
}
html.rc-app-bg.rc-billing-page .payments-tab-general .cards .card > .bg-grey-850{
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html.rc-app-bg.rc-billing-page .payments-tab-general .cards .card .skeleton,
html.rc-app-bg.rc-billing-page .payments-tab-general .cards .card [class*="bg-grey-750"]{
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  animation: none !important;
}

/* Navigation tabs: clear monochrome Liquid Glass with a precise active rim. */
html.rc-app-bg .navigation .item-row{
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  transition: color .18s ease, border-color .18s ease, background-color .18s ease, transform .18s ease !important;
}

html.rc-app-bg .navigation .item-row:not(.router-link-active):not(.active):hover{
  color: rgba(255,255,255,.92) !important;
  border-color: rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  background: rgba(255,255,255,.025) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
  -webkit-backdrop-filter: blur(16px) saturate(125%) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
}

html.rc-app-bg .navigation .item-row.router-link-active,
html.rc-app-bg .navigation a.router-link-active .item-row,
html.rc-app-bg .navigation .item-row.active{
  color: rgba(255,255,255,.98) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.24) !important;
  border-left-color: rgba(255,255,255,.17) !important;
  border-right-color: rgba(255,255,255,.10) !important;
  border-bottom-color: rgba(255,255,255,.065) !important;
  background:
    radial-gradient(90% 75% at 24% 0%, rgba(255,255,255,.105), transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.060), rgba(255,255,255,.018)) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 -1px 0 rgba(0,0,0,.16),
    0 8px 24px rgba(0,0,0,.18) !important;
  -webkit-backdrop-filter: blur(22px) saturate(145%) !important;
  backdrop-filter: blur(22px) saturate(145%) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg .navigation .item-row.router-link-active::after,
html.rc-app-bg .navigation a.router-link-active .item-row::after,
html.rc-app-bg .navigation .item-row.active::after{
  content: "" !important;
  position: absolute !important;
  z-index: -1 !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background: linear-gradient(115deg, rgba(255,255,255,.045), transparent 38%, rgba(255,255,255,.018) 70%, transparent) !important;
  box-shadow: none !important;
}

/* Active navigation v2: colourless glass, no grey fill. */
html.rc-app-bg .navigation .item-row.router-link-active,
html.rc-app-bg .navigation a.router-link-active .item-row,
html.rc-app-bg .navigation .item-row.active{
  border-color: rgba(255,255,255,.085) !important;
  border-top-color: rgba(255,255,255,.17) !important;
  border-left-color: rgba(255,255,255,.12) !important;
  border-right-color: rgba(255,255,255,.065) !important;
  border-bottom-color: rgba(255,255,255,.04) !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 7px 20px rgba(0,0,0,.15) !important;
  -webkit-backdrop-filter: blur(20px) saturate(112%) !important;
  backdrop-filter: blur(20px) saturate(112%) !important;
}

html.rc-app-bg .navigation .item-row.router-link-active::after,
html.rc-app-bg .navigation a.router-link-active .item-row::after,
html.rc-app-bg .navigation .item-row.active::after{
  background: transparent !important;
  background-image: none !important;
}

/* Active navigation v3: optically clear glass, without a dark inner plate. */
html.rc-app-bg .navigation .item-row.router-link-active,
html.rc-app-bg .navigation a.router-link-active .item-row,
html.rc-app-bg .navigation .item-row.active,
html.rc-app-bg .navigation .item-row.router-link-active:hover,
html.rc-app-bg .navigation a.router-link-active .item-row:hover,
html.rc-app-bg .navigation .item-row.active:hover{
  border: 1px solid transparent !important;
  background:
    linear-gradient(rgba(255,255,255,.012), rgba(255,255,255,.012)) padding-box,
    linear-gradient(150deg, rgba(255,255,255,.20), rgba(255,255,255,.055) 44%, rgba(255,255,255,.11)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  filter: none !important;
}

/* Dialogs v243: optically clear, colourless Liquid Glass.
   Warning artwork is deliberately not targeted, so the yellow icon remains intact. */
html.rc-app-bg #app > .base .modal-border:not(.transparent){
  border: 1px solid transparent !important;
  border-radius: 17px !important;
  background:
    linear-gradient(rgba(255,255,255,.012), rgba(255,255,255,.006)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.24), rgba(255,255,255,.055) 48%, rgba(255,255,255,.13)) border-box !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    0 26px 80px rgba(0,0,0,.42) !important;
  -webkit-backdrop-filter: blur(30px) saturate(112%) !important;
  backdrop-filter: blur(30px) saturate(112%) !important;
  overflow: visible !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) > .modal,
html.rc-app-bg #app > .base .modal-border:not(.transparent) > .modal > .divided-card,
html.rc-app-bg #app > .base .modal-border:not(.transparent) > .modal > .divided-card > :is(.header,.content,.footer){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.065) !important;
  box-shadow: none !important;
  filter: none !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) > .modal{
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 16px !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) .divided-card > .header.apply-border,
html.rc-app-bg #app > .base .modal-border:not(.transparent) .divided-card > .footer{
  border-color: rgba(255,255,255,.065) !important;
}

/* Inputs, selects, option rows and action cards inside the dialogs. */
html.rc-app-bg #app > .base .modal-border:not(.transparent) :is(
  input:not([type="checkbox"]):not([type="radio"]),
  textarea,
  .select > .activator,
  .select .options-list,
  .items-row > .item,
  .uploader,
  .upload,
  [class*="upload"]:not(svg):not(path),
  [class*="dropzone"],
  [class*="attachment"]
){
  background: rgba(255,255,255,.012) !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-top-color: rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  -webkit-backdrop-filter: blur(18px) saturate(108%) !important;
  backdrop-filter: blur(18px) saturate(108%) !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) .select .options-list{
  padding: 4px !important;
  border-radius: 10px !important;
  background: rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: blur(30px) saturate(108%) !important;
  backdrop-filter: blur(30px) saturate(108%) !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) .select .options-list .option{
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) .select .options-list .option:is(:hover,.-selected){
  border-color: rgba(255,255,255,.09) !important;
  background: rgba(255,255,255,.035) !important;
}

/* Every modal action is the same neutral glass: no blue, red or grey plate. */
html.rc-app-bg #app > .base .modal-border:not(.transparent) :is(
  button,
  .ra-button,
  [role="button"]
):not(.option){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  color: rgba(255,255,255,.82) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  -webkit-backdrop-filter: blur(16px) saturate(108%) !important;
  backdrop-filter: blur(16px) saturate(108%) !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) :is(
  button,
  .ra-button,
  [role="button"]
):not(.option):hover{
  background: rgba(255,255,255,.035) !important;
  border-color: rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.19) !important;
  color: rgba(255,255,255,.98) !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) :is(
  button,
  .ra-button,
  [role="button"]
):disabled{
  background: transparent !important;
  border-color: rgba(255,255,255,.035) !important;
  color: rgba(255,255,255,.28) !important;
  opacity: 1 !important;
}

/* Neutral switches and check rows used by ban/check completion dialogs. */
html.rc-app-bg #app > .base .modal-border:not(.transparent) :is(
  .switch,
  [class*="switch"],
  [class*="checkbox"],
  [class*="radio"]
):not(.switch-text){
  --tw-bg-opacity: 0 !important;
  --tw-ring-color: rgba(255,255,255,.12) !important;
  border-color: rgba(255,255,255,.10) !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) :is(
  input[type="checkbox"],
  input[type="radio"]
){
  accent-color: rgba(255,255,255,.88) !important;
}

/* Dialogs v244: the check/ban wizard is teleported outside #app > .base.
   Keep every plate genuinely clear and let only blur, rim and reflections define it. */
html.rc-app-bg body .modal-border:not(.transparent){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1px solid transparent !important;
  border-radius: 17px !important;
  box-shadow: none !important;
  filter: none !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal{
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 16px !important;
  background:
    linear-gradient(rgba(255,255,255,.006), rgba(255,255,255,.003)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.22), rgba(255,255,255,.045) 46%, rgba(255,255,255,.12)) border-box !important;
  background-color: transparent !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 24px 70px rgba(0,0,0,.34) !important;
  -webkit-backdrop-filter: blur(30px) saturate(100%) !important;
  backdrop-filter: blur(30px) saturate(100%) !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal :is(
  .divided-card,
  .divided-card > .header,
  .divided-card > .content,
  .divided-card > .footer
){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal .divided-card > :is(.header.apply-border,.footer){
  border-color: rgba(255,255,255,.055) !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal :is(
  .reason-item,
  .items-row > .item,
  .ra-card,
  .admin-switch,
  input:not([type="checkbox"]):not([type="radio"]),
  textarea,
  .select > .activator,
  .uploader,
  [class*="attachment"],
  [class*="dropzone"]
){
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.07) !important;
  border-top-color: rgba(255,255,255,.115) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
  -webkit-backdrop-filter: blur(13px) saturate(100%) !important;
  backdrop-filter: blur(13px) saturate(100%) !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal :is(.reason-item,.items-row > .item):hover{
  background: rgba(255,255,255,.018) !important;
  border-color: rgba(255,255,255,.11) !important;
  border-top-color: rgba(255,255,255,.16) !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal :is(
  button,
  .ra-button,
  [role="button"]
):not(.option){
  --tw-bg-opacity: 0 !important;
  --tw-border-opacity: 1 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  color: rgba(255,255,255,.82) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
  filter: none !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal :is(
  button,
  .ra-button,
  [role="button"]
):not(.option):hover{
  background: rgba(255,255,255,.025) !important;
  border-color: rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.18) !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal :is(
  button,
  .ra-button,
  [role="button"]
):disabled{
  background: transparent !important;
  border-color: rgba(255,255,255,.035) !important;
  color: rgba(255,255,255,.25) !important;
  opacity: 1 !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal .checkbox-container .checkbox-mark{
  --tw-bg-opacity: 0 !important;
  --tw-border-opacity: 1 !important;
  background: transparent !important;
  background-color: transparent !important;
  border-color: rgba(255,255,255,.15) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal .checkbox-container:hover .checkbox-mark,
html.rc-app-bg body .modal-border:not(.transparent) > .modal .checkbox-container input:checked + .checkbox-mark{
  background: rgba(255,255,255,.10) !important;
  background-color: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.48) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.16) !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal .custom-switch .slider,
html.rc-app-bg body .modal-border:not(.transparent) > .modal .custom-switch .peer:checked + .peer{
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

html.rc-app-bg body .modal-border:not(.transparent) > .modal .custom-switch .peer::after,
html.rc-app-bg body .modal-border:not(.transparent) > .modal .custom-switch .peer:checked + .peer::after{
  background: rgba(255,255,255,.88) !important;
  background-color: rgba(255,255,255,.88) !important;
}

/* Dialog wizard v245: fields created on later steps and teleported menus. */
html.rc-app-bg body .modal-border .modal :is(
  .input-container,
  .input-box,
  .input-field,
  .input-field-container,
  .expanding-textarea,
  .select-wrapper,
  .select-wrapper .select,
  .select-wrapper .select .activator,
  .button-select-container,
  .button-select,
  .reasons-list,
  .reason-item,
  .server-list,
  .server,
  [class*="bg-grey-"]
){
  --tw-bg-opacity: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
  filter: none !important;
}

html.rc-app-bg body .modal-border .modal :is(
  .input-box,
  .input-field,
  .input-field-container,
  .expanding-textarea,
  .select-wrapper .select .activator,
  .button-select-container,
  .reason-item,
  .server-list,
  .server
){
  border: 1px solid rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  border-radius: 8px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
  -webkit-backdrop-filter: blur(14px) saturate(100%) !important;
  backdrop-filter: blur(14px) saturate(100%) !important;
}

html.rc-app-bg body .modal-border .modal :is(
  .input-box input,
  .input-box textarea,
  .input-field input,
  .input-field textarea,
  .expanding-textarea
){
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;
}

html.rc-app-bg body .modal-border .modal :is(
  .input-box,
  .input-field,
  .input-field-container,
  .select-wrapper .select .activator
):focus-within,
html.rc-app-bg body .modal-border .modal .select-wrapper .select .activator.-opened{
  background: rgba(255,255,255,.012) !important;
  border-color: rgba(255,255,255,.16) !important;
  border-top-color: rgba(255,255,255,.23) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* Dropdowns may be teleported outside the modal; style the component itself. */
html.rc-app-bg body .select-wrapper .select .options-list,
html.rc-app-bg body .select-wrapper .select.modal .options-list,
html.rc-app-bg body .popper:has(.options-list) .options-list{
  --tw-bg-opacity: 0 !important;
  padding: 5px !important;
  overflow: hidden auto !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  background:
    linear-gradient(rgba(255,255,255,.008), rgba(255,255,255,.004)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.20), rgba(255,255,255,.04) 48%, rgba(255,255,255,.11)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 18px 44px rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter: blur(30px) saturate(100%) !important;
  backdrop-filter: blur(30px) saturate(100%) !important;
}

html.rc-app-bg body .select-wrapper .select .options-list .option,
html.rc-app-bg body .select-wrapper .select.modal .options-list .option{
  --tw-bg-opacity: 0 !important;
  margin: 1px 0 !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html.rc-app-bg body .select-wrapper .select .options-list .option:is(:hover,.-selected),
html.rc-app-bg body .select-wrapper .select.modal .options-list .option:is(:hover,.-selected){
  background: rgba(255,255,255,.025) !important;
  border-color: rgba(255,255,255,.095) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}

/* Refined verdict ticks: clear rim, crisp white check, no blue fill. */
html.rc-app-bg body .modal-border .modal .reason-item .checkbox-container{
  min-height: 18px !important;
  align-items: center !important;
}

html.rc-app-bg body .modal-border .modal .reason-item .checkbox-container .checkbox-mark{
  top: 50% !important;
  width: 15px !important;
  height: 15px !important;
  margin-top: -7.5px !important;
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 5px !important;
  background:
    linear-gradient(transparent, transparent) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.28), rgba(255,255,255,.07)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease !important;
}

html.rc-app-bg body .modal-border .modal .reason-item:hover .checkbox-mark{
  transform: scale(1.04) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 2px rgba(255,255,255,.025) !important;
}

html.rc-app-bg body .modal-border .modal .reason-item .checkbox-container input:checked + .checkbox-mark{
  border-color: transparent !important;
  background:
    linear-gradient(rgba(255,255,255,.12), rgba(255,255,255,.055)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.68), rgba(255,255,255,.16)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), 0 0 12px rgba(255,255,255,.05) !important;
}

html.rc-app-bg body .modal-border .modal .reason-item .checkbox-container .checkbox-mark .icon{
  width: 12px !important;
  fill: rgba(255,255,255,.96) !important;
  filter: none !important;
}

/* Dialogs v246: remove every remaining nested grey surface, regardless of wrapper depth. */
html.rc-app-bg body .modal-border .modal,
html.rc-app-bg body .modal-border .modal :is(.divided-card,.divided-card > .header,.divided-card > .content,.divided-card > .footer){
  --tw-bg-opacity: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
}

html.rc-app-bg body .modal-border .modal{
  border: 1px solid transparent !important;
  background:
    linear-gradient(rgba(255,255,255,.004), rgba(255,255,255,.002)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.20), rgba(255,255,255,.035) 48%, rgba(255,255,255,.10)) border-box !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 24px 70px rgba(0,0,0,.32) !important;
  -webkit-backdrop-filter: blur(28px) saturate(100%) !important;
  backdrop-filter: blur(28px) saturate(100%) !important;
}

html.rc-app-bg body .modal-border .modal :is(
  .reason-item,.items-row > .item,.input-box,.input-field,.input-field-container,
  .expanding-textarea,.select-wrapper .select .activator,.server-list,.server,
  [class*="bg-grey-"]
){
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

/* Native selects cannot render translucent system popups, so JS replaces them. */
html.rc-app-bg .rc-native-select-hidden{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html.rc-app-bg .rc-glass-select{
  position: relative !important;
  width: 100% !important;
}

html.rc-app-bg .rc-glass-select-trigger{
  display: flex !important;
  width: 100% !important;
  min-height: 34px !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 8px !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-top-color: rgba(255,255,255,.14) !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: rgba(255,255,255,.88) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
  text-align: left !important;
  -webkit-backdrop-filter: blur(14px) saturate(100%) !important;
  backdrop-filter: blur(14px) saturate(100%) !important;
}

html.rc-app-bg .rc-glass-select-trigger:hover,
html.rc-app-bg .rc-glass-select.is-open .rc-glass-select-trigger{
  background: rgba(255,255,255,.018) !important;
  border-color: rgba(255,255,255,.16) !important;
  border-top-color: rgba(255,255,255,.23) !important;
}

html.rc-app-bg .rc-glass-select-arrow{
  width: 7px !important;
  height: 7px !important;
  flex: 0 0 7px !important;
  border-right: 1px solid rgba(255,255,255,.65) !important;
  border-bottom: 1px solid rgba(255,255,255,.65) !important;
  transform: rotate(45deg) translateY(-2px) !important;
  transition: transform .16s ease !important;
}

html.rc-app-bg .rc-glass-select.is-open .rc-glass-select-arrow{
  transform: rotate(225deg) translate(-2px,-2px) !important;
}

html.rc-app-bg body > .rc-glass-select-menu{
  position: fixed !important;
  z-index: 2147483000 !important;
  padding: 5px !important;
  overflow: hidden auto !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  background:
    linear-gradient(rgba(255,255,255,.006), rgba(255,255,255,.003)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.20), rgba(255,255,255,.04) 48%, rgba(255,255,255,.11)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 18px 48px rgba(0,0,0,.34) !important;
  -webkit-backdrop-filter: blur(30px) saturate(100%) !important;
  backdrop-filter: blur(30px) saturate(100%) !important;
}

html.rc-app-bg body > .rc-glass-select-menu[hidden]{
  display: none !important;
}

html.rc-app-bg body > .rc-glass-select-menu .rc-glass-select-option{
  display: flex !important;
  width: 100% !important;
  min-height: 31px !important;
  align-items: center !important;
  padding: 6px 9px !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: rgba(255,255,255,.72) !important;
  text-align: left !important;
}

html.rc-app-bg body > .rc-glass-select-menu .rc-glass-select-option:hover,
html.rc-app-bg body > .rc-glass-select-menu .rc-glass-select-option.is-selected{
  border-color: rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.022) !important;
  color: rgba(255,255,255,.96) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}

/* Dialogs v247: modal glass must not depend on the optional rc-app-bg setting. */
html body .modal-border{
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .modal-border .modal{
  --tw-bg-opacity: 0 !important;
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 16px !important;
  background:
    linear-gradient(rgba(255,255,255,.004), rgba(255,255,255,.002)) padding-box,
    linear-gradient(145deg, rgba(255,255,255,.20), rgba(255,255,255,.035) 48%, rgba(255,255,255,.10)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 24px 70px rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter: blur(28px) saturate(100%) !important;
  backdrop-filter: blur(28px) saturate(100%) !important;
}

html body .modal-border .modal :is(
  .divided-card,.divided-card > .header,.divided-card > .content,.divided-card > .footer,
  .reason-item,.items-row > .item,.ra-card,.admin-switch,
  .input-container,.input-box,.input-field,.input-field-container,.expanding-textarea,
  .select-wrapper,.select-wrapper .select,.select-wrapper .select .activator,
  .button-select-container,.button-select,.reasons-list,.server-list,.server,
  [class*="bg-grey-"]
){
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  filter: none !important;
}

html body .modal-border .modal :is(
  .reason-item,.items-row > .item,.ra-card,.admin-switch,
  .input-box,.input-field,.input-field-container,.expanding-textarea,
  .select-wrapper .select .activator,.button-select-container,.server-list,.server
){
  border: 1px solid rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.135) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
  -webkit-backdrop-filter: blur(14px) saturate(100%) !important;
  backdrop-filter: blur(14px) saturate(100%) !important;
}

html body .modal-border .modal :is(.divided-card > .header.apply-border,.divided-card > .footer){
  border-color: rgba(255,255,255,.055) !important;
}

html body .modal-border .modal :is(input,textarea,select){
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .modal-border .modal :is(button,.ra-button,[role="button"]):not(.option){
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.13) !important;
  color: rgba(255,255,255,.84) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
}

html body .modal-border .modal :is(button,.ra-button,[role="button"]):not(.option):hover{
  background: rgba(255,255,255,.022) !important;
  border-color: rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.19) !important;
}

html body .modal-border .modal .checkbox-container .checkbox-mark{
  --tw-bg-opacity: 0 !important;
  top: 50% !important;
  width: 15px !important;
  height: 15px !important;
  margin-top: -7.5px !important;
  border: 1px solid transparent !important;
  border-radius: 5px !important;
  background:
    linear-gradient(transparent,transparent) padding-box,
    linear-gradient(145deg,rgba(255,255,255,.30),rgba(255,255,255,.07)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
}

html body .modal-border .modal .checkbox-container input:checked + .checkbox-mark{
  background:
    linear-gradient(rgba(255,255,255,.12),rgba(255,255,255,.05)) padding-box,
    linear-gradient(145deg,rgba(255,255,255,.72),rgba(255,255,255,.16)) border-box !important;
  background-color: transparent !important;
  border-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18),0 0 12px rgba(255,255,255,.05) !important;
}

html body .modal-border .modal .checkbox-container .checkbox-mark .icon{
  width: 12px !important;
  fill: rgba(255,255,255,.96) !important;
}

html .rc-native-select-hidden{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

html .rc-glass-select{ position: relative !important; width: 100% !important; }

html .rc-glass-select-trigger{
  display: flex !important;
  width: 100% !important;
  min-height: 34px !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 7px 10px !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-top-color: rgba(255,255,255,.14) !important;
  border-radius: 8px !important;
  background: transparent !important;
  color: rgba(255,255,255,.88) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
  text-align: left !important;
}

html body > .rc-glass-select-menu{
  position: fixed !important;
  z-index: 2147483000 !important;
  padding: 5px !important;
  overflow: hidden auto !important;
  border: 1px solid transparent !important;
  border-radius: 11px !important;
  background:
    linear-gradient(rgba(255,255,255,.005),rgba(255,255,255,.002)) padding-box,
    linear-gradient(145deg,rgba(255,255,255,.20),rgba(255,255,255,.035) 48%,rgba(255,255,255,.11)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045),0 18px 48px rgba(0,0,0,.32) !important;
  -webkit-backdrop-filter: blur(30px) saturate(100%) !important;
  backdrop-filter: blur(30px) saturate(100%) !important;
}

html body > .rc-glass-select-menu[hidden]{ display: none !important; }

html body > .rc-glass-select-menu .rc-glass-select-option{
  display: flex !important;
  width: 100% !important;
  min-height: 31px !important;
  align-items: center !important;
  padding: 6px 9px !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  color: rgba(255,255,255,.74) !important;
  text-align: left !important;
}

html body > .rc-glass-select-menu .rc-glass-select-option:is(:hover,.is-selected){
  border-color: rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.02) !important;
  color: rgba(255,255,255,.96) !important;
}

/* Dialogs v248: runtime-tagged surfaces from the real rendered Vue tree. */
html body .rc-liquid-dialog{
  --tw-bg-opacity: 0 !important;
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 16px !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05),0 24px 70px rgba(0,0,0,.30) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .rc-liquid-dialog,
html body .rc-liquid-dialog *{
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .rc-liquid-shell{
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* v251: reason/server suggestion panels need their own readable clear-glass layer. */
html body .rc-liquid-dialog .suggester-input-wrapper .suggestions-wrapper{
  --tw-bg-opacity: 0 !important;
  z-index: 80 !important;
  padding: 5px !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-top-color: rgba(255,255,255,.16) !important;
  border-radius: 10px !important;
  background: rgba(0,0,0,.22) !important;
  background-color: rgba(0,0,0,.22) !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035),0 16px 38px rgba(0,0,0,.28) !important;
  -webkit-backdrop-filter: blur(18px) saturate(100%) !important;
  backdrop-filter: blur(18px) saturate(100%) !important;
}

html body .rc-liquid-dialog .suggester-input-wrapper .suggestions-wrapper .suggestion{
  --tw-bg-opacity: 0 !important;
  min-height: 30px !important;
  padding: 6px 8px !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html body .rc-liquid-dialog .suggester-input-wrapper .suggestions-wrapper .suggestion:is(:hover,.selected){
  border-color: rgba(255,255,255,.10) !important;
  background: rgba(255,255,255,.018) !important;
  background-color: rgba(255,255,255,.018) !important;
}

html body .rc-liquid-dialog .rc-liquid-clear{
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  filter: none !important;
}

html body .rc-liquid-dialog::before,
html body .rc-liquid-dialog::after,
html body .rc-liquid-dialog .rc-liquid-clear::before,
html body .rc-liquid-dialog .rc-liquid-clear::after{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

html body .rc-liquid-dialog :is(
  .reason-item,[role="radio"],[role="option"],button,.ra-button,
  input,textarea,.input-box,.input-field,.select,.activator,
  [class*="server"],[class*="comment"]
){
  --tw-bg-opacity: 0 !important;
  background-color: transparent !important;
  background-image: none !important;
}

html body .rc-liquid-dialog :is(.reason-item,[role="radio"],.input-box,.input-field,.activator){
  border: 1px solid rgba(255,255,255,.075) !important;
  border-top-color: rgba(255,255,255,.135) !important;
  border-radius: 8px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03) !important;
}

/* v252: check-result suggesters use the real Vue classes directly.
   Keep these controls clear even though the runtime modal decorator is disabled. */
html body .modal-border .modal:has(.ban-modal){
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html body .modal-border .modal .suggester-input-wrapper,
html body .modal-border .modal .suggester-input-wrapper > .input-box,
html body .modal-border .modal .suggester-input-wrapper > .input-box input{
  --tw-bg-opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
}

html body .modal-border .modal .suggester-input-wrapper{
  position: relative !important;
  z-index: 1 !important;
}

html body .modal-border .modal .suggester-input-wrapper:focus-within{
  z-index: 500 !important;
}

html body .modal-border .modal .suggester-input-wrapper > .input-box{
  border: 1px solid rgba(255,255,255,.10) !important;
  border-top-color: rgba(255,255,255,.18) !important;
  border-radius: 8px !important;
  background:
    radial-gradient(130% 120% at 50% -35%,rgba(255,255,255,.20),transparent 55%),
    linear-gradient(180deg,rgba(255,255,255,.045),rgba(255,255,255,.008)) !important;
  background-color: rgba(255,255,255,.012) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), inset 0 -1px 0 rgba(255,255,255,.018), 0 7px 20px rgba(0,0,0,.14) !important;
  -webkit-backdrop-filter: blur(26px) saturate(112%) brightness(98%) !important;
  backdrop-filter: blur(26px) saturate(112%) brightness(98%) !important;
}

html body .modal-border .modal .suggester-input-wrapper :is(.value,.item,.selected-item,.tag,.chip){
  --tw-bg-opacity: 0 !important;
  border-color: rgba(255,255,255,.10) !important;
  background: linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.012)) !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}

html body .modal-border .modal .suggester-input-wrapper .suggestions-wrapper,
html body:has(.modal-border .modal) > .suggestions-wrapper{
  --tw-bg-opacity: 0 !important;
  overflow: hidden auto !important;
  padding: 5px !important;
  border: 1px solid rgba(255,255,255,.10) !important;
  border-top-color: rgba(255,255,255,.19) !important;
  border-radius: 10px !important;
  background:
    radial-gradient(140% 85% at 50% -10%,rgba(255,255,255,.09),transparent 60%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.008)) !important;
  background-color: rgba(32,33,36,.76) !important;
  background-image:
    radial-gradient(140% 85% at 50% -10%,rgba(255,255,255,.09),transparent 60%),
    linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.008)) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), inset 0 -1px 0 rgba(255,255,255,.025), 0 16px 40px rgba(0,0,0,.25) !important;
  -webkit-backdrop-filter: blur(38px) saturate(104%) !important;
  backdrop-filter: blur(38px) saturate(104%) !important;
  isolation: isolate !important;
  z-index: 501 !important;
  transform: translateZ(0) !important;
  will-change: backdrop-filter !important;
}

html body .modal-border .modal .suggester-input-wrapper .suggestions-wrapper :is(.suggestion,.item),
html body:has(.modal-border .modal) > .suggestions-wrapper :is(.suggestion,.item){
  --tw-bg-opacity: 0 !important;
  border: 1px solid transparent !important;
  border-radius: 7px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html body .modal-border .modal .suggester-input-wrapper .suggestions-wrapper :is(.suggestion,.item):is(:hover,.selected,.active),
html body:has(.modal-border .modal) > .suggestions-wrapper :is(.suggestion,.item):is(:hover,.selected,.active){
  border-color: rgba(255,255,255,.14) !important;
  background: linear-gradient(180deg,rgba(255,255,255,.075),rgba(255,255,255,.025)) !important;
  background-color: rgba(255,255,255,.035) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.055) !important;
}

/* Webhook dialog: the outer shell is the only glass surface. */
html.rc-app-bg #app > .base .modal-border:not(.transparent):has(.webhook-edit-modal){
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.008) 55%, rgba(255,255,255,.025)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 20px 52px rgba(0,0,0,.2) !important;
  -webkit-backdrop-filter: blur(34px) saturate(105%) !important;
  backdrop-filter: blur(34px) saturate(105%) !important;
  overflow: hidden !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent):has(.webhook-edit-modal) > .modal,
html.rc-app-bg #app > .base .modal-border:not(.transparent) .webhook-edit-modal,
html.rc-app-bg #app > .base .modal-border:not(.transparent) .webhook-edit-modal > .divided-card,
html.rc-app-bg #app > .base .modal-border:not(.transparent) .webhook-edit-modal .divided-card > :is(.header,.content,.footer){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) .webhook-edit-modal :is(.input-box,.docs,.footer .ra-button),
html.rc-app-bg #app > .base .modal-border:not(.transparent) .webhook-edit-modal :is(.input-box,.docs,.footer .ra-button):is(:hover,:focus-within){
  background: rgba(255,255,255,.025) !important;
  background-color: rgba(255,255,255,.025) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: none !important;
  filter: none !important;
}

html.rc-app-bg #app > .base .modal-border:not(.transparent) .webhook-edit-modal .input-box input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Webhooks are mounted directly inside #app's relative overlay. */
html.rc-app-bg body #app .modal-border:has(.webhook-edit-modal){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(.webhook-edit-modal) > .modal{
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018) 55%, rgba(255,255,255,.035)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 20px 52px rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: blur(34px) saturate(105%) !important;
  backdrop-filter: blur(34px) saturate(105%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body #app .modal-border:has(.webhook-edit-modal) .webhook-edit-modal > .divided-card,
html.rc-app-bg body #app .modal-border:has(.webhook-edit-modal) .webhook-edit-modal .divided-card > :is(.header,.content,.footer){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(.webhook-edit-modal) .webhook-edit-modal :is(.input-box,.docs,.footer .ra-button){
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .modal-border:has(.webhook-edit-modal) .webhook-edit-modal .input-box input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Discord integration wizard: match the clear webhook dialog. */
html.rc-app-bg body #app .modal-border:has(.autokick-modal[internal-id="?discord-webhook="]){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(.autokick-modal[internal-id="?discord-webhook="]) > .modal{
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018) 55%, rgba(255,255,255,.035)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 20px 52px rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: blur(34px) saturate(105%) !important;
  backdrop-filter: blur(34px) saturate(105%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body #app .modal-border:has(.autokick-modal[internal-id="?discord-webhook="]) .autokick-modal :is(.card,.card-header,.card-content,.card-footer){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(.autokick-modal[internal-id="?discord-webhook="]) .autokick-modal :is(.input-box,.select .activator,.card-footer .ra-button,.card-header .append){
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .modal-border:has(.autokick-modal[internal-id="?discord-webhook="]) .autokick-modal .input-box input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Server connection, reconnection and settings dialogs. */
html.rc-app-bg body #app .modal-border:has(:is(.server-pair,.server-edit-modal)){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(:is(.server-pair,.server-edit-modal)) > .modal{
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018) 55%, rgba(255,255,255,.035)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 20px 52px rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: blur(34px) saturate(105%) !important;
  backdrop-filter: blur(34px) saturate(105%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body #app .modal-border:has(:is(.server-pair,.server-edit-modal)) :is(.server-pair,.server-edit-modal),
html.rc-app-bg body #app .modal-border:has(:is(.server-pair,.server-edit-modal)) :is(.server-pair,.server-edit-modal) > .divided-card,
html.rc-app-bg body #app .modal-border:has(:is(.server-pair,.server-edit-modal)) :is(.server-pair,.server-edit-modal) .divided-card > :is(.header,.content,.footer){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(:is(.server-pair,.server-edit-modal)) :is(.command,.input-box,.footer .ra-button){
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .modal-border:has(:is(.server-pair,.server-edit-modal)) .input-box input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .modal-border:has(.server-pair) .project-connect > svg{
  fill: rgba(255,255,255,.65) !important;
  color: rgba(255,255,255,.65) !important;
}

/* Billing top-up dialog: clear glass with a neutral selected state. */
html.rc-app-bg body #app .modal-border:has(.payments-modal){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(.payments-modal) > .modal{
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018) 55%, rgba(255,255,255,.035)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 20px 52px rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: blur(34px) saturate(105%) !important;
  backdrop-filter: blur(34px) saturate(105%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal,
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal > .divided-card,
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal .divided-card > :is(.header,.content,.footer),
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal .methods{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal :is(.method,.input-box,.footer .ra-button){
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal .method.selected{
  background: rgba(255,255,255,.085) !important;
  border-color: rgba(255,255,255,.35) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08) !important;
}
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal .method.selected .checkmark{
  background: rgba(255,255,255,.8) !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal .method.selected .checkmark svg{
  fill: #111 !important;
}
html.rc-app-bg body #app .modal-border:has(.payments-modal) .payments-modal .input-box input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Staff dialogs share one clear glass surface. */
html.rc-app-bg body #app .modal-border:has(:is(.permissions-modal[internal-id="?client-permissions="],.client-details-modal[internal-id^="?staff="],.rc-staff-remove-confirm)){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(:is(.permissions-modal[internal-id="?client-permissions="],.client-details-modal[internal-id^="?staff="],.rc-staff-remove-confirm)) > .modal{
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.018) 55%, rgba(255,255,255,.035)) !important;
  background-color: transparent !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 20px 52px rgba(0,0,0,.22) !important;
  -webkit-backdrop-filter: blur(34px) saturate(105%) !important;
  backdrop-filter: blur(34px) saturate(105%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body #app .modal-border:has(.permissions-modal[internal-id="?client-permissions="]) .permissions-modal :is(.card,.card-header,.card-content,.card-footer),
html.rc-app-bg body #app .modal-border:has(.client-details-modal[internal-id^="?staff="]) .client-details-modal,
html.rc-app-bg body #app .modal-border:has(.client-details-modal[internal-id^="?staff="]) .client-details-modal :is(.header,.divided-card,.content,.footer),
html.rc-app-bg body #app .modal-border:has(.rc-staff-remove-confirm) .rc-staff-remove-confirm,
html.rc-app-bg body #app .modal-border:has(.rc-staff-remove-confirm) .rc-staff-remove-confirm :is(.content,.buttons){
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(.client-details-modal[internal-id^="?staff="]) .client-details-modal .bg-gradient{
  background: transparent !important;
  opacity: 0 !important;
}
html.rc-app-bg body #app .modal-border:has(:is(.permissions-modal[internal-id="?client-permissions="],.client-details-modal[internal-id^="?staff="],.rc-staff-remove-confirm)) :is(.input-box,.ra-button,.client-details-modal .info .row,.client-details-modal .integrations,.client-details-modal .integration){
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .modal-border:has(.permissions-modal[internal-id="?client-permissions="]) .input-box input{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html.rc-app-bg body #app .modal-border:has(.rc-staff-remove-confirm) > .modal{
  width: min(360px, calc(100vw - 32px)) !important;
  min-height: 0 !important;
  height: auto !important;
}
html.rc-app-bg body #app .modal-border:has(.rc-staff-remove-confirm) .rc-staff-remove-confirm{
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
}
html.rc-app-bg body #app .modal-border:has(.rc-staff-remove-confirm) .rc-staff-remove-confirm .content{
  min-height: 0 !important;
  height: auto !important;
  padding: 18px 20px 12px !important;
  gap: 8px !important;
}
html.rc-app-bg body #app .modal-border:has(.rc-staff-remove-confirm) .rc-staff-remove-confirm .icon-warn{
  margin: 0 0 5px !important;
}
html.rc-app-bg body #app .modal-border:has(.rc-staff-remove-confirm) .rc-staff-remove-confirm .icon-warn svg{
  width: 52px !important;
  height: 45px !important;
}
html.rc-app-bg body #app .modal-border:has(.rc-staff-remove-confirm) .rc-staff-remove-confirm .buttons{
  margin: 0 !important;
  padding: 8px 16px 16px !important;
}

/* Employee dialogs: one edge and a more private frosted profile. */
html.rc-app-bg body #app .modal-border:has(.permissions-modal[internal-id="?client-permissions="]) .permissions-modal{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border:has(.client-details-modal[internal-id^="?staff="]) > .modal{
  background: linear-gradient(145deg, rgba(255,255,255,.06), rgba(255,255,255,.025)), rgba(0,0,0,.55) !important;
  backdrop-filter: blur(48px) saturate(100%) !important;
  -webkit-backdrop-filter: blur(48px) saturate(100%) !important;
}
html.rc-app-bg body #app .client-details-modal[internal-id^="?staff="] .info .row .bio{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* Employee security settings. */
html.rc-app-bg body #app .settings-container[data-v-20b1cc5e] > .settings{
  background: linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.018)) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 16px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035) !important;
  backdrop-filter: blur(28px) saturate(100%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(100%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body #app .settings-container[data-v-20b1cc5e] > .settings > .switch-wrapper{
  background: transparent !important;
}

/* Apply settings glass as soon as Vue mounts the page, before JS polishing. */
html.rc-app-bg body #app .tabbed-navigation > .content:has(:is(.settings-container[data-v-310612a0],.settings-container[data-v-0d79b110],.settings-container[data-v-8d2201d4],.settings-container[data-v-326b1643])){
  filter: blur(0px) !important;
}
html.rc-app-bg body #app :is(.settings-container[data-v-326b1643],.settings-container[data-v-310612a0],.settings-container[data-v-0d79b110],.settings-container[data-v-8d2201d4]) > .settings,
html.rc-app-bg body #app .bg-grey-900[data-v-310612a0]{
  background: rgba(255,255,255,.035) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-radius: 16px !important;
  background-clip: padding-box !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045), inset 0 -1px 0 rgba(255,255,255,.018) !important;
  backdrop-filter: blur(28px) saturate(106%) brightness(76%) !important;
  -webkit-backdrop-filter: blur(28px) saturate(106%) brightness(76%) !important;
  overflow: hidden !important;
  clip-path: inset(0 round 16px) !important;
  transition: none !important;
}
html.rc-app-bg body #app :is(.settings-container[data-v-326b1643],.settings-container[data-v-310612a0],.settings-container[data-v-0d79b110],.settings-container[data-v-8d2201d4]) > .settings > *{
  background: transparent !important;
  box-shadow: none !important;
}

/* Personal profile fields: colour-neutral glass, with a clear focus edge. */
html body #rc-dash #tab-profile .settings-field{
  background: transparent !important;
  box-shadow: none !important;
}
html body #rc-dash #tab-profile .settings-field :is(input, textarea){
  background: linear-gradient(145deg, rgba(255,255,255,.045), rgba(255,255,255,.012)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
  backdrop-filter: blur(24px) saturate(100%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(100%) !important;
}
html body #rc-dash #tab-profile .settings-field :is(input, textarea):focus{
  border-color: rgba(255,255,255,.28) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05), 0 0 0 2px rgba(255,255,255,.05) !important;
}

/* Profile actions use neutral glass. */
html body #rc-dash #tab-profile .settings-actions :is(.btn-save,.btn-close-settings){
  background: linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.018)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05) !important;
  color: rgba(255,255,255,.88) !important;
  backdrop-filter: blur(24px) saturate(100%) !important;
  -webkit-backdrop-filter: blur(24px) saturate(100%) !important;
}
html body #rc-dash #tab-profile .settings-actions :is(.btn-save,.btn-close-settings):hover{
  background: rgba(255,255,255,.10) !important;
  border-color: rgba(255,255,255,.22) !important;
}

/* Hover and keyboard focus match the selected sidebar item's clear glass. */
html.rc-app-bg body #app .navigation .item-row:is(:hover,:focus-visible){
  color: rgba(255,255,255,.98) !important;
  border: 1px solid transparent !important;
  background: linear-gradient(rgba(255,255,255,.012), rgba(255,255,255,.012)) padding-box,
    linear-gradient(150deg, rgba(255,255,255,.20), rgba(255,255,255,.055) 44%, rgba(255,255,255,.11)) border-box !important;
  background-color: transparent !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.045) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
  transform: translateY(-1px) !important;
}

/* Server gear menu: clear neutral glass with a readable blurred backdrop. */
html.rc-app-bg body .p-contextmenu:has([aria-label="Скачать плагин"]){
  background: linear-gradient(145deg, rgba(255,255,255,.065), rgba(255,255,255,.015)), rgba(0,0,0,.42) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-radius: 14px !important;
  box-shadow: 0 16px 42px rgba(0,0,0,.28), inset 0 1px 0 rgba(255,255,255,.06) !important;
  backdrop-filter: blur(32px) saturate(100%) !important;
  -webkit-backdrop-filter: blur(32px) saturate(100%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body .p-contextmenu:has([aria-label="Скачать плагин"]) :is(.p-contextmenu-root-list,.p-menuitem,.p-menuitem-content,.ra-button){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html.rc-app-bg body .p-contextmenu:has([aria-label="Скачать плагин"]) .p-menuitem-content:is(:hover,:focus-within){
  background: rgba(255,255,255,.07) !important;
  border-radius: 8px !important;
}


/* The menu is teleported; identify it by its staff-only action. */
html.rc-app-bg body .p-contextmenu:has([aria-label="Изменить права"]){
  background: rgba(0,0,0,.38) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.05), rgba(255,255,255,.015)) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 12px !important;
  box-shadow: 0 16px 36px rgba(0,0,0,.24), inset 0 1px 0 rgba(255,255,255,.04) !important;
  -webkit-backdrop-filter: blur(32px) saturate(105%) !important;
  backdrop-filter: blur(32px) saturate(105%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body .p-contextmenu:has([aria-label="Изменить права"]) :is(.p-menuitem-content,.ra-button){
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html.rc-app-bg body .p-contextmenu:has([aria-label="Изменить права"]) .p-menuitem-content:hover{
  background: rgba(255,255,255,.07) !important;
}

/* Keep the server deletion warning compact without affecting other dialogs. */
html.rc-app-bg body #app .modal-border:has(.rc-server-remove-confirm) > .modal{
  height: auto !important;
  min-height: 0 !important;
}
html.rc-app-bg body #app .rc-server-remove-confirm{
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  gap: 0 !important;
}
html.rc-app-bg body #app .rc-server-remove-confirm .content{
  padding: 16px 20px 8px !important;
}
html.rc-app-bg body #app .rc-server-remove-confirm .icon-error{
  margin: 0 0 8px !important;
}
html.rc-app-bg body #app .rc-server-remove-confirm .icon-error svg{
  width: 72px !important;
  height: auto !important;
}
html.rc-app-bg body #app .rc-server-remove-confirm .buttons{
  margin: 0 !important;
  padding: 8px 16px 16px !important;
}

/* One glass surface for the date range, with enough room for both dates. */
html.rc-app-bg[data-rc-stats-page] body #app .titled-layout .rounded-md:has(> .p-calendar){
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  gap: 6px !important;
  min-height: 38px !important;
  padding: 0 10px 0 12px !important;
  cursor: pointer !important;
}
html.rc-app-bg[data-rc-stats-page] body #app .titled-layout .rounded-md > .p-calendar{
  width: 110px !important;
  min-width: 110px !important;
  flex: 0 0 110px !important;
}
html.rc-app-bg[data-rc-stats-page] body #app .titled-layout .rounded-md > .p-calendar > .p-inputtext{
  box-sizing: border-box !important;
  width: 100% !important;
  min-width: 0 !important;
  height: 36px !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}
html.rc-app-bg[data-rc-stats-page] body #app .titled-layout .rounded-md:has(> .p-calendar) > svg{
  flex: 0 0 16px !important;
  pointer-events: none !important;
}

/* Ban and mute details share the same neutral glass surface. */
html.rc-app-bg body #app .modal-border:has(:is(.ban-view-modal,.mute-view-modal)) > .modal{
  background: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.035) 45%, rgba(255,255,255,.06)), rgba(0,0,0,.34) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-radius: 20px !important;
  box-shadow: 0 24px 80px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.07) !important;
  -webkit-backdrop-filter: blur(32px) saturate(100%) !important;
  backdrop-filter: blur(32px) saturate(100%) !important;
  overflow: hidden !important;
}
html.rc-app-bg body #app .modal-border :is(.ban-view-modal,.mute-view-modal),
html.rc-app-bg body #app .modal-border :is(.ban-view-modal,.mute-view-modal) :is(.divided-card,.header,.ban-view-header,.content,.footer){
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html.rc-app-bg body #app .modal-border :is(.ban-view-modal,.mute-view-modal){
  border: 1px solid rgba(255,255,255,.14) !important;
  border-radius: 22px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1) !important;
  overflow: hidden !important;
}
html.rc-app-bg body #app .modal-border :is(.ban-view-modal,.mute-view-modal) :is(.row,.comment){
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(255,255,255,.08) !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.025) !important;
}
html.rc-app-bg body #app .modal-border :is(.ban-view-modal,.mute-view-modal) .footer .ra-button{
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.11) !important;
  border-radius: 10px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04) !important;
}
html.rc-app-bg body #app .modal-border :is(.ban-view-modal,.mute-view-modal) .footer .ra-button:hover{
  background: rgba(255,255,255,.095) !important;
}

/* Final alert-card guard: neutral Liquid Glass for every project slug. */
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer{
  display: grid !important;
  grid-template-columns: minmax(0,1fr) !important;
  gap: 10px !important;
  padding: 12px 14px 24px !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover{
  min-height: 72px !important;
  overflow: hidden !important;
  background-color: rgba(255,255,255,.028) !important;
  background-image: radial-gradient(120% 95% at 8% -24%, rgba(255,255,255,.14), rgba(255,255,255,.035) 35%, transparent 66%), linear-gradient(145deg, rgba(255,255,255,.055), rgba(255,255,255,.012)) !important;
  border: 1px solid rgba(255,255,255,.085) !important;
  border-top-color: rgba(255,255,255,.18) !important;
  border-radius: 18px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), inset 0 -1px 0 rgba(255,255,255,.018), 0 16px 38px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(30px) saturate(105%) !important;
  backdrop-filter: blur(30px) saturate(105%) !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover:hover{
  transform: translateY(-2px) !important;
  background-color: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.14) !important;
  border-top-color: rgba(255,255,255,.24) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 20px 48px rgba(0,0,0,.2) !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover > .element > .flex{
  min-height: 70px !important;
  padding: 11px 13px !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  grid-template-columns: 42px minmax(0,1fr) !important;
  gap: 12px !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon{
  width: 42px !important;
  height: 42px !important;
  background-color: rgba(255,255,255,.04) !important;
  background-image: radial-gradient(circle at 32% 15%, rgba(255,255,255,.17), transparent 58%) !important;
  border: 1px solid rgba(255,255,255,.09) !important;
  border-top-color: rgba(255,255,255,.18) !important;
  border-radius: 13px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 8px 20px rgba(0,0,0,.14) !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon img{
  width: 27px !important;
  height: 27px !important;
  border-radius: 8px !important;
  filter: grayscale(1) brightness(1.14) contrast(.92) !important;
  opacity: .9 !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover p.row{
  color: rgba(255,255,255,.66) !important;
  font-size: 13px !important;
  line-height: 1.38 !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .date{
  margin-top: 4px !important;
  padding: 2px 7px !important;
  color: rgba(255,255,255,.42) !important;
  font-size: 9px !important;
  background: rgba(255,255,255,.025) !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-radius: 999px !important;
}

/* Alert rows: transparent liquid glass that keeps the page background colour. */
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover{
  background-color: rgba(255,255,255,.018) !important;
  background-image:
    radial-gradient(85% 140% at 7% -58%, rgba(255,255,255,.17) 0%, rgba(255,255,255,.045) 38%, transparent 68%),
    linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.008)) !important;
  border-color: rgba(255,255,255,.095) !important;
  border-top-color: rgba(255,255,255,.17) !important;
  border-bottom-color: rgba(255,255,255,.045) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 -1px 0 rgba(255,255,255,.012),
    0 12px 30px rgba(0,0,0,.11) !important;
  -webkit-backdrop-filter: blur(28px) saturate(145%) brightness(104%) !important;
  backdrop-filter: blur(28px) saturate(145%) brightness(104%) !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover:hover{
  background-color: rgba(255,255,255,.038) !important;
  background-image:
    radial-gradient(85% 140% at 7% -58%, rgba(255,255,255,.22), rgba(255,255,255,.06) 40%, transparent 70%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.012)) !important;
  border-color: rgba(255,255,255,.16) !important;
  border-top-color: rgba(255,255,255,.25) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -1px 0 rgba(255,255,255,.018),
    0 16px 38px rgba(0,0,0,.15) !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon{
  background-color: rgba(255,255,255,.045) !important;
  background-image: linear-gradient(145deg, rgba(255,255,255,.12), rgba(255,255,255,.018)) !important;
  border-color: rgba(255,255,255,.11) !important;
  border-top-color: rgba(255,255,255,.2) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), 0 6px 16px rgba(0,0,0,.14) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
}

html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon img{
  filter: brightness(1.08) contrast(.96) !important;
  opacity: 1 !important;
}

/* Map player search: compact neutral Liquid Glass. */
html.rc-app-bg body:has(a[href$="/map"][aria-current="page"]) #app #page-content :is(.input-box,.search-input,.n-input):has(input[placeholder*="steamid" i]){
  overflow: hidden !important;
  background-color: rgba(255,255,255,.045) !important;
  background-image:
    radial-gradient(110% 120% at 12% -38%, rgba(255,255,255,.19), rgba(255,255,255,.035) 46%, transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.012)) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-top-color: rgba(255,255,255,.24) !important;
  border-bottom-color: rgba(255,255,255,.07) !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.11), inset 0 -1px 0 rgba(0,0,0,.08), 0 10px 26px rgba(0,0,0,.16) !important;
  -webkit-backdrop-filter: blur(24px) saturate(135%) brightness(106%) !important;
  backdrop-filter: blur(24px) saturate(135%) brightness(106%) !important;
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

html.rc-app-bg body:has(a[href$="/map"][aria-current="page"]) #app #page-content :is(.input-box,.search-input,.n-input):has(input[placeholder*="steamid" i]):focus-within{
  background-color: rgba(255,255,255,.07) !important;
  border-color: rgba(255,255,255,.23) !important;
  border-top-color: rgba(255,255,255,.34) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.15), 0 12px 30px rgba(0,0,0,.18), 0 0 0 3px rgba(255,255,255,.055) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg body #app #page-content input[placeholder*="steamid" i]{
  min-height: 34px !important;
  padding: 7px 13px !important;
  background-color: rgba(0,0,0,.025) !important;
  background-image:
    radial-gradient(100% 95% at 18% -50%, rgba(255,255,255,.13), transparent 64%),
    linear-gradient(180deg, rgba(255,255,255,.012), transparent 55%) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  border-top-color: rgba(255,255,255,.22) !important;
  border-bottom-color: rgba(255,255,255,.05) !important;
  border-radius: 999px !important;
  outline: 0 !important;
  color: rgba(255,255,255,.94) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), inset 0 -1px 0 rgba(0,0,0,.035), 0 8px 22px rgba(0,0,0,.1) !important;
  -webkit-backdrop-filter: blur(18px) saturate(165%) brightness(108%) !important;
  backdrop-filter: blur(18px) saturate(165%) brightness(108%) !important;
  transition: border-color .18s ease, background-color .18s ease, box-shadow .18s ease, transform .18s ease !important;
}

html.rc-app-bg body #app #page-content input[placeholder*="steamid" i]:focus{
  background-color: rgba(0,0,0,.015) !important;
  border-color: rgba(255,255,255,.2) !important;
  border-top-color: rgba(255,255,255,.32) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.13), 0 10px 26px rgba(0,0,0,.12), 0 0 0 3px rgba(255,255,255,.045) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg body #app #page-content input[placeholder*="steamid" i]::placeholder{
  color: rgba(255,255,255,.48) !important;
  opacity: 1 !important;
}

/* The map search has its own opaque wrapper; flatten it into one glass layer. */
html.rc-app-bg body #app #page-content :is(div,label,form):has(> input[placeholder*="steamid" i]){
  padding: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app #page-content input[placeholder*="steamid" i]{
  background-color: rgba(255,255,255,.008) !important;
  background-image: linear-gradient(180deg, rgba(255,255,255,.018), transparent 58%) !important;
  border-color: rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.24) !important;
  border-bottom-color: rgba(255,255,255,.045) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.085), 0 7px 20px rgba(0,0,0,.08) !important;
  -webkit-backdrop-filter: blur(20px) saturate(175%) brightness(112%) !important;
  backdrop-filter: blur(20px) saturate(175%) brightness(112%) !important;
}

/* Checks verdicts use the exact same neutral glass chip as bans and mutes. */
html.rc-app-bg body #app #page-content .rc-check-verdict-wrap{
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app #page-content .rc-check-verdict{
  width: fit-content !important;
  min-height: 26px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 4px 8px !important;
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 8px !important;
  color: rgba(255,255,255,.72) !important;
  font-size: 12px !important;
  line-height: 1 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(118%) !important;
  backdrop-filter: blur(16px) saturate(118%) !important;
}

html.rc-app-bg body #app #page-content .rc-check-verdict :is(span,p,svg){
  color: inherit !important;
}

/* Runtime-tagged map search: remove every opaque layer and keep one clear glass shell. */
html.rc-app-bg body #app .rc-map-player-search-glass{
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background-color: rgba(255,255,255,.008) !important;
  background-image:
    radial-gradient(105% 130% at 16% -58%, rgba(255,255,255,.18), rgba(255,255,255,.025) 44%, transparent 70%),
    linear-gradient(180deg, rgba(255,255,255,.012), transparent 58%) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  border-top-color: rgba(255,255,255,.27) !important;
  border-bottom-color: rgba(255,255,255,.05) !important;
  border-radius: 999px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.1), inset 0 -1px 0 rgba(0,0,0,.035), 0 8px 22px rgba(0,0,0,.1) !important;
  -webkit-backdrop-filter: blur(22px) saturate(180%) brightness(112%) !important;
  backdrop-filter: blur(22px) saturate(180%) brightness(112%) !important;
}

html.rc-app-bg body #app .rc-map-player-search-glass > *,
html.rc-app-bg body #app .rc-map-player-search-control{
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app .rc-map-player-search-glass:focus-within{
  background-color: rgba(255,255,255,.018) !important;
  border-color: rgba(255,255,255,.22) !important;
  border-top-color: rgba(255,255,255,.36) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.14), 0 10px 26px rgba(0,0,0,.12), 0 0 0 3px rgba(255,255,255,.045) !important;
}

/* Checks verdict: pixel-match the reason chip used by bans and mutes. */
html.rc-app-bg body #app #page-content .verdict{
  width: fit-content !important;
  min-width: 0 !important;
  height: 32px !important;
  min-height: 32px !important;
  display: inline-flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 6px !important;
  padding: 5px 9px !important;
  background: rgba(255,255,255,.018) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 9px !important;
  color: rgba(255,255,255,.72) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(118%) !important;
  backdrop-filter: blur(16px) saturate(118%) !important;
}

html.rc-app-bg body #app #page-content .verdict > .text{
  width: auto !important;
  height: 20px !important;
  margin: 0 !important;
  padding: 0 !important;
  color: rgba(255,255,255,.68) !important;
  font-size: 16px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app #page-content .verdict > svg{
  display: none !important;
}
html.rc-app-bg body #app #page-content .verdict::after{
  content: "" !important;
  width: 16px !important;
  height: 16px !important;
  flex: 0 0 16px !important;
  background: rgba(255,255,255,.58) !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10c-1.473 0-2.874-.319-4.136-.893l-3.949.739a1.5 1.5 0 0 1-1.745-1.776l.781-3.808A9.96 9.96 0 0 1 2 12Zm4.25 0a1.25 1.25 0 1 0 2.5 0 1.25 1.25 0 0 0-2.5 0Zm4.5 0a1.25 1.25 0 1 0 2.5 0 1.25 1.25 0 0 0-2.5 0Zm4.5 0a1.25 1.25 0 1 0 2.5 0 1.25 1.25 0 0 0-2.5 0Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' fill-rule='evenodd' d='M2 12C2 6.477 6.477 2 12 2s10 4.477 10 10-4.477 10-10 10c-1.473 0-2.874-.319-4.136-.893l-3.949.739a1.5 1.5 0 0 1-1.745-1.776l.781-3.808A9.96 9.96 0 0 1 2 12Zm4.25 0a1.25 1.25 0 1 0 2.5 0 1.25 1.25 0 0 0-2.5 0Zm4.5 0a1.25 1.25 0 1 0 2.5 0 1.25 1.25 0 0 0-2.5 0Zm4.5 0a1.25 1.25 0 1 0 2.5 0 1.25 1.25 0 0 0-2.5 0Z'/%3E%3C/svg%3E") center / contain no-repeat !important;
}

/* Global runtime notifications: neutral liquid glass for every status type. */
html.rc-app-bg body #app .runtime-notification-wrapper .notification,
html.rc-app-bg body #app .notification[data-v-eda83e49]{
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background-color: rgba(255,255,255,.045) !important;
  background-image:
    radial-gradient(125% 170% at 12% -72%, rgba(255,255,255,.19) 0%, rgba(255,255,255,.045) 46%, transparent 72%),
    linear-gradient(180deg, rgba(255,255,255,.025) 0%, rgba(255,255,255,.008) 100%) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.24) !important;
  border-bottom-color: rgba(255,255,255,.065) !important;
  border-radius: 12px !important;
  color: rgba(255,255,255,.82) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.10),
    inset 0 -1px 0 rgba(0,0,0,.08),
    0 12px 34px rgba(0,0,0,.20) !important;
  -webkit-backdrop-filter: blur(24px) saturate(125%) brightness(108%) !important;
  backdrop-filter: blur(24px) saturate(125%) brightness(108%) !important;
}

/* Keep success/error/warning meaning in the icon only; never tint the glass. */
html.rc-app-bg body #app .runtime-notification-wrapper .notification:is(.success,.error,.warning,.info),
html.rc-app-bg body #app .notification[data-v-eda83e49]:is(.success,.error,.warning,.info){
  background-color: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.24) !important;
  border-bottom-color: rgba(255,255,255,.065) !important;
}

/* Bottom-right notices v313: one colourless liquid-glass material for every type. */
html.rc-app-bg body .runtime-notification-wrapper .notification,
html.rc-app-bg body .runtime-notification-wrapper .checkapp-toast,
html.rc-app-bg body .notification[data-v-eda83e49]{
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  background:
    linear-gradient(145deg, rgba(255,255,255,.075), rgba(255,255,255,.025)) !important;
  background-color: rgba(10,10,12,.24) !important;
  border: 1px solid rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.21) !important;
  border-bottom-color: rgba(255,255,255,.075) !important;
  border-radius: 14px !important;
  color: rgba(255,255,255,.9) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07) !important;
  -webkit-backdrop-filter: blur(16px) saturate(102%) !important;
  backdrop-filter: blur(16px) saturate(102%) !important;
}

html.rc-app-bg body .runtime-notification-wrapper .notification:is(.success,.error,.warning,.warn,.info),
html.rc-app-bg body .notification[data-v-eda83e49]:is(.success,.error,.warning,.warn,.info){
  background-color: rgba(10,10,12,.24) !important;
  border-color: rgba(255,255,255,.13) !important;
  border-top-color: rgba(255,255,255,.21) !important;
  border-bottom-color: rgba(255,255,255,.075) !important;
}

html.rc-app-bg body .runtime-notification-wrapper .checkapp-toast > div:first-child{
  background: rgba(255,255,255,.045) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
  color: rgba(255,255,255,.9) !important;
  box-shadow: none !important;
}

html.rc-app-bg body .runtime-notification-wrapper .checkapp-toast > div:last-child > div{
  color: rgba(255,255,255,.84) !important;
}

/* Player profile v317: visible blur and guaranteed animation on every mount. */
@keyframes rc-player-profile-in-v317{
  from { opacity: 0; }
  to { opacity: 1; }
}

/* Player profile v318: stable glass with no delayed backdrop-filter painting. */
@keyframes rc-player-profile-in-v318{
  from { opacity: 0; transform: translate3d(0,6px,0); }
  to { opacity: 1; transform: translate3d(0,0,0); }
}

/* Final authority: player profile is transparent neutral Liquid Glass{ background:rgba(0,0,0,.38)!important; -webkit-backdrop-filter:blur(6px)!important; backdrop-filter:blur(6px)!important; }

/* Player profile: calm{ background:rgba(0,0,0,.44)!important; -webkit-backdrop-filter:blur(5px) saturate(100%)!important; backdrop-filter:blur(5px) saturate(100%)!important; }

/* Player profile v323: clearer typography and full-colour emoji{
  color: rgba(255,255,255,.94) !important;
}

/* Player profile: appearance-only neutral Liquid Glass layer.
   Geometry, layout, media, icons and behaviour intentionally stay untouched. */
html.rc-app-bg body:has(.player-modal) .modal-backdrop {
  background: rgba(0, 0, 0, .12) !important;
  -webkit-backdrop-filter: blur(14px) saturate(100%) !important;
  backdrop-filter: blur(14px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.player-modal) .modal,
html.rc-app-bg body #app#app#app .player-modal {
  background: rgba(255, 255, 255, .018) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .12) !important;
  -webkit-backdrop-filter: blur(26px) saturate(100%) !important;
  backdrop-filter: blur(26px) saturate(100%) !important;
  box-shadow:
    0 22px 58px rgba(0, 0, 0, .22),
    inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-extended > .nav {
  background: rgba(255, 255, 255, .012) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .08) !important;
  -webkit-backdrop-filter: blur(21px) saturate(100%) !important;
  backdrop-filter: blur(21px) saturate(100%) !important;
  box-shadow: inset -1px 0 0 rgba(255, 255, 255, .025) !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-extended > .content,
html.rc-app-bg body #app#app#app .player-modal .content-inner,
html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout,
html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content,
html.rc-app-bg body #app#app#app .player-modal .general {
  background: transparent !important;
  background-image: none !important;
}

html.rc-app-bg body #app#app#app .player-modal .table-card,
html.rc-app-bg body #app#app#app .player-modal .table-info,
html.rc-app-bg body #app#app#app .player-modal .content-inner .rounded-lg,
html.rc-app-bg body #app#app#app .player-modal .content-inner [class*="bg-grey-9"] {
  background: rgba(255, 255, 255, .022) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .1) !important;
  -webkit-backdrop-filter: blur(19px) saturate(100%) !important;
  backdrop-filter: blur(19px) saturate(100%) !important;
  box-shadow:
    0 9px 24px rgba(0, 0, 0, .1),
    inset 0 1px 0 rgba(255, 255, 255, .03) !important;
}

html.rc-app-bg body #app#app#app .player-modal .table-card > .flex,
html.rc-app-bg body #app#app#app .player-modal .table-card > .header,
html.rc-app-bg body #app#app#app .player-modal .table-card > .title,
html.rc-app-bg body #app#app#app .player-modal .table-info > .header,
html.rc-app-bg body #app#app#app .player-modal .table-card .cell,
html.rc-app-bg body #app#app#app .player-modal .table-card .list-item,
html.rc-app-bg body #app#app#app .player-modal .table-info td,
html.rc-app-bg body #app#app#app .player-modal .table-info .row {
  background: transparent !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .075) !important;
}

html.rc-app-bg body #app#app#app .player-modal .player-tag,
html.rc-app-bg body #app#app#app .player-modal .actions .btn,
html.rc-app-bg body #app#app#app .player-modal .nav-controls .controls-button,
html.rc-app-bg body #app#app#app .player-modal .content-controls .controls-button,
html.rc-app-bg body #app#app#app .player-modal button:not(.preset.primary):not(.destructive) {
  background: rgba(255, 255, 255, .028) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .1) !important;
  color: rgba(255, 255, 255, .91) !important;
  -webkit-backdrop-filter: blur(16px) saturate(100%) !important;
  backdrop-filter: blur(16px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 4px 12px rgba(0, 0, 0, .08) !important;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

html.rc-app-bg body #app#app#app .player-modal .nav .menu-item {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  color: rgba(255, 255, 255, .69) !important;
  box-shadow: none !important;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease !important;
}

html.rc-app-bg body #app#app#app .player-modal .nav .menu-item:hover,
html.rc-app-bg body #app#app#app .player-modal .nav .menu-item.-active,
html.rc-app-bg body #app#app#app .player-modal .nav .menu-item.active {
  background: rgba(255, 255, 255, .038) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .105) !important;
  color: rgba(255, 255, 255, .96) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03), 0 5px 14px rgba(0, 0, 0, .08) !important;
}

html.rc-app-bg body #app#app#app .player-modal .player-tag:hover,
html.rc-app-bg body #app#app#app .player-modal .actions .btn:hover,
html.rc-app-bg body #app#app#app .player-modal .nav-controls .controls-button:hover,
html.rc-app-bg body #app#app#app .player-modal .content-controls .controls-button:hover,
html.rc-app-bg body #app#app#app .player-modal button:not(.preset.primary):not(.destructive):hover {
  background: rgba(255, 255, 255, .05) !important;
  border-color: rgba(255, 255, 255, .14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035), 0 6px 16px rgba(0, 0, 0, .1) !important;
}

html.rc-app-bg body #app#app#app .player-modal .table-card .cell .title,
html.rc-app-bg body #app#app#app .player-modal .table-card .list-item .title,
html.rc-app-bg body #app#app#app .player-modal .text-grey-600,
html.rc-app-bg body #app#app#app .player-modal [class*="text-grey-5"],
html.rc-app-bg body #app#app#app .player-modal [class*="text-grey-6"] {
  color: rgba(255, 255, 255, .68) !important;
}

html.rc-app-bg body #app#app#app .player-modal .table-card .cell .subtitle,
html.rc-app-bg body #app#app#app .player-modal .table-card .list-item .subtitle,
html.rc-app-bg body #app#app#app .player-modal .text-grey-50 {
  color: rgba(255, 255, 255, .94) !important;
}

/* Remove the legacy dark artwork behind the player header. */
html.rc-app-bg body #app#app#app .player-modal .nav .header-bg,
html.rc-app-bg body #app#app#app .player-modal .nav .header-bg .bg-image,
html.rc-app-bg body #app#app#app .player-modal .nav .header-bg .bg-blur,
html.rc-app-bg body #app#app#app .player-modal .nav .header-bg .bg-gradik {
  opacity: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Profile notices use the same clear, neutral Liquid Glass surface. */
html.rc-app-bg body #app#app#app .player-modal .tip,
html.rc-app-bg body #app#app#app .player-modal .tip.danger,
html.rc-app-bg body #app#app#app .player-modal .tip.warning,
html.rc-app-bg body #app#app#app .player-modal .tip.info {
  background: rgba(255, 255, 255, .026) !important;
  background-color: rgba(255, 255, 255, .026) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .105) !important;
  -webkit-backdrop-filter: blur(20px) saturate(100%) !important;
  backdrop-filter: blur(20px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03), 0 8px 22px rgba(0, 0, 0, .09) !important;
}

html.rc-app-bg body #app#app#app .player-modal .tip > .gradient,
html.rc-app-bg body #app#app#app .player-modal .tip::before,
html.rc-app-bg body #app#app#app .player-modal .tip::after {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Three-dot player menu: clear neutral Liquid Glass. */
html.rc-app-bg body:has(.player-modal) > .p-contextmenu,
html.rc-app-bg body:has(.player-modal) .p-contextmenu.p-component {
  background: rgba(255, 255, 255, .026) !important;
  background-color: rgba(255, 255, 255, .026) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .115) !important;
  -webkit-backdrop-filter: blur(22px) saturate(100%) !important;
  backdrop-filter: blur(22px) saturate(100%) !important;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-contextmenu-root-list,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .ra-button {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content {
  border-color: transparent !important;
  transition: background-color .15s ease, border-color .15s ease !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content:hover,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content:focus-within {
  background: rgba(255, 255, 255, .055) !important;
  border-color: rgba(255, 255, 255, .09) !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu::before,
html.rc-app-bg body:has(.player-modal) .p-contextmenu::after {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Nested player action menus share the exact same clear glass surface. */
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-submenu-list,
html.rc-app-bg body:has(.player-modal) .p-contextmenu ul[role="menu"] {
  background: rgba(255, 255, 255, .14) !important;
  background-color: rgba(255, 255, 255, .14) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .14) !important;
  -webkit-backdrop-filter: blur(30px) saturate(100%) !important;
  backdrop-filter: blur(30px) saturate(100%) !important;
  box-shadow: 0 16px 38px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-submenu-list::before,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-submenu-list::after {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Add-note dialog: wider, shorter, and matched to the profile glass. */
html.rc-app-bg body #app#app#app .modal-border:has(.confirm[internal-id="?confirm="] textarea) {
  background: rgba(255, 255, 255, .1) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .12) !important;
  box-shadow: 0 20px 52px rgba(0, 0, 0, .24) !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.confirm[internal-id="?confirm="] textarea) > .modal,
html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) {
  width: 420px !important;
  max-width: calc(100vw - 32px) !important;
  height: auto !important;
  min-height: 0 !important;
  background: rgba(255, 255, 255, .026) !important;
  background-color: rgba(255, 255, 255, .026) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .115) !important;
  -webkit-backdrop-filter: blur(26px) saturate(100%) !important;
  backdrop-filter: blur(26px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
  padding: 20px 18px 14px !important;
}

html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) > .content {
  height: auto !important;
  min-height: 0 !important;
  padding: 16px 20px 14px !important;
  background: transparent !important;
}

html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) .input-container,
html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) .input-box,
html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) textarea {
  height: 84px !important;
  min-height: 84px !important;
  background: rgba(255, 255, 255, .022) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .12) !important;
  -webkit-backdrop-filter: blur(18px) saturate(100%) !important;
  backdrop-filter: blur(18px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) > .buttons {
  padding-top: 12px !important;
}

html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) .buttons .ra-button {
  background: rgba(255, 255, 255, .03) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .11) !important;
  -webkit-backdrop-filter: blur(16px) saturate(100%) !important;
  backdrop-filter: blur(16px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) .buttons .ra-button:hover {
  background: rgba(255, 255, 255, .06) !important;
  border-color: rgba(255, 255, 255, .16) !important;
}

/* Final alignment pass: one glass layer, no doubled frame. */
html.rc-app-bg body #app#app#app .modal-border:has(.confirm[internal-id="?confirm="] textarea) {
  width: 420px !important;
  max-width: calc(100vw - 32px) !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.confirm[internal-id="?confirm="] textarea) > .modal {
  width: 420px !important;
  max-width: 100% !important;
  height: auto !important;
  min-height: 0 !important;
  padding: 0 !important;
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 18px !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}

html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) {
  box-sizing: border-box !important;
  width: 420px !important;
  max-width: 100% !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .035) !important;
  background-image: none !important;
  -webkit-backdrop-filter: blur(26px) saturate(100%) !important;
  backdrop-filter: blur(26px) saturate(100%) !important;
  box-shadow: 0 20px 52px rgba(0, 0, 0, .24), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) > .content,
html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) > .buttons,
html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) .input-container,
html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) .input-box,
html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) textarea {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
}

html.rc-app-bg body #app#app#app .confirm[internal-id="?confirm="]:has(textarea) > .buttons {
  gap: 10px !important;
}

/* Player statistics period selector: clear Liquid Glass. */
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .select,
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .activator {
  background: rgba(255, 255, 255, .026) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .11) !important;
  -webkit-backdrop-filter: blur(18px) saturate(100%) !important;
  backdrop-filter: blur(18px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html.rc-app-bg body #app#app#app .player-modal .stats-select-input .options-list {
  background: rgba(255, 255, 255, .045) !important;
  background-color: rgba(255, 255, 255, .045) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .12) !important;
  -webkit-backdrop-filter: blur(24px) saturate(100%) !important;
  backdrop-filter: blur(24px) saturate(100%) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, .2), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body #app#app#app .player-modal .stats-select-input .options-list .option {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  transition: background-color .15s ease, border-color .15s ease !important;
}

html.rc-app-bg body #app#app#app .player-modal .stats-select-input .options-list .option:hover,
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .options-list .option.-active,
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .options-list .option.active {
  background: rgba(255, 255, 255, .06) !important;
  border-color: rgba(255, 255, 255, .09) !important;
}

html.rc-app-bg body #app#app#app .player-modal .stats-select-input .options-list::before,
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .options-list::after {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Player kills table: neutral Liquid Glass without changing its grid. */
html.rc-app-bg body #app#app#app .player-modal .kill-feed-table {
  background: rgba(255, 255, 255, .022) !important;
  background-color: rgba(255, 255, 255, .022) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .1) !important;
  -webkit-backdrop-filter: blur(20px) saturate(100%) !important;
  backdrop-filter: blur(20px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html.rc-app-bg body #app#app#app .player-modal .kill-feed-table > .header {
  background: rgba(255, 255, 255, .035) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .085) !important;
}

html.rc-app-bg body #app#app#app .player-modal .kill-feed-table .content-layer,
html.rc-app-bg body #app#app#app .player-modal .kill-feed-table .row {
  background: transparent !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .075) !important;
}

html.rc-app-bg body #app#app#app .player-modal .kill-feed-table .row:hover {
  background: rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body #app#app#app .player-modal .kill-feed-table .ra-button {
  background: rgba(255, 255, 255, .035) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .1) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

/* Combatlog: one clean glass modal with glass table and participant cards. */
html.rc-app-bg body #app#app#app .modal-border:has(.combatlog-modal) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.combatlog-modal) > .modal {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .combatlog-modal[internal-id="?combatlog="] {
  background: rgba(255, 255, 255, .035) !important;
  background-color: rgba(255, 255, 255, .035) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  -webkit-backdrop-filter: blur(26px) saturate(100%) !important;
  backdrop-filter: blur(26px) saturate(100%) !important;
  box-shadow: 0 22px 58px rgba(0, 0, 0, .25), inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body #app#app#app .combatlog-modal .divided-card,
html.rc-app-bg body #app#app#app .combatlog-modal .divided-card > .header,
html.rc-app-bg body #app#app#app .combatlog-modal .divided-card > .content {
  background: transparent !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .075) !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .combatlog-modal .table-container,
html.rc-app-bg body #app#app#app .combatlog-modal .table {
  background: rgba(255, 255, 255, .03) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .1) !important;
  -webkit-backdrop-filter: blur(18px) saturate(100%) !important;
  backdrop-filter: blur(18px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

html.rc-app-bg body #app#app#app .combatlog-modal .table-header,
html.rc-app-bg body #app#app#app .combatlog-modal .table .row {
  background: transparent !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .075) !important;
}

html.rc-app-bg body #app#app#app .combatlog-modal .players .player {
  background: rgba(255, 255, 255, .035) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .1) !important;
  -webkit-backdrop-filter: blur(16px) saturate(100%) !important;
  backdrop-filter: blur(16px) saturate(100%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

/* Played-hours graph: lightweight glass, rendered by the profile's main blur. */
html.rc-app-bg body #app#app#app .player-modal .stats > .item,
html.rc-app-bg body #app#app#app .player-modal .stats .item.relative.h-\[220px\] {
  background: rgba(255, 255, 255, .025) !important;
  background-color: rgba(255, 255, 255, .025) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .1) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025), 0 8px 24px rgba(0, 0, 0, .08) !important;
}

html.rc-app-bg body #app#app#app .player-modal .stats > .item > .header,
html.rc-app-bg body #app#app#app .player-modal .stats .item.relative.h-\[220px\] > .header {
  background: rgba(255, 255, 255, .018) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .075) !important;
}

/* Performance pass: one real blur for the profile instead of many nested GPU blurs. */
html.rc-app-bg body:has(.player-modal) .modal-backdrop {
  -webkit-backdrop-filter: blur(11px) saturate(100%) !important;
  backdrop-filter: blur(11px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.player-modal) .modal,
html.rc-app-bg body #app#app#app .player-modal {
  -webkit-backdrop-filter: blur(34px) saturate(100%) !important;
  backdrop-filter: blur(34px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.player-modal) {
  will-change: opacity, transform !important;
  backface-visibility: hidden !important;
  transform: translateZ(0) !important;
  transition: opacity .16s ease-out, transform .16s ease-out !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-extended > .nav,
html.rc-app-bg body #app#app#app .player-modal .table-card,
html.rc-app-bg body #app#app#app .player-modal .table-info,
html.rc-app-bg body #app#app#app .player-modal .content-inner .rounded-lg,
html.rc-app-bg body #app#app#app .player-modal .content-inner [class*="bg-grey-9"],
html.rc-app-bg body #app#app#app .player-modal .player-tag,
html.rc-app-bg body #app#app#app .player-modal .actions .btn,
html.rc-app-bg body #app#app#app .player-modal .nav-controls .controls-button,
html.rc-app-bg body #app#app#app .player-modal .content-controls .controls-button,
html.rc-app-bg body #app#app#app .player-modal button:not(.preset.primary):not(.destructive),
html.rc-app-bg body #app#app#app .player-modal .tip,
html.rc-app-bg body #app#app#app .player-modal .kill-feed-table,
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .select,
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .activator,
html.rc-app-bg body #app#app#app .player-modal .stats > .item {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app#app#app .player-modal button,
html.rc-app-bg body #app#app#app .player-modal .menu-item,
html.rc-app-bg body #app#app#app .player-modal .controls-button,
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .activator,
html.rc-app-bg body #app#app#app .player-modal .stats-select-input .option {
  transition-duration: .16s !important;
}

/* Activity log: sessions, IP addresses and nickname history. */
html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-filters > .button-select-container {
  background: rgba(255, 255, 255, .022) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .105) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .045),
    0 8px 22px rgba(0, 0, 0, .08) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-filters .button-select {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-filters .button-select:hover {
  background: rgba(255, 255, 255, .035) !important;
  border-color: rgba(255, 255, 255, .08) !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-filters .button-select.-active {
  background: rgba(255, 255, 255, .075) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .15) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    0 5px 14px rgba(0, 0, 0, .1) !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content .player-details-card {
  background: rgba(255, 255, 255, .032) !important;
  background-color: rgba(255, 255, 255, .032) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .105) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .045),
    inset 0 -1px 0 rgba(255, 255, 255, .012),
    0 9px 26px rgba(0, 0, 0, .09) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content .player-details-card:hover {
  background: rgba(255, 255, 255, .046) !important;
  border-color: rgba(255, 255, 255, .155) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .065),
    0 10px 28px rgba(0, 0, 0, .11) !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content .player-details-card-badge.default {
  background: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .09) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content .tip {
  background: rgba(255, 255, 255, .036) !important;
  background-color: rgba(255, 255, 255, .036) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .1) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .045),
    0 8px 24px rgba(0, 0, 0, .08) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content .player-details-card .actions button,
html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content .player-details-card .actions .btn {
  background: rgba(255, 255, 255, .045) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .12) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content .player-details-card .actions button:hover,
html.rc-app-bg body #app#app#app .player-modal .modal-menu-page-layout-content .player-details-card .actions .btn:hover {
  background: rgba(255, 255, 255, .075) !important;
  border-color: rgba(255, 255, 255, .18) !important;
}

/* Permissions: every rule is an individual compact glass card. */
html.rc-app-bg body #app#app#app .player-modal .settings-container .settings {
  display: flex !important;
  flex-direction: column !important;
  gap: 8px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .player-modal .settings-container .settings > .switch-wrapper {
  min-height: 48px !important;
  background: rgba(255, 255, 255, .038) !important;
  background-color: rgba(255, 255, 255, .038) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 12px !important;
  box-shadow: 0 7px 20px rgba(0, 0, 0, .075) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  overflow: hidden !important;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

html.rc-app-bg body #app#app#app .player-modal .settings-container .settings > .switch-wrapper:hover {
  background: rgba(255, 255, 255, .052) !important;
  border-color: transparent !important;
  box-shadow: 0 8px 22px rgba(0, 0, 0, .095) !important;
}

html.rc-app-bg body #app#app#app .player-modal .settings-container .settings > .switch-wrapper + .switch-wrapper {
  border-top-width: 0 !important;
  border-top-color: transparent !important;
}

html.rc-app-bg body #app#app#app .player-modal .settings-container .settings > .switch-wrapper .switch-text .title,
html.rc-app-bg body #app#app#app .player-modal .settings-container .settings > .switch-wrapper .switch-text .title p {
  color: rgba(255, 255, 255, .9) !important;
}

html.rc-app-bg body #app#app#app .player-modal .settings-container .settings > .switch-wrapper .subtitle {
  color: rgba(255, 255, 255, .52) !important;
}

html.rc-app-bg body #app#app#app .player-modal .settings-container .settings > .switch-wrapper .custom-switch .slider {
  background-color: rgba(0, 0, 0, .3) !important;
  border: 1px solid rgba(255, 255, 255, .13) !important;
  box-shadow:
    inset 0 1px 3px rgba(0, 0, 0, .18),
    0 1px 0 rgba(255, 255, 255, .04) !important;
}

html.rc-app-bg body #app#app#app .player-modal .settings-container .settings > .switch-wrapper .custom-switch input:checked + .slider {
  background-color: rgba(34, 197, 94, .82) !important;
  border-color: rgba(134, 239, 172, .48) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .22),
    0 0 10px rgba(34, 197, 94, .16) !important;
}

/* Dialog switches: clearly show an enabled state (including chat mute). */
html.rc-app-bg body #app#app#app .modal-border > .modal .custom-switch input:checked + .slider,
html.rc-app-bg body #app#app#app .modal-border > .modal .custom-switch input.peer:checked + .slider.peer,
html.rc-app-bg body #app#app#app .modal-border > .modal .custom-switch .peer:checked + .peer {
  --tw-bg-opacity: 1 !important;
  background: rgb(34, 197, 94) !important;
  background-color: rgb(34, 197, 94) !important;
  border-color: rgba(134, 239, 172, .72) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .28),
    0 0 12px rgba(34, 197, 94, .28) !important;
}

/* Context menus use native :hover painting; avoid a queued transition while
   Vue updates the focused menu item under a rapidly moving pointer. */
html.rc-app-bg body .p-contextmenu .p-menuitem-content {
  transition: none !important;
}

/* Remove the old narrow fills behind labels inside overview cards. */
html.rc-app-bg body #app#app#app .player-modal .table-card .list-item > .title,
html.rc-app-bg body #app#app#app .player-modal .table-info .list-item > .title {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Player profile: keep a single blur layer so loading Statistics does not turn grey. */
html.rc-app-bg body #app#app#app .modal-border:has(.player-modal) > .modal {
  background: rgba(255, 255, 255, .025) !important;
  background-color: rgba(255, 255, 255, .025) !important;
  background-image: none !important;
  -webkit-backdrop-filter: blur(34px) saturate(100%) !important;
  backdrop-filter: blur(34px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.player-modal) .player-modal {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Player profile performance hints only; visual styles stay untouched. */
html.rc-app-bg body #app#app#app .modal-border:has(.player-modal),
html.rc-app-bg body #app#app#app .modal-border:has(.player-modal) > .modal {
  will-change: opacity, transform !important;
  backface-visibility: hidden !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.player-modal) > .modal,
html.rc-app-bg body:has(.player-modal) .modal-backdrop {
  will-change: opacity, transform, backdrop-filter !important;
  backface-visibility: hidden !important;
}

/* Ban-list subscription menu: clear, colourless liquid glass. */
html.rc-app-bg body:has(.tabbed-navigation > .header > .element.selected:nth-child(4)) .p-contextmenu {
  overflow: hidden !important;
  padding: 7px !important;
  background-color: rgba(255, 255, 255, .025) !important;
  background-image:
    radial-gradient(circle at 18% 0%, rgba(255, 255, 255, .16), transparent 48%),
    linear-gradient(145deg, rgba(255, 255, 255, .065), rgba(255, 255, 255, .008) 62%, rgba(255, 255, 255, .028)) !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-top-color: rgba(255, 255, 255, .28) !important;
  border-radius: 16px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .15),
    inset 0 -1px 0 rgba(255, 255, 255, .025),
    0 18px 42px rgba(0, 0, 0, .22) !important;
  -webkit-backdrop-filter: blur(26px) saturate(118%) !important;
  backdrop-filter: blur(26px) saturate(118%) !important;
}

html.rc-app-bg body:has(.tabbed-navigation > .header > .element.selected:nth-child(4)) .p-contextmenu :is(.p-contextmenu-root-list,.p-menuitem,.p-menuitem-content,.ra-button) {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.tabbed-navigation > .header > .element.selected:nth-child(4)) .p-contextmenu .p-menuitem-content {
  overflow: hidden !important;
  border: 1px solid transparent !important;
  border-radius: 10px !important;
}

html.rc-app-bg body:has(.tabbed-navigation > .header > .element.selected:nth-child(4)) .p-contextmenu .p-menuitem-content:hover {
  background:
    radial-gradient(circle at 16% 0%, rgba(255, 255, 255, .13), transparent 50%),
    linear-gradient(135deg, rgba(255, 255, 255, .075), rgba(255, 255, 255, .014)) !important;
  border-color: rgba(255, 255, 255, .13) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

/* Global unban dialog: one clear, colourless liquid-glass surface. */
html.rc-app-bg body .modal-border:has(.global-unban-modal) {
  border: 1px solid rgba(255, 255, 255, .1) !important;
  border-radius: 19px !important;
  background: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .modal-border:has(.global-unban-modal) > .modal {
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .11) !important;
  border-radius: 18px !important;
  background-color: rgba(255, 255, 255, .028) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(24px) saturate(105%) !important;
  backdrop-filter: blur(24px) saturate(105%) !important;
}

html.rc-app-bg body .global-unban-modal,
html.rc-app-bg body .global-unban-modal > .divided-card,
html.rc-app-bg body .global-unban-modal :is(.header,.content,.footer,.switch-wrapper) {
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .global-unban-modal :is(.header,.footer) {
  border-color: rgba(255, 255, 255, .075) !important;
}

html.rc-app-bg body .global-unban-modal :is(.preview,.input-box,input:not([type="checkbox"]),.p-inputtext) {
  background-color: rgba(255, 255, 255, .016) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .09) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .global-unban-modal .ra-button {
  background-color: rgba(255, 255, 255, .016) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .1) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .global-unban-modal .ra-button:hover {
  background-color: rgba(255, 255, 255, .035) !important;
  border-color: rgba(255, 255, 255, .19) !important;
}

/* All confirmation dialogs: compact vertical rhythm. */
html.rc-app-bg body .modal > .confirm {
  gap: 8px !important;
  padding: 16px 16px 12px !important;
}

html.rc-app-bg body .modal > .confirm > .content {
  padding: 10px 12px 8px !important;
}

html.rc-app-bg body .modal > .confirm > .content > div:has(> svg) {
  width: 72px !important;
  height: 62px !important;
  margin-top: 0 !important;
  margin-bottom: 6px !important;
}

html.rc-app-bg body .modal > .confirm > .content > div:has(> svg) > svg {
  width: 72px !important;
  height: 62px !important;
}

html.rc-app-bg body .modal > .confirm > .content > .title {
  margin-top: 0 !important;
  margin-bottom: 4px !important;
}

html.rc-app-bg body .modal > .confirm > .content > .description {
  margin-top: 0 !important;
  line-height: 18px !important;
}

html.rc-app-bg body .modal > .confirm > .buttons {
  height: 42px !important;
  margin-top: 6px !important;
  padding-top: 6px !important;
}

html.rc-app-bg body .modal > .confirm > .buttons .ra-button {
  height: 36px !important;
  min-height: 36px !important;
  padding-top: 7px !important;
  padding-bottom: 7px !important;
}

/* Ban-list destructive action labels. */
html.rc-app-bg body:has(.tabbed-navigation > .header > .element.selected:nth-child(4))
  .destructive-action > .switch-text > .title {
  color: #ff5c5c !important;
}

/* Global unban submit: plain red, without glow or gradients. */
html.rc-app-bg body .global-unban-modal .ra-button.destructive {
  color: #fff !important;
  background-color: #d9484e !important;
  background-image: none !important;
  border: 1px solid #e25a60 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .global-unban-modal .ra-button.destructive :is(.wrapper,p,span) {
  color: #fff !important;
}

html.rc-app-bg body .global-unban-modal .ra-button.destructive:hover {
  background-color: #c93f45 !important;
  border-color: #d94d53 !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .modal-border:not(.transparent) > .modal
  .global-unban-modal .ra-button.destructive {
  color: #fff !important;
  background: #d9484e !important;
  border: 1px solid #e25a60 !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app#app#app .modal-border:not(.transparent) > .modal
  .global-unban-modal .ra-button.destructive:hover {
  background: #c93f45 !important;
  border-color: #d94d53 !important;
  box-shadow: none !important;
}



/* Home dashboard: neutral liquid-glass cards. */
html.rc-app-bg body #app#app#app #rc-panel-home .rph-stat,
html.rc-app-bg body #app#app#app #rc-panel-home .rph-list-wrap {
  background: rgba(255, 255, 255, .045) !important;
  background-color: rgba(255, 255, 255, .045) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .075),
    inset 0 -1px 0 rgba(255, 255, 255, .018),
    0 14px 38px rgba(0, 0, 0, .14) !important;
  -webkit-backdrop-filter: blur(20px) saturate(100%) !important;
  backdrop-filter: blur(20px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app #rc-panel-home .rph-stat {
  transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

html.rc-app-bg body #app#app#app #rc-panel-home .rph-stat:hover {
  background: rgba(255, 255, 255, .065) !important;
  border-color: rgba(255, 255, 255, .21) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .11),
    0 17px 42px rgba(0, 0, 0, .17) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg body #app#app#app #rc-panel-home .rph-server {
  background: rgba(255, 255, 255, .032) !important;
  background-color: rgba(255, 255, 255, .032) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .115) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .055),
    0 9px 26px rgba(0, 0, 0, .1) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: transform .16s ease, background-color .16s ease, border-color .16s ease, box-shadow .16s ease !important;
}

html.rc-app-bg body #app#app#app #rc-panel-home .rph-server:hover {
  background: rgba(255, 255, 255, .055) !important;
  border-color: rgba(255, 255, 255, .19) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .085),
    0 11px 30px rgba(0, 0, 0, .13) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg body #app#app#app #rc-panel-home .rph-stat-icon,
html.rc-app-bg body #app#app#app #rc-panel-home .rph-list-icon {
  background: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .11) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}

/* Chat composer: send icon without the old grey square. */
html.rc-app-bg body #app#app#app .player-message-chat-root .player-message-page-footer-container .input-field > button.ra-button {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  filter: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app#app#app .player-message-chat-root .player-message-page-footer-container .input-field > button.ra-button:hover,
html.rc-app-bg body #app#app#app .player-message-chat-root .player-message-page-footer-container .input-field > button.ra-button:focus,
html.rc-app-bg body #app#app#app .player-message-chat-root .player-message-page-footer-container .input-field > button.ra-button:active {
  background: rgba(255, 255, 255, .045) !important;
  border: 0 !important;
  box-shadow: none !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg body #app#app#app .player-message-chat-root .player-message-page-footer-container .input-field > button.ra-button .send {
  fill: rgba(255, 255, 255, .78) !important;
  color: rgba(255, 255, 255, .78) !important;
  filter: none !important;
}

/* Direct-message/reply indicator above the composer. */
html.rc-app-bg body #app#app#app .player-message-chat-root .player-message-page-footer-container .input-field-container > :not(.input-field) {
  background: rgba(255, 255, 255, .045) !important;
  background-color: rgba(255, 255, 255, .045) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .15) !important;
  border-bottom-color: rgba(255, 255, 255, .09) !important;
  border-radius: 12px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .075),
    0 8px 22px rgba(0, 0, 0, .1) !important;
  -webkit-backdrop-filter: blur(16px) saturate(100%) !important;
  backdrop-filter: blur(16px) saturate(100%) !important;
}

/* Chat message action menu. */
html.rc-app-bg body:has(.player-message-chat-root) > .p-contextmenu,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu.p-component {
  background: rgba(24, 24, 24, .64) !important;
  background-color: rgba(24, 24, 24, .64) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .145) !important;
  border-radius: 14px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .075),
    0 20px 48px rgba(0, 0, 0, .34) !important;
  -webkit-backdrop-filter: blur(22px) saturate(100%) !important;
  backdrop-filter: blur(22px) saturate(100%) !important;
  overflow: visible !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu :is(.p-contextmenu-root-list,.p-menuitem,.p-menuitem-content,.ra-button) {
  background: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-menuitem-content:hover,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-menuitem-content:focus-within {
  background: rgba(255, 255, 255, .075) !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-submenu-list {
  z-index: 20 !important;
  min-width: 150px !important;
  padding: 6px !important;
  overflow: visible !important;
  pointer-events: auto !important;
  border: 1px solid rgba(255, 255, 255, .17) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .105) !important;
  background-color: rgba(255, 255, 255, .105) !important;
  background-image: none !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, .22) !important;
  -webkit-backdrop-filter: blur(32px) saturate(100%) !important;
  backdrop-filter: blur(32px) saturate(100%) !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-submenu-list .p-menuitem,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-submenu-list .p-menuitem-content,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-submenu-list .ra-button {
  pointer-events: auto !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-submenu-list .p-menuitem-content,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-submenu-list .ra-button {
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-submenu-list
  .p-menuitem-content:hover,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu .p-submenu-list
  .p-menuitem-content:focus-within {
  border-color: rgba(255, 255, 255, .12) !important;
  background: rgba(255, 255, 255, .075) !important;
  box-shadow: none !important;
}

/* Mute setup modal: one coherent glass surface, clean inner controls. */
html.rc-app-bg body #app#app#app .modal-border > .modal:has(.mute-modal),
html.rc-app-bg body #app#app#app .vfm__content:has(.mute-modal) {
  background: rgba(24, 24, 24, .58) !important;
  background-color: rgba(24, 24, 24, .58) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .15) !important;
  border-radius: 16px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    0 26px 68px rgba(0, 0, 0, .42) !important;
  -webkit-backdrop-filter: blur(24px) saturate(100%) !important;
  backdrop-filter: blur(24px) saturate(100%) !important;
  overflow: hidden !important;
}

html.rc-app-bg body #app#app#app .modal-border > .modal:has(.mute-modal) :is(.header,.content,.footer,.divided-card),
html.rc-app-bg body #app#app#app .vfm__content:has(.mute-modal) :is(.header,.content,.footer,.divided-card) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .modal-border > .modal:has(.mute-modal) :is(input,textarea,.input-field,.select,.activator),
html.rc-app-bg body #app#app#app .vfm__content:has(.mute-modal) :is(input,textarea,.input-field,.select,.activator) {
  background: rgba(255, 255, 255, .045) !important;
  background-color: rgba(255, 255, 255, .045) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .13) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

/* Chat mute setup: clear neutral glass instead of a black modal. */
html.rc-app-bg body #app#app#app .modal-border:has(.mute-modal) > .modal,
html.rc-app-bg body #app#app#app .modal-border:has(.mute-modal) > .modal:has(.custom-switch):has(.select-wrapper) {
  background: rgba(255, 255, 255, .055) !important;
  background-color: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .17) !important;
  border-radius: 17px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .095),
    0 26px 68px rgba(0, 0, 0, .28) !important;
  -webkit-backdrop-filter: blur(28px) saturate(100%) !important;
  backdrop-filter: blur(28px) saturate(100%) !important;
  overflow: hidden !important;
}

html.rc-app-bg body #app#app#app .mute-modal,
html.rc-app-bg body #app#app#app .mute-modal > .card,
html.rc-app-bg body #app#app#app .mute-modal :is(.card-header,.card-content,.card-footer) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .mute-modal .card-header,
html.rc-app-bg body #app#app#app .mute-modal .card-footer {
  border-color: rgba(255, 255, 255, .09) !important;
}

html.rc-app-bg body #app#app#app .mute-modal .card-content > div > .bg-grey-950 {
  background: rgba(255, 255, 255, .04) !important;
  background-color: rgba(255, 255, 255, .04) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .105) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

html.rc-app-bg body #app#app#app .mute-modal .card-content > div > .bg-grey-950 .bg-grey-850 {
  background: rgba(255, 255, 255, .055) !important;
  background-color: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
}

html.rc-app-bg body #app#app#app .mute-modal :is(.input-box,input,textarea,.select,.activator) {
  background: rgba(255, 255, 255, .038) !important;
  background-color: rgba(255, 255, 255, .038) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .13) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app#app#app .mute-modal .ra-button:not(.destructive) {
  background: rgba(255, 255, 255, .04) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .12) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

html.rc-app-bg body #app#app#app .mute-modal .ra-button:not(.destructive):hover:not(:disabled) {
  background: rgba(255, 255, 255, .075) !important;
  border-color: rgba(255, 255, 255, .19) !important;
}

/* Three chat-message action buttons. */
html.rc-app-bg body #app#app#app .player-message-chat-root .player-message .interaction-buttons {
  background: rgba(255, 255, 255, .045) !important;
  background-color: rgba(255, 255, 255, .045) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .13) !important;
  border-radius: 10px !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .065),
    0 10px 25px rgba(0, 0, 0, .16) !important;
  -webkit-backdrop-filter: blur(16px) saturate(100%) !important;
  backdrop-filter: blur(16px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .player-message-chat-root .player-message .interaction-button {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
  transition: background-color .15s ease, transform .15s ease !important;
}

html.rc-app-bg body #app#app#app .player-message-chat-root .player-message .interaction-button:hover {
  background: rgba(255, 255, 255, .085) !important;
  transform: translateY(-1px) !important;
}

/* Clear glass for the expanded chat action menu. */
html.rc-app-bg body:has(.player-message-chat-root) > .p-contextmenu,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu.p-component {
  background: rgba(255, 255, 255, .095) !important;
  background-color: rgba(255, 255, 255, .095) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .17) !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .09),
    0 20px 48px rgba(0, 0, 0, .28) !important;
  -webkit-backdrop-filter: blur(32px) saturate(100%) !important;
  backdrop-filter: blur(32px) saturate(100%) !important;
}

/* Player menu performance: preserve its glass, but make item hover immediate. */
html.rc-app-bg body:has(.player-modal) .p-contextmenu :is(.p-contextmenu-root-list,.p-menuitem,.p-menuitem-content,.ra-button),
html.rc-app-bg body:has(.player-modal) .p-contextmenu :is(.p-contextmenu-root-list,.p-menuitem,.p-menuitem-content,.ra-button)::before,
html.rc-app-bg body:has(.player-modal) .p-contextmenu :is(.p-contextmenu-root-list,.p-menuitem,.p-menuitem-content,.ra-button)::after {
  transition: none !important;
  transform: none !important;
  filter: none !important;
  box-shadow: none !important;
  will-change: auto !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content > .ra-button {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Keyboard focus must not leave a stale white plate under the mouse. */
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content:focus-within:not(:hover) {
  background: transparent !important;
  border-color: transparent !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content:hover {
  background: rgba(255, 255, 255, .055) !important;
  border-color: rgba(255, 255, 255, .09) !important;
}

/* Keep the expensive glass static while menu items react on their own layer. */
html.rc-app-bg body:has(.player-modal) > .p-contextmenu,
html.rc-app-bg body:has(.player-modal) .p-contextmenu.p-component {
  position: absolute !important;
  isolation: isolate !important;
  background: transparent !important;
  background-color: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body:has(.player-modal) > .p-contextmenu::before,
html.rc-app-bg body:has(.player-modal) .p-contextmenu.p-component::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: -1 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  background: rgba(255, 255, 255, .026) !important;
  -webkit-backdrop-filter: blur(22px) saturate(100%) !important;
  backdrop-filter: blur(22px) saturate(100%) !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content:hover,
html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content:focus-within {
  background: transparent !important;
  border-color: transparent !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content > button.ra-button {
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  transition: none !important;
  transform: translateZ(0) !important;
  backface-visibility: hidden !important;
}

html.rc-app-bg body:has(.player-modal) .p-contextmenu .p-menuitem-content > button.ra-button:hover {
  background: rgba(255, 255, 255, .055) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .09) !important;
}

/* Command variables and server response: one clean neutral Liquid Glass family. */
html.rc-app-bg body #app#app#app .modal-border:has(.execute-command-modal),
html.rc-app-bg body #app#app#app .modal-border:has(.command-response-modal) {
  padding: 1px !important;
  overflow: visible !important;
  border: 1px solid rgba(255, 255, 255, .17) !important;
  border-top-color: rgba(255, 255, 255, .28) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, .08),
    0 22px 58px rgba(0, 0, 0, .3) !important;
  -webkit-backdrop-filter: blur(30px) saturate(105%) !important;
  backdrop-filter: blur(30px) saturate(105%) !important;
}

html.rc-app-bg body #app#app#app .modal-border:has(.execute-command-modal) > .modal,
html.rc-app-bg body #app#app#app .modal-border:has(.command-response-modal) > .modal,
html.rc-app-bg body #app#app#app .execute-command-modal,
html.rc-app-bg body #app#app#app .command-response-modal {
  background: rgba(255, 255, 255, .025) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 17px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body #app#app#app :is(.execute-command-modal,.command-response-modal) :is(.header,.footer) {
  background: rgba(255, 255, 255, .025) !important;
  background-image: none !important;
  border-color: rgba(255, 255, 255, .09) !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app :is(.execute-command-modal,.command-response-modal) :is(.input-box,input,textarea,.select,.command,.command-box,.response,.content-layer) {
  background: rgba(255, 255, 255, .035) !important;
  background-image: none !important;
  border: 1px solid rgba(255, 255, 255, .13) !important;
  border-top-color: rgba(255, 255, 255, .2) !important;
  border-radius: 11px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body #app#app#app :is(.execute-command-modal,.command-response-modal) .ra-button {
  border-color: rgba(255, 255, 255, .15) !important;
  background: rgba(255, 255, 255, .045) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

html.rc-app-bg body #app#app#app :is(.execute-command-modal,.command-response-modal) .ra-button:hover {
  border-color: rgba(255, 255, 255, .24) !important;
  background: rgba(255, 255, 255, .085) !important;
}

/* Server-response accordion: remove the remaining opaque console skin. */
html.rc-app-bg body #app#app#app .command-response-modal .accordion {
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .15) !important;
  border-top-color: rgba(255, 255, 255, .23) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .025) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

html.rc-app-bg body #app#app#app .command-response-modal .accordion > .header {
  background: rgba(255, 255, 255, .045) !important;
  background-image: none !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, .09) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body #app#app#app .command-response-modal .accordion > .body,
html.rc-app-bg body #app#app#app .command-response-modal .accordion > .body.-opened,
html.rc-app-bg body #app#app#app .command-response-modal .accordion > .body > .inner {
  background: rgba(255, 255, 255, .018) !important;
  background-color: rgba(255, 255, 255, .018) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .command-response-modal .accordion .copy-button,
html.rc-app-bg body #app#app#app .command-response-modal .accordion button {
  background: rgba(255, 255, 255, .04) !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 8px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

/* The response modal is teleported outside #app. */
html.rc-app-bg body .modal-border:has(.command-response-modal) {
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-top-color: rgba(255, 255, 255, .3) !important;
  border-radius: 18px !important;
  background: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09), 0 22px 58px rgba(0, 0, 0, .28) !important;
  -webkit-backdrop-filter: blur(30px) saturate(105%) !important;
  backdrop-filter: blur(30px) saturate(105%) !important;
}

html.rc-app-bg body .modal-border:has(.command-response-modal) > .modal,
html.rc-app-bg body .command-response-modal {
  background: rgba(255, 255, 255, .02) !important;
  background-image: none !important;
  border-radius: 17px !important;
  box-shadow: none !important;
}

html.rc-app-bg body .command-response-modal .accordion {
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  border-top-color: rgba(255, 255, 255, .25) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .025) !important;
  background-color: rgba(255, 255, 255, .025) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

html.rc-app-bg body .command-response-modal .accordion .header {
  background: rgba(255, 255, 255, .045) !important;
  background-color: rgba(255, 255, 255, .045) !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, .1) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .04) !important;
}

html.rc-app-bg body .command-response-modal .accordion .body,
html.rc-app-bg body .command-response-modal .accordion .body.-opened,
html.rc-app-bg body .command-response-modal .accordion .inner,
html.rc-app-bg body .command-response-modal :is(.jv-container,.jv-code,.jv-node,.my-theme),
html.rc-app-bg body .command-response-modal [class*="bg-grey-1000"] {
  background: rgba(255, 255, 255, .018) !important;
  background-color: rgba(255, 255, 255, .018) !important;
  background-image: none !important;
  box-shadow: none !important;
}

/* Hard override for the real scoped Accordion used by server responses. */
body .accordion[data-v-ead8a5e7] {
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-top-color: rgba(255, 255, 255, .28) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .025) !important;
  background-color: rgba(255, 255, 255, .025) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05) !important;
}

body .accordion[data-v-ead8a5e7] > .header[data-v-ead8a5e7] {
  background: rgba(255, 255, 255, .05) !important;
  background-color: rgba(255, 255, 255, .05) !important;
  background-image: none !important;
  border-bottom: 1px solid rgba(255, 255, 255, .11) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

body .accordion[data-v-ead8a5e7] > .body[data-v-ead8a5e7],
body .accordion[data-v-ead8a5e7] > .body[data-v-ead8a5e7].-opened {
  background: rgba(255, 255, 255, .022) !important;
  background-color: rgba(255, 255, 255, .022) !important;
  background-image: none !important;
  border: 0 !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .025) !important;
}

body .accordion[data-v-ead8a5e7] > .body[data-v-ead8a5e7] > .inner[data-v-ead8a5e7],
body .accordion[data-v-ead8a5e7] > .body[data-v-ead8a5e7] > .inner[data-v-ead8a5e7] :is(.jv-container,.jv-code,.jv-node,.my-theme,pre,code) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body .accordion[data-v-ead8a5e7] > .body[data-v-ead8a5e7] > .inner[data-v-ead8a5e7] * {
  background-color: transparent !important;
  background-image: none !important;
}

/* Employee profile: clean bright Liquid Glass, without the old black fill. */
html.rc-app-bg body .modal-border:has(.client-details-modal) {
  padding: 1px !important;
  border: 1px solid rgba(255, 255, 255, .2) !important;
  border-top-color: rgba(255, 255, 255, .34) !important;
  border-radius: 21px !important;
  background: rgba(255, 255, 255, .065) !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .1), 0 24px 62px rgba(0, 0, 0, .27) !important;
  -webkit-backdrop-filter: blur(34px) saturate(108%) !important;
  backdrop-filter: blur(34px) saturate(108%) !important;
}

html.rc-app-bg body .modal-border:has(.client-details-modal) > .modal,
html.rc-app-bg body #app .modal-border:has(.client-details-modal[internal-id^="?staff="]) > .modal {
  background: rgba(255, 255, 255, .035) !important;
  background-color: rgba(255, 255, 255, .035) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 20px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .client-details-modal,
html.rc-app-bg body .client-details-modal > .header,
html.rc-app-bg body .client-details-modal > .divided-card,
html.rc-app-bg body .client-details-modal .content {
  background-color: transparent !important;
  background-image: none !important;
}

html.rc-app-bg body .client-details-modal > .header {
  border-bottom-color: rgba(255, 255, 255, .12) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .035) !important;
}

html.rc-app-bg body .client-details-modal .info .row {
  border: 1px solid rgba(255, 255, 255, .15) !important;
  border-top-color: rgba(255, 255, 255, .22) !important;
  background: rgba(255, 255, 255, .04) !important;
  background-color: rgba(255, 255, 255, .04) !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045) !important;
}

/* Employee profile is also used on pages without the rc-app-bg html class. */
body .modal-border:has(.client-details-modal) {
  padding: 1px !important;
  border: 1px solid rgba(255, 255, 255, .28) !important;
  border-top-color: rgba(255, 255, 255, .46) !important;
  border-radius: 21px !important;
  background: rgba(255, 255, 255, .12) !important;
  background-color: rgba(255, 255, 255, .12) !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 24px 60px rgba(0, 0, 0, .24) !important;
  -webkit-backdrop-filter: blur(30px) saturate(112%) !important;
  backdrop-filter: blur(30px) saturate(112%) !important;
}

body .modal-border:has(.client-details-modal) > .modal {
  background: rgba(255, 255, 255, .06) !important;
  background-color: rgba(255, 255, 255, .06) !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 20px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .075) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

body .client-details-modal,
body .client-details-modal > .header,
body .client-details-modal > .divided-card,
body .client-details-modal .content {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

body .client-details-modal > .header {
  border-bottom: 1px solid rgba(255, 255, 255, .14) !important;
}

body .client-details-modal .info .row {
  border: 1px solid rgba(255, 255, 255, .2) !important;
  border-top-color: rgba(255, 255, 255, .32) !important;
  background: rgba(255, 255, 255, .075) !important;
  background-color: rgba(255, 255, 255, .075) !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08) !important;
}

body .client-details-modal > .header > .close {
  border-color: rgba(255, 255, 255, .25) !important;
  background: rgba(255, 255, 255, .12) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12) !important;
}

/* Settings / Reports: visible tabs and select options on pages without rc-app-bg. */
body .tabbed-navigation > .header {
  overflow: visible !important;
  padding: 3px !important;
  border: 1px solid rgba(255, 255, 255, .12) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .045) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}

body .tabbed-navigation > .header .element {
  color: rgba(255, 255, 255, .68) !important;
  opacity: 1 !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  background: transparent !important;
  box-shadow: none !important;
}

body .tabbed-navigation > .header .element:hover {
  color: rgba(255, 255, 255, .94) !important;
  background: rgba(255, 255, 255, .075) !important;
  border-color: rgba(255, 255, 255, .1) !important;
}

body .tabbed-navigation > .header .element.selected,
body .tabbed-navigation > .header .element.-selected,
body .tabbed-navigation > .header .element[aria-current="page"] {
  color: #fff !important;
  background: rgba(255, 255, 255, .13) !important;
  border-color: rgba(255, 255, 255, .2) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11) !important;
}

body .tabbed-navigation .content.pt-8 .section,
body .tabbed-navigation .content.pt-8 .settings-container,
body .tabbed-navigation .content.pt-8 .settings,
body .tabbed-navigation .content.pt-8 .switch-wrapper {
  overflow: visible !important;
}

body .tabbed-navigation .content.pt-8 .section:has(.select.settings .options-list),
body .tabbed-navigation .content.pt-8 .settings-container:has(.select.settings .options-list),
body .tabbed-navigation .content.pt-8 .settings:has(.select.settings .options-list),
body .tabbed-navigation .content.pt-8 .switch-wrapper:has(.select.settings .options-list) {
  position: relative !important;
  z-index: 500 !important;
}

body .tabbed-navigation .content.pt-8 .select.settings {
  position: relative !important;
}

body .tabbed-navigation .content.pt-8 .select.settings .activator {
  color: rgba(255, 255, 255, .94) !important;
  opacity: 1 !important;
  border: 1px solid rgba(255, 255, 255, .16) !important;
  border-top-color: rgba(255, 255, 255, .24) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .07) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}

body .tabbed-navigation .content.pt-8 .select.settings .options-list {
  z-index: 510 !important;
  min-width: 120px !important;
  padding: 5px !important;
  overflow: visible !important;
  color: rgba(255, 255, 255, .94) !important;
  border: 1px solid rgba(255, 255, 255, .2) !important;
  border-top-color: rgba(255, 255, 255, .32) !important;
  border-radius: 12px !important;
  background: rgba(52, 47, 56, .94) !important;
  background-image: none !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09), 0 18px 42px rgba(0, 0, 0, .34) !important;
  -webkit-backdrop-filter: blur(26px) saturate(108%) !important;
  backdrop-filter: blur(26px) saturate(108%) !important;
}

body .tabbed-navigation .content.pt-8 .select.settings .options-list .option {
  min-height: 32px !important;
  padding: 7px 9px !important;
  color: rgba(255, 255, 255, .88) !important;
  opacity: 1 !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
}

body .tabbed-navigation .content.pt-8 .select.settings .options-list .option:hover,
body .tabbed-navigation .content.pt-8 .select.settings .options-list .option.-selected {
  color: #fff !important;
  border-color: rgba(255, 255, 255, .14) !important;
  background: rgba(255, 255, 255, .12) !important;
}

/* Settings / Reports (CustomReportsTab): keep SelectInput menus visible. */
body .section[data-v-8d2201d4],
body .section[data-v-8d2201d4] > div,
body .section[data-v-8d2201d4] .switch-wrapper,
body .section[data-v-8d2201d4] .select-wrapper,
body .section[data-v-8d2201d4] .select.settings {
  overflow: visible !important;
}

body .section[data-v-8d2201d4]:has(.options-list),
body .section[data-v-8d2201d4] > div:has(.options-list),
body .section[data-v-8d2201d4] .switch-wrapper:has(.options-list),
body .section[data-v-8d2201d4] .select-wrapper:has(.options-list) {
  position: relative !important;
  z-index: 900 !important;
}

body .section[data-v-8d2201d4] .select.settings {
  position: relative !important;
}

body .section[data-v-8d2201d4] .select.settings .activator {
  color: rgba(255, 255, 255, .96) !important;
  opacity: 1 !important;
  border: 1px solid rgba(255, 255, 255, .2) !important;
  border-top-color: rgba(255, 255, 255, .3) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .09) !important;
  background-image: linear-gradient(145deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .015)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .09), 0 8px 22px rgba(0, 0, 0, .12) !important;
}

body .section[data-v-8d2201d4] .select.settings .options-list {
  z-index: 950 !important;
  min-width: 132px !important;
  max-height: none !important;
  padding: 6px !important;
  overflow: visible !important;
  color: rgba(255, 255, 255, .96) !important;
  opacity: 1 !important;
  border: 1px solid rgba(255, 255, 255, .24) !important;
  border-top-color: rgba(255, 255, 255, .38) !important;
  border-radius: 13px !important;
  background: rgba(73, 64, 76, .9) !important;
  background-image: linear-gradient(145deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .015)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .11), 0 18px 42px rgba(0, 0, 0, .32) !important;
  -webkit-backdrop-filter: blur(24px) saturate(120%) !important;
  backdrop-filter: blur(24px) saturate(120%) !important;
}

body .section[data-v-8d2201d4] .select.settings .options-list .option,
body .section[data-v-8d2201d4] .select.settings .options-list .option span {
  color: rgba(255, 255, 255, .94) !important;
  opacity: 1 !important;
}

body .section[data-v-8d2201d4] .select.settings .options-list .option {
  min-height: 34px !important;
  padding: 8px 10px !important;
  border: 1px solid transparent !important;
  border-radius: 9px !important;
  background: transparent !important;
}

body .section[data-v-8d2201d4] .select.settings .options-list .option:hover {
  color: #fff !important;
  border-color: rgba(255, 255, 255, .16) !important;
  background: rgba(255, 255, 255, .13) !important;
}

/* Specificity override for the reports page's older rc-app-bg rules. */
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings,
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings-container,
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .switch-wrapper,
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .select-wrapper,
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .select.settings {
  overflow: visible !important;
}

html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings:has(.options-list),
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .switch-wrapper:has(.options-list),
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .select-wrapper:has(.options-list),
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .select.settings:has(.options-list) {
  position: relative !important;
  z-index: 1200 !important;
}

html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings .select.settings .activator {
  position: relative !important;
  isolation: isolate !important;
  overflow: hidden !important;
  color: #fff !important;
  opacity: 1 !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-radius: 10px !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings .select.settings .activator::before {
  display: none !important;
  content: none !important;
}

html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings .select.settings .activator svg {
  color: rgba(255, 255, 255, .78) !important;
  fill: rgba(255, 255, 255, .78) !important;
  opacity: 1 !important;
}

html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings .select.settings .options-list {
  z-index: 1250 !important;
  max-height: none !important;
  overflow: visible !important;
  color: #fff !important;
  opacity: 1 !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-top-color: rgba(255, 255, 255, .28) !important;
  background-color: rgba(255, 255, 255, .018) !important;
  background-image: radial-gradient(circle at 16% 0%, rgba(255, 255, 255, .17), transparent 48%), linear-gradient(145deg, rgba(255, 255, 255, .05), rgba(255, 255, 255, .004) 58%, rgba(255, 255, 255, .02)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .16), inset 0 -1px 0 rgba(255, 255, 255, .025), 0 18px 42px rgba(0, 0, 0, .22) !important;
  -webkit-backdrop-filter: blur(30px) saturate(120%) !important;
  backdrop-filter: blur(30px) saturate(120%) !important;
}

html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings .select.settings .options-list .option,
html.rc-app-bg body .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4] .settings .select.settings .options-list .option span {
  color: rgba(255, 255, 255, .96) !important;
  opacity: 1 !important;
}

/* Reports selects: do not clip an opened menu; preserve its existing visuals. */
html.rc-app-bg body #app .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4]
  .settings-container[data-v-8d2201d4] > .settings:has(.select.settings .options-list) {
  overflow: visible !important;
  position: relative !important;
  z-index: 1300 !important;
}

html.rc-app-bg body #app .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4]
  .settings:has(.select.settings .options-list) .switch-wrapper:has(.options-list),
html.rc-app-bg body #app .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4]
  .settings:has(.select.settings .options-list) .select-wrapper:has(.options-list),
html.rc-app-bg body #app .tabbed-navigation .content.pt-8 .section[data-v-8d2201d4]
  .settings:has(.select.settings .options-list) .select.settings:has(.options-list) {
  position: relative !important;
  z-index: 1310 !important;
  overflow: visible !important;
}

/* Actions menu: prevent the destructive focus colour flashing around the popup. */
html.rc-app-bg body:has(.tabbed-navigation .section .actions) > .p-contextmenu,
html.rc-app-bg body:has(.tabbed-navigation .section .actions) .p-contextmenu.p-component {
  outline: 0 !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .075), 0 18px 42px rgba(0, 0, 0, .26) !important;
  transition: none !important;
}

html.rc-app-bg body:has(.tabbed-navigation .section .actions) .p-contextmenu
  :is(.p-contextmenu-root-list,.p-menuitem,.p-menuitem-content,.ra-button):is(:focus,:focus-visible,:focus-within,:active) {
  outline: 0 !important;
  border-color: transparent !important;
  box-shadow: none !important;
  transition: none !important;
}

/* New action: each control is one clean liquid-glass surface, without grey inner strips. */
html.rc-app-bg body #app#app#app .command-create-modal[internal-id="?command-create="]
  :is(.input-container > .input-box,.suggester-input-wrapper.dark,.select-wrapper.select-input-command > .select.modal) {
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-top-color: rgba(255, 255, 255, .23) !important;
  border-radius: 12px !important;
  background-color: rgba(255, 255, 255, .035) !important;
  background-image: radial-gradient(90% 120% at 12% 0%, rgba(255, 255, 255, .085), transparent 58%) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .075), inset 0 -1px 0 rgba(0, 0, 0, .08) !important;
  -webkit-backdrop-filter: blur(18px) saturate(112%) !important;
  backdrop-filter: blur(18px) saturate(112%) !important;
}

html.rc-app-bg body #app#app#app .command-create-modal[internal-id="?command-create="]
  :is(.input-container > .input-box,.suggester-input-wrapper.dark,.select-wrapper.select-input-command > .select.modal):is(:hover,:focus-within) {
  border-color: rgba(255, 255, 255, .21) !important;
  background-color: rgba(255, 255, 255, .055) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .105) !important;
}

html.rc-app-bg body #app#app#app .command-create-modal[internal-id="?command-create="]
  :is(.input-container > .input-box > input,.suggester-input-wrapper.dark > .input-box,.suggester-input-wrapper.dark > .input-box > input,.select-wrapper.select-input-command > .select.modal > .activator) {
  border: 0 !important;
  outline: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Project staff: clear liquid-glass cards, with one native add slot after the team. */
html.rc-app-bg body #app#app#app .staff-page .clients-grid > .client-card {
  isolation: isolate !important;
  overflow: hidden !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  border-top-color: rgba(255, 255, 255, .25) !important;
  border-radius: 14px !important;
  background-color: rgba(255, 255, 255, .035) !important;
  background-image: radial-gradient(105% 80% at 15% 0%, rgba(255, 255, 255, .105), transparent 58%), linear-gradient(145deg, rgba(255, 255, 255, .025), rgba(255, 255, 255, .006)) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .085), inset 0 -1px 0 rgba(0, 0, 0, .09), 0 14px 32px rgba(0, 0, 0, .13) !important;
  -webkit-backdrop-filter: blur(22px) saturate(118%) !important;
  backdrop-filter: blur(22px) saturate(118%) !important;
  transition: border-color 170ms ease, background-color 170ms ease, transform 170ms ease, box-shadow 170ms ease !important;
}

html.rc-app-bg body #app#app#app .staff-page .clients-grid > .client-card:not(.empty):hover {
  border-color: rgba(255, 255, 255, .22) !important;
  background-color: rgba(255, 255, 255, .055) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .12), 0 17px 36px rgba(0, 0, 0, .16) !important;
  transform: translateY(-1px) !important;
}

html.rc-app-bg body #app#app#app .staff-page .clients-grid > .client-card.empty {
  min-height: 122px !important;
  cursor: pointer !important;
  border-style: dashed !important;
  border-color: rgba(255, 255, 255, .16) !important;
  background-color: rgba(255, 255, 255, .018) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .055) !important;
}

html.rc-app-bg body #app#app#app .staff-page .clients-grid > .client-card.empty:hover {
  border-style: solid !important;
  border-color: rgba(255, 255, 255, .25) !important;
  background-color: rgba(255, 255, 255, .052) !important;
}

/* Player sidebar server picker: readable liquid glass above the filter rows. */
html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .select.settings > .options-list {
  --tw-bg-opacity: 0 !important;
  isolation: isolate !important;
  border: 1px solid rgba(255, 255, 255, .14) !important;
  background: rgba(34, 34, 34, .82) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(36px) saturate(100%) !important;
  backdrop-filter: blur(36px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .select.settings > .options-list > .option:is(:hover,.-selected) {
  border-color: rgba(255, 255, 255, .10) !important;
  background: rgba(255, 255, 255, .065) !important;
  box-shadow: none !important;
}

/* Sidebar toggles: one reliable label hit target and a clear active state. */
html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content .custom-switch {
  cursor: pointer !important;
  touch-action: manipulation !important;
  user-select: none !important;
  -webkit-user-select: none !important;
}

html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .custom-switch > .slider {
  pointer-events: none !important;
  transition: background-color 110ms ease, border-color 110ms ease, transform 110ms ease !important;
}

html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .custom-switch > input:checked + .slider {
  background: #18d874 !important;
  background-image: none !important;
  border-color: #36e98c !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .custom-switch > input:checked + .slider::before {
  background: #fff !important;
  box-shadow: none !important;
}

/* Players table license badges: clear, colourless glass outline. */
html.rc-app-bg body #app#app#app [data-v-9ecc2df1] .max-w-fit
  .container:is([title="Пиратский"],[title="Лицензия"],[title="Pirated"],[title="License"]) {
  --tw-bg-opacity: 0 !important;
  border: 1px solid rgba(255, 255, 255, .17) !important;
  border-radius: 7px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(14px) saturate(105%) !important;
  backdrop-filter: blur(14px) saturate(105%) !important;
}

/* Final chat-menu frost layer: keep all three menu levels visibly matte. */
html.rc-app-bg body:has(.player-message-chat-root) > .p-contextmenu.p-component,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu.p-component {
  background: rgba(255, 255, 255, .17) !important;
  background-color: rgba(255, 255, 255, .17) !important;
  background-image: none !important;
  -webkit-backdrop-filter: blur(38px) saturate(100%) !important;
  backdrop-filter: blur(38px) saturate(100%) !important;
}

html.rc-app-bg body:has(.player-message-chat-root) > .p-contextmenu.p-component .p-submenu-list,
html.rc-app-bg body:has(.player-message-chat-root) .p-contextmenu.p-component .p-submenu-list {
  background: rgba(255, 255, 255, .21) !important;
  background-color: rgba(255, 255, 255, .21) !important;
  background-image: none !important;
  -webkit-backdrop-filter: blur(38px) saturate(100%) !important;
  backdrop-filter: blur(38px) saturate(100%) !important;
}

/* Chat sidebar controls: clear glass without grey fills or flat row bands. */
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select.settings > .activator,
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  :is(.input-box,.suggester-input-wrapper,.tags-input,[class*="tag-input"]) {
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 10px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(20px) saturate(105%) !important;
  backdrop-filter: blur(20px) saturate(105%) !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select.settings > .activator:is(:hover,.-opened),
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  :is(.input-box,.suggester-input-wrapper,.tags-input,[class*="tag-input"]):focus-within {
  border-color: rgba(255, 255, 255, .30) !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  button:not(.close):not([role="switch"]) {
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 10px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(20px) saturate(105%) !important;
  backdrop-filter: blur(20px) saturate(105%) !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  button:not(.close):not([role="switch"]):hover {
  border-color: rgba(255, 255, 255, .30) !important;
  background: transparent !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .settings-container + .settings-container {
  border-top: 0 !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  :is(.select-wrapper,.settings-container)::before,
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  :is(.select-wrapper,.settings-container)::after {
  content: none !important;
  display: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  :is(.select-wrapper,.settings-container) {
  background: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

/* The app paints select captions as full-width dark strips. Keep captions plain. */
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select-wrapper > .select-label {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

/* Custom highlight lists: color selector and word tags without grey blocks. */
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .label .select.default,
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .label .select.default > .activator {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .suggester-input-wrapper .input-box > .value {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .suggester-input-wrapper .input-box > .value > .item {
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 999px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .suggester-input-wrapper .input-box > .value > .item:is(:hover,:focus-within) {
  border-color: rgba(255, 255, 255, .30) !important;
  background: transparent !important;
}

/* Remove the native dark strip drawn by the actual word-entry control. */
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .suggester-input-wrapper :is(input,textarea,[contenteditable="true"]),
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .suggester-input-wrapper :is(input,textarea,[contenteditable="true"]):is(:hover,:focus,:active) {
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-box-shadow: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .suggester-input-wrapper input:-webkit-autofill {
  -webkit-text-fill-color: inherit !important;
  -webkit-box-shadow: 0 0 0 1000px transparent inset !important;
  transition: background-color 99999s ease-out 0s !important;
}

/* Chat position dropdown: visible neutral liquid-glass surface. */
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select.settings > .options-list {
  z-index: 10000 !important;
  padding: 6px !important;
  border: 1px solid rgba(255, 255, 255, .22) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .055) !important;
  background-color: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  box-shadow: none !important;
  overflow: visible !important;
  -webkit-backdrop-filter: blur(40px) saturate(100%) !important;
  backdrop-filter: blur(40px) saturate(100%) !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select.settings > .options-list > .option {
  min-height: 32px !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select.settings > .options-list > .option:is(:hover,:focus-visible) {
  border-color: rgba(255, 255, 255, .18) !important;
  background: rgba(255, 255, 255, .10) !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .settings-container:has(.select.settings > .activator.-opened),
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select-wrapper:has(.select.settings > .activator.-opened),
html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select.settings:has(> .activator.-opened) {
  position: relative !important;
  z-index: 9999 !important;
  overflow: visible !important;
  isolation: auto !important;
}

html.rc-app-bg body:has(.player-message-chat-root) .sidebar-content
  .select.settings > .options-list > .option > span {
  position: relative !important;
  z-index: 1 !important;
  color: rgba(255, 255, 255, .94) !important;
  opacity: 1 !important;
}

/* Reports settings dropdowns: keep every sound option visible above adjacent rows. */
html.rc-app-bg body .tabbed-navigation .section
  :is(.settings-container,.settings,.switch-wrapper,.select-wrapper,.select.settings):has(.select.settings > .activator.-opened),
html.rc-app-bg body .tabbed-navigation .section
  .select.settings:has(> .activator.-opened) {
  position: relative !important;
  z-index: 10000 !important;
  overflow: visible !important;
  isolation: auto !important;
}

html.rc-app-bg body .tabbed-navigation .section
  .select.settings > .options-list {
  z-index: 10001 !important;
  max-height: none !important;
  padding: 6px !important;
  overflow: visible !important;
  border: 1px solid rgba(255, 255, 255, .22) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .055) !important;
  background-color: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(40px) saturate(100%) !important;
  backdrop-filter: blur(40px) saturate(100%) !important;
}

html.rc-app-bg body .tabbed-navigation .section
  .select.settings > .options-list > .option {
  display: flex !important;
  min-height: 32px !important;
  visibility: visible !important;
  opacity: 1 !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body .tabbed-navigation .section
  .select.settings > .options-list > .option:is(:hover,:focus-visible,.-selected) {
  border-color: rgba(255, 255, 255, .18) !important;
  background: rgba(255, 255, 255, .10) !important;
}

html.rc-app-bg body .tabbed-navigation .section
  .select.settings > .options-list > .option > span {
  color: rgba(255, 255, 255, .94) !important;
  opacity: 1 !important;
}

/* Sidebar dropdown final override: beats the legacy #app#app#app rule. */
html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  :is(.settings-container,.switch-wrapper,.select-wrapper,.select.settings):has(.select.settings > .activator.-opened),
html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .select.settings:has(> .activator.-opened) {
  position: relative !important;
  z-index: 20000 !important;
  overflow: visible !important;
  isolation: auto !important;
}

html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .select.settings > .options-list {
  z-index: 20001 !important;
  max-height: none !important;
  padding: 6px !important;
  overflow: visible !important;
  border: 1px solid rgba(255, 255, 255, .22) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .055) !important;
  background-color: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(40px) saturate(100%) !important;
  backdrop-filter: blur(40px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .select.settings > .options-list > .option {
  display: flex !important;
  min-height: 32px !important;
  visibility: visible !important;
  opacity: 1 !important;
  border: 1px solid transparent !important;
  border-radius: 8px !important;
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .select.settings > .options-list > .option:is(:hover,:focus-visible,.-selected) {
  border-color: rgba(255, 255, 255, .18) !important;
  background: rgba(255, 255, 255, .10) !important;
}

html.rc-app-bg body #app#app#app .content-with-sidebar .sidebar-content
  .select.settings > .options-list > .option > span {
  color: rgba(255, 255, 255, .96) !important;
  opacity: 1 !important;
}

/* Bans header staff/project picker: clear liquid glass instead of tonal black. */
html.rc-app-bg body #app#app#app .content-wrapper .header
  .select-wrapper.select-mobile .select.tonal-dark > .activator {
  border: 1px solid rgba(255, 255, 255, .18) !important;
  border-radius: 10px !important;
  background: rgba(255, 255, 255, .055) !important;
  background-color: rgba(255, 255, 255, .055) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(28px) saturate(100%) !important;
  backdrop-filter: blur(28px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .content-wrapper .header
  .select-wrapper.select-mobile .select.tonal-dark > .activator:is(:hover,.-opened) {
  border-color: rgba(255, 255, 255, .28) !important;
  background: rgba(255, 255, 255, .08) !important;
}

html.rc-app-bg body #app#app#app .content-wrapper .header
  .select-wrapper.select-mobile .select.tonal-dark > .options-list {
  border: 1px solid rgba(255, 255, 255, .20) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .065) !important;
  background-color: rgba(255, 255, 255, .065) !important;
  background-image: none !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(36px) saturate(100%) !important;
  backdrop-filter: blur(36px) saturate(100%) !important;
}

html.rc-app-bg body #app#app#app .content-wrapper .header
  .select-wrapper.select-mobile .select.tonal-dark > .options-list > .option {
  background: transparent !important;
  box-shadow: none !important;
}

html.rc-app-bg body #app#app#app .content-wrapper .header
  .select-wrapper.select-mobile .select.tonal-dark > .options-list > .option:is(:hover,.-selected) {
  background: rgba(255, 255, 255, .10) !important;
}

/* Compact, readable bottom-right runtime notices. */
html.rc-app-bg body #app#app#app .runtime-notification-wrapper[data-v-eda83e49],
html.rc-app-bg body #app#app#app .runtime-notification-wrapper {
  box-sizing: border-box !important;
  width: min(310px, calc(100vw - 20px)) !important;
  max-width: 310px !important;
  height: auto !important;
  min-height: 0 !important;
  gap: 8px !important;
  padding: 0 10px 10px !important;
}

html.rc-app-bg body #app#app#app .runtime-notification-wrapper
  .notification[data-v-eda83e49],
html.rc-app-bg body #app#app#app .runtime-notification-wrapper .notification {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 290px !important;
  min-height: 42px !important;
  gap: 9px !important;
  padding: 9px 11px !important;
  border-radius: 11px !important;
}

html.rc-app-bg body #app#app#app .runtime-notification-wrapper
  .notification > div:first-child > svg {
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
}

html.rc-app-bg body #app#app#app .runtime-notification-wrapper
  .notification :is(.text-sm,p) {
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 16px !important;
}




/* Profile > Interface: keep controls as neutral liquid glass and above the
   dashboard's non-interactive overlay layer. */
html.rc-app-bg body #rc-dash .interface-option .rc-drop-btn{
  background: rgba(255,255,255,.028) !important;
  background-color: rgba(255,255,255,.028) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(20px) saturate(105%) !important;
  backdrop-filter: blur(20px) saturate(105%) !important;
  pointer-events: auto !important;
}

html.rc-app-bg body #rc-dash .interface-option .rc-drop-btn:hover,
html.rc-app-bg body #rc-dash .interface-option .rc-drop.open .rc-drop-btn{
  background: rgba(255,255,255,.055) !important;
  background-color: rgba(255,255,255,.055) !important;
  border-color: rgba(255,255,255,.27) !important;
}

html.rc-app-bg body #rc-dash .rc-drop-menu.is-open,
html.rc-app-bg body #rc-dash .rc-drop-menu.is-open .rc-drop-item{
  pointer-events: auto !important;
}

/* Profile interface selectors: rounded liquid-glass trigger and menu. */
html.rc-app-bg body #rc-dash .interface-option .rc-drop-btn{
  min-width: 86px !important;
  min-height: 34px !important;
  justify-content: center !important;
  padding: 7px 13px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.045) !important;
  background-color: rgba(255,255,255,.045) !important;
  background-image: none !important;
  border-color: rgba(255,255,255,.19) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.075) !important;
  -webkit-backdrop-filter: blur(24px) saturate(112%) !important;
  backdrop-filter: blur(24px) saturate(112%) !important;
}

html.rc-app-bg body #rc-dash .rc-drop-menu{
  padding: 6px !important;
  border-radius: 15px !important;
  background: rgba(255,255,255,.085) !important;
  background-color: rgba(255,255,255,.085) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.21) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.09) !important;
  -webkit-backdrop-filter: blur(30px) saturate(112%) !important;
  backdrop-filter: blur(30px) saturate(112%) !important;
}

html.rc-app-bg body #rc-dash .rc-drop-menu .rc-drop-item{
  min-height: 32px !important;
  padding: 8px 12px !important;
  border: 0 !important;
  border-radius: 10px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}

html.rc-app-bg body #rc-dash .rc-drop-menu .rc-drop-item:hover,
html.rc-app-bg body #rc-dash .rc-drop-menu .rc-drop-item.active{
  background: rgba(255,255,255,.10) !important;
  background-color: rgba(255,255,255,.10) !important;
}

/* Home theme toggle: must follow the global glass layer. */
html.rc-home-on.rc-home-light,
html.rc-home-on.rc-home-light body,
html.rc-home-on.rc-home-light #rc-home{
  background-color: #f4f4f4 !important;
  color: #111 !important;
}

html.rc-home-on.rc-home-light #rc-home .bg{
  background:
    radial-gradient(circle at 50% 42%, rgba(0,0,0,.04), transparent 31%),
    radial-gradient(circle at 16% 18%, rgba(0,0,0,.02), transparent 23%),
    radial-gradient(circle at 83% 78%, rgba(0,0,0,.018), transparent 26%),
    linear-gradient(180deg,#fafafa 0%,#eeeeee 100%) !important;
}

html.rc-home-on.rc-home-light #rc-home .bg::before{
  background-image: linear-gradient(rgba(0,0,0,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.03) 1px,transparent 1px) !important;
  opacity: .45 !important;
}

html.rc-home-on.rc-home-light #rc-home .bg::after{
  background: radial-gradient(circle,rgba(0,0,0,.03),rgba(0,0,0,.01) 35%,transparent 68%) !important;
}

html.rc-home-on.rc-home-light #rc-home .card{
  background-color: rgba(255,255,255,.58) !important;
  background-image: linear-gradient(145deg,rgba(255,255,255,.72),rgba(255,255,255,.30)) !important;
  border-color: rgba(0,0,0,.10) !important;
  border-top-color: rgba(255,255,255,.92) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.82) !important;
  -webkit-backdrop-filter: blur(30px) saturate(100%) !important;
  backdrop-filter: blur(30px) saturate(100%) !important;
}

html.rc-home-on.rc-home-light #rc-home .card::before{
  background: linear-gradient(125deg,rgba(255,255,255,.46),transparent 34%,transparent 72%,rgba(255,255,255,.12)) !important;
}

html.rc-home-on.rc-home-light #rc-home .input,
html.rc-home-on.rc-home-light #rc-home .input:focus-within{
  background-color: rgba(255,255,255,.48) !important;
  background-image: linear-gradient(180deg,rgba(255,255,255,.68),rgba(255,255,255,.24)) !important;
  border-color: rgba(0,0,0,.12) !important;
  border-top-color: rgba(255,255,255,.88) !important;
  border-bottom-color: rgba(0,0,0,.08) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.74) !important;
}

html.rc-home-on.rc-home-light #rc-home .input:focus-within{
  border-color: rgba(0,0,0,.23) !important;
  border-top-color: rgba(255,255,255,.96) !important;
}

html.rc-home-on.rc-home-light #rc-home :is(h1,h2,.auth-switch a){ color:#111 !important; }
html.rc-home-on.rc-home-light #rc-home :is(.lead,.card p,.auth-switch,.forgot,.foot,label){ color:rgba(0,0,0,.55) !important; }
html.rc-home-on.rc-home-light #rc-home .input :is(input,svg){ color:rgba(0,0,0,.78) !important; }
html.rc-home-on.rc-home-light #rc-home .input input::placeholder{ color:rgba(0,0,0,.40) !important; }
html.rc-home-on.rc-home-light #rc-home .divider{ background:rgba(0,0,0,.09) !important; }
html.rc-home-on.rc-home-light #rc-home .control-pill{
  background:rgba(255,255,255,.62) !important;
  border-color:rgba(0,0,0,.10) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.82) !important;
}
html.rc-home-on.rc-home-light #rc-home .lang-btn.active{ background:#111 !important; color:#fff !important; }
html.rc-home-on.rc-home-light #rc-home .theme-btn{ color:#333 !important; }
html.rc-home-on.rc-home-light #rc-home button[type="submit"]{ background:#111 !important; color:#fff !important; }

/* Billing balance card: remove the stale bright rail on its left edge. */
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card:first-child .info,
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card:first-child .info > *{
  border-left: 0 !important;
  outline: 0 !important;
}
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card:first-child .info::before,
html.rc-app-bg.rc-billing-page .payments-tab-general .cards > .card:first-child .info::after{
  content: none !important;
  display: none !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

/* Billing antiflash: these elements uniquely identify the billing route, so its
   final card skin must not wait for the route observer to add rc-billing-page. */
html.rc-app-bg .payments-tab-general .card .info{
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
html.rc-app-bg .payments-tab-general > .divider-wrapper{
  display: none !important;
}
html.rc-app-bg .payments-tab-general .cards > .card,
html.rc-app-bg .payments-tab-general .cards > .card:hover{
  background: rgba(20,20,20,.35) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  box-shadow: 0 8px 32px rgba(0,0,0,.15) !important;
  filter: none !important;
  -webkit-backdrop-filter: blur(28px) saturate(140%) !important;
  backdrop-filter: blur(28px) saturate(140%) !important;
}
html.rc-app-bg .payments-tab-general .cards > .card::before,
html.rc-app-bg .payments-tab-general .cards > .card::after{
  content: none !important;
  display: none !important;
}
html.rc-app-bg .payments-tab-general .cards > .card > .bg-grey-850{
  background: transparent !important;
  background-image: none !important;
  box-shadow: none !important;
}
html.rc-app-bg .payments-tab-general .cards > .card .skeleton,
html.rc-app-bg .payments-tab-general .cards > .card [class*="bg-grey-750"]{
  background: rgba(255,255,255,.025) !important;
  background-image: none !important;
  box-shadow: none !important;
  filter: none !important;
  animation: none !important;
}
html.rc-app-bg .payments-tab-general .card .ra-button.preset.white,
html.rc-app-bg .payments-tab-general .card .ra-button.preset.white:hover,
html.rc-app-bg .payments-tab-general .card .ra-button.preset.white:focus{
  background: #eee !important;
  color: #111 !important;
  border: 1px solid #fff !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

/* Mutes: action button must be identical to the Bans action button. */
html.rc-app-bg body:has(a[href$="/mutes"][aria-current="page"]) #page-content .content-layer .row > .element:last-child > .flex > div{
  width: 38px !important;
  height: 38px !important;
  align-items: center !important;
  background: rgba(4,135,105,.12) !important;
  background-image: none !important;
  border: 1px solid rgba(35,210,165,.07) !important;
  border-radius: 11px !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(130%) !important;
  backdrop-filter: blur(16px) saturate(130%) !important;
}
html.rc-app-bg body:has(a[href$="/mutes"][aria-current="page"]) #page-content .content-layer .row > .element:last-child .ra-button{
  width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  background: rgba(8,10,14,.28) !important;
  background-image: none !important;
  border: 1px solid rgba(255,255,255,.04) !important;
  border-top-color: rgba(255,255,255,.075) !important;
  border-radius: 11px !important;
  color: rgba(255,255,255,.58) !important;
  outline: 0 !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: blur(16px) saturate(125%) !important;
  backdrop-filter: blur(16px) saturate(125%) !important;
}
html.rc-app-bg body:has(a[href$="/mutes"][aria-current="page"]) #page-content .content-layer .row > .element:last-child .ra-button:hover{
  background: rgba(255,255,255,.045) !important;
  border-color: rgba(255,255,255,.065) !important;
  color: rgba(255,255,255,.9) !important;
}

/* Alerts: compact rows with the current project's avatar. */
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer{
  gap: 7px !important;
  padding: 9px 12px 20px !important;
}
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover{
  min-height: 52px !important;
  border-radius: 13px !important;
}
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover > .element > .flex{
  min-height: 50px !important;
  padding: 7px 10px !important;
}
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .flex.items-center.gap-4.w-full{
  grid-template-columns: 34px minmax(0,1fr) !important;
  gap: 9px !important;
}
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon{
  width: 34px !important;
  height: 34px !important;
  border-radius: 10px !important;
}
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon img{
  width: 30px !important;
  height: 30px !important;
  border-radius: 8px !important;
  object-fit: cover !important;
  filter: none !important;
  opacity: 0 !important;
  transition: opacity .12s ease !important;
}
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .icon img[data-checkapp-project-avatar-ready="1"]{
  opacity: 1 !important;
}
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover p.row{
  font-size: 12px !important;
  line-height: 1.25 !important;
}
html.rc-app-bg body:has(a[href$="/alerts"][aria-current="page"]) #app #page-content#page-content#page-content .content-layer > .row.relative.defaultHover .date{
  margin-top: 2px !important;
  padding: 1px 6px !important;
  font-size: 8px !important;
}

/* Alerts antiflash: never expose the legacy logo or the full skeleton list. */
html.rc-alerts-page body #page-content .content-layer > .row.relative.defaultHover:has(.skeleton),
html.rc-alerts-page body #page-content .content-layer > .row.relative.defaultHover:has(.alert-skeleton){
  display: none !important;
}
html.rc-alerts-page body #page-content .content-layer > .row.relative.defaultHover .icon img:not([data-checkapp-project-avatar-ready="1"]){
  opacity: 0 !important;
  visibility: hidden !important;
}
html.rc-alerts-page body #page-content .content-layer > .row.relative.defaultHover .icon img[data-checkapp-project-avatar-ready="1"]{
  opacity: 1 !important;
  visibility: visible !important;
}