:root{
  --bg:#121214;
  --card:#121622;
  --card2:#0f1320;
  --text:#e7eaf2;
  --muted:#a7adc2;
  --line:rgba(255,255,255,.08);
  --ok:#2bd576;
  --warn:#f6c244;
  --bad:#ff4d4d;
  --btn:#1c2440;
  --btn2:#161d33;
  --yellow:#ffd24a;

  --accent-rgb: 93,168,255;
  --accent: rgb(var(--accent-rgb));
  --uiScale: 1;
  --uiScaleMinWidth: 1200;
  color-scheme: dark;
}

select, option{
  background-color: #0d1120;
  color: var(--text);
}
select option:checked{
  background-color: rgba(var(--accent-rgb), .18);
}

*{box-sizing:border-box}

html{
  min-height: 100%;
  background-color: #121214;
  background-image: none;
  background-attachment: fixed;
  overflow-y: scroll;
  scrollbar-gutter: stable;
}

body{
  min-height: 100vh;
  margin:0;
  font-family: ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:#121214;
  color:var(--text);
  overflow-x:hidden;
}

@supports not (scrollbar-gutter: stable){
  body{ overflow-y: scroll; }
}

body::before{ content:none; }

body::after{ content:none; }

.topbarThemeBtn{
  display:none !important;
}

.wrap{width:100%;max-width:1320px;margin:0 auto;padding:18px}
h1{margin:0 0 6px;letter-spacing:.2px}
h2{margin:0 0 12px}
h3{margin:0 0 10px}
p{margin:0}

.row{display:flex;align-items:center}
.space{justify-content:space-between}
.gap{gap:10px}
.wrapline{flex-wrap:wrap}
.mt10{margin-top:10px}

.muted{color:var(--muted)}
.small{font-size:12px}

.topbar{
  position:sticky;
  top:0;
  background:rgba(9,10,16,.55);
  backdrop-filter: blur(10px);
  border-bottom:1px solid var(--line);
  z-index:10;

  border-bottom-left-radius: 14px;
  border-bottom-right-radius: 14px;
}

.topbar.wrap{
  width:min(calc(100% - 52px), 1600px);
  max-width:1600px;
  margin:0 auto;
  padding:14px 16px;
}

.topbar > .row.space{
  display:grid;
  grid-template-columns:minmax(185px, .68fr) minmax(0, auto) minmax(185px, .68fr);
  gap:10px;
  min-height:72px;
  align-items:center;
}

.topbar > .row.space > .topTitle{
  justify-self:start;
  min-width:0;
}

.topbar > .row.space > .dashTabBar{
  justify-self:center;
  min-width:0;
}

.topbar > .row.space > .topActions{
  justify-self:end;
  min-width:0;
}

.card{
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  border:1px solid var(--line);
  border-radius:16px;
  padding:16px;
  margin:14px 0;
  box-shadow:0 12px 40px rgba(0,0,0,.35);
}

.subcard{
  background:var(--card2);
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
}

.usersHeader{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}

.usersHeaderActions{
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:auto;
}

@media (max-width: 560px){
  .usersHeader{flex-direction:column; align-items:stretch;}
  .usersHeaderActions{justify-content:flex-end;}
}

.grid2{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
  align-items:start;
}
@media (max-width:960px){
  .grid2{grid-template-columns:1fr}
}
.grid2 .field{
  align-content:start;
}

.grid2 .selectWrap{
  align-self:start;
}
#configModulesGrid.configModulesGrid{
  display:none;
  column-count:1;
  column-gap:0;
  column-fill:auto;
}

@media (max-width:960px){
  #configModulesGrid.configModulesGrid{
    column-count:1;
  }
}

#configModulesGrid.configModulesGrid > .subcard{
  display:inline-block;
  width:100%;
  margin:0 0 14px 0;
  break-inside:avoid;
  -webkit-column-break-inside:avoid;
  page-break-inside:avoid;
  transform-origin: top center;
  will-change: opacity, transform, max-height, filter, margin;
  transition:
    opacity .24s ease,
    transform .32s cubic-bezier(.22,1,.36,1),
    filter .24s ease,
    max-height .32s cubic-bezier(.22,1,.36,1),
    margin .32s cubic-bezier(.22,1,.36,1),
    padding .24s ease,
    border-color .24s ease,
    box-shadow .24s ease;
}

#configModulesGrid.configModulesGrid > .subcard.moduleFx-animating{
  overflow:hidden;
}

#configModulesGrid.configModulesGrid > .subcard.moduleFx-hidden{
  opacity:0;
  transform:translateY(-10px) scale(.985);
  filter:blur(6px);
  margin-top:0 !important;
  margin-bottom:0 !important;
  padding-top:0 !important;
  padding-bottom:0 !important;
  border-color:rgba(255,255,255,0);
  box-shadow:none;
  pointer-events:none;
}

@media (prefers-reduced-motion: reduce){
  #configModulesGrid.configModulesGrid > .subcard{
    transition:none;
  }
}

.twitchCards{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:10px;
}

.twitchStreamerCard{
  display:flex;
  flex-direction:column;
  gap:0;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  border-radius:14px;
}

.twitchStreamerHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.twitchCardLeft{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.twitchAvatar{
  width:34px;
  height:34px;
  border-radius:999px;
  object-fit:cover;
  background:rgba(255,255,255,.08);
}

.twitchNameWrap{
  display:flex;
  flex-direction:column;
  min-width:0;
  gap:4px;
}

.twitchName{
  font-weight:700;
  line-height:1.1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:320px;
}

.twitchLogin{
  font-size:12px;
  opacity:.7;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  max-width:320px;
}

.twitchStreamerActions{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  flex:0 0 auto;
}

.twitchStatusRow{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.twitchStatusBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:22px;
  padding:0 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
}

.twitchStatusBadge.live{
  color:#aef7c7;
  background:rgba(24,126,74,.22);
  border:1px solid rgba(70,204,129,.32);
}

.twitchStatusBadge.offline{
  color:rgba(231,234,242,.82);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
}

.twitchStatusMeta{
  font-size:12px;
  color:rgba(231,234,242,.72);
}

.twitchStreamerBody{
  overflow:hidden;
  max-height:0;
  opacity:0;
  transition:
    max-height .30s cubic-bezier(.22,1,.36,1),
    opacity .18s ease;
  will-change:max-height, opacity;
}

.twitchStreamerBodyInner{
  padding-top:12px;
}

.twitchStreamerCard.isCollapsed .twitchStreamerBodyInner{
  padding-top:0;
}

.twitchMetaGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.twitchMeta{
  min-width:0;
  display:grid;
  gap:8px;
}

.twitchMeta.wide{
  grid-column:1 / -1;
}

.twitchMetaTop{
  display:flex;
  align-items:center;
  gap:8px;
}

.twitchMetaLabel{
  margin:0;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  line-height:1.1;
}

.twitchMetaHelp{
  margin-left:0;
  width:16px;
  height:16px;
}

.twitchColorControl{
  display:inline-flex;
  align-items:center;
  gap:8px;
  justify-self:start;
  min-height:38px;
  padding:6px 8px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
}

.twitchColor{
  width:34px;
  height:24px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  flex:0 0 auto;
  appearance:auto;
  -webkit-appearance:auto;
}

.twitchHexInput{
  width:90px;
  min-width:90px;
  height:26px;
  padding:0 8px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:rgba(231,234,242,.84);
  font-size:11px;
  font-weight:700;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:0;
  box-shadow:none;
}

.twitchHexInput:focus{
  border-color:rgba(var(--accent-rgb), .55);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .16);
}

.twitchTemplateInput{
  width:100%;
  min-height:100px;
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
  color:#fff;
  outline:none;
  resize:vertical;
}

.twitchTokenBar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.twitchTokenRow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  align-items:center;
  flex:1 1 auto;
}

.twitchTokenChip{
  display:inline-flex;
  align-items:center;
}

.twitchTokenChip .btn{
  min-height:34px;
  padding:8px 10px;
}

.twitchTokenHelpWrap{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  flex:0 0 auto;
}

.twitchTokenOverviewHelp{
  margin-left:0;
  width:16px;
  height:16px;
  flex:0 0 auto;
}

.twitchHistoryBox{
  display:grid;
  gap:8px;
}

.twitchHistoryItem{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.02);
}

.twitchHistoryItemTitle{
  font-size:13px;
  font-weight:700;
  color:rgba(231,234,242,.95);
}

.twitchHistoryItemMeta{
  margin-top:4px;
  font-size:12px;
  color:rgba(231,234,242,.66);
}

@media (max-width: 860px){
  .twitchStreamerHead{
    flex-direction:column;
  }

  .twitchStreamerActions{
    width:100%;
    justify-content:space-between;
  }

  .twitchStreamerToggle{
    min-width:140px;
  }

  .twitchMetaGrid{
    grid-template-columns:1fr;
  }

  .twitchMeta.wide{
    grid-column:auto;
  }

  .twitchTokenBar{
    flex-direction:column;
    align-items:flex-start;
  }

  .twitchTokenHelpWrap{
    justify-content:flex-start;
  }
}

@media (prefers-reduced-motion: reduce){
  .twitchStreamerBody{
    transition:none;
  }
}

.twitchSearchResults{
  display:flex;
  flex-direction:column;
  gap:8px;
  margin-top:14px;
  max-height:320px;
  overflow:auto;
}

.twitchResult{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  border-radius:12px;
}

.twitchResultLeft{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.twitchSearchBar{
  display:flex;
  align-items:center;
  gap:10px;
}

.twitchSearchInput{
  flex:1;
}

.twitchResultRow{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,0.08);
  background:rgba(255,255,255,0.03);
  border-radius:12px;
  cursor: default;
  text-align:left;
}

.twitchResultRow:hover{
  background: rgba(145,70,255,0.12);
  border-color: rgba(145,70,255,0.35);
  box-shadow: 0 0 0 2px rgba(145,70,255,0.12);
}

.twitchResultRow:focus{
  outline:2px solid rgba(145,70,255,0.55);
  outline-offset:2px;
}

.twitchResultAvatar{
  width:34px;
  height:34px;
  border-radius:10px;
  object-fit:cover;
}

.twitchResultMeta{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.twitchResultName{
  font-weight:800;
  font-size:14px;
  color:#fff;
  line-height:1.1;
}

.twitchResultLogin{
  font-size:12px;
  color:rgba(255,255,255,0.55);
  line-height:1.1;
}

.twitchResultName{
  display:flex;
  align-items:center;
  gap:8px;
}

.twitchLiveIcon{
  font-size:12px;
  line-height:1;
  transform: translateY(-1px);
}

@media (max-width: 860px){
  .twitchMetaGrid{
    grid-template-columns:1fr;
  }

  .twitchMeta.wide{
    grid-column:auto;
  }

  .twitchCardHead{
    flex-direction:column;
    align-items:stretch;
  }
}

.twitchLiveBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:900;
  letter-spacing:.4px;
  padding:3px 7px;
  border-radius:6px;
  background:#e91916;
  color:#fff;
  line-height:1;
}

.factionCards{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:10px;
}

.factionCard{
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  border-radius:12px;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:12px;
}

.factionGrid{
  display:grid;
  grid-template-columns:minmax(220px,1.35fr) minmax(96px,.56fr) minmax(280px,1.9fr);
  gap:12px;
  align-items:end;
}

.factionMeta{
  min-width:0;
  display:grid;
  gap:7px;
}

.factionMetaTop{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.factionMetaLabel{
  margin:0;
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  line-height:1.1;
}

.factionMeta .helpIcon{
  margin-left:0;
  width:16px;
  height:16px;
}

.factionGrid input{
  width:100%;
  height:42px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
  color:#fff;
  padding:0 12px;
  outline:none;
}

.pwWrap{
  position:relative;
  width:100%;
}

.pwWrap input{
  width:100%;
  padding-right:44px;
}

.pwEye{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  width:34px;
  height:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
  color:rgba(255,255,255,.7);
  cursor:pointer;
}

.pwEye:hover{
  color:#fff;
}

.pwEye.on{
  color:#fff;
}

.factionRoleField{
  margin-top:2px;
}

.factionActions{
  display:flex;
  justify-content:flex-end;
}

@media (max-width: 860px){
  .factionGrid{
    grid-template-columns:1fr;
  }
}

.ticketCategoryCard{
  gap:12px;
}

.ticketCategoryHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.ticketCategoryMeta{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.ticketCategoryTitle{
  font-weight:900;
  font-size:15px;
  line-height:1.15;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.ticketCategorySub{
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.ticketCategoryActions{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  flex:0 0 auto;
}

.ticketCategoryToggle{
  min-width:140px;
}

.ticketDragHandle{
  flex:0 0 auto;
  align-self:center;
  width:18px;
  height:28px;
  border-radius:7px;
  cursor:grab;
  color:var(--muted);
  background-image:
    linear-gradient(currentColor, currentColor),
    linear-gradient(currentColor, currentColor),
    linear-gradient(currentColor, currentColor);
  background-size:13px 2px;
  background-position:center top 8px, center center, center bottom 8px;
  background-repeat:no-repeat;
  opacity:.5;
  user-select:none;
  touch-action:none;
  transition:opacity .15s ease, color .15s ease, background-color .15s ease;
}

.ticketDragHandle:hover{
  opacity:1;
  color:var(--accent);
  background-color:rgba(var(--accent-rgb), .10);
}

.ticketDragHandle:active{
  cursor:grabbing;
}

.ticketCategoryCard.isDragging,
.customCommandsV2BlockCard.isDragging{
  cursor:grabbing;
  user-select:none;
  border-color:rgba(var(--accent-rgb), .65) !important;
  box-shadow:0 18px 40px rgba(0,0,0,.45), 0 0 0 1px rgba(var(--accent-rgb), .55);
}

.ticketDragPlaceholder{
  box-sizing:border-box;
  margin:2px 0;
  border:2px dashed rgba(var(--accent-rgb), .55);
  border-radius:14px;
  background:rgba(var(--accent-rgb), .06);
  transition:height .12s ease;
}

.ticketCategoryBody{
  overflow:hidden;
  max-height:0;
  opacity:0;
  transition:
    max-height .30s cubic-bezier(.22,1,.36,1),
    opacity .18s ease;
  will-change:max-height, opacity;
}

.ticketCategoryBodyInner{
  padding-top:2px;
}

.ticketCategoryCard.isCollapsed .ticketCategoryBodyInner{
  padding-top:0;
}

@media (max-width: 860px){
  .ticketCategoryHead{
    flex-direction:column;
  }

  .ticketCategoryActions{
    width:100%;
    justify-content:space-between;
  }

  .ticketCategoryToggle{
    min-width:0;
    flex:1 1 auto;
  }
}

@media (prefers-reduced-motion: reduce){
  .ticketCategoryBody{
    transition:none;
  }
}

.sanktionParaList{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:0;
  transition:min-height .24s cubic-bezier(.22,1,.36,1);
}

.sanktionParaList:empty{
  display:none;
}

.sanktionParaCard{
  padding:10px 12px;
  gap:8px;
}

.sanktionParaCard.sanktionParaFx{
  opacity:0;
  transform:translateY(-10px) scale(.988);
  filter:blur(6px);
  will-change:opacity, transform, filter;
  transition:
    opacity .22s ease,
    transform .30s cubic-bezier(.22,1,.36,1),
    filter .22s ease;
}

.sanktionParaCard.sanktionParaFx.show{
  opacity:1;
  transform:none;
  filter:none;
}

@media (prefers-reduced-motion: reduce){
  .sanktionParaList{
    transition:none;
  }

  .sanktionParaCard.sanktionParaFx{
    transition:none;
  }
}

.sanktionParaHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}

.sanktionParaMeta{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.sanktionParaNr{
  font-weight:900;
  font-size:15px;
  line-height:1.1;
}

.sanktionParaText{
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
  margin-top:3px;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.sanktionParaRight{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
  flex:0 0 auto;
}

.sanktionParaPill{
  white-space:nowrap;
}

.sanktionParaActions{
  gap:6px;
  flex-wrap:wrap;
}

.sanktionParaActions .btn{
  min-height:34px;
  padding:8px 10px;
}

@media (max-width: 860px){
  .sanktionParaHead{
    flex-direction:column;
  }

  .sanktionParaRight{
    width:100%;
    justify-content:space-between;
  }
}

.field{display:grid;gap:6px;min-width:240px}
label{font-size:12px;color:var(--muted)}
input,select,textarea{
  background:#0d1120;
  border:1px solid var(--line);
  color:var(--text);
  border-radius:10px;
  padding:10px 12px;
  outline:none;
}
textarea{min-height:180px;width:100%;resize:vertical}
#rawJson{
  position:relative;
  z-index:2;
  display:block;
  width:100%;
  height:100%;
  min-height:0;
  resize:none;
  border:0;
  border-radius:0;
  padding:14px 16px;
  background:transparent;
  color:#d4d4d4;
  font-size:13px;
  line-height:21px;
  font-family:Consolas, "Cascadia Code", "SFMono-Regular", Menlo, Monaco, monospace;
  tab-size:2;
  white-space:pre;
  overflow:auto;
  box-shadow:none;
}

#rawJson:focus{
  box-shadow:none;
}

.jsonAdvanced{
  margin-top:20px;
  border:0;
  border-radius:18px;
  background:transparent;
  overflow:visible;
}

.jsonAdvanced summary{
  width:max-content;
  max-width:100%;
  min-height:34px;
  display:flex;
  align-items:center;
  gap:8px;
  margin-left:0;
  padding:0 12px;
  cursor:pointer;
  color:rgba(231,234,242,.72);
  font-size:11px;
  line-height:1;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.095);
  border-radius:999px;
  background:rgba(255,255,255,.035);
  box-shadow:
    0 10px 24px rgba(0,0,0,.16),
    inset 0 1px 0 rgba(255,255,255,.035);
  opacity:.88;
  transition:
    opacity .18s ease,
    color .18s ease,
    border-color .18s ease,
    background .18s ease,
    transform .18s ease,
    box-shadow .18s ease;
}

.jsonAdvanced summary::marker{
  color:rgba(231,234,242,.36);
}

.jsonAdvanced summary::-webkit-details-marker{
  color:rgba(231,234,242,.36);
}

.jsonAdvanced summary:hover{
  opacity:1;
  color:rgba(231,234,242,.94);
  border-color:rgba(var(--accent-rgb), .26);
  background:rgba(var(--accent-rgb), .065);
  transform:translateY(-1px);
  box-shadow:
    0 13px 28px rgba(0,0,0,.20),
    0 0 18px rgba(var(--accent-rgb), .06),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.jsonAdvanced[open] summary{
  margin-bottom:10px;
  color:rgba(231,234,242,.95);
  border-color:rgba(var(--accent-rgb), .30);
  background:rgba(var(--accent-rgb), .085);
  opacity:1;
}

.jsonEditorShell{
  overflow:hidden;
  border-radius:18px;
  background:#1e1e1e;
  border:1px solid rgba(255,255,255,.075);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.03),
    0 16px 40px rgba(0,0,0,.28);
}

.jsonAdvanced[open] .jsonEditorShell{
  animation:jsonEditorReveal .24s cubic-bezier(.22,1,.36,1) both;
}

@keyframes jsonEditorReveal{
  from{
    opacity:0;
    transform:translateY(8px) scale(.992);
    filter:blur(5px);
  }
  to{
    opacity:1;
    transform:none;
    filter:none;
  }
}

.jsonEditorHeader{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:7px 10px 7px 14px;
  background:#252526;
  border-bottom:1px solid rgba(255,255,255,.065);
}

.jsonEditorTitle{
  min-width:0;
  display:flex;
  align-items:center;
  gap:9px;
  color:#cccccc;
  font-size:12px;
  font-weight:900;
  letter-spacing:.02em;
}

#rawJsonFileName{
  min-width:0;
  max-width:360px;
  display:inline-block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.jsonEditorDot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:#4ec9b0;
  box-shadow:0 0 14px rgba(78,201,176,.35);
}

.jsonEditorShell.hasError .jsonEditorDot{
  background:#f48771;
  box-shadow:0 0 14px rgba(244,135,113,.35);
}

.jsonEditorActions{
  display:flex;
  align-items:center;
  gap:7px;
  flex-wrap:wrap;
  justify-content:flex-end;
}

.jsonEditorBtn{
  min-height:30px;
  padding:0 10px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.09);
  background:#2d2d30;
  color:#cccccc;
  font-size:12px;
  font-weight:800;
  cursor:pointer;
}

.jsonEditorBtn:hover{
  background:#37373d;
  border-color:rgba(255,255,255,.15);
}

.jsonEditorBtn.primary{
  color:#ffffff;
  background:#0e639c;
  border-color:rgba(14,99,156,.9);
}

.jsonEditorBtn.primary:hover{
  background:#1177bb;
}

.jsonEditorBody{
  display:grid;
  grid-template-columns:58px minmax(0, 1fr);
  height:min(70vh, 760px);
  min-height:420px;
  background:#1e1e1e;
}

.jsonEditorLines{
  height:100%;
  min-height:0;
  padding:14px 8px 14px 0;
  overflow:hidden;
  background:#1e1e1e;
  border-right:1px solid rgba(255,255,255,.045);
  color:#858585;
  font-size:13px;
  line-height:21px;
  font-family:Consolas, "Cascadia Code", "SFMono-Regular", Menlo, Monaco, monospace;
  text-align:right;
  user-select:none;
}

.jsonEditorLines span{
  display:block;
  height:21px;
  padding-right:10px;
}

.jsonEditorLines span.isError{
  color:#ffffff;
  background:rgba(244,135,113,.22);
  border-right:2px solid #f48771;
}

.jsonEditorInputWrap{
  --jsonActiveLineTop:-9999px;
  position:relative;
  min-width:0;
  min-height:0;
  height:100%;
  overflow:hidden;
}

.jsonEditorInputWrap::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:var(--jsonActiveLineTop);
  height:21px;
  z-index:1;
  pointer-events:none;
  background:rgba(255,255,255,.055);
  border-top:1px solid rgba(255,255,255,.025);
  border-bottom:1px solid rgba(0,0,0,.18);
}

.jsonEditorShell.hasError #rawJson{
  background:
    linear-gradient(90deg, rgba(244,135,113,.055), transparent 38%),
    transparent;
}

.jsonEditorError{
  display:none;
  padding:10px 14px;
  border-top:1px solid rgba(244,135,113,.22);
  background:rgba(244,135,113,.10);
  color:#f5c2ba;
  font-size:12px;
  line-height:1.45;
  font-family:Consolas, "Cascadia Code", "SFMono-Regular", Menlo, Monaco, monospace;
}

.jsonEditorShell.hasError .jsonEditorError{
  display:block;
}

.jsonEditorStatusBar{
  min-height:28px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 10px 0 14px;
  background:#007acc;
  color:#ffffff;
  font-size:11px;
  font-weight:800;
  font-family:Consolas, "Cascadia Code", "SFMono-Regular", Menlo, Monaco, monospace;
}

.jsonEditorStatusBar span{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.jsonEditorShell.hasError .jsonEditorStatusBar{
  background:#8a2f23;
}

.jsonEditorApplyRow{
  padding:12px 14px 14px;
  background:#252526;
  border-top:1px solid rgba(255,255,255,.065);
}

@media (max-width:760px){
  .jsonEditorHeader{
    align-items:stretch;
    flex-direction:column;
  }

  .jsonEditorActions{
    justify-content:flex-start;
  }

  .jsonEditorBody{
    grid-template-columns:46px minmax(0, 1fr);
  }

  .jsonEditorLines{
    font-size:12px;
  }

  #rawJson{
    font-size:12px;
  }

  .jsonEditorStatusBar{
    flex-wrap:wrap;
    height:auto;
    padding:7px 10px;
  }

  #rawJsonFileName{
    max-width:220px;
  }

  .jsonAdvanced summary{
    margin-left:0;
  }
}

.btn{
  background:var(--btn);
  border:1px solid var(--line);
  color:var(--text);
  padding:10px 12px;
  border-radius:12px;
  cursor:pointer;
  text-decoration:none;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition: transform .18s ease, box-shadow .18s ease, background .18s ease, filter .18s ease, opacity .22s ease, border-color .18s ease;
  will-change: transform;
}

.btn:hover{background:var(--btn2);transform: translateY(-1px) scale(1.02);box-shadow: 0 10px 30px rgba(0,0,0,.25)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:none}

.btn.ghost{background:transparent}
.btn.warn{border-color:rgba(246,194,68,.35)}
.btn.danger{border-color:rgba(255,77,77,.35)}

.btn.primary{
  background: linear-gradient(180deg, rgba(255,210,74,1), rgba(255,170,60,1));
  color:#16110a;
  border-color: rgba(255,210,74,.55);
  font-weight:800;
}
.btn.primary:hover{filter: brightness(1.03) saturate(1.05)}
.btn.big{padding:14px 18px;border-radius:14px;min-width:220px;font-size:16px;height:48px}

.configBackBtn{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 18px 10px 12px;
  border-radius:999px;
  border:1px solid rgba(var(--accent-rgb), .45);
  background:
    radial-gradient(circle at 0% 50%, rgba(var(--accent-rgb), .22), transparent 60%),
    linear-gradient(180deg, rgba(var(--accent-rgb), .14), rgba(var(--accent-rgb), .06));
  color:var(--text);
  font-weight:800;
  letter-spacing:-.01em;
  cursor:pointer;
  overflow:hidden;
  isolation:isolate;
  box-shadow:0 8px 22px rgba(0,0,0,.28);
  transition:
    transform .2s cubic-bezier(.22,1,.36,1),
    border-color .2s ease,
    box-shadow .2s ease,
    background .2s ease;
}

.configBackBtn::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(115deg, transparent 35%, rgba(255,255,255,.22) 50%, transparent 65%);
  background-size:220% 100%;
  background-position:160% 0;
  background-repeat:no-repeat;
}

.configBackBtn:hover{
  transform:translateY(-1px);
  border-color:rgba(var(--accent-rgb), .8);
  background:
    radial-gradient(circle at 0% 50%, rgba(var(--accent-rgb), .30), transparent 60%),
    linear-gradient(180deg, rgba(var(--accent-rgb), .20), rgba(var(--accent-rgb), .10));
  box-shadow:
    0 12px 30px rgba(0,0,0,.34),
    0 0 26px rgba(var(--accent-rgb), .35);
}

.configBackBtn:hover::before{
  animation:configBackSheen .7s ease forwards;
}

.configBackBtn:active{
  transform:translateY(-1px);
}

.configBackBtn:focus-visible{
  outline:2px solid rgba(var(--accent-rgb), .6);
  outline-offset:3px;
}

.configBackBtnArrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  width:26px;
  height:26px;
  border-radius:999px;
  background:rgb(var(--accent-rgb));
  color:#fff;
  box-shadow:0 0 14px rgba(var(--accent-rgb), .45);
  transition:transform .22s cubic-bezier(.22,1,.36,1);
}

.configBackBtn:hover .configBackBtnArrow{
  transform:translateX(-3px);
}

.configBackBtnArrow svg{
  width:15px;
  height:15px;
  fill:none;
  stroke:#fff;
  stroke-width:2.6;
  stroke-linecap:round;
  stroke-linejoin:round;
}

@keyframes configBackSheen{
  0%{background-position:160% 0}
  100%{background-position:-60% 0}
}

@media (prefers-reduced-motion:reduce){
  .configBackBtn,
  .configBackBtn .configBackBtnArrow{
    transition:none;
  }

  .configBackBtn:hover::before{
    animation:none;
  }
}

.pill{
  padding:8px 12px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(0,0,0,.2);
  font-size:13px;
}

.toggle{display:inline-flex;align-items:center;gap:10px;user-select:none}
.toggle input{width:18px;height:18px}

.advanced{margin-top:14px}
.advanced summary{cursor:pointer;color:var(--muted)}

.toast{
  margin-top:12px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid var(--line);
  display:none;
}
.toast.ok{display:block;border-color:rgba(43,213,118,.35)}
.toast.bad{display:block;border-color:rgba(255,77,77,.35)}
.toast.warn{display:block;border-color:rgba(246,194,68,.38)}

.authBox{
  display:inline-flex;
  align-items:center;
  gap:8px;

  padding:6px 8px;
  border-radius:14px;
  border:1px solid var(--line);
  background:rgba(0,0,0,.18);

  min-height:54px;
  max-width:min(390px, 100%);

  flex:0 1 auto;
  box-sizing:border-box;
}

.authBox .btn{
  height: 34px;
  padding: 8px 10px;
}

.authGoodName,
.authBad,
.authBox .muted.small{
  white-space: nowrap;
}

.authGoodName{
  max-width:210px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;

  font-size:14.5px;
  font-weight:700;
}

.authBad{color:var(--bad);font-weight:800}

.avatar{
  width:42px;height:42px;border-radius:12px;border:1px solid var(--line);
  object-fit:cover;background:#0d1120;
}
.avatarFallback{
  width:42px;height:42px;border-radius:12px;border:1px solid var(--line);
  display:grid;place-items:center;background:#0d1120;font-weight:900;color:var(--muted);
}

.layout{
  display:grid;
  grid-template-columns: 0px 1fr;
  transition: grid-template-columns .25s ease;
}

.sidebar{
  width:0;
  overflow:hidden;
  border-right:1px solid var(--line);
  background: var(--card2);
  backdrop-filter: none;
  box-shadow: 0 12px 40px rgba(0,0,0,35);

  height: 100vh;
  position: sticky;
  top: 0;
  padding-top: 8px;
  z-index: 9;


  transition: width .25s ease, opacity .25s ease;
  opacity:0;

  display:flex;
  flex-direction:column;
  align-items:center;

  border-top-right-radius: 14px;
  border-bottom-right-radius: 14px;
}

body.mode-config .main{
  min-width: 0;
}

@media (min-width: 761px){
  body.mode-config{
    --sidebar-top-offset: 140px;
    --sidebar-card-width: 160px;
    --sidebar-edge-gap: 18px;
    --config-side-gap: 18px;
  }

  body.mode-config .layout{
    grid-template-columns: calc(var(--sidebar-card-width) + var(--sidebar-edge-gap)) minmax(0, 1fr);
    column-gap: var(--config-side-gap);
    align-items: start;
  }

  body.mode-config .main{
    grid-column: 2;
  }

  body.mode-config .sidebar{
    position: fixed;
    top: var(--sidebar-top-offset);
    left: var(--sidebar-edge-gap);
    bottom: auto;
    transform: none;
    align-self: start;
    width: var(--sidebar-card-width);
    height: auto;
    max-height: calc(100vh - var(--sidebar-top-offset) - 14px);
    overflow: hidden;
    padding: 12px 0;
    margin-left: 0;
    opacity: 1;
    background: linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.014));
    border: 1px solid var(--line);
    border-radius: 16px;
    box-shadow: 0 12px 40px rgba(0,0,0,.35);
    backdrop-filter: none;
  }

  body.mode-config .backBtn{
    background: rgba(255,255,255,.035);
    border: 1px solid var(--line);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
  }

  body.mode-config .sideList{
    flex: 0 1 auto;
    min-height: 0;
    max-height: calc(100vh - var(--sidebar-top-offset) - 96px);
    overflow-y: auto;
    overflow-x: hidden;
    padding: 10px 12px 12px;
    align-content: start;
  }

  body.mode-config #configCard{
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
    border:0;
    background:transparent;
    box-shadow:none;
  }
}

.backBtn{
  width: calc(100% - 24px);
  margin: 8px 12px 10px;
  height: 40px;
  padding: 0 14px;
  box-sizing: border-box;

  border-radius: 14px;
  background: rgba(13,17,32,.55);
  border: 1px solid var(--line);
  color: var(--text);

  display:flex;
  flex-direction:row;
  align-items:center;
  justify-content:center;
  gap:6px;

  cursor:pointer;
  transition: box-shadow .18s ease, background .18s ease, border-color .18s ease;
}

.backBtn:hover{
  background: rgba(13,17,32,.75);
  border-color: rgba(255,255,255,.14);
  box-shadow:
    0 12px 34px rgba(0,0,0,.38),
    0 0 0 1px rgba(255,255,255,.06) inset;
}

.backSvg{
  display:flex;
  align-items:center;
  justify-content:center;
  line-height:0;
  transform: none;
}

.backSvg svg{
  width: 14px;
  height: 14px;
  display:block;
}

.backText{
  display:flex;
  align-items:center;
  font-weight: 700;
  font-size: 8px;
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1;
  white-space: nowrap;
}

.sideList{
  width: 100%;
  padding: 10px 12px 18px;

  display: grid;
  grid-template-columns: repeat(2, 52px);
  gap: 8px;

  align-content: start;
  justify-content: center;

  overflow-y: auto;
  flex: 1;
  min-height: 0;
}

.sideIcon{
  width:52px;
  height:52px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(13,17,32,.8);
  cursor:pointer;
  display:grid;
  place-items:center;
  transition: transform .25s cubic-bezier(.2,.8,.2,1), border-radius .25s cubic-bezier(.2,.8,.2,1), box-shadow .2s ease, filter .2s ease, border-color .2s ease;
  position:relative;
  overflow:hidden;
  background-size: cover;
  background-position: center;
}

.sideIcon::before{
  content:"";
  position:absolute;
  left:-10px;
  top:50%;
  transform:translateY(-50%) scaleY(.2);
  width:4px;
  height:40%;
  border-radius:0 4px 4px 0;
  background:#fff;
  transition:transform .25s cubic-bezier(.2,.8,.2,1), height .25s ease;
  opacity:0;
  pointer-events:none;
}

.sideIcon:hover{
  transform: translateY(-1px);
  box-shadow: 0 10px 28px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.04);
  border-color: rgba(255,255,255,.18);
  border-radius:22px;
}

.sideIcon:hover::before{
  opacity:.85;
  transform:translateY(-50%) scaleY(1);
  height:45%;
}

.sideIcon img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:inherit;
  display:block;
  transition:filter .25s ease;
}

.sideIcon:hover img{
  filter:brightness(1.08) saturate(1.06);
}

.sideIcon.missing{
  opacity:.55;
  filter:grayscale(.35) saturate(.75);
}

.sideIcon.missing:hover{
  opacity:.85;
  filter:grayscale(.1) saturate(.95);
}

.sideIcon.active{
  outline:none;
  border-color: rgba(255,210,74,.85);
  transform: translateY(-1px);
  border-radius:22px;
  box-shadow:
    0 0 0 2px rgba(255,210,74,.45),
    0 10px 28px rgba(255,180,60,.2),
    0 18px 50px rgba(0,0,0,.38);
  filter: saturate(1.08) brightness(1.1);
}

.sideIcon.active::before{
  opacity:1;
  transform:translateY(-50%) scaleY(1);
  height:65%;
  background:rgba(255,210,74,1);
  box-shadow:0 0 12px rgba(255,210,74,.55);
}

.sideIcon.active:hover{
  transform: translateY(-2px);
  border-radius:24px;
}

.sideList{
  gap:10px;
}

.serverGrid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:12px;
  margin-top:14px;
}

.serverGrid.hasSections{
  display:flex;
  flex-direction:column;
  gap:22px;
}

.serverGridSection{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.serverGridSectionHeader{
  display:flex;
  align-items:baseline;
  gap:8px;
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.06em;
  color:rgba(255,255,255,.62);
  padding:0 2px;
}

.serverGridSectionCount{
  font-size:.6875rem;
  font-weight:500;
  color:rgba(255,255,255,.38);
  padding:1px 6px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  letter-spacing:.02em;
}

.serverGridSectionTiles{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap:12px;
}

@media (max-width: 1100px){
  .serverGridSectionTiles{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 820px){
  .serverGridSectionTiles{
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 520px){
  .serverGridSectionTiles{
    grid-template-columns: minmax(0, 1fr);
  }
}

.tile{
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:
    linear-gradient(135deg, rgba(255,255,255,.04) 0%, rgba(255,255,255,.015) 100%),
    rgba(13,17,32,.65);
  padding:14px;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:12px;
  position:relative;
  overflow:hidden;
  transition: transform .2s cubic-bezier(.2,.8,.2,1), box-shadow .2s ease, border-color .2s ease, background .2s ease, opacity .25s ease, filter .25s ease;
  will-change: transform;
}

.tile::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:18px;
  padding:1px;
  background:linear-gradient(135deg, rgba(255,210,74,0) 0%, rgba(255,210,74,.25) 50%, rgba(255,210,74,0) 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  opacity:0;
  transition:opacity .25s ease;
  pointer-events:none;
}

.tile:hover{
  transform: translateY(-3px) scale(1.015);
  box-shadow: 0 20px 48px rgba(0,0,0,.42), 0 2px 10px rgba(0,0,0,.2);
  border-color: rgba(255,255,255,.14);
  background:
    linear-gradient(135deg, rgba(255,255,255,.06) 0%, rgba(255,255,255,.02) 100%),
    rgba(16,20,38,.75);
}

.tile:hover::before{
  opacity:1;
}

.tile:active{
  transform: translateY(-1px) scale(1.005);
  transition: transform .08s ease;
}

.tile.missing{
  background:
    linear-gradient(135deg, rgba(255,255,255,.02) 0%, rgba(255,255,255,.005) 100%),
    rgba(13,17,32,.20);
  border-color:rgba(255,255,255,.05);
  box-shadow:none;
}

.tile.missing .guildIcon,
.tile.missing .guildFallback{
  opacity:.55;
  filter:saturate(.85);
}

.tile.missing .guildName{
  color:rgba(231,234,242,.82);
}

.tile.missing .guildMeta{
  color:rgba(231,234,242,.6);
}

.tile.active{
  outline:none;
  border-color:rgba(255,210,74,.65);
  box-shadow:
    0 0 0 2px rgba(255,210,74,.3),
    0 18px 48px rgba(255,180,60,.15),
    0 6px 18px rgba(0,0,0,.35);
  animation: dashAnimTilePop .35s cubic-bezier(.22,1,.36,1);
}

.tile.active::before{
  opacity:1;
  background:linear-gradient(135deg, rgba(255,210,74,.0) 0%, rgba(255,210,74,.55) 50%, rgba(255,210,74,.0) 100%);
}

.guildIcon{
  width:48px;
  height:48px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.06);
  object-fit:cover;
  background:#0d1120;
  box-shadow:0 4px 12px rgba(0,0,0,.25);
  transition:transform .25s cubic-bezier(.2,.8,.2,1), box-shadow .2s ease;
  flex:0 0 auto;
}

.tile:hover .guildIcon{
  transform:scale(1.06) rotate(-2deg);
  box-shadow:0 8px 20px rgba(0,0,0,.35);
}

.tile.active .guildIcon{
  border-color:rgba(255,210,74,.4);
}

.guildFallback{
  width:48px;height:48px;border-radius:16px;border:1px solid var(--line);
  display:grid;place-items:center;background:#0d1120;font-weight:900;color:var(--muted);
}

.guildName{font-weight:900;font-size:15px;line-height:1.15}
.guildMeta{font-size:12px;color:var(--muted);margin-top:4px}

.shine::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  pointer-events:none;

  background:
    radial-gradient(
      220px circle at var(--mx, 50%) var(--my, 50%),
      rgba(255,255,255,.10),
      rgba(255,255,255,.05) 40%,
      rgba(255,255,255,0) 70%
    );

  opacity:0;
  transition: opacity .18s ease;
  mix-blend-mode: screen;
}

.shine::after{
  content:"";
  position:absolute;
  inset:-1px;
  border-radius:inherit;
  border:1px solid transparent;

  background:
    linear-gradient(rgba(13,17,32,0), rgba(13,17,32,0)) padding-box,
    linear-gradient(135deg,
      rgba(255,255,255,.16),
      rgba(255,210,74,.18),
      rgba(93,168,255,.20)
    ) border-box;

  opacity:0;
  transition: opacity .18s ease;
  pointer-events:none;
}

.shine:hover::before{opacity:.70}
.shine:hover::after{opacity:.35}

.sideIcon.active.shine::after{opacity:.45}
.sideIcon.active.shine::before{opacity:.35}

.tile:hover{
  background: rgba(13,17,32,.68);
}
.guildName{
  text-shadow: 0 1px 0 rgba(0,0,0,.35);
}

.statusBlock{
  border:1px solid var(--line);
  border-radius: 16px 16px 14px 14px;
  padding:12px;
  background: rgba(0,0,0,.18);
  overflow:hidden;
}

.configEditStatus{
  display:none;
  margin-left:auto;
  max-width:min(55%, 430px);
  font-size:12px;
  font-weight:800;
  color:rgba(231,234,242,.76);
  text-align:right;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

@media (max-width:760px){
  .configEditStatus{
    width:100%;
    max-width:none;
    margin-left:0;
    text-align:left;
  }
}

.btn.invite{
  background: rgba(255,255,255,.03);
  border-color: rgba(var(--accent-rgb), .55);
  color: var(--accent);
  font-weight:800;
}
.btn.invite:hover{
  background: rgba(var(--accent-rgb), .08);
  border-color: rgba(var(--accent-rgb), .75);
  filter: brightness(1.02);
}

.communityFloatingCard{
  position:fixed;
  top:18px;
  right:18px;
  z-index:9998;
  width:min(320px, calc(100vw - 36px));
  min-height:62px;
  display:flex;
  align-items:center;
  gap:12px;
  padding:11px 13px;
  border-radius:18px;
  border:1px solid rgba(88,101,242,.34);
  background:
    radial-gradient(circle at 100% 0%, rgba(88,101,242,.24), transparent 42%),
    linear-gradient(180deg, rgba(33,41,92,.86), rgba(13,17,32,.96));
  color:#eef2ff;
  text-align:left;
  box-shadow:0 18px 46px rgba(0,0,0,.30);
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
}

.communityFloatingCard:hover{
  transform:translateY(-2px);
  box-shadow:0 22px 56px rgba(0,0,0,.34);
  border-color:rgba(121,133,255,.56);
  filter:brightness(1.03);
}

.communityFloatingCard:disabled{
  opacity:.64;
  cursor:not-allowed;
  transform:none;
  box-shadow:none;
  filter:none;
}

.communityFloatingIcon{
  width:42px;
  height:42px;
  border-radius:13px;
  display:grid;
  place-items:center;
  flex:0 0 auto;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  color:#5865F2;
}

.communityFloatingLogo{
  width:24px;
  height:24px;
  display:block;
}

.communityFloatingText{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
  flex:1 1 auto;
}

.communityFloatingBadge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid rgba(118,129,255,.20);
  background:rgba(88,101,242,.16);
  color:#dfe3ff;
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.communityFloatingTitle{
  font-size:14px;
  font-weight:900;
  line-height:1.15;
  color:#ffffff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.communityFloatingSub{
  font-size:11px;
  line-height:1.2;
  color:rgba(231,234,242,.78);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.communityFloatingArrow{
  font-size:18px;
  line-height:1;
  color:rgba(255,255,255,.88);
  flex:0 0 auto;
}

@media (max-width: 1180px), (max-height: 860px){
  .communityFloatingCard{
    top:96px;
    right:14px;
    width:min(280px, calc(100vw - 28px));
  }

  .communityFloatingSub{
    display:none;
  }
}

@media (max-width: 640px){
  .communityFloatingCard{
    top:auto;
    right:12px;
    left:12px;
    bottom:12px;
    width:auto;
    border-radius:16px;
  }

  .communityFloatingTitle{
    font-size:13px;
  }
}

body.mode-config #serverSelectCard{
  display:none !important;
}

.controlBlock{display:flex;flex-direction:column;align-items:flex-end}
.controlTitle{margin-bottom:6px}

.tooltip{
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  max-width: min(520px, calc(100vw - 20px));
  background: rgba(20,20,28,.92);
  border: 1px solid rgba(255,255,255,.10);
  color: #fff;
  padding: 8px 12px;
  border-radius: 14px;
  font-size: 13px;
  font-weight: 700;
  line-height: 1.35;
  white-space: pre-wrap;
  word-break: normal;
  overflow-wrap: anywhere;
  pointer-events: none;
  opacity: 0;
  transform: translateY(6px);
  transition: opacity .12s ease, transform .12s ease;
  backdrop-filter: blur(10px);
}

.tooltip[data-side="bottom"]{
  transform: translateY(-6px);
}

.tooltip.show{
  opacity: 1;
  transform: translateY(0);
}

body.mode-config #toastWrap{
  padding-top: 0;
  padding-bottom: 0;
}

.main{
  position:relative;
  min-height: 0;
  display:flex;
  flex-direction:column;
}

.loggedOutScreen{
  position: fixed;
  inset: 0;
  display: grid;
  place-items: center;
  padding: 120px 18px 28px;
  z-index: 2;
}

.loginCard{
  width: min(540px, 100%);
}

body:not(.mode-config):not(.mode-logs):not(.mode-users):not(.mode-servers):not(.mode-serverview) .main{
  justify-content:flex-start;
  padding-bottom: 120px;
}

body:not(.mode-config) #dashboardOverviewCard,
body:not(.mode-config) #serverSelectCard{
  width: min(1280px, 100%);
  margin-left: auto;
  margin-right: auto;
}

.dashboardOverviewCard{
  width:min(1280px,100%);
  margin:0 auto 10px;
  padding:16px 16px 14px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .14), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  overflow:hidden;
}

.dashOverviewHero{
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
  gap:12px;
  margin-bottom:12px;
}

.dashOverviewHeroText{
  min-width:0;
  flex:1 1 auto;
}

.dashOverviewEyebrow{
  font-size:12px;
  line-height:1;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(var(--accent-rgb), .92);
  margin-bottom:8px;
}

.dashOverviewHero h2{
  margin:0;
}

.dashOverviewStats{
  display:grid;
  grid-template-columns:repeat(6, minmax(0,1fr));
  gap:10px;
  margin-bottom:10px;
}

.dashOverviewStat{
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  padding:12px 13px;
  background:rgba(12,16,29,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  min-width:0;
}

.dashOverviewStatLabel{
  font-size:12px;
  font-weight:800;
  color:var(--muted);
  margin-bottom:10px;
}

.dashOverviewStatValue{
  display:block;
  width:100%;
  max-width:100%;
  font-size:23px;
  line-height:1.04;
  font-weight:900;
  letter-spacing:-.02em;
  min-height:24px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

#overviewAccess{
  overflow:visible;
  text-overflow:clip;
}

#overviewAccess.isAutoFitWrapped{
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.dashOverviewStatMeta{
  margin-top:6px;
  font-size:12px;
  line-height:1.35;
  color:var(--muted);
  min-height:0;
}

.dashOverviewBottom{
  display:grid;
  grid-template-columns:minmax(0, 1.55fr) minmax(280px, .75fr);
  gap:10px;
}

.dashOverviewPanel{
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  padding:14px;
  background:rgba(12,16,29,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  min-width:0;
}

.dashOverviewPanelCompact{
  display:flex;
  flex-direction:column;
}

.dashOverviewPanelTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:10px;
}

.dashOverviewPanelLabel{
  font-size:12px;
  font-weight:900;
  letter-spacing:.10em;
  text-transform:uppercase;
  color:var(--muted);
  margin-bottom:6px;
}

.dashOverviewPanelTitle{
  font-size:18px;
  line-height:1.1;
  font-weight:900;
}

.dashOverviewUptimeStats{
  display:flex;
  align-items:flex-start;
  gap:14px;
  flex-wrap:wrap;
}

.dashOverviewUptimeStat{
  display:grid;
  gap:4px;
  text-align:right;
}

.dashOverviewUptimeLabel{
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}

.dashOverviewUptimeValue{
  font-size:18px;
  line-height:1;
  font-weight:900;
}

.dashOverviewBars{
  display:flex;
  align-items:flex-end;
  gap:10px;
  min-height:144px;
  width:100%;
}

.dashOverviewBarTrack::after{
  content:"";
  position:absolute;
  left:50%;
  top:6px;
  bottom:6px;
  width:2px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  transform:translateX(-50%);
}

.dashOverviewBarItem{
  flex:1 1 0;
  display:grid;
  grid-template-rows:auto 1fr auto;
  justify-items:stretch;
  align-items:end;
  gap:6px;
  min-width:0;
}

.dashOverviewBarPct{
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,.74);
  text-align:center;
  letter-spacing:.01em;
  min-height:14px;
}

.dashOverviewBarTrack{
  position:relative;
  width:100%;
  height:110px;
  background:transparent;
  border:none;
  overflow:visible;
}

.dashOverviewBarTrack::after{
  content:"";
  position:absolute;
  left:50%;
  top:6px;
  bottom:6px;
  width:2px;
  border-radius:999px;
  background:rgba(255,255,255,.08);
  transform:translateX(-50%);
}

.dashOverviewBarFill{
  position:absolute;
  left:50%;
  bottom:6px;
  transform:translateX(-50%);
  width:18px;
  border-radius:999px;
  background:linear-gradient(180deg, rgba(111,197,255,.98), rgba(43,213,118,.92));
  box-shadow:0 10px 18px rgba(43,213,118,.18);
}

.dashOverviewBarFill.isEmpty{
  width:14px;
  background:rgba(255,255,255,.14);
  box-shadow:none;
}

.dashOverviewBarDay{
  font-size:11px;
  font-weight:800;
  color:var(--muted);
  text-transform:uppercase;
  letter-spacing:.04em;
  text-align:center;
}

.dashOverviewMetricList{
  display:grid;
  gap:12px;
  margin-top:auto;
}

.dashOverviewMetric{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  padding:13px 14px;
  background:rgba(255,255,255,.03);
}

.dashOverviewMetricName{
  font-size:13px;
  font-weight:800;
  color:var(--muted);
}

.dashOverviewMetricValue{
  font-size:22px;
  line-height:1;
  font-weight:900;
  text-align:right;
}

body.mode-config #dashboardOverviewCard,
body.mode-logs #dashboardOverviewCard,
body.mode-users #dashboardOverviewCard,
body.mode-servers #dashboardOverviewCard,
body.mode-serverview #dashboardOverviewCard,
body.mode-dms #dashboardOverviewCard{
  display:none !important;
}

@media (max-width: 1180px){
  .dashOverviewStats{
    grid-template-columns:repeat(3, minmax(0,1fr));
  }

  .dashOverviewBottom{
    grid-template-columns:1fr;
  }

  .serverGrid{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px){
  .dashboardOverviewCard{
    padding:15px;
  }

  .dashOverviewHero{
    flex-direction:column;
    align-items:stretch;
  }

  .dashOverviewStats{
    grid-template-columns:repeat(2, minmax(0,1fr));
  }

  .dashOverviewPanelTop{
    flex-direction:column;
  }

  .dashOverviewUptimeStat{
    text-align:left;
  }

  .serverGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap:10px;
  }
}

@media (max-width: 540px){
  .dashOverviewStats{
    grid-template-columns:1fr;
  }

  .serverGrid{
    grid-template-columns: 1fr;
  }
}

.configLayout{
  display:grid;
  grid-template-columns: minmax(0, 1fr) 240px;
  gap:14px;
  align-items:start;
}

#configCard{
  position:relative;
}

.configModuleStage{
  position:relative;
  margin-top:18px;
  min-height:var(--configModuleStageHeight, 920px);
  overflow-anchor:none;
  transition:min-height .22s cubic-bezier(.22,1,.36,1);
}

.configModuleOverview.isModulesLoading .configModuleStage{
  min-height:var(--configModuleStageHeight, 920px);
}

.configLoadOverlay{
  position:absolute;
  inset:0;
  z-index:4;
  display:flex;
  align-items:flex-start;
  justify-content:center;
  padding-top:112px;
  min-height:100%;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.018));
  box-shadow:
    0 14px 34px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.045);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .24s ease, visibility 0s linear .24s;
}

.configLoadOverlay.isActive{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transition:opacity .22s ease;
}

.configLoadInner{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:14px;
  width:min(340px, calc(100% - 36px));
}

.configLoadBar{
  position:relative;
  width:100%;
  height:4px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  overflow:hidden;
}

.configLoadFill{
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:0;
  border-radius:inherit;
  background:linear-gradient(90deg, rgba(var(--accent-rgb), .6), rgb(var(--accent-rgb)));
  box-shadow:0 0 12px rgba(var(--accent-rgb), .5);
}

.configLoadOverlay.isActive .configLoadFill{
  animation:configLoadFill 1.2s cubic-bezier(.25,.8,.3,1) forwards;
}

.configLoadText{
  font-size:15.5px;
  font-weight:900;
  letter-spacing:.045em;
  color:rgba(231,234,242,.88);
}

@keyframes configLoadFill{
  0%{width:0}
  72%{width:84%}
  100%{width:100%}
}

@media (prefers-reduced-motion:reduce){
  .configLoadOverlay,
  .configLoadOverlay.isActive{
    transition:none;
  }

  .configModuleOverviewList{
    transition:none;
    transform:none;
  }

  .configLoadOverlay.isActive .configLoadFill{
    animation:none;
    width:100%;
  }
}

.configRail{
  position: sticky;
  top: 96px;
  align-self:start;
  display:grid;
  gap:14px;
  height: fit-content;
}

.railBox{
  background: var(--card2);
  border:1px solid var(--line);
  border-radius:14px;
  padding:14px;
  display:grid;
  gap:10px;
}

.configRail .railBox{
  min-height:0;
}
.railTitle{
  font-size:12px;
  color:var(--muted);
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.configRail .btn{ width:100%; }

#controlDock #controlBlock{
  width:100%;
}

.modulesDock{
  --moduleDockRowHeight: 36px;
  display:grid;
  gap:6px;
  max-height: calc((var(--moduleDockRowHeight) * 14) + (6px * 13));
  overflow-y:auto;
  overflow-x:hidden;
  align-content:start;
  padding-right:4px;
}

.modulesDock .field{
  min-width:0;
  margin:0;
}

.modulesDock .field.fieldInline{
  min-height:var(--moduleDockRowHeight);
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  column-gap:10px;
  row-gap:0;
}

.modulesDock .field.fieldInline label{
  margin:0;
  font-size:13px;
  line-height:1.15;
}

.modulesDock .field.fieldInline .toggle{
  justify-self:end;
}

.moduleRow{
  min-height:var(--moduleRowHeight);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 12px;
  border-radius:14px;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.05);
}

.moduleRow:hover{
  border-color: rgba(255,255,255,.16);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 28px rgba(0,0,0,.18);
}

.moduleName{
  font-weight:800;
  font-size:13px;
}

.moduleDockCategory{
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.018));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  overflow:hidden;
}

.moduleDockCategoryBtn{
  width:100%;
  min-height:38px;
  padding:10px 12px;
  border:0;
  background:transparent;
  color:var(--text);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  border-radius:0;
}

.moduleDockCategoryBtn:hover{
  background:rgba(255,255,255,.04);
}

.moduleDockCategoryLeft{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.moduleDockCategoryCaret{
  flex:0 0 auto;
  font-size:12px;
  line-height:1;
  color:var(--muted);
  transition:transform .18s ease;
}

.moduleDockCategory.isClosed .moduleDockCategoryCaret{
  transform:rotate(-90deg);
}

.moduleDockCategoryLabel{
  min-width:0;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
  line-height:1.15;
}

.moduleDockCategoryCount{
  flex:0 0 auto;
  min-width:22px;
  height:22px;
  padding:0 7px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  color:var(--text);
  font-size:11px;
  font-weight:800;
}

.moduleDockCategoryBody{
  display:grid;
  gap:0;
  padding:0 10px 10px;
  overflow:hidden;
  overflow-x:hidden;
  align-content:start;
  padding-right:6px;
  max-height:min(42vh, 340px);
  opacity:1;
  transition:
    max-height .30s cubic-bezier(.22,1,.36,1),
    opacity .18s ease,
    padding .18s ease;
  will-change:max-height, opacity;
}

.moduleDockCategoryBody::-webkit-scrollbar{
  width:8px;
}

.moduleDockCategoryBody::-webkit-scrollbar-track{
  background:rgba(255,255,255,.05);
  border-radius:999px;
}

.moduleDockCategoryBody::-webkit-scrollbar-thumb{
  background:linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,.12));
  border-radius:999px;
  border:2px solid rgba(0,0,0,.18);
}

.moduleDockCategory:not(.isClosed) .moduleDockCategoryBody{
  overflow-y:auto;
}

.moduleDockCategory.isClosed .moduleDockCategoryBody{
  max-height:0 !important;
  opacity:0;
  padding-bottom:0;
  pointer-events:none;
}

.moduleDockCategory .field.fieldInline{
  margin:0;
  padding:8px 2px;
  border-top:1px solid rgba(255,255,255,.06);
}

.moduleDockCategoryEmpty{
  padding:10px 2px 2px;
  color:var(--muted);
  font-size:12px;
  line-height:1.35;
}

.configModulePageHead{
  margin-bottom:14px;
}

.configModulePageSubtitle{
  margin-top:4px;
  line-height:1.45;
}

.configModuleOverview{
  display:grid;
  gap:14px;
}

.configModuleOverviewHero{
  min-height:88px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:16px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:
    radial-gradient(circle at 0% 0%, rgba(var(--accent-rgb), .10), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.018));
  box-shadow:
    0 14px 34px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.configModuleGuildHero{
  min-width:0;
  min-height:54px;
  display:flex;
  align-items:center;
  gap:13px;
}

.configModuleGuildIconWrap{
  width:54px;
  height:54px;
  flex:0 0 54px;
  border-radius:18px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(13,17,32,.82);
  box-shadow:
    0 10px 24px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.configModuleGuildIcon{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.configModuleGuildFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-weight:950;
  color:rgba(231,234,242,.76);
  background:
    radial-gradient(circle at 30% 20%, rgba(var(--accent-rgb), .16), transparent 38%),
    rgba(255,255,255,.035);
}

.configModuleGuildText{
  min-width:0;
  min-height:46px;
  display:grid;
  align-content:center;
  gap:4px;
}

.configModuleGuildText h3{
  margin:0;
  font-size:24px;
  line-height:1.08;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.configModuleGuildText p{
  line-height:1.35;
}

.configModuleOverviewCount{
  flex:0 0 auto;
  min-width:104px;
  min-height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(43,213,118,.18);
  background:rgba(43,213,118,.055);
  color:rgba(174,247,199,.88);
  font-size:12px;
  font-weight:900;
  white-space:nowrap;
  box-shadow:0 0 24px rgba(43,213,118,.045);
}

.configModuleToolbar{
  display:flex;
  align-items:center;
  gap:10px;
  max-width:620px;
}

#configModuleSearch{
  width:360px;
  max-width:100%;
  flex:0 1 360px;
}

.configModuleToolbar input,
.configModuleToolbar select{
  min-height:44px;
  border-radius:14px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.016));
  border:1px solid rgba(255,255,255,.09);
  color:var(--text);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 10px 24px rgba(0,0,0,.18);
  transition:border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.configModuleToolbar input:hover,
.configModuleToolbar select:hover{
  border-color:rgba(255,255,255,.16);
}

.configModuleToolbar input:focus,
.configModuleToolbar select:focus{
  border-color:rgba(var(--accent-rgb), .46);
  box-shadow:
    0 0 0 3px rgba(var(--accent-rgb), .14),
    inset 0 1px 0 rgba(255,255,255,.075),
    0 12px 26px rgba(0,0,0,.22);
}

.configModuleFilterWrap{
  width:190px;
  min-width:190px;
}

.configModuleFilterWrap::after{
  content:"";
  position:absolute;
  right:14px;
  top:50%;
  width:18px;
  height:18px;
  transform:translateY(-50%);
  pointer-events:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='rgba(231,234,242,0.72)' d='M7 10l5 6 5-6z'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-size:18px 18px;
}

#configModuleFilter{
  appearance:none;
  -webkit-appearance:none;
  padding-right:46px;
  font-weight:900;
}

.configModuleOverviewList{
  display:grid;
  gap:18px;
  opacity:1;
  transform:none;
  transition:
    opacity .26s ease,
    transform .34s cubic-bezier(.22,1,.36,1);
  will-change:opacity, transform;
  overflow-anchor:none;
}

.configModuleOverview.isModulesLoading .configModuleOverviewList{
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translate3d(0,14px,0) scale(.992);
}

.configModuleGroup{
  display:grid;
  gap:10px;
}

.configModuleGroupHead{
  width:100%;
  min-height:34px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 2px;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  text-align:left;
}

.configModuleGroupHeadLeft{
  min-width:0;
  display:flex;
  align-items:center;
  gap:7px;
}

.configModuleGroupCaret{
  width:16px;
  height:16px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:rgba(231,234,242,.54);
  font-size:12px;
  line-height:1;
  transform:rotate(0deg);
  transition:transform .16s ease, color .16s ease;
}

.configModuleGroupHead:hover .configModuleGroupCaret{
  color:rgba(231,234,242,.86);
}

.configModuleGroupTitle{
  min-width:0;
  color:rgba(231,234,242,.78);
  font-size:12px;
  font-weight:900;
  letter-spacing:.075em;
  text-transform:uppercase;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.configModuleGroupBody{
  overflow:visible;
  max-height:2200px;
  opacity:1;
  transition:max-height .22s cubic-bezier(.22,1,.36,1), opacity .14s ease;
}

.configModuleGroup.isClosed .configModuleGroupCaret{
  transform:rotate(-90deg);
}

.configModuleGroup.isClosed .configModuleGroupBody{
  overflow:hidden;
  max-height:0;
  opacity:0;
}

.configModuleGroupCount{
  min-width:22px;
  height:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 7px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.035);
  color:rgba(231,234,242,.52);
  font-size:11px;
  font-weight:900;
}

.configModuleCardGrid{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(245px, 1fr));
  gap:12px;
  padding:6px 4px 4px;
  margin:-6px -4px -4px;
  overflow:visible;
}

.configModuleCard{
  min-height:190px;
  position:relative;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:12px;
  padding:16px 92px 62px 16px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.038), rgba(255,255,255,.016));
  box-shadow:
    0 12px 30px rgba(0,0,0,.20),
    inset 0 1px 0 rgba(255,255,255,.04);
  transform-origin:center;
  will-change:transform;
  transition:
    transform .18s cubic-bezier(.22,1,.36,1),
    border-color .18s ease,
    background .18s ease,
    box-shadow .18s ease,
    opacity .18s ease;
}

.configModuleCard::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  border-radius:16px 16px 0 0;
  background:rgba(255,255,255,.12);
  opacity:.34;
  pointer-events:none;
  transition:opacity .18s ease, background .18s ease, box-shadow .18s ease;
}

.configModuleCard:hover{
  transform:translateY(-2px) scale(1.012);
  border-color:rgba(255,255,255,.16);
  background:
    linear-gradient(180deg, rgba(255,255,255,.048), rgba(255,255,255,.02));
  box-shadow:
    0 18px 42px rgba(0,0,0,.28),
    inset 0 1px 0 rgba(255,255,255,.052);
}

.configModuleCard:hover::before{
  opacity:.72;
}

.configModuleCard.is-active{
  border-color:rgba(255,255,255,.11);
  background:
    linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.018));
  box-shadow:
    0 12px 30px rgba(0,0,0,.20),
    0 0 24px rgba(43,213,118,.035),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.configModuleCard.is-active::before{
  opacity:1;
  background:linear-gradient(90deg, rgba(43,213,118,.72), rgba(43,213,118,.44));
  box-shadow:0 0 18px rgba(43,213,118,.14);
}

.configModuleCard.is-missing{
  border-color:rgba(255,255,255,.105);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.017));
  box-shadow:
    0 12px 30px rgba(0,0,0,.20),
    0 0 28px rgba(255,77,77,.06),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.configModuleCard.is-missing::before{
  opacity:1;
  background:linear-gradient(90deg, rgba(255,77,77,.66), rgba(255,77,77,.38));
  box-shadow:0 0 18px rgba(255,77,77,.14);
}

.configModuleCard.is-disabled{
  opacity:.50;
}

.configModuleCard.is-disabled:hover{
  opacity:.58;
}

.configModuleCardTop{
  display:block;
  min-width:0;
}

.configModuleCardBottom{
  position:absolute;
  right:16px;
  bottom:16px;
  z-index:3;
}

.configModuleCardMeta{
  min-width:0;
  width:100%;
  display:grid;
  gap:8px;
}

.configModuleWarnBadge{
  position:absolute;
  right:20px;
  top:58px;
  z-index:3;
  width:30px;
  height:30px;
  display:grid;
  place-items:center;
  padding:0;
  border-radius:999px;
  border:1px solid rgba(255,77,77,.24);
  background:rgba(255,77,77,.085);
  box-shadow:0 0 18px rgba(255,77,77,.10);
  font-size:15px;
  line-height:1;
  text-align:center;
  font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",ui-sans-serif,system-ui,sans-serif;
}

.configModuleCardMeta h3{
  margin:0;
  font-size:14.5px;
  line-height:1.15;
  font-weight:900;
  color:rgba(255,255,255,.95);
}

.configModuleCardMeta p{
  color:rgba(231,234,242,.62);
  font-size:12px;
  line-height:17px;
  max-height:none;
  overflow:visible;
}

.configModuleSwitch{
  position:absolute !important;
  right:16px;
  top:16px;
  z-index:4;
  width:56px;
  height:30px;
  display:block;
  flex:0 0 auto;
  margin:0;
  padding:0;
  cursor:pointer;
}

.configModuleSwitch .checkbox-wrapper-30,
.configModuleSwitch .checkbox-wrapper-30 *,
.configModuleSwitch svg.checkbox{
  display:none !important;
  width:0 !important;
  height:0 !important;
  opacity:0 !important;
  pointer-events:none !important;
}

.configModuleSwitch input{
  position:absolute !important;
  inset:auto !important;
  left:0 !important;
  top:0 !important;
  width:1px !important;
  height:1px !important;
  opacity:0 !important;
  overflow:hidden !important;
  clip:rect(0 0 0 0) !important;
  clip-path:inset(50%) !important;
  white-space:nowrap !important;
  pointer-events:none !important;
  appearance:none !important;
  -webkit-appearance:none !important;
  border:0 !important;
  margin:0 !important;
  padding:0 !important;
}

.configModuleSwitchSlider{
  position:absolute;
  inset:0;
  width:56px;
  height:30px;
  border-radius:999px;
  background:linear-gradient(135deg, #3a4150, #171b22);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:0 6px 16px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.06);
  transition:
    background .35s cubic-bezier(.22,1,.36,1),
    box-shadow .25s ease,
    transform .15s ease,
    border-color .25s ease;
}

.configModuleSwitchSlider::before{
  content:"";
  position:absolute;
  width:24px;
  height:24px;
  left:2px;
  top:2px;
  border-radius:999px;
  background:#fff;
  box-shadow:0 2px 5px rgba(0,0,0,.28);
  transition:
    transform .35s cubic-bezier(.22,1,.36,1),
    box-shadow .2s ease;
}

.configModuleSwitch:hover .configModuleSwitchSlider{
  border-color:rgba(255,255,255,.18);
}

.configModuleSwitch input:focus-visible + .configModuleSwitchSlider{
  box-shadow:
    0 6px 16px rgba(0,0,0,.26),
    0 0 0 3px rgba(var(--accent-rgb), .18),
    inset 0 1px 0 rgba(255,255,255,.06);
}

.configModuleSwitch input:checked + .configModuleSwitchSlider,
.configModuleSwitch.is-on .configModuleSwitchSlider{
  background:linear-gradient(135deg, rgba(var(--accent-rgb), 1), rgba(var(--accent-rgb), .55));
  border-color:rgba(var(--accent-rgb), .45);
  box-shadow:
    0 6px 16px rgba(0,0,0,.26),
    0 0 18px rgba(var(--accent-rgb), .22),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.configModuleSwitch input:checked + .configModuleSwitchSlider::before,
.configModuleSwitch.is-on .configModuleSwitchSlider::before{
  transform:translateX(26px);
  box-shadow:0 2px 8px rgba(0,0,0,.32), 0 0 8px rgba(var(--accent-rgb), .28);
}

.configModuleSwitch:active .configModuleSwitchSlider{
  transform:scale(.97);
}

.configModuleOverviewList.staggerPreparing .configModuleCard{
  opacity:0;
  transform:translate3d(0,10px,0);
}

.configModuleOverviewList.staggerOnce .configModuleCard{
  animation:dashAnimFadeUp .38s cubic-bezier(.22,1,.36,1) both;
}

@keyframes dashAnimFadeUpMuted{
  from{
    opacity:0;
    transform:translate3d(0,10px,0);
  }
  to{
    opacity:.50;
    transform:none;
  }
}

.configModuleOverviewList.staggerOnce .configModuleCard.is-disabled{
  animation-name:dashAnimFadeUpMuted;
}

.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(1){ animation-delay:0s; }
.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(2){ animation-delay:.035s; }
.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(3){ animation-delay:.07s; }
.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(4){ animation-delay:.105s; }
.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(5){ animation-delay:.14s; }
.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(6){ animation-delay:.175s; }
.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(7){ animation-delay:.21s; }
.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(8){ animation-delay:.245s; }
.configModuleOverviewList.staggerOnce .configModuleCardGrid .configModuleCard:nth-child(n+9){ animation-delay:.28s; }

@media (prefers-reduced-motion: reduce){
  .configModuleOverviewList.staggerPreparing .configModuleCard,
  .configModuleOverviewList.staggerOnce .configModuleCard{
    animation:none !important;
    opacity:1;
    transform:none;
  }

  .configModuleCard,
  .configModuleCard::before,
  .configModuleSwitchSlider,
  .configModuleSwitchSlider::before{
    transition:none !important;
  }
}

.configModuleCardBottom{
  position:absolute;
  right:16px;
  bottom:16px;
  z-index:3;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
}

.configModuleSettingsBtn{
  width:40px;
  height:40px;
  min-height:40px;
  padding:0;
  border-radius:13px;
  font-size:12px;
  font-weight:900;
  margin-left:0;
  background:rgba(255,255,255,.035);
  border-color:rgba(255,255,255,.09);
  box-shadow:
    0 10px 24px rgba(0,0,0,.18),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.configModuleSettingsIconBtn svg{
  display:block;
}

.configModuleSettingsBtn:disabled{
  opacity:.36;
  cursor:not-allowed;
  background:rgba(255,255,255,.025);
  border-color:rgba(255,255,255,.055);
  color:rgba(231,234,242,.42);
}

.configModuleOverviewEmpty,
.configModuleEmpty{
  padding:16px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
  color:var(--muted);
  line-height:1.4;
}

.configModuleOverviewEmpty{
  display:grid;
  gap:5px;
}

.configModuleOverviewEmpty strong{
  color:var(--text);
}

.configModuleEditorTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:14px;
  padding:16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.044), rgba(255,255,255,.018));
  box-shadow:
    0 14px 34px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.045);
}

#configModuleBackBtn{
  order:2;
  flex:0 0 auto;
}

.configModuleEditorTitleWrap{
  order:1;
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:5px;
}

.configModuleEditorTitleWrap h3{
  margin:0;
  font-size:22px;
  line-height:1.1;
}

.configModuleEditorTitleWrap p{
  white-space:pre-line;
  line-height:1.45;
}

@media (max-width: 1180px){
  .configModuleCardGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px){
  .configModuleOverviewHero,
  .configModuleEditorTop{
    flex-direction:column;
    align-items:stretch;
  }

  #configModuleBackBtn{
    order:1;
    width:100%;
  }

  .configModuleEditorTitleWrap{
    order:2;
  }

  .configModuleOverviewCount{
    width:100%;
  }

  .configModuleToolbar{
    display:grid;
    grid-template-columns:1fr;
    max-width:none;
  }

  #configModuleSearch{
    width:100%;
    flex:auto;
  }

  .configModuleFilterWrap{
    width:100%;
    min-width:0;
  }

  .configModuleCardGrid{
    grid-template-columns:1fr;
  }

  .configModuleCard{
    min-height:132px;
  }

  .configModuleCardBottom{
    align-items:stretch;
    flex-direction:column;
  }

  .configModuleSettingsBtn{
    width:38px;
  }
}

@media (max-width: 760px){
  .moduleDockCategoryBtn{
    padding:10px;
  }

  .moduleDockCategoryBody{
    padding:0 8px 8px;
    padding-right:4px;
  }

  .moduleDockCategory:not(.isClosed) .moduleDockCategoryBody{
    max-height:min(38dvh, 280px);
  }
}

@media (max-width: 960px){
  .configLayout{ grid-template-columns: 1fr; }
  .configRail{ position: static; }
}

body.mode-config .sideList::-webkit-scrollbar{
  width: 10px;
}

body.mode-config .sideList::-webkit-scrollbar-track{
  background: rgba(255,255,255,.06);
  border-radius: 999px;
}

body.mode-config .sideList::-webkit-scrollbar-thumb{
  background: linear-gradient(180deg, rgba(255,255,255,.28), rgba(255,255,255,.14));
  border-radius: 999px;
  border: 2px solid rgba(0,0,0,.20);
}

body:not(.mode-config) #serverSelectCard{
  align-self: center;
}

body.mode-config .main.wrap{
  max-width: none;
  width: 100%;
  margin: 0;
  padding-left: 18px;
  padding-right: 18px;
}

body.mode-config .configLayout{
  grid-template-columns: minmax(0, 1fr) 240px;
  gap: 16px;
}

body.mode-config .configMain{
  padding-right: 0;
}

body.mode-config .configRail{
  position: sticky;
  top: 96px;
  align-self:start;
  height: fit-content;
}

#toastWrap{
  position: fixed;
  top: 12px;
  left: 12px;
  z-index: 9998;

  max-width: min(420px, calc(100vw - 24px));
  padding: 0 !important;
  margin: 0 !important;
  pointer-events: none;
}

#toast{
  pointer-events: auto;
  margin: 0;
  width: max-content;
  max-width: min(420px, calc(100vw - 24px));

  background: rgba(10,12,18,.70);
  backdrop-filter: blur(10px);
  box-shadow: 0 14px 40px rgba(0,0,0,.35);
}

input, select, textarea{
  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  border: 1px solid rgba(255,255,255,.09);
  color: var(--text);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}

input:hover, select:hover, textarea:hover{
  border-color: rgba(255,255,255,.16);
}

input:focus, select:focus, textarea:focus{
  border-color: rgba(var(--accent-rgb), .55);
  box-shadow:
    0 0 0 3px rgba(var(--accent-rgb), .18),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 16px 36px rgba(0,0,0,.32);
}

input[type="text"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="email"]:focus,
input[type="password"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
select:focus,
textarea:focus{
  transform: translate3d(0,-1px,0);
}

@media (prefers-reduced-motion: reduce){
  input[type="text"]:focus,
  input[type="number"]:focus,
  input[type="search"]:focus,
  input[type="email"]:focus,
  input[type="password"]:focus,
  input[type="tel"]:focus,
  input[type="url"]:focus,
  select:focus,
  textarea:focus{
    transform:none;
  }
}

.field.isMissing input,
.field.isMissing select,
.field.isMissing textarea,
.field.isMissing input:focus,
.field.isMissing select:focus,
.field.isMissing textarea:focus{
  border-color: rgba(255,77,77,.85);
  box-shadow:
    0 0 0 3px rgba(255,77,77,.22),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 30px rgba(0,0,0,.28);
}

#missingWrap{
  position: fixed;
  top: 14px;
  right: 14px;
  z-index: 10020;
  pointer-events: none;
}

#dirtyWrap{
  position: fixed;
  top: 64px;
  right: 14px;
  z-index: 9999;
  pointer-events: none;
}

#dirtyToast{
  display: block;
  color: rgba(246,194,68,.95);
  font-weight: 900;
  background: rgba(9,10,16,.55);
  backdrop-filter: blur(10px);
}

#missingToast{
  display: block;
  color: rgba(255,77,77,.98);
  font-weight: 900;
  background: rgba(9,10,16,.96);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  box-shadow: 0 18px 44px rgba(0,0,0,.42);
}

input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline: none;
}

select{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  padding-right: 46px;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='rgba(231,234,242,0.72)' d='M7 10l5 6 5-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 0 0, right 14px center;
  background-size: auto, 18px 18px;
}

select[multiple]{
  background-image: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  padding-right: 12px;
  min-height: 110px;
}

body.mode-config input:not([type="checkbox"]):not([type="color"]),
body.mode-config select,
body.mode-config textarea{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.09);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}

body.mode-config input:not([type="checkbox"]):not([type="color"]),
body.mode-config textarea{
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
}

body.mode-config input:not([type="checkbox"]):not([type="color"]):hover,
body.mode-config select:hover,
body.mode-config textarea:hover{
  border-color: rgba(255,255,255,.16);
}

body.mode-config input:not([type="checkbox"]):not([type="color"]):focus,
body.mode-config select:focus,
body.mode-config textarea:focus{
  border-color: rgba(93,168,255,.55);
  box-shadow:
    0 0 0 3px rgba(93,168,255,.18),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 30px rgba(0,0,0,.28);
}

.chanPrefix{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 18px;
  height: 18px;
  border-radius: 9px;
  display: grid;
  place-items: center;
  font-weight: 900;
  font-size: 12px;
  color: rgba(231,234,242,.85);
  background: rgba(255,255,255,.08);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12);
  pointer-events: none;
}

select.hasChanPrefix{
  padding-left: 38px;
}

.msBtn.hasChanPrefix{
  padding-left: 38px;
}

.msSearch{
  width: 100%;
  height: 40px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  color: rgba(231,234,242,.92);
  padding: 0 12px;
  outline: none;
  margin: 0 0 8px;
}

.msSearch::placeholder{
  color: rgba(231,234,242,.55);
  font-weight: 800;
}

.msSearch:focus{
  border-color: rgba(var(--accent-rgb), .55);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .16);
}

.msChanDot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb), .75);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb), .16);
}

.selectWrap{
  position: relative;
}

.ms{
  position: relative;
}

.msBtn{
  width: 100%;
  text-align: left;
  cursor: pointer;

  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;

  padding: 10px 46px 10px 12px;
  min-height: 44px;

  border-radius: 14px;
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  border: 1px solid rgba(255,255,255,.09);
  color: var(--text);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
  position: relative;
}

.msBtn:hover{
  border-color: rgba(255,255,255,.16);
}

.msBtn:focus{
  outline: none;
  border-color: rgba(var(--accent-rgb), .55);
  box-shadow:
    0 0 0 3px rgba(var(--accent-rgb), .18),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 30px rgba(0,0,0,.28);
}

.msBtn::after{
  content: "";
  position: absolute;
  right: 14px;
  top: 50%;
  transform: translateY(-50%);
  transition: transform .18s ease;
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='rgba(231,234,242,0.72)' d='M7 10l5 6 5-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: 18px 18px;
  pointer-events: none;
}

.msClear{
  position: absolute;
  right: 38px;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.05);
  color: rgba(231,234,242,.78);
  display: grid;
  place-items: center;
  font-weight: 900;
  line-height: 1;
  opacity: 0;
  pointer-events: none;
  transition: opacity .12s ease, border-color .12s ease, background .12s ease, transform .12s ease;
  z-index: 3;
}

.ms.hasValue .msClear{
  opacity: 1;
  pointer-events: auto;
}

.msClear:hover{
  border-color: rgba(255,255,255,.18);
  background: rgba(255,255,255,.08);
}

.msClear:active{
  transform: translateY(-50%) scale(.98);
}

.msClear:focus{
  outline: none;
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .14);
}

.ms.open .msBtn{
  border-color: rgba(var(--accent-rgb), .38);
  box-shadow:
    0 0 0 3px rgba(var(--accent-rgb), .12),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 30px rgba(0,0,0,.28);
}

.ms.open .msBtn::after{
  transform: translateY(-50%) rotate(180deg);
}

.msBtn.hasRoleDot{
  padding-left: 38px;
}

.msPlaceholder{
  opacity: .7;
}

.msChip{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.10);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.2;
}

.msChipDot{
  width: 9px;
  height: 9px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px rgba(0,0,0,.35);
}

.msChipDotChan{
  background: rgba(var(--accent-rgb), .75);
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb), .16);
}

.msPanel{
  position: absolute;
  left: 0;
  right: 0;
  top: calc(100% + 8px);
  z-index: 200;

  background: rgba(12,14,22,.98);
  border: 1px solid rgba(255,255,255,.10);
  border-radius: 14px;

  box-shadow: 0 24px 60px rgba(0,0,0,.55);
  padding: 8px;

  max-height: 320px;
  overflow: auto;
  display: none;
}

.ms.open .msPanel{
  display: block;
  border-color: rgba(var(--accent-rgb), .22);
  box-shadow: 0 24px 60px rgba(0,0,0,.55);
}

#configModulesGrid.configModulesGrid{
  overflow: visible;
}

#configModulesGrid.configModulesGrid > .subcard{
  position: relative;
  overflow: visible;
  z-index: 1;
}

#configModulesGrid.configModulesGrid > .subcard:focus-within{
  z-index: 600;
}

#configModulesGrid.configModulesGrid > .subcard:has(.ms.open){
  z-index: 700;
}

.selectWrap,
.ms{
  position: relative;
}

.ms.open{
  z-index: 750;
}

.msPanel{
  z-index: 900;
}

.msItem{
  display: flex;
  align-items: center;
  gap: 10px;

  padding: 10px 10px;
  border-radius: 12px;
  cursor: pointer;
  user-select: none;

  border: 1px solid transparent;
  transition: background .15s ease, border-color .15s ease;
}

.msItem:hover{
  background: rgba(255,255,255,.05);
  border-color: rgba(255,255,255,.10);
}

.msItem.isSelected{
  background: rgba(93,168,255,.10);
}
.msItem.isSelected:hover{
  background: rgba(93,168,255,.14);
}

.msItem:has(input:checked){
  background: rgba(var(--accent-rgb), .10);
  border-color: rgba(var(--accent-rgb), .22);
}

.msItem > input{
  width: 18px;
  height: 18px;
  cursor: pointer;
  accent-color: var(--accent);
}

.msRoleDot{
  width: 10px;
  height: 10px;
  border-radius: 999px;
  box-shadow: 0 0 0 2px rgba(0,0,0,.35);
}

.msText{
  font-weight: 800;
}

.field.isMissing .msBtn,
.field.isMissing .msBtn:focus{
  border-color: rgba(255,77,77,.85);
  box-shadow:
    0 0 0 3px rgba(255,77,77,.22),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 30px rgba(0,0,0,.28);
}

.roleDot{
  position: absolute;
  left: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 11px;
  height: 11px;
  border-radius: 999px;
  background: rgba(255,255,255,.18);
  box-shadow: 0 0 0 2px rgba(0,0,0,.35), 0 8px 20px rgba(0,0,0,.25);
  pointer-events: none;
}

select.hasRoleDot{
  padding-left: 38px;
}

details.advanced[open] #rawJson{
  height: min(70vh, 780px);
  min-height: min(70vh, 780px);
  resize: vertical;
}

:root{
  --scroll-track: rgba(255,255,255,.06);
  --scroll-thumbA: rgba(255,255,255,.28);
  --scroll-thumbB: rgba(255,255,255,.14);
}

*{
  scrollbar-width: thin;
  scrollbar-color: var(--scroll-thumbA) var(--scroll-track);
}

*::-webkit-scrollbar{ width: 12px; height: 12px; }
*::-webkit-scrollbar-track{
  background: var(--scroll-track);
  border-radius: 999px;
}
*::-webkit-scrollbar-thumb{
  border-radius: 999px;
  background: linear-gradient(180deg, var(--scroll-thumbA), var(--scroll-thumbB));
  border: 3px solid rgba(0,0,0,0);
  background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover{
  background: linear-gradient(180deg, rgba(255,255,255,.36), rgba(255,255,255,.18));
}

.toggle{display:flex;align-items:center}
.toggle input[type="checkbox"]{
  appearance:none;
  -webkit-appearance:none;

  width:56px;
  height:30px;
  border-radius:999px;

  background: linear-gradient(135deg, #3a4150, #171b22);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: 0 6px 16px rgba(0,0,0,.26), inset 0 1px 0 rgba(255,255,255,.06);
  transition:
    background .35s cubic-bezier(.22,1,.36,1),
    box-shadow .25s ease,
    transform .15s ease,
    border-color .25s ease;
  position:relative;
  cursor:pointer;
}

.toggle input[type="checkbox"]::before{
  content:"";
  width:24px;
  height:24px;
  border-radius:50%;
  background:#fff;
  box-shadow: 0 2px 5px rgba(0,0,0,.28);
  position:absolute;
  top:2px;
  left:2px;
  transition:
    transform .35s cubic-bezier(.22,1,.36,1),
    box-shadow .2s ease;
}

.toggle input[type="checkbox"]:hover{
  border-color: rgba(255,255,255,.18);
}

.toggle input[type="checkbox"]:checked{
  border-color: rgba(var(--accent-rgb), .45);
  box-shadow:
    0 6px 16px rgba(0,0,0,.26),
    0 0 18px rgba(var(--accent-rgb), .22),
    inset 0 1px 0 rgba(255,255,255,.10);
}

.toggle input[type="checkbox"]:checked::before{
  box-shadow: 0 2px 8px rgba(0,0,0,.32), 0 0 8px rgba(var(--accent-rgb), .28);
}

.toggle input[type="checkbox"]:active{
  transform: scale(.97);
}

@media (prefers-reduced-motion: reduce){
  .toggle input[type="checkbox"],
  .toggle input[type="checkbox"]::before{
    transition:none !important;
  }
  .toggle input[type="checkbox"]:active{
    transform:none;
  }
}

.toggle input[type="checkbox"]:checked{
  background: linear-gradient(135deg, rgba(var(--accent-rgb), 1), rgba(var(--accent-rgb), .55));
}

.toggle input[type="checkbox"]:checked::before{
  transform: translateX(26px);
}

.botBannerPreview{
  width: 340px;
  height: 136px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background-color: #0d1120;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  box-shadow: 0 14px 34px rgba(0,0,0,.35);
  position: relative;
  display:grid;
  place-items:center;
}

.botBannerPreview .previewOverlay{ max-width: 220px; }

.botBannerPreview.hasImage .previewOverlay{ opacity: 0; }
.botBannerPreview.hasImage:hover .previewOverlay{ opacity: 1; }

.jlBgPreview{
  width: 100%;
  max-width: 340px;
  height: 120px;
  border-radius: 16px;
  border: 1px solid var(--line);
  background-color: #0d1120;
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  box-shadow: 0 14px 34px rgba(0,0,0,.35);
  position: relative;
  display:grid;
  place-items:center;
}

.jlBgDim{
  position:absolute;
  inset:0;
  border-radius: 16px;
  background:#000;
  opacity:0;
  pointer-events:none;
  transition: opacity .12s ease;
}

.jlBgPreview .previewOverlay{
  position: relative;
  z-index: 2;
}

.jlBrightRow{
  width: 100%;
  max-width: 360px;
  margin-top: 10px;
  display:flex;
  flex-direction:column;
  gap: 8px;
  --br: 100;
}

.jlBrightTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  font-weight: 900;
  font-size: 12px;
  color: rgba(231,234,242,.78);
}

.jlBrightValue{
  display:flex;
  align-items:center;
  gap: 6px;
}

.jlBrightNum{
  width: 76px;
  height: 30px;
  border-radius: 10px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(10,12,18,.75);
  color: var(--text);
  font-weight: 900;
  letter-spacing: .2px;
  text-align: right;
  padding: 0 10px;
  outline: none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06);
}

.jlBrightNum::-webkit-outer-spin-button,
.jlBrightNum::-webkit-inner-spin-button{
  appearance: none;
  -webkit-appearance: none;
  margin: 0;
}

.jlBrightNum{
  appearance: textfield;
  -moz-appearance: textfield;
}

.jlBrightNum:focus{
  border-color: rgba(var(--accent-rgb), .35);
  box-shadow: 0 0 0 3px rgba(var(--accent-rgb), .16), inset 0 1px 0 rgba(255,255,255,.06);
}

.jlBrightSuffix{
  color: rgba(231,234,242,.68);
  font-weight: 900;
}

.jlBrightRange{
  width:100%;
  height:18px;
  -webkit-appearance:none;
  appearance:none;
  background:transparent !important;
  outline:none;
  border:0;
  box-shadow:none;
  cursor:pointer;
  accent-color:transparent;
  -webkit-tap-highlight-color:transparent;
}

.jlBrightRange:focus,
.jlBrightRange:active{
  outline:none;
  box-shadow:none;
}

.jlBrightRange::-moz-focus-outer{
  border:0;
}

.jlBrightRange::-webkit-slider-runnable-track{
  height:12px;
  border-radius:999px;
  background:
    linear-gradient(
      to right,
      rgba(var(--accent-rgb), .95) 0%,
      rgba(var(--accent-rgb), .95) calc(var(--br) * 1%),
      rgba(255,255,255,.12) calc(var(--br) * 1%),
      rgba(255,255,255,.12) 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -1px 0 rgba(0,0,0,.55);
}

.jlBrightRange::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,.06));
  box-shadow:
    0 10px 20px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.12);
  margin-top:-5px;
  transition:box-shadow .12s ease, transform .12s ease;
}

.jlBrightRange:hover::-webkit-slider-thumb,
.jlBrightRange:focus::-webkit-slider-thumb{
  box-shadow:
    0 12px 24px rgba(0,0,0,.40),
    inset 0 1px 0 rgba(255,255,255,.14);
  transform:scale(1.03);
}

.jlBrightRange::-moz-range-track{
  height:12px;
  border-radius:999px;
  background:rgba(255,255,255,.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -1px 0 rgba(0,0,0,.55);
}

.jlBrightRange::-moz-range-progress{
  height:12px;
  border-radius:999px;
  background:rgba(var(--accent-rgb), .95);
}

.jlBrightRange::-moz-range-thumb{
  width:22px;
  height:22px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:linear-gradient(180deg, rgba(255,255,255,.24), rgba(255,255,255,.06));
  box-shadow:
    0 10px 20px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.12);
  transition:box-shadow .12s ease, transform .12s ease;
}

.jlBrightRange:disabled{
  cursor:not-allowed;
  opacity:.55;
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider){
  -webkit-appearance:none;
  appearance:none;
  width:100%;
  height:22px;
  margin:6px 0;
  background:transparent;
  cursor:pointer;
  outline:none;
  -webkit-tap-highlight-color:transparent;
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider)::-webkit-slider-runnable-track{
  height:8px;
  border-radius:999px;
  background:
    linear-gradient(to right,
      var(--accent) 0%,
      var(--accent) var(--rangeFill, 0%),
      rgba(var(--accent-rgb), .16) var(--rangeFill, 0%),
      rgba(var(--accent-rgb), .16) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), inset 0 -1px 0 rgba(0,0,0,.5);
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider)::-webkit-slider-thumb{
  -webkit-appearance:none;
  width:20px;
  height:20px;
  margin-top:-6px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  background:linear-gradient(180deg, #ffffff, rgba(255,255,255,.80));
  box-shadow:0 6px 16px rgba(0,0,0,.40), 0 0 0 4px rgba(var(--accent-rgb), .14), inset 0 1px 0 rgba(255,255,255,.6);
  transition:box-shadow .14s ease, transform .14s ease;
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider):hover::-webkit-slider-thumb{
  transform:scale(1.08);
  box-shadow:0 8px 20px rgba(0,0,0,.45), 0 0 0 6px rgba(var(--accent-rgb), .22), inset 0 1px 0 rgba(255,255,255,.6);
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider):focus-visible::-webkit-slider-thumb{
  box-shadow:0 8px 20px rgba(0,0,0,.45), 0 0 0 6px rgba(var(--accent-rgb), .32), inset 0 1px 0 rgba(255,255,255,.6);
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider)::-moz-range-track{
  height:8px;
  border-radius:999px;
  background:rgba(var(--accent-rgb), .16);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), inset 0 -1px 0 rgba(0,0,0,.5);
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider)::-moz-range-progress{
  height:8px;
  border-radius:999px;
  background:var(--accent);
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider)::-moz-range-thumb{
  width:20px;
  height:20px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.22);
  background:linear-gradient(180deg, #ffffff, rgba(255,255,255,.80));
  box-shadow:0 6px 16px rgba(0,0,0,.40), 0 0 0 4px rgba(var(--accent-rgb), .14), inset 0 1px 0 rgba(255,255,255,.6);
  transition:box-shadow .14s ease, transform .14s ease;
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider):hover::-moz-range-thumb{
  transform:scale(1.08);
}

input[type="range"]:not(.jlBrightRange):not(.discordAudioSlider):not(.discordMicSettingsSlider):disabled{
  cursor:not-allowed;
  opacity:.5;
}

.jlBrightNum:disabled{
  opacity:.55;
}

.jlBgPreview.hasImage .previewOverlay{
  opacity: 0;
}

.jlBgPreview.hasImage:hover .previewOverlay{
  opacity: 1;
  background: rgba(0,0,0,.35);
  padding: 6px 10px;
  border-radius: 999px;
  backdrop-filter: blur(6px);
}

.modal{
  position: fixed;
  inset: 0;
  display: none;
  z-index: 9999;

  align-items: center;
  justify-content: center;

  padding: 120px 18px 28px;
  box-sizing: border-box;
}

.modal.show{
  display: flex;
}

.modalBackdrop{
  position:absolute;
  inset:0;
  background: rgba(0,0,0,.55);
  backdrop-filter: blur(6px);
  z-index: 0;
}

.modalCard{
  position:relative;
  width: min(920px, calc(100vw - 32px));
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background: linear-gradient(180deg, rgba(18,22,34,.96), rgba(13,17,32,.92));
  box-shadow: 0 30px 90px rgba(0,0,0,.55);
  padding: 16px;
  z-index: 1;
}

.serverBuilderExtensionAccessDeniedCard{
  width:min(480px, calc(100vw - 32px));
  display:grid;
  gap:12px;
}

.serverBuilderExtensionAccessDeniedCard h3{
  margin:0;
}

.serverBuilderExtensionAccessDeniedActions{
  display:flex;
  justify-content:flex-end;
  gap:8px;
  margin-top:4px;
}

@media (max-width:560px){
  .serverBuilderExtensionAccessDeniedActions{
    justify-content:stretch;
  }

  .serverBuilderExtensionAccessDeniedActions .btn{
    width:100%;
  }
}

.logsInviteTrackingModalCard{
  width:min(980px, calc(100vw - 32px));
  padding:18px;
}

.logsInviteTrackingHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.logsInviteTrackingHeadText{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.logsInviteTrackingEyebrow{
  display:inline-flex;
  align-self:flex-start;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(var(--accent-rgb), .24);
  background:rgba(var(--accent-rgb), .12);
  color:rgba(231,234,242,.96);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.logsInviteTrackingHead h3{
  margin:0;
  font-size:24px;
  line-height:1.12;
  letter-spacing:-0.02em;
}

.logsInviteTrackingToolbar{
  display:grid;
  grid-template-columns:minmax(320px, 1fr) minmax(220px, 280px);
  gap:12px;
  margin-top:16px;
  margin-bottom:14px;
  align-items:end;
}

.logsInviteTrackingFilter{
  display:grid;
  gap:6px;
}

.logsInviteTrackingSearchWrap{
  width:100%;
  min-width:0;
  margin:0;
}

.logsInviteTrackingToolbar .logsSearchRow{
  width:100%;
}

.logsInviteTrackingToolbar .logsSearchField{
  min-height:44px;
}

.logsInviteTrackingToolbar .selectWrap > .ms{
  width:100%;
}

.logsSearchField #logsInviteTrackingSearch{
  flex:1;
  min-width:0;
  height:38px;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  outline:none !important;
  color:#fff;
}

.logsSearchField #logsInviteTrackingSearch::placeholder{
  color:rgba(255,255,255,0.55);
}

.logsInviteTrackingToolbar .logsSearchClearBtn{
  flex:0 0 auto;
  align-self:center;
  margin-left:0;
}

.logsInviteTrackingBody{
  min-height:0;
  max-height:min(62dvh, 620px);
  overflow:auto;
  padding-right:4px;
}

.logsInviteTrackingList{
  display:grid;
  gap:12px;
}

.logsInviteTrackingEmpty{
  min-height:220px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-align:center;
}

.logsInviteCard{
  display:grid;
  gap:14px;
  padding:16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018));
}

.logsInviteCardTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.logsInviteCardTopLeft{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.logsInviteCardBadge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:24px;
  padding:0 9px;
  border-radius:999px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  border:1px solid rgba(255,255,255,.08);
}

.logsInviteCardBadge.isAccepted{
  color:#b9ffd1;
  border-color:rgba(43,213,118,.28);
  background:rgba(43,213,118,.14);
}

.logsInviteCardBadge.isOpen{
  color:#ffe6a4;
  border-color:rgba(246,194,68,.24);
  background:rgba(246,194,68,.12);
}

.logsInviteCardTitle{
  font-size:18px;
  font-weight:900;
  line-height:1.15;
  color:rgba(231,234,242,.98);
  overflow-wrap:anywhere;
}

.logsInviteCardMeta{
  font-size:12px;
  color:rgba(167,173,194,.9);
  line-height:1.45;
}

.logsInviteCardCode{
  flex:0 0 auto;
  max-width:100%;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.22);
  font-size:12px;
  font-weight:900;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color:rgba(231,234,242,.94);
  white-space:nowrap;
}

.logsInviteCardGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.logsInviteCardField{
  min-width:0;
  display:grid;
  gap:5px;
}

.logsInviteCardLabel{
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(167,173,194,.82);
}

.logsInviteCardValue{
  min-width:0;
  color:rgba(231,234,242,.96);
  font-size:14px;
  line-height:1.45;
  overflow-wrap:anywhere;
}

.resetCard{
  width: min(560px, calc(100vw - 32px));
}

.dashboardDmConfirmCard{
  width: min(620px, calc(100vw - 32px));
  padding: 18px;
}

.dashboardDmConfirmTop{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-bottom:16px;
}

.dashboardDmConfirmTop h3{
  margin:0;
  font-size:24px;
  line-height:1.15;
  letter-spacing:-0.02em;
}

.dashboardDmConfirmEyebrow{
  display:inline-flex;
  align-self:flex-start;
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color: rgba(231,234,242,.96);
  border:1px solid rgba(41,211,178,.28);
  background: rgba(41,211,178,.12);
}

.dashboardDmConfirmPanel{
  display:flex;
  align-items:center;
  gap:16px;
  padding:16px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(41,211,178,.18), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.025));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 18px 40px rgba(0,0,0,.22);
}

.dashboardDmConfirmAvatar{
  width:64px;
  height:64px;
  border-radius:20px;
  overflow:hidden;
  flex:0 0 auto;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  box-shadow: 0 10px 24px rgba(0,0,0,.20);
}

.dashboardDmConfirmAvatar .userAvatarImg{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:20px;
}

.dashboardDmConfirmAvatar .userAvatarFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border-radius:20px;
  font-size:20px;
  font-weight:900;
  color: rgba(231,234,242,.96);
}

.dashboardDmConfirmMeta{
  min-width:0;
  flex:1 1 auto;
}

.dashboardDmConfirmBadge{
  display:inline-flex;
  padding:5px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
  color: rgba(167,173,194,.94);
  background: rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
}

.dashboardDmConfirmName{
  margin-top:10px;
  font-size:20px;
  font-weight:800;
  color: rgba(231,234,242,.98);
  line-height:1.15;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.dashboardDmConfirmId{
  margin-top:6px;
  font-size:12px;
  color: rgba(167,173,194,.88);
  word-break:break-all;
}

.dashboardDmConfirmHint{
  margin-top:12px;
  padding:10px 12px;
  border-radius:14px;
  font-size:13px;
  line-height:1.5;
  color: rgba(231,234,242,.88);
  background: rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
}

.dashboardDmConfirmActions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:18px;
}

.dashboardDmConfirmSubmitBtn{
  min-width:128px;
  color:#06261f;
  font-weight:800;
  border-color: rgba(41,211,178,.40);
  background: linear-gradient(180deg, rgba(97,239,201,1), rgba(41,211,178,1));
  box-shadow:
    0 10px 24px rgba(41,211,178,.26),
    inset 0 1px 0 rgba(255,255,255,.30);
}

.dashboardDmConfirmSubmitBtn:hover{
  color:#06261f;
  border-color: rgba(41,211,178,.40);
  background: linear-gradient(180deg, rgba(97,239,201,1), rgba(41,211,178,1));
  box-shadow:
    0 10px 24px rgba(41,211,178,.26),
    inset 0 1px 0 rgba(255,255,255,.30);
  filter: brightness(1.03);
}

#categoryAdminCreateSubmitBtn.dashboardDmConfirmSubmitBtn{
  min-width:152px;
  color:rgba(231,234,242,.92);
  border-color:rgba(var(--accent-rgb), .18);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .10), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.070), rgba(255,255,255,.032));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 10px 24px rgba(0,0,0,.18);
  font-weight:850;
  filter:none;
}

#categoryAdminCreateSubmitBtn.dashboardDmConfirmSubmitBtn:hover:not(:disabled){
  color:#fff;
  border-color:rgba(var(--accent-rgb), .34);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .16), transparent 44%),
    linear-gradient(180deg, rgba(255,255,255,.090), rgba(255,255,255,.040));
  box-shadow:
    0 14px 30px rgba(0,0,0,.24),
    0 0 0 3px rgba(var(--accent-rgb), .085),
    inset 0 1px 0 rgba(255,255,255,.070);
  filter:none;
}

#categoryAdminCreateSubmitBtn.dashboardDmConfirmSubmitBtn:disabled{
  opacity:.58;
  color:rgba(231,234,242,.70);
  border-color:rgba(255,255,255,.09);
  background:rgba(255,255,255,.045);
  box-shadow:none;
}

#dashboardDmConfirmModal .modalBackdrop{
  background: rgba(2,8,15,.74);
  backdrop-filter: blur(10px);
}

#dashboardDmConfirmModal .dashboardDmConfirmCard{
  overflow:hidden;
  transform: translateY(14px) scale(.985);
  opacity:0;
  transition:
    transform .22s cubic-bezier(.22,1,.36,1),
    opacity .18s ease,
    box-shadow .18s ease;
}

#dashboardDmConfirmModal.show .dashboardDmConfirmCard{
  transform: translateY(0) scale(1);
  opacity:1;
}

#dashboardDmConfirmModal .dashboardDmConfirmCard::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:1px;
  background: linear-gradient(90deg, rgba(41,211,178,0), rgba(41,211,178,.72), rgba(41,211,178,0));
  pointer-events:none;
}

.dashboardIntroFab{
  position:fixed;
  left:18px;
  bottom:18px;
  z-index:9997;
  height:52px;
  padding:0 16px 0 14px;
  border-radius:18px;
  gap:10px;
  font-weight:900;
  letter-spacing:.01em;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .08), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow:
    0 18px 42px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.06);
}

.dashboardIntroFab:hover{
  border-color:rgba(var(--accent-rgb), .22);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .12), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.022));
  box-shadow:
    0 22px 50px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.dashboardIntroFabIcon{
  width:28px;
  height:28px;
  border-radius:12px;
  display:grid;
  place-items:center;
  color:rgba(245,248,255,.96);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

#dashboardIntroModal .modalBackdrop{
  background:rgba(2,8,15,.72);
  backdrop-filter:blur(8px);
}

#dashboardIntroModal .dashboardIntroCard{
  width:min(880px, calc(100vw - 32px));
  padding:20px;
  overflow:hidden;
  transform:translateY(14px) scale(.985);
  opacity:0;
  transition:
    transform .22s cubic-bezier(.22,1,.36,1),
    opacity .18s ease,
    box-shadow .18s ease;
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .08), transparent 28%),
    linear-gradient(180deg, rgba(18,24,35,.98), rgba(10,14,22,.96));
  border:1px solid rgba(255,255,255,.09);
  box-shadow:
    0 28px 72px rgba(0,0,0,.56),
    inset 0 1px 0 rgba(255,255,255,.05);
}

#dashboardIntroModal.show .dashboardIntroCard{
  transform:translateY(0) scale(1);
  opacity:1;
}

#dashboardIntroModal .dashboardIntroCard::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:1px;
  background:linear-gradient(90deg, rgba(var(--accent-rgb), 0), rgba(var(--accent-rgb), .32), rgba(var(--accent-rgb), 0));
  pointer-events:none;
}

.dashboardIntroTop{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-bottom:16px;
}

.dashboardIntroTop h3{
  margin:0;
  font-size:26px;
  line-height:1.08;
  letter-spacing:-.02em;
}

.dashboardIntroEyebrow{
  display:inline-flex;
  align-self:flex-start;
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(241,246,255,.96);
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
}

.dashboardIntroBody{
  display:grid;
  gap:14px;
}

.dashboardIntroHero{
  padding:16px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .08), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 30px rgba(0,0,0,.18);
}

.dashboardIntroHeroTitle{
  font-size:20px;
  font-weight:900;
  line-height:1.1;
  color:rgba(231,234,242,.98);
}

.dashboardIntroHeroText{
  margin-top:8px;
  color:rgba(231,234,242,.80);
  line-height:1.6;
  font-size:14px;
}

.dashboardIntroChoiceGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.dashboardIntroChoice{
  width:100%;
  min-width:0;
  text-align:left;
  padding:16px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.02)),
    rgba(255,255,255,.02);
  color:var(--text);
  cursor:pointer;
  transition:
    transform .18s ease,
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 34px rgba(0,0,0,.18);
}

.dashboardIntroChoice:hover{
  transform:translateY(-2px);
  border-color:rgba(var(--accent-rgb), .18);
  background:
    linear-gradient(180deg, rgba(var(--accent-rgb), .06), rgba(255,255,255,.02)),
    rgba(255,255,255,.02);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 16px 36px rgba(0,0,0,.22);
}

.dashboardIntroChoiceBadge{
  display:inline-flex;
  padding:5px 9px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(167,173,194,.94);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
}

.dashboardIntroChoiceTitle{
  margin-top:12px;
  font-size:20px;
  font-weight:900;
  line-height:1.1;
  color:rgba(231,234,242,.98);
}

.dashboardIntroChoiceText{
  margin-top:8px;
  color:rgba(231,234,242,.80);
  line-height:1.55;
  font-size:14px;
}

.dashboardIntroInfo{
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.03);
}

.dashboardIntroInfoTitle{
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(167,173,194,.82);
}

.dashboardIntroInfoText{
  margin-top:6px;
  line-height:1.55;
  color:rgba(231,234,242,.86);
  font-size:14px;
}

.dashboardIntroStepList{
  display:grid;
  gap:10px;
}

.dashboardIntroStep{
  display:grid;
  grid-template-columns:40px minmax(0, 1fr);
  gap:12px;
  align-items:flex-start;
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.07);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018)),
    rgba(255,255,255,.02);
}

.dashboardIntroStepNr{
  width:40px;
  height:40px;
  border-radius:14px;
  display:grid;
  place-items:center;
  font-size:14px;
  font-weight:900;
  color:rgba(245,248,255,.98);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

.dashboardIntroStepTitle{
  font-size:15px;
  font-weight:900;
  color:rgba(231,234,242,.98);
  line-height:1.2;
}

.dashboardIntroStepText{
  margin-top:5px;
  color:rgba(231,234,242,.78);
  line-height:1.55;
  font-size:13.5px;
}

.dashboardIntroPillRow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:2px;
}

.dashboardIntroPill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:32px;
  padding:7px 11px;
  border-radius:999px;
  font-size:12px;
  font-weight:900;
  color:rgba(241,246,255,.96);
  background:rgba(var(--accent-rgb), .14);
  border:1px solid rgba(var(--accent-rgb), .22);
}

.dashboardIntroMiniGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.dashboardIntroMiniCard{
  padding:15px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.07);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018)),
    rgba(255,255,255,.02);
}

.dashboardIntroMiniTitle{
  font-size:15px;
  font-weight:900;
  line-height:1.15;
  color:rgba(231,234,242,.98);
}

.dashboardIntroMiniText{
  margin-top:7px;
  color:rgba(231,234,242,.78);
  line-height:1.55;
  font-size:13.5px;
}

.dashboardIntroActions{
  display:flex;
  justify-content:space-between;
  gap:10px;
  margin-top:18px;
}

.dashboardIntroCloseBtn{
  min-width:132px;
  color:#071a26;
  font-weight:900;
  border-color:rgba(var(--accent-rgb), .32);
  background:linear-gradient(180deg, rgba(182,220,255,1), rgba(var(--accent-rgb), 1));
  box-shadow:
    0 10px 24px rgba(var(--accent-rgb), .24),
    inset 0 1px 0 rgba(255,255,255,.28);
}

.dashboardIntroCloseBtn:hover{
  color:#071a26;
  border-color:rgba(var(--accent-rgb), .32);
  background:linear-gradient(180deg, rgba(182,220,255,1), rgba(var(--accent-rgb), 1));
  box-shadow:
    0 10px 24px rgba(var(--accent-rgb), .24),
    inset 0 1px 0 rgba(255,255,255,.28);
  filter:brightness(1.03);
}

@media (max-width: 760px){
  .dashboardIntroFab{
    left:12px;
    right:12px;
    bottom:12px;
    width:auto;
    justify-content:center;
  }

  .dashboardIntroChoiceGrid,
  .dashboardIntroMiniGrid{
    grid-template-columns:1fr;
  }

  .dashboardIntroActions{
    flex-wrap:wrap;
  }

  .dashboardIntroActions .btn{
    flex:1 1 100%;
    width:100%;
  }
}

@media (max-width:640px){
  .dashboardDmConfirmPanel{
    align-items:flex-start;
  }

  .dashboardDmConfirmActions{
    flex-wrap:wrap;
  }

  .dashboardDmConfirmActions .btn{
    flex:1 1 100%;
  }
}

#saveBtn[data-state="saving"]{
  opacity: .85;
  animation: dashAnimSavePulse 1.4s ease-out infinite;
}

#saveBtn[data-state="error"]{
  border-color: rgba(255,77,77,.35);
  box-shadow:
    0 0 0 3px rgba(255,77,77,.16),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 14px 30px rgba(0,0,0,.28);
}

.cropGrid{
  margin-top: 12px;
  display:grid;
  grid-template-columns: 360px 1fr;
  gap: 14px;
  align-items: start;
}
@media (max-width: 860px){
  .cropGrid{ grid-template-columns: 1fr; }
}

.cropStage{
  width: 360px;
  max-width: 100%;
  aspect-ratio: 1 / 1;
  border-radius: 18px;
  border: 1px solid rgba(255,255,255,.10);
  background:#0d1120;
  overflow:hidden;
  display:grid;
  place-items:center;
}

#cropCanvas{
  width: 340px;
  height: 340px;
  border-radius: 16px;
}

#cropPreviewCanvas{
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.10);
  background:#0d1120;
  box-shadow: 0 12px 30px rgba(0,0,0,.35);
}

#cropPreviewCanvas.isBanner{
  border-radius: 14px;
}

.field.fieldInline{
  grid-template-columns: 1fr auto;
  align-items: center;
}
.field.fieldInline label{ margin:0; }

.cropSide{
  display:flex;
  flex-direction:column;
  gap:12px;
  min-height: 340px;
}
.cropActions{
  margin-top:auto;
  justify-content:flex-end;
}
#cropZoomRow.jlBrightRow{
  margin-top: 0;
  max-width: 260px;
}
#cropZoomRow .jlBrightNum{
  width: 86px;
}

.avatarEditor{
  display:grid;
  gap:12px;
}

.avatarActions{
  display:grid;
  grid-template-columns: 1fr auto;
  gap:12px;
  align-items:start;
}

.avatarActionsRight{
  display:flex;
  flex-direction:column;
  gap:10px;
}

#botAvatarAddBtn{
  justify-content:center;
  min-height: 42px;
}

#botAvatarEditBtn, #botAvatarClearBtn{
  width: 150px;
  justify-content:center;
}

.botProfileGrid{
  display:grid;
  grid-template-columns: 1fr;
  gap:14px;
  align-items:stretch;
}

.botProfileGrid .bpLeft{
  grid-column: 1;
}

.botProfileGrid .bpRight{
  grid-column: 2;
  grid-row: 1 / span 2;
  display:flex;
  flex-direction:column;
  height:100%;
}

.botProfileGrid .bpRight .avatarRow{
  margin-top:auto;
}

.botProfileGrid .bpFull{
  grid-column: 1 / -1;
}

@media (max-width: 960px){
  .botProfileGrid{
    grid-template-columns: 1fr;
  }

  .botProfileGrid .bpRight{
    grid-column: auto;
    grid-row: auto;
  }

  .botProfileGrid .bpFull{
    grid-column: auto;
  }
}

#botNickInput{
  height: 42px;
}

#botBioInput{
  min-height: 90px;
  resize: vertical;
}

.avatarRow{
  display:grid;
  grid-template-columns: 1fr 160px;
  gap:12px;
  align-items:end;
}

.avatarRow.jlBgRow{
  grid-template-columns: minmax(0, 1fr) 140px;
  align-items:end;
}

.avatarRow.jlBgRow .avatarLeft{
  justify-items:stretch;
}

.avatarRow.jlBgRow .avatarRight{
  align-self:end;
}

@media (max-width: 720px){
  .avatarRow.jlBgRow{
    grid-template-columns: 1fr;
  }
  .avatarRow.jlBgRow .avatarRight{
    flex-direction: row;
  }
}

.avatarLeft{
  display:grid;
  gap:12px;
  justify-items:center;
}

.avatarRight{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.avatarBtn{
  height: 42px;
  width: 100%;
  justify-content:center;
}

#botAvatarAddBtn{
  max-width: 220px;
}

.botAvatarPreview{
  width: 156px;
  height: 156px;
  border-radius: 999px;
  border: 1px solid var(--line);
  background: #0d1120 center/cover no-repeat;
  box-shadow: 0 14px 34px rgba(0,0,0,.35);
  position: relative;
  display:grid;
  place-items:center;
}

.previewOverlay{
  opacity: 1;
  transition: opacity .15s ease;
  font-weight: 900;
  font-size: 12px;
  color: rgba(231,234,242,.85);
  text-align:center;
  max-width: 110px;
  line-height: 1.2;
  pointer-events:none;
  text-shadow: 0 1px 0 rgba(0,0,0,.45);
}

.botAvatarPreview.hasImage .previewOverlay{
  opacity: 0;
}

.botAvatarPreview.hasImage:hover .previewOverlay{
  opacity: 1;
  background: rgba(0,0,0,.35);
  padding: 6px 10px;
  border-radius: 999px;
  backdrop-filter: blur(6px);
}

.statusBlock.noBot .row.space{ justify-content: space-between !important; }
.statusBlock.noBot #actionRow{ justify-content: center !important; }
.statusBlock.noBot #selectedHint{ text-align: left !important; }

.statusBlock.noBot #inviteBtn{
  margin: 0 auto;
}

#controlBlock{
  align-items: center !important;
}
#controlBlock .row.gap{
  justify-content: center;
  width: 100%;
}

.guildMeta.on{ color: rgba(43,213,118,.9); }
.guildMeta.off{ color: rgba(255,77,77,.85); }

body.app-loading #serverSelectCard #serverGrid{ display:none; }
body.app-loading #serverSelectCard #loadingCard{ display:block !important; }

#loadingCard{
  display:none;
  margin-top:14px;
  text-align:center;
  padding: 26px 16px;
}

.loadingDots{
  margin-top: 12px;
  display:flex;
  justify-content:center;
  gap:8px;
}
.loadingDots span{
  width: 8px;
  height: 8px;
  border-radius: 999px;
  background: rgba(231,234,242,.55);
  animation: dotPulse 0.9s infinite ease-in-out;
}
.logsLoadingState{
  min-height: 220px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-align:center;
}

.logsLoadingState .loadingDots{
  margin-top: 0;
}
.logsLoadingState{
  min-height: 220px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-align:center;
}

.logsLoadingState .loadingDots{
  margin-top: 0;
}
.loadingDots span:nth-child(2){ animation-delay: 0.12s; }
.loadingDots span:nth-child(3){ animation-delay: 0.24s; }

@keyframes dotPulse{
  0%, 100% { transform: translateY(0); opacity: .35; }
  50%      { transform: translateY(-4px); opacity: .95; }
}

#actionRow{
  justify-content: center !important;
  min-height: 76px;
}

#actionRow .btn.big{
  min-width: 190px;
}

.mirrorBtnCta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  background: linear-gradient(180deg, rgba(99,117,244,1), rgba(79,97,214,1));
  color:#ffffff;
  border:1px solid rgba(88,101,242,.6);
  font-weight:800;
  letter-spacing:.2px;

  transition: filter .15s ease, transform .12s ease;
}

.mirrorBtnCta:hover:not(:disabled){
  filter: brightness(1.05) saturate(1.08);
}

.mirrorBtnCta:active:not(:disabled){
  transform: translateY(1px);
}

.mirrorBtnCta:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.mirrorBtnIcon{
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  color:inherit;
  transition: transform .35s cubic-bezier(.2, .8, .2, 1);
  transform-origin:center;
}

.mirrorBtnCta:hover:not(:disabled) .mirrorBtnIcon{
  transform: rotate(-14deg) scale(1.08);
}

.mirrorBtnIcon svg{
  display:block;
  width:20px;
  height:auto;
}

.mirrorBtnLabel{
  white-space:nowrap;
}

.btn.sm.mirrorBtnCta{
  padding:6px 10px;
  font-size:13px;
  height:auto;
  min-width:0;
  border-radius:10px;
  gap:6px;
}

.btn.sm.mirrorBtnCta .mirrorBtnIcon svg{
  width:15px;
  height:auto;
}

.configBtnCta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
}

.configBtnIcon{
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  color:inherit;
  transition: transform .5s cubic-bezier(.2, .8, .2, 1);
}

.configBtnCta:hover:not(:disabled) .configBtnIcon{
  transform: rotate(60deg);
}

.configBtnIcon svg{
  display:block;
}

.logsBtnCta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  background: linear-gradient(180deg, rgba(75,87,110,1), rgba(55,65,85,1));
  color:#ffffff;
  border:1px solid rgba(110,124,152,.5);
  font-weight:800;
  letter-spacing:.2px;

  transition: filter .15s ease, transform .12s ease;
}

.logsBtnCta:hover:not(:disabled){
  filter: brightness(1.12) saturate(1.05);
}

.logsBtnCta:active:not(:disabled){
  transform: translateY(1px);
}

.logsBtnCta:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.logsBtnIcon{
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  color:inherit;
  transition: transform .35s cubic-bezier(.2, .8, .2, 1);
}

.logsBtnCta:hover:not(:disabled) .logsBtnIcon{
  transform: translateY(-2px) scale(1.06);
}

.inviteBtnCta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;

  background: linear-gradient(180deg, #4b2e83 0%, #2e1b5e 100%);
  color:#ffffff;
  border:1px solid rgba(123,74,226,.55);
  font-weight:800;
  letter-spacing:.2px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);

  transition: filter .15s ease, transform .12s ease, box-shadow .15s ease;
  text-decoration:none;
}

.inviteBtnCta:hover:not(:disabled){
  filter: brightness(1.15) saturate(1.1);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 0 0 1px rgba(123,74,226,.3);
}

.inviteBtnCta:hover:not(:disabled){
  filter: brightness(1.08) saturate(1.08);
}

.inviteBtnCta:active:not(:disabled){
  transform: translateY(1px);
}

.inviteBtnIcon{
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  color:inherit;
  transition: transform .3s cubic-bezier(.2, .8, .2, 1);
}

.inviteBtnCta:hover:not(:disabled) .inviteBtnIcon{
  transform: translateX(3px) scale(1.08);
}

.inviteBtnIcon svg{
  display:block;
}

.inviteBtnLabel{
  white-space:nowrap;
}

.logsBtnIcon svg{
  display:block;
}

.discordViewMessage.isPinned{
  position:relative;
  background:linear-gradient(90deg, rgba(255,190,70,.07) 0%, rgba(255,190,70,.03) 30%, transparent 100%);
  border-left:2px solid rgba(255,190,70,.55);
  padding-left:6px;
  margin-left:-8px;
  border-radius:4px;
}

.discordViewPinnedIndicator{
  position:absolute;
  top:-10px;
  left:40px;
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:2px 8px;
  border-radius:999px;
  background:rgba(255,190,70,.14);
  border:1px solid rgba(255,190,70,.4);
  color:rgba(255,200,110,.95);
  font-size:10px;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  line-height:1.4;
  z-index:1;
  box-shadow:0 2px 8px rgba(0,0,0,.2);
  pointer-events:none;
}

.discordViewPinnedIcon{
  display:inline-grid;
  place-items:center;
  transform:rotate(-18deg);
  color:rgba(255,190,70,1);
}

.discordViewPinnedIcon svg{
  display:block;
}

.discordViewPinnedLabel{
  white-space:nowrap;
}

.discordViewMessage.isPinned.isGrouped .discordViewPinnedIndicator{
  display:none;
}

@media (max-width: 760px){
  .discordViewPinnedIndicator{
    left:32px;
    top:-8px;
    font-size:9px;
    padding:1px 6px;
  }
}

.discordReactions{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
  margin-top:6px;
}

.discordReactionPill{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 7px;
  min-height:26px;
  background:#2b2d31;
  border:1px solid rgba(255,255,255,.06);
  border-radius:8px;
  color:#dbdee1;
  font-size:.875rem;
  font-family:inherit;
  line-height:1.25;
  cursor:pointer;
  transition:background-color .08s ease, border-color .08s ease, color .08s ease;
  user-select:none;
}

.discordReactionPill:hover{
  background:#35373c;
  border-color:rgba(255,255,255,.12);
}

.discordReactionPill.isMe{
  background:rgba(88,101,242,.16);
  border-color:rgba(88,101,242,.6);
  color:#fff;
}

.discordReactionPill.isMe:hover{
  background:rgba(88,101,242,.28);
  border-color:rgba(88,101,242,.9);
}

.discordReactionEmojiImg{
  width:18px;
  height:18px;
  display:block;
  object-fit:contain;
}

.discordReactionEmojiChar{
  font-size:1.125rem;
  line-height:1;
  display:inline-flex;
  align-items:center;
}

.discordReactionCount{
  font-variant-numeric:tabular-nums;
  font-size:.8125rem;
  font-weight:500;
  color:inherit;
  min-width:8px;
  text-align:center;
}

.discordReactionTooltip{
  position:fixed;
  z-index:9100;
  max-width:min(320px, calc(100vw - 20px));
  padding:10px 12px;
  background:#111214;
  border-radius:4px;
  box-shadow:0 8px 16px rgba(0,0,0,.24), 0 0 0 1px rgba(0,0,0,.32);
  color:#dbdee1;
  font-size:.875rem;
  line-height:1.375;
  pointer-events:auto;
  user-select:none;
}

.discordReactionTooltipHead{
  display:flex;
  align-items:center;
  gap:8px;
}

.discordReactionTooltipEmoji{
  width:20px;
  height:20px;
  flex-shrink:0;
  object-fit:contain;
}

.discordReactionTooltipEmoji.isChar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:1.125rem;
  line-height:1;
}

.discordReactionTooltipTitle{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  color:#f2f3f5;
  font-weight:500;
}

.discordReactionTooltipAction{
  margin-top:4px;
  font-size:.75rem;
  color:#b5bac1;
  line-height:1.25;
}

.discordViewMessageEditArea{
  margin-top:2px;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.discordViewMessageEditInput{
  width:100%;
  min-height:42px;
  max-height:360px;
  padding:10px 12px;
  box-sizing:border-box;
  background:#383a40;
  border:0;
  border-radius:8px;
  color:#dbdee1;
  font-family:inherit;
  font-size:1rem;
  line-height:1.375;
  resize:none;
  outline:none;
  overflow-y:auto;
}

.discordViewMessageEditInput:focus{
  outline:none;
}

.discordViewMessageEditHint{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  font-size:.75rem;
  color:#949ba4;
  line-height:1.25;
}

.discordViewMessageEditActions{
  display:inline-flex;
  align-items:center;
  gap:4px;
  color:#dbdee1;
}

.discordViewMessageEditCancel,
.discordViewMessageEditSubmit{
  border:0;
  background:transparent;
  color:inherit;
  font-family:inherit;
  font-size:.75rem;
  line-height:1.25;
  padding:0 4px;
  cursor:pointer;
  border-radius:3px;
  transition:color .08s ease;
}

.discordViewMessageEditCancel{
  color:#949ba4;
}

.discordViewMessageEditCancel:hover{
  color:#fff;
  text-decoration:underline;
}

.discordViewMessageEditSubmit{
  color:#00a8fc;
  font-weight:600;
}

.discordViewMessageEditSubmit:hover{
  text-decoration:underline;
}

.discordViewMessageEditedBadge{
  display:inline-block;
  margin-left:4px;
  font-size:.625rem;
  color:#949ba4;
  line-height:1.25;
  font-weight:400;
  cursor:default;
  user-select:none;
  vertical-align:baseline;
}

.discordViewChannelHeadIconBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border:0;
  background:transparent;
  color:#b5bac1;
  border-radius:4px;
  cursor:pointer;
  transition:color .08s ease, background-color .08s ease;
  flex-shrink:0;
}

.discordViewChannelHeadIconBtn:hover{
  color:#dbdee1;
  background:rgba(255,255,255,.04);
}

.discordViewChannelHeadIconBtn.isActive{
  color:#dbdee1;
  background:rgba(255,255,255,.06);
}

.discordViewPinsPanel{
  position:fixed;
  z-index:9050;
  width:min(420px, calc(100vw - 24px));
  max-height:min(540px, calc(100vh - 80px));
  background:#2b2d31;
  border-radius:8px;
  box-shadow:0 8px 16px rgba(0,0,0,.32), 0 0 0 1px rgba(0,0,0,.36);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.discordViewPinsHead{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:12px 14px;
  background:#1e1f22;
  color:#fff;
  border-bottom:1px solid rgba(0,0,0,.32);
}

.discordViewPinsTitle{
  font-size:1rem;
  font-weight:600;
  line-height:1.25;
}

.discordViewPinsCloseBtn{
  width:28px;
  height:28px;
  border:0;
  background:transparent;
  color:#b5bac1;
  font-size:16px;
  line-height:1;
  cursor:pointer;
  border-radius:4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.discordViewPinsCloseBtn:hover{
  color:#fff;
  background:rgba(255,255,255,.06);
}

.discordViewPinsList{
  flex:1 1 auto;
  overflow-y:auto;
  padding:10px 10px 14px;
  display:flex;
  flex-direction:column;
  gap:8px;
  background:#2b2d31;
}

.discordViewPinsList::-webkit-scrollbar{
  width:8px;
}

.discordViewPinsList::-webkit-scrollbar-track{
  background:transparent;
}

.discordViewPinsList::-webkit-scrollbar-thumb{
  background:rgba(0,0,0,.28);
  border-radius:4px;
}

.discordViewPinsEmpty{
  padding:24px 16px;
  text-align:center;
  color:#949ba4;
  font-size:.875rem;
  line-height:1.375;
}

.discordViewPinItem{
  padding:10px 12px;
  border-radius:6px;
  background:#313338;
  color:#dbdee1;
  display:flex;
  flex-direction:column;
  gap:6px;
  font-size:.875rem;
  line-height:1.375;
}

.discordViewPinHead{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.discordViewPinAvatar{
  width:24px;
  height:24px;
  border-radius:50%;
  object-fit:cover;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.05);
  font-size:.75rem;
  font-weight:500;
  color:rgba(231,234,242,.72);
}

.discordViewPinAvatar.isFallback{
  background:rgba(88,101,242,.24);
  color:#fff;
}

.discordViewPinAuthor{
  flex:1 1 auto;
  min-width:0;
  font-weight:600;
  color:#f2f3f5;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordViewPinTime{
  flex-shrink:0;
  font-size:.75rem;
  color:#949ba4;
}

.discordViewPinText{
  color:#dbdee1;
  overflow-wrap:break-word;
  white-space:pre-wrap;
}

.discordViewPinMetaMuted{
  color:#949ba4;
  font-style:italic;
}

.discordViewPinPreviewImage{
  width:100%;
  height:140px;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  border-radius:4px;
  background-color:rgba(0,0,0,.25);
}

.discordViewPinActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  padding-top:2px;
}

.discordViewPinJumpBtn,
.discordViewPinUnpinBtn{
  border:0;
  border-radius:3px;
  background:transparent;
  color:#b5bac1;
  font-family:inherit;
  font-size:.75rem;
  font-weight:600;
  line-height:1.25;
  text-transform:uppercase;
  letter-spacing:.02em;
  padding:6px 10px;
  cursor:pointer;
  transition:color .08s ease, background-color .08s ease;
}

.discordViewPinJumpBtn{
  color:#5865f2;
}

.discordViewPinJumpBtn:hover{
  color:#fff;
  background:rgba(88,101,242,.14);
}

.discordViewPinUnpinBtn{
  color:#f23f42;
}

.discordViewPinUnpinBtn:hover{
  color:#fff;
  background:rgba(242,63,66,.14);
}

#discordAudioSettingsModal .modal-card{
  width:min(560px, calc(100vw - 32px));
  max-height:min(640px, calc(100vh - 40px));
  display:flex;
  flex-direction:column;
  background:#313338;
  color:#dbdee1;
  border-radius:8px;
  overflow:hidden;
  box-shadow:0 20px 60px rgba(0,0,0,.6);
}

#discordAudioSettingsModal .modal-head{
  padding:16px 20px;
  background:#2b2d31;
  border-bottom:1px solid rgba(0,0,0,.32);
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-shrink:0;
}

#discordAudioSettingsModal .modal-head h2{
  margin:0;
  font-size:1rem;
  font-weight:600;
  color:#fff;
}

#discordAudioSettingsModal .modal-close{
  width:28px;
  height:28px;
  border:0;
  background:transparent;
  color:#b5bac1;
  font-size:20px;
  line-height:1;
  cursor:pointer;
  border-radius:4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

#discordAudioSettingsModal .modal-close:hover{
  color:#fff;
  background:rgba(255,255,255,.06);
}

#discordAudioSettingsModal .modal-body{
  padding:16px 20px 20px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:16px;
}

.discordAudioSettingsSection{
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:16px;
  background:#2b2d31;
  border-radius:6px;
}

.discordAudioSettingsSectionTitle{
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:#b5bac1;
  line-height:1;
}

.discordAudioSettingsField{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.discordAudioSettingsField > label{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:.8125rem;
  font-weight:500;
  color:#dbdee1;
  line-height:1.25;
}

.discordAudioSettingsValue{
  font-variant-numeric:tabular-nums;
  color:#00a8fc;
  font-size:.75rem;
  font-weight:600;
}

.discordSelectWrap{
  position:relative;
  display:block;
}

.discordSelectWrap::after{
  content:"";
  position:absolute;
  right:14px;
  top:50%;
  width:8px;
  height:8px;
  border-right:2px solid #b5bac1;
  border-bottom:2px solid #b5bac1;
  transform:translateY(-70%) rotate(45deg);
  pointer-events:none;
}

.discordSelectWrap select{
  width:100%;
  appearance:none;
  -moz-appearance:none;
  height:38px;
  padding:0 36px 0 12px;
  border:0;
  background:#1e1f22;
  color:#dbdee1;
  font-family:inherit;
  font-size:.875rem;
  border-radius:4px;
  cursor:pointer;
  outline:none;
}

.discordSelectWrap select:focus{
  box-shadow:inset 0 0 0 1px #5865f2;
}

.discordSelectWrap select:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.discordAudioSlider{
  appearance:none;
  -webkit-appearance:none;
  width:100%;
  height:8px;
  background:transparent;
  cursor:pointer;
  outline:none;
  margin:6px 0;
}

.discordAudioSlider::-webkit-slider-runnable-track{
  width:100%;
  height:8px;
  background:linear-gradient(to right, #5865f2 var(--audio-slider-fill, 50%), #1e1f22 var(--audio-slider-fill, 50%));
  border-radius:4px;
  border:0;
}

.discordAudioSlider::-moz-range-track{
  width:100%;
  height:8px;
  background:#1e1f22;
  border-radius:4px;
  border:0;
}

.discordAudioSlider::-moz-range-progress{
  height:8px;
  background:#5865f2;
  border-radius:4px;
}

.discordAudioSlider::-webkit-slider-thumb{
  appearance:none;
  -webkit-appearance:none;
  width:18px;
  height:18px;
  background:#fff;
  border-radius:50%;
  border:0;
  box-shadow:0 2px 6px rgba(0,0,0,.4);
  margin-top:-5px;
  cursor:pointer;
  transition:transform .1s ease;
}

.discordAudioSlider::-moz-range-thumb{
  width:18px;
  height:18px;
  background:#fff;
  border-radius:50%;
  border:0;
  box-shadow:0 2px 6px rgba(0,0,0,.4);
  cursor:pointer;
  transition:transform .1s ease;
}

.discordAudioSlider:hover::-webkit-slider-thumb,
.discordAudioSlider:active::-webkit-slider-thumb{
  transform:scale(1.15);
}

.discordAudioSlider:hover::-moz-range-thumb,
.discordAudioSlider:active::-moz-range-thumb{
  transform:scale(1.15);
}

.discordAudioModeToggle{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.discordAudioModeBtn{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px;
  background:#1e1f22;
  color:#dbdee1;
  border:2px solid transparent;
  border-radius:6px;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
  transition:border-color .12s ease, background-color .12s ease;
}

.discordAudioModeBtn:hover{
  background:#232428;
  border-color:rgba(255,255,255,.08);
}

.discordAudioModeBtn.isActive{
  background:rgba(88,101,242,.14);
  border-color:#5865f2;
}

.discordAudioModeIcon{
  flex-shrink:0;
  width:36px;
  height:36px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.06);
  color:#b5bac1;
}

.discordAudioModeBtn.isActive .discordAudioModeIcon{
  background:#5865f2;
  color:#fff;
}

.discordAudioModeLabel{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.discordAudioModeName{
  font-size:.875rem;
  font-weight:600;
  color:#f2f3f5;
}

.discordAudioModeHint{
  font-size:.75rem;
  color:#949ba4;
  line-height:1.3;
}

#logOutput{
  margin: 0;
  white-space: pre;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
  font-size: 12.5px;
  line-height: 1.35;
  color: rgba(255,255,255,0.88);
}

body.mode-logs #toastWrap{
  display:none !important;
}

.logsTop{ gap: 14px; }

body.mode-logs .logsMainFilter{
  display:flex;
  align-items:flex-end;
  gap:12px;
  margin-left:auto;
  flex-wrap:wrap;
}

body.mode-logs .logsMainFilterLabel{
  font-size:12px;
  color:var(--muted);
  font-weight:900;
  white-space:nowrap;
}

body.mode-logs .logsMainFilterMeta{
  display:flex;
  flex-direction:column;
  gap:6px;
}

body.mode-logs .logsMainFilterValue{
  min-width:170px;
  min-height:44px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.03);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22);
  display:flex;
  align-items:center;
  font-weight:900;
  color:var(--text);
}

body.mode-logs .logsMainFilter select{
  min-width:220px;
  min-height:44px;
  border-radius:14px;
  padding:10px 46px 10px 12px;
  font-weight:900;

  border:1px solid rgba(255,255,255,.09);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22);
  transition:border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}

body.mode-logs .logsMainFilter select:hover{
  border-color:rgba(255,255,255,.16);
}

body.mode-logs .logsMainFilter select:focus{
  border-color:rgba(93,168,255,.55);
  box-shadow:
    0 0 0 3px rgba(93,168,255,.18),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 30px rgba(0,0,0,.28);
}

@media (max-width:720px){
  body.mode-logs .logsMainFilter{
    width:100%;
    justify-content:flex-end;
  }
  body.mode-logs .logsMainFilter select{
    min-width:190px;
  }
}

body.mode-logs #mainLogsCategoryWrap{
  width: 300px;
  min-width: 300px;
}

body.mode-logs #mainLogsTimeZoneWrap{
  width: 260px;
  min-width: 260px;
}

body.mode-logs #mainLogsDateWrap{
  width: 220px;
  min-width: 220px;
}

body.mode-logs .logsInviteTrackingToolbar .selectWrap{
  width: 280px;
  min-width: 280px;
}

body.mode-logs .logsInviteTrackingToolbar select{
  width: 100%;
  min-height: 44px;
  border-radius: 14px;
  padding: 10px 46px 10px 12px;
  font-weight: 900;
  border: 1px solid rgba(255,255,255,.09);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}

body.mode-logs .logsInviteTrackingToolbar select:hover{
  border-color: rgba(255,255,255,.16);
}

body.mode-logs .logsInviteTrackingToolbar select:focus{
  border-color: rgba(93,168,255,.55);
  box-shadow:
    0 0 0 3px rgba(93,168,255,.18),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 30px rgba(0,0,0,.28);
}

@media (max-width:720px){
  body.mode-logs .logsInviteTrackingToolbar .selectWrap{
    width: 100%;
    min-width: 0;
  }
}

body.mode-logs .logsMainFilter .selectWrap > .ms{
  width: 100%;
}

body.mode-logs #mainLogsCategoryWrap .msBtn{
  min-height: 44px;
}

body.mode-logs #mainLogsCategoryWrap .msPanel{
  max-height: 360px;
}

body.mode-logs #mainLogsCategoryWrap .msText{
  flex: 1 1 auto;
  min-width: 0;
}

body.mode-logs #mainLogsCategoryWrap .msItem{
  justify-content: flex-start;
}

body.mode-logs #mainLogsCategoryWrap .checkbox-wrapper-30{
  flex: 0 0 auto;
  margin-right: 2px;
  --size: .88;
}

@media (max-width:720px){
  body.mode-logs #mainLogsCategoryWrap{
    width: 100%;
    min-width: 0;
  }

  body.mode-logs #mainLogsTimeZoneWrap{
    width: 220px;
    min-width: 220px;
  }

  body.mode-logs #mainLogsDateWrap{
    width: 190px;
    min-width: 190px;
  }
}

.logsGuildBadge{
  width: 40px;
  height: 40px;
  border-radius: 14px;
  border: 1px solid var(--line);
  background: #0d1120;
  display:grid;
  place-items:center;
  overflow:hidden;
  box-shadow: 0 10px 26px rgba(0,0,0,.28);
}

.logsGuildIcon{
  width:100%;
  height:100%;
  object-fit:cover;
}

.logsGuildFallback{
  font-weight: 900;
  color: var(--muted);
}

.logsToolbar{ justify-content:flex-end; }
.logsToolbar .btn{ min-width: 110px; }

.logsSearchWrap{
  display:flex;
  flex-direction:column;
  gap: 4px;
  min-width: 240px;
}

#logsSearch{ border-radius: 14px; }

.logLine:hover{
  background: rgba(255,255,255,.03);
}

.logMark{
  background: rgba(255,210,74,.22);
  color: var(--text);
  padding: 0 2px;
  border-radius: 4px;
}

.ansi{ color: inherit; }
.ansi-bold{ font-weight: 900; }

.ansi.fg-31{ color: var(--bad); }
.ansi.fg-32{ color: var(--ok); }
.ansi.fg-33{ color: var(--warn); }
.ansi.fg-34{ color: rgba(93,168,255,.95); }
.ansi.fg-35{ color: rgba(216,139,255,.95); }
.ansi.fg-36{ color: rgba(68,214,255,.95); }
.ansi.fg-37{ color: rgba(231,234,242,.92); }

.ansi.fg-90{ color: rgba(167,173,194,.78); }
.ansi.fg-91{ color: rgba(255,107,107,.98); }
.ansi.fg-92{ color: rgba(61,255,138,.95); }
.ansi.fg-93{ color: rgba(255,224,138,.98); }
.ansi.fg-94{ color: rgba(138,180,255,.98); }
.ansi.fg-95{ color: rgba(240,166,255,.98); }
.ansi.fg-96{ color: rgba(146,245,255,.98); }
.ansi.fg-97{ color: rgba(255,255,255,.98); }

.ansi.bg-41{ background: rgba(255,77,77,.22); }
.ansi.bg-42{ background: rgba(43,213,118,.16); }
.ansi.bg-43{ background: rgba(246,194,68,.18); }
.ansi.bg-44{ background: rgba(93,168,255,.18); }
.ansi.bg-45{ background: rgba(216,139,255,.16); }
.ansi.bg-46{ background: rgba(68,214,255,.14); }
.ansi.bg-47{ background: rgba(255,255,255,.12); }

.logsSearchRow{
  display:flex;
  align-items:center;
  gap: 10px;
  flex-wrap:nowrap;
  min-width:0;
}

.logsSearchRow > .logsSearchField{
  min-width:0;
  flex:1 1 auto;
}

.logsSearchField{
  position:relative;
}

.logsSearchField input{
  min-width:0;
}

.logsSearchClearBtn{
  flex:0 0 auto;
}

.logsNavBtn{
  width: 34px;
  height: 34px;
  min-width: 34px !important;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.85);
  cursor: pointer;
  line-height: 1;
}

.logsNavBtn:hover{
  background: rgba(255,255,255,0.07);
}

.logOutput{
  line-height: 1.25;
}

.logLine{
  padding: 1px 6px;
  border-radius: 8px;
}

.logLine.isHit{
  background: rgba(255,255,255,0.02);
}

.logLine.isActiveHit{
  outline: 1px solid rgba(255,210,74,.35);
  background: rgba(255,210,74,.10);
}

body.mode-logs #serverSelectCard,
body.mode-logs #configCard,
body.mode-logs #loadingCard{
  display:none !important;
}

body.mode-logs #toastWrap{ display:none !important; }

body.mode-logs{
  overflow-x: hidden;
}

body.mode-logs #logBox{
  background: #0b0f18 !important;
  border: 1px solid rgba(255,255,255,0.10) !important;
  box-shadow: 0 0 0 1px rgba(255,255,255,0.03) inset !important;

  height: min(84vh, 920px) !important;
  overflow: auto !important;
}

body.mode-logs #logsSearchCount{
  min-height: 20px !important;
}

body.mode-logs .main{
  justify-content: flex-start !important;
  padding-bottom: 0 !important;
}

.logsToolbar{
  column-gap: 34px !important;
  row-gap: 16px !important;
  justify-content: flex-end;
}

.logsToolGroup{
  display: flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 16px;
}

.logsAutoGroup{ margin-right: 10px; }
.logsSearchGroup{ margin-right: 16px; }

.logsToolGroup .btn{
  padding-left: 14px;
  padding-right: 14px;
}

@media (min-width: 980px){
  .logsSearchWrap{ min-width: 320px; }
}

body.mode-logs .main.wrap{
  width: 100% !important;

  max-width: 1600px !important;
  margin: 0 auto !important;

  padding: 14px 18px 18px !important;

  display: flex !important;
  flex-direction: column !important;

  align-items: stretch !important;
  justify-content: flex-start !important;

  box-sizing: border-box !important;
}

body.mode-logs #logsCard{
  width:100% !important;
  margin:14px 0 0 !important;
  align-self:stretch !important;
  padding:16px !important;
  border:1px solid var(--line) !important;
  border-radius:16px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)) !important;
  box-shadow:0 12px 40px rgba(0,0,0,.35) !important;
  display:flex !important;
  flex-direction:column !important;
  box-sizing:border-box !important;
}

.topbar .row.space > div:first-child{
  min-width: 0;
}

.topbar h1{
  white-space: nowrap;
}

.topbar p.muted{
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 560px;
}

body.mode-logs .layout{
  grid-template-columns: 0px 1fr !important;
}

body.mode-logs .sidebar{
  display: none !important;
  width: 0 !important;
  opacity: 0 !important;
}

body.mode-logs .main{
  grid-column: 1 / -1 !important;
}

.authText{
  display:flex;
  flex-direction:column;
  line-height: 1.5;
}

.authHint{
  font-size: 12px;
  color: rgba(231,234,242,.92);
  opacity: .9;
}

body.mode-logs .logsControlCard{
  margin-top: 10px;
  padding: 10px 12px;
}

body.mode-logs .logsToolbar{
  justify-content: space-between !important;
  column-gap: 12px !important;
  row-gap: 12px !important;
  align-items: center;
}

@media (min-width: 920px){
  body.mode-logs .logsToolbar{ flex-wrap: nowrap; }
}

body.mode-logs .logsSearchGroup{
  flex: 1;
  min-width: 0;
  margin-right: 0 !important;
}
body.mode-logs .logsAutoGroup{ margin-right: 0 !important; }

body.mode-logs .logsSearchWrap{
  width: 100%;
  min-width: 0;
}

body.mode-logs .logsSearchRow{
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
}

body.mode-logs .logsSearchField{
  display: flex;
  align-items: center;
  gap: 10px;
  flex: 1;
  min-width: 0;

  height: 38px;
  padding: 0 8px 0 10px;
  border-radius: 14px;

  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(0,0,0,0.20);
  box-shadow: 0 0 0 1px rgba(255,255,255,0.03) inset;
}

body.mode-logs .logsSearchIcon{
  font-size: 14px;
  color: rgba(255,255,255,0.62);
}

body.mode-logs .logsSearchField #logsSearch{
  flex: 1;
  min-width: 0;
  height: 38px;

  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
}

body.mode-logs .logsSearchField #logsSearch::placeholder{
  color: rgba(231,234,242,.55);
}

body.mode-logs .logsSearchNav{
  display: flex;
  gap: 6px;
}

body.mode-logs .logsNavBtn{
  height: 30px;
  width: 32px;
  min-width: 32px !important;

  border-radius: 11px;
  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.88);

  font-weight: 900;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;

  transition: background .18s ease, transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}

body.mode-logs .logsNavBtn:hover{
  background: rgba(255,255,255,0.07);
  border-color: rgba(255,255,255,0.18);
  transform: translateY(-1px);
  box-shadow: 0 10px 26px rgba(0,0,0,.22);
}

body.mode-logs #logsSearchCount.logsCountBadge{
  height: 38px;
  padding: 0 12px;
  border-radius: 999px;

  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);

  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 12px;
  color: rgba(231,234,242,.78);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;

  min-width: 78px;
}

#serversSearchCount.logsCountBadge{
  height: 38px;
  padding: 0 12px;
  border-radius: 999px;

  border: 1px solid rgba(255,255,255,0.12);
  background: rgba(255,255,255,0.04);

  display: inline-flex;
  align-items: center;
  justify-content: center;

  font-size: 12px;
  color: rgba(255,255,255,0.82);
  white-space: nowrap;
}

#serversSearchCount.logsCountBadge:empty{
  opacity: 0;
  pointer-events: none;
}

body.mode-logs #logsSearchCount.logsCountBadge:empty{
  opacity: 0;
  pointer-events: none;
}

body.mode-logs .logsToolbar .btn.logsBtn{
  min-width: 0 !important;
  height: 38px;
  padding: 0 12px;
  border-radius: 14px;

  transform: none;
  box-shadow: none;
}

body.mode-logs .logsToolbar .btn.logsBtn:hover{
  transform: none;
  box-shadow: 0 10px 26px rgba(0,0,0,.22);
}

.logsSearchField #serversSearch{
  flex: 1;
  min-width: 0;

  height: 38px;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  outline: none !important;
  color: #fff;
}

.logsSearchField #twitchStreamerQuery{
  flex: 1;
  min-width: 0;

  height: 38px;
  border: 0 !important;
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  outline: none !important;
  color: #fff;
}

.logsSearchField #twitchStreamerQuery::placeholder{
  color: rgba(255,255,255,0.55);
}

.logsSearchField #serversSearch::placeholder{
  color: rgba(255,255,255,0.55);
}

.logsSearchNav{
  display:flex;
  gap:6px;
  padding-left: 8px;
  border-left: 1px solid rgba(255,255,255,0.10);
}

.logsSearchField .logsNavBtn{
  width: 32px;
  height: 30px;
  min-width: 32px !important;

  border: 0 !important;
  border-radius: 11px;
  background: rgba(255,255,255,0.04);
  color: rgba(255,255,255,0.88);
}

.logsSearchField .logsNavBtn:hover{
  background: rgba(255,255,255,0.08);
}

html{ overflow-y: scroll; }
body{ overflow-y: auto; }

body.mode-logs #logsSearch{
  box-shadow: none !important;
}

body.mode-logs #logsSearch:focus{
  box-shadow: none !important;
}

body.mode-logs .logsSearchField #logsSearch{
  appearance: none;
  -webkit-appearance: none;
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

body.mode-logs .logsSearchNav{
  padding-left: 8px;
  border-left: 1px solid rgba(255,255,255,0.10);
}

body.mode-logs .logsNavBtn{
  border: 0 !important;
  box-shadow: none !important;
}

.authBox{
  min-width: 0;
  width: max-content;
  justify-content: flex-end;
}

.shutdownCard{
  width: min(560px, calc(100vw - 32px));
}

.topRight{
  align-items:center;
}

.topUsersBtn{
  height:54px;
  padding:10px 14px;
  border-radius:14px;
}

.usersGear{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  opacity:.95;
}

.idList{
  display:flex;
  flex-direction:column;
  gap:10px;
  margin-top:12px;
}

body.mode-users #serverSelectCard,
body.mode-users #configCard,
body.mode-users #logsCard,
body.mode-users #loadingCard{
  display:none !important;
}

body.mode-users .layout{
  display:grid !important;
  grid-template-columns:minmax(0, 1fr) !important;
}

body.mode-users .main.wrap{
  grid-column:1 / -1 !important;
  width:100% !important;
  max-width:none !important;
  margin:0 auto !important;
  padding:18px 14px !important;
  box-sizing:border-box !important;
  display:grid !important;
  justify-items:stretch !important;
  align-items:start !important;
}

body.mode-users #usersCard{
  display:block !important;
  width:calc(100vw - 28px) !important;
  max-width:none !important;
  margin:0 auto !important;
  justify-self:stretch !important;
}

body.mode-users #sidebar,
body.mode-users #backBtn{
  display:none !important;
}

body.mode-users #toastWrap{
  display:none !important;
}

.topActions{
  display:flex;
  align-items:center;
  gap:10px;
}

.usersBtn{
  height:54px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 14px;
  border-radius:14px;
  white-space:nowrap;
}

.usersBtn .usersIcon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.grid3{
  display:grid;
  grid-template-columns:repeat(4, minmax(330px, 1fr));
  gap:18px;
  align-items:start;
}

body.mode-users #fullPermsUsersSection{
  order:-1;
}

body.mode-users #usersCard .subcard{
  padding:18px;
  min-width:0;
}

body.mode-users #usersCard .subcard > .row.gap.mt10{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
}

body.mode-users #usersCard .subcard > .row.gap.mt10 input{
  flex:1 1 auto;
  min-width:0;
}

body.mode-users #usersCard .subcard > .row.gap.mt10 .btn{
  flex:0 0 auto;
  min-width:138px;
}

body.mode-users #usersCard .idRow{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:12px;
}

body.mode-users #usersCard .userCell{
  flex:unset;
  width:100%;
  min-width:0;
}

body.mode-users #usersCard .userMeta{
  min-width:0;
  width:100%;
}

body.mode-users #usersCard .userName,
body.mode-users #usersCard .userId{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

body.mode-users #usersCard .idRowActions{
  gap:8px;
}

body.mode-users #usersCard .idRowActions .btn.sm{
  min-width:104px;
  padding-left:10px;
  padding-right:10px;
}

@media (max-width:1520px){
  .grid3{
    grid-template-columns:repeat(2, minmax(330px, 1fr));
  }
}

@media (max-width:820px){
  body.mode-users .main.wrap{
    padding-left:12px !important;
    padding-right:12px !important;
  }

  body.mode-users #usersCard{
    width:100% !important;
  }

  .grid3{
    grid-template-columns:1fr;
  }

  body.mode-users #fullPermsUsersSection{
    order:-1;
  }
}

@media (max-width:560px){
  body.mode-users #usersCard .subcard > .row.gap.mt10{
    flex-wrap:wrap;
  }

  body.mode-users #usersCard .subcard > .row.gap.mt10 .btn{
    width:100%;
    min-width:0;
  }

  body.mode-users #usersCard .idRow{
    grid-template-columns:1fr;
  }

  body.mode-users #usersCard .idRowActions{
    justify-content:stretch;
  }

  body.mode-users #usersCard .idRowActions .btn.sm{
    width:100%;
    min-width:0;
  }
}

.usersAddRow input{
  flex:1 1 auto;
  min-width:180px;
}

.usersList{
  margin-top:12px;
  display:grid;
  gap:10px;
}

.idRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:12px 14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.03);
}

.idRowActions .btn.sm{
  min-width:116px;
}

.idRowActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex:0 0 auto;
  flex-wrap:nowrap;
}

.userDmBtn{
  border-color:rgba(41,211,178,.34);
  color:rgba(231,234,242,.98);
  background:rgba(41,211,178,.12);
}

.userDmBtn:hover{
  background:rgba(41,211,178,.18);
  border-color:rgba(41,211,178,.48);
}

.btn.sm{
  padding:8px 12px;
  height:36px;
  border-radius:12px;
  min-width:auto;
  font-size:13px;
}

.userCell{
  display:flex;
  align-items:center;
  gap:12px;
  flex:1 1 520px;
  min-width:0;
}

.categoryAdminsPanel{
  margin-top:22px;
  display:grid;
  gap:16px;
}

.categoryAdminsHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.categoryAdminsHeadActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:12px;
  min-width:min(860px, 62%);
  margin-left:auto;
}

.categoryAdminSearchWrap{
  width:min(760px, 100%);
  min-width:min(420px, 100%);
  flex:1 1 680px;
}

.categoryAdminSearchWrap .logsSearchRow{
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
  min-width:0;
}

.categoryAdminSearchWrap .logsSearchField{
  width:100%;
  min-width:0;
  min-height:46px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 8px 0 13px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.035),
    0 12px 28px rgba(0,0,0,.16);
}

.categoryAdminSearchWrap .logsSearchField:focus-within{
  border-color:rgba(var(--accent-rgb), .32);
  box-shadow:
    0 0 0 3px rgba(var(--accent-rgb), .10),
    0 14px 32px rgba(0,0,0,.22),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.categoryAdminSearchWrap .logsSearchIcon{
  flex:0 0 auto;
  color:rgba(231,234,242,.58);
  font-size:15px;
  line-height:1;
}

#categoryAdminSearchInput{
  appearance:none;
  -webkit-appearance:none;
  flex:1 1 auto;
  min-width:0;
  height:42px;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  outline:none !important;
  box-shadow:none !important;
  color:var(--text);
  font-size:13px;
  font-weight:700;
  letter-spacing:.01em;
}

#categoryAdminSearchInput::placeholder{
  color:rgba(231,234,242,.52);
}

#categoryAdminSearchInput::-webkit-search-decoration,
#categoryAdminSearchInput::-webkit-search-cancel-button,
#categoryAdminSearchInput::-webkit-search-results-button,
#categoryAdminSearchInput::-webkit-search-results-decoration{
  -webkit-appearance:none;
  appearance:none;
  display:none;
}

.categoryAdminSearchWrap .logsSearchClearBtn.show{
  opacity:1;
  pointer-events:auto;
}

.categoryAdminsHead h3{
  margin:0 0 6px;
}

.categoryAdminCreateModalCard{
  width:min(620px, calc(100vw - 32px));
  padding:18px;
  overflow:hidden;
  transform:translateY(14px) scale(.985);
  opacity:0;
  transition:
    transform .22s cubic-bezier(.22,1,.36,1),
    opacity .18s ease,
    box-shadow .18s ease;
}

#categoryAdminCreateModal.show .categoryAdminCreateModalCard{
  transform:translateY(0) scale(1);
  opacity:1;
}

#categoryAdminCreateModal .modalBackdrop{
  background:rgba(2,8,15,.74);
  backdrop-filter:blur(10px);
}

.categoryAdminModalTop{
  display:flex;
  flex-direction:column;
  gap:4px;
  margin-bottom:16px;
}

.categoryAdminModalTop h3{
  margin:0;
  font-size:24px;
  line-height:1.15;
  letter-spacing:-.02em;
}

.categoryAdminModalBody{
  display:grid;
  gap:14px;
}

.categoryAdminModalBody textarea{
  min-height:110px;
}

.categoryAdminColorControl{
  display:inline-flex;
  align-items:center;
  gap:8px;
  justify-self:start;
  min-height:42px;
  padding:7px 8px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
}

.categoryAdminColorPicker{
  width:36px;
  height:26px;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  flex:0 0 auto;
  appearance:auto;
  -webkit-appearance:auto;
}

.categoryAdminHexInput{
  width:104px;
  min-width:104px;
  height:28px;
  padding:0 8px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:rgba(231,234,242,.88);
  font-size:11px;
  font-weight:800;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  letter-spacing:.02em;
  box-shadow:none;
  text-transform:uppercase;
}

.categoryAdminHexInput:focus{
  border-color:rgba(var(--accent-rgb), .55);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .16);
}

.categoryAdminList{
  display:grid;
  gap:14px;
}

.categoryAdminEmpty{
  padding:14px;
  border:1px dashed rgba(255,255,255,.14);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}

.categoryAdminCard{
  --category-admin-color:#5DA8FF;
  display:grid;
  gap:14px;
  padding:16px 16px 16px 20px;
  border:1px solid rgba(255,255,255,.09);
  border-radius:18px;
  background:
    radial-gradient(circle at 0 0, rgba(var(--accent-rgb), .075), transparent 30%),
    rgba(255,255,255,.03);
  position:relative;
  overflow:hidden;
}

.categoryAdminCard::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:5px;
  background:var(--category-admin-color);
  box-shadow:0 0 22px color-mix(in srgb, var(--category-admin-color) 42%, transparent);
}

.categoryAdminCard:has(.ms.open){
  z-index:800;
}

.categoryAdminCardHeader{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:start;
  gap:14px;
  padding:2px 2px 10px;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.categoryAdminTitleBlock{
  min-width:0;
  display:grid;
  gap:5px;
}

.categoryAdminTitle{
  min-width:0;
  font-size:18px;
  font-weight:950;
  letter-spacing:-.02em;
  color:rgba(241,245,255,.96);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.categoryAdminSummary{
  color:rgba(167,173,194,.88);
  font-size:12.5px;
  line-height:1.4;
  overflow-wrap:anywhere;
}

.categoryAdminSummary.isEmpty{
  opacity:.62;
}

.categoryAdminHeaderActions{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.categoryAdminHeaderActions .btn{
  min-height:38px;
  padding:8px 12px;
}

.categoryAdminEditGrid{
  display:grid;
  grid-template-columns:minmax(240px, .72fr) minmax(340px, 1.28fr);
  gap:12px;
  align-items:start;
}

.categoryAdminNameInput{
  min-height:42px;
}

.categoryAdminDescriptionInput{
  min-height:42px;
  height:42px;
  resize:vertical;
}

.categoryAdminColumns{
  display:grid;
  grid-template-columns:minmax(390px, 1.08fr) minmax(330px, .84fr) minmax(280px, .72fr);
  gap:14px;
  align-items:stretch;
}

.categoryAdminColumnServers{
  order:1;
}

.categoryAdminColumnAdmins{
  order:2;
}

.categoryAdminColumnActivity{
  order:3;
}

.categoryAdminColumn{
  display:grid;
  grid-template-rows:auto auto minmax(0, 1fr);
  gap:10px;
  min-width:0;
  min-height:100%;
  padding:14px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:16px;
  background:rgba(0,0,0,.14);
  overflow:visible;
  position:relative;
}

.categoryAdminColumnActivity{
  align-self:stretch;
  overflow:hidden;
  isolation:isolate;
  background:rgba(0,0,0,.16);
}

.categoryAdminColumnActivity{
  grid-template-rows:auto minmax(0, 1fr);
}

.categoryAdminColumnServers,
.categoryAdminColumnAdmins{
  align-self:start;
  min-height:auto;
}

.categoryAdminColumnActivity::before{
  content:"";
  position:absolute;
  inset:-25%;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 12%, color-mix(in srgb, var(--category-admin-color) 28%, transparent), transparent 32%),
    radial-gradient(circle at 88% 88%, rgba(255,255,255,.055), transparent 34%);
  opacity:.42;
  filter:blur(10px);
}

.categoryAdminColumnActivity > *{
  position:relative;
  z-index:1;
}

.categoryAdminActivityList{
  display:grid;
  align-content:start;
  align-items:start;
  grid-auto-rows:max-content;
  gap:8px;
  min-height:0;
  height:auto;
  max-height:382px;
  overflow-y:auto;
  overflow-x:hidden;
  padding:0 8px 0 8px;
  scrollbar-width:thin;
  scrollbar-color:rgba(255,255,255,.22) rgba(255,255,255,.045);
}

.categoryAdminActivityList::-webkit-scrollbar{
  width:8px;
}

.categoryAdminActivityList::-webkit-scrollbar-track{
  background:rgba(255,255,255,.035);
  border-radius:999px;
}

.categoryAdminActivityList::-webkit-scrollbar-thumb{
  background:rgba(255,255,255,.18);
  border-radius:999px;
  border:2px solid rgba(0,0,0,.18);
}

.categoryAdminActivityList::-webkit-scrollbar-thumb:hover{
  background:rgba(255,255,255,.28);
}

.categoryAdminActivityEmpty{
  padding:12px;
  border-radius:13px;
  border:1px dashed rgba(255,255,255,.12);
  background:rgba(255,255,255,.025);
  color:rgba(167,173,194,.82);
  font-size:12px;
  line-height:1.35;
}

.categoryAdminActivityItem{
  display:grid;
  grid-template-columns:16px minmax(0, 1fr);
  gap:9px;
  align-items:start;
  min-width:0;
  padding:10px 11px;
  border-radius:13px;
  border:1px solid rgba(255,255,255,.075);
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.020)),
    rgba(255,255,255,.018);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
  position:relative;
  overflow:hidden;
}

.categoryAdminActivityItem::before{
  content:none;
}

.categoryAdminActivityLed,
.categoryAdminActivityText{
  position:relative;
  z-index:1;
}

.categoryAdminActivityItem.isNew{
  animation:categoryAdminLogSlideDown .62s cubic-bezier(.22,1,.36,1) both;
}

@keyframes categoryAdminLogSlideDown{
  0%{
    opacity:0;
    transform:translateY(-16px);
    filter:blur(6px);
  }
  62%{
    opacity:1;
    transform:translateY(3px);
    filter:blur(0);
  }
  100%{
    opacity:1;
    transform:none;
    filter:none;
  }
}

.categoryAdminActivityLed{
  width:10px;
  height:10px;
  margin-top:4px;
  border-radius:999px;
  background:var(--category-admin-color);
  box-shadow:
    0 0 0 4px color-mix(in srgb, var(--category-admin-color) 16%, transparent),
    0 0 18px color-mix(in srgb, var(--category-admin-color) 55%, transparent);
}

.categoryAdminActivityItem.isAdd .categoryAdminActivityLed,
.categoryAdminActivityItem.isCreate .categoryAdminActivityLed{
  background:#2bd576;
  box-shadow:
    0 0 0 4px rgba(43,213,118,.13),
    0 0 18px rgba(43,213,118,.42);
}

.categoryAdminActivityItem.isRemove .categoryAdminActivityLed{
  background:#ff5c5c;
  box-shadow:
    0 0 0 4px rgba(255,92,92,.13),
    0 0 18px rgba(255,92,92,.42);
}

.categoryAdminActivityItem.isEdit .categoryAdminActivityLed{
  background:#5da8ff;
  box-shadow:
    0 0 0 4px rgba(93,168,255,.13),
    0 0 18px rgba(93,168,255,.42);
}

.categoryAdminActivityItem.isDm .categoryAdminActivityLed{
  background:#b985ff;
  box-shadow:
    0 0 0 4px rgba(185,133,255,.13),
    0 0 18px rgba(185,133,255,.42);
}

.categoryAdminActivityText{
  min-width:0;
  display:grid;
  gap:4px;
}

.categoryAdminActivityTitle{
  min-width:0;
  color:rgba(241,245,255,.94);
  font-size:12.5px;
  font-weight:900;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.categoryAdminActivityMeta{
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  color:rgba(167,173,194,.72);
  font-size:11px;
  line-height:1.2;
}

.categoryAdminActivityMeta span{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.categoryAdminColumnHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.categoryAdminColumnHead h4{
  margin:0;
  font-size:13px;
  font-weight:950;
  letter-spacing:.02em;
}

.categoryAdminColumnHead span{
  min-width:28px;
  height:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.045);
  color:rgba(231,234,242,.78);
  font-size:11px;
  font-weight:900;
}

.categoryAdminAddLine{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:10px;
  align-items:center;
}

.categoryAdminAddLine input,
.categoryAdminAddLine select{
  width:100%;
  min-width:0;
}

.categoryAdminAddLine .btn{
  min-height:42px;
  white-space:nowrap;
}

.categoryAdminGuildSelectWrap,
.categoryAdminGuildSelectWrap .ms{
  width:100%;
  min-width:0;
}

.categoryAdminGuildSelectWrap .msBtn{
  flex-wrap:nowrap;
  min-height:42px;
}

.categoryAdminGuildSelectWrap .msPanel{
  max-height:320px;
  z-index:950;
}

.categoryAdminGuildMs .msBtn{
  gap:8px;
}

.categoryAdminGuildMsItem{
  min-width:0;
}

.categoryAdminGuildMsIcon{
  width:24px;
  height:24px;
  min-width:24px;
  border-radius:8px;
  object-fit:cover;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.08);
  color:rgba(231,234,242,.84);
  font-size:10px;
  font-weight:950;
  overflow:hidden;
}

.categoryAdminGuildSelectedCount{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  font-weight:900;
  color:rgba(231,234,242,.90);
}

.categoryAdminGuildMs .msClear{
  display:flex;
}

.categoryAdminGuildSelectWrap .msSingleText,
.categoryAdminGuildSelectWrap .msText,
.categoryAdminGuildSelectWrap .categoryAdminGuildSelectedCount{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.categoryAdminServerList,
.categoryAdminUserList{
  display:grid;
  align-content:start;
  align-items:start;
  grid-auto-rows:max-content;
  gap:8px;
  min-height:0;
}

.categoryAdminColumnAdmins{
  align-self:start;
}

.categoryAdminColumnAdmins .categoryAdminUserList{
  max-height:360px;
  overflow:auto;
  padding-right:2px;
}

.categoryAdminServerCard{
  --category-admin-color:#5DA8FF;
  display:grid;
  gap:10px;
  padding:10px 12px 10px 15px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  min-width:0;
  position:relative;
  overflow:hidden;
}

.categoryAdminServerCard::before{
  content:"";
  position:absolute;
  left:0;
  top:0;
  bottom:0;
  width:4px;
  background:var(--category-admin-color);
  opacity:.95;
}

.categoryAdminServerTop{
  display:grid;
  grid-template-columns:34px 34px minmax(0, 1fr) auto;
  align-items:center;
  gap:10px;
  min-width:0;
}

.categoryAdminServerIcon{
  width:34px;
  height:34px;
  min-width:34px;
  border-radius:11px;
  object-fit:cover;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:900;
  color:rgba(231,234,242,.84);
  overflow:hidden;
}

.categoryAdminServerToggle{
  width:34px;
  height:34px;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
  color:rgba(231,234,242,.88);
  cursor:pointer;
  transition:transform .18s ease, background .18s ease, border-color .18s ease;
}

.categoryAdminServerToggle:hover{
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.14);
}

.categoryAdminServerToggle.isOpen{
  transform:rotate(180deg);
}

.categoryAdminServerMeta{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.categoryAdminServerName{
  min-width:0;
  font-weight:900;
  font-size:14px;
  line-height:1.15;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.categoryAdminServerId{
  min-width:0;
  font-size:11px;
  color:rgba(167,173,194,.72);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.categoryAdminRemoveBtn{
  min-width:104px;
}

.categoryAdminServerAdmins{
  display:grid;
  gap:8px;
  padding-top:8px;
  border-top:1px solid rgba(255,255,255,.07);
  transform-origin:top center;
}

.categoryAdminServerCard.isAnimating .categoryAdminServerAdmins{
  animation:categoryAdminPanelReveal .24s cubic-bezier(.22,1,.36,1) both;
}

.categoryAdminServerAdminList{
  display:grid;
  align-content:start;
  align-items:start;
  grid-auto-rows:max-content;
  gap:8px;
}

.categoryAdminUserNameLine{
  min-width:0;
  display:flex;
  align-items:center;
  gap:7px;
}

.categoryAdminUserNameLine .userName{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.categoryAdminOwnerTag{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:19px;
  padding:0 7px;
  border-radius:999px;
  border:1px solid rgba(255,210,74,.26);
  background:rgba(255,210,74,.08);
  color:rgba(255,226,142,.92);
  font-size:10px;
  font-weight:950;
  letter-spacing:.035em;
  text-transform:uppercase;
}

.categoryAdminServerAdminList .categoryAdminUserRow{
  opacity:1;
  transform:none;
  filter:none;
}

.categoryAdminServerCard.isAnimating .categoryAdminServerAdminList .categoryAdminUserRow{
  opacity:0;
  transform:translateY(-8px) scale(.985);
  filter:blur(4px);
  animation:categoryAdminUserReveal .28s cubic-bezier(.22,1,.36,1) forwards;
}

.categoryAdminServerCard.isAnimating .categoryAdminServerAdminList .categoryAdminUserRow:nth-child(1){ animation-delay:.02s; }
.categoryAdminServerCard.isAnimating .categoryAdminServerAdminList .categoryAdminUserRow:nth-child(2){ animation-delay:.045s; }
.categoryAdminServerCard.isAnimating .categoryAdminServerAdminList .categoryAdminUserRow:nth-child(3){ animation-delay:.07s; }
.categoryAdminServerCard.isAnimating .categoryAdminServerAdminList .categoryAdminUserRow:nth-child(4){ animation-delay:.095s; }
.categoryAdminServerCard.isAnimating .categoryAdminServerAdminList .categoryAdminUserRow:nth-child(5){ animation-delay:.12s; }
.categoryAdminServerCard.isAnimating .categoryAdminServerAdminList .categoryAdminUserRow:nth-child(n+6){ animation-delay:.145s; }

@keyframes categoryAdminPanelReveal{
  from{
    opacity:0;
    transform:translateY(-8px);
  }
  to{
    opacity:1;
    transform:none;
  }
}

@keyframes categoryAdminUserReveal{
  to{
    opacity:1;
    transform:none;
    filter:none;
  }
}

@media (prefers-reduced-motion: reduce){
  .categoryAdminServerAdmins,
  .categoryAdminServerAdminList .categoryAdminUserRow,
  .categoryAdminActivityItem.isNew,
  .categoryAdminActivityItem.isNew::before{
    animation:none !important;
    opacity:1 !important;
    transform:none !important;
    filter:none !important;
  }
}

.categoryAdminServerAdminState,
.categoryAdminServerAdminHint{
  padding:8px 10px;
  border-radius:10px;
  background:rgba(255,255,255,.025);
  border:1px solid rgba(255,255,255,.06);
}

.categoryAdminServerAdmins .idRow{
  padding:8px 10px;
  grid-template-columns:minmax(0, 1fr) auto;
}

.categoryAdminServerAdmins .userMeta{
  min-width:0;
}

.categoryAdminServerAdmins .userId{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.categoryAdminAutoBadge{
  display:inline-flex;
  align-items:center;
  gap:6px;
  align-self:flex-start;
  margin-top:6px;
  padding:4px 8px;
  border-radius:999px;
  font-size:10px;
  font-weight:850;
  letter-spacing:.025em;
  color:rgba(190,205,255,.92);
  border:1px solid rgba(118,146,255,.24);
  background:
    linear-gradient(180deg, rgba(118,146,255,.16), rgba(118,146,255,.075)),
    rgba(255,255,255,.025);
}

.categoryAdminAutoBadge span{
  color:rgba(190,205,255,.84);
}

.categoryAdminAutoBadge strong{
  color:rgba(244,247,255,.96);
  font-weight:950;
}

.categoryAdminUserRow{
  padding:10px 12px;
}

.categoryAdminServerCard,
.categoryAdminUserRow,
.categoryAdminServerAdmins .idRow{
  align-self:start;
  height:auto;
}

.categorySearchHit{
  border-color:rgba(var(--accent-rgb), .48) !important;
  box-shadow:
    0 0 0 1px rgba(var(--accent-rgb), .20),
    0 0 24px rgba(var(--accent-rgb), .10),
    inset 0 1px 0 rgba(255,255,255,.045);
}

.categoryAdminMark{
  padding:0 3px;
  border-radius:5px;
  color:#fff;
  background:rgba(var(--accent-rgb), .38);
  box-shadow:0 0 0 1px rgba(var(--accent-rgb), .18);
}

.msIconFallback{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:9px;
  font-weight:900;
  color:rgba(231,234,242,.86);
}

.msItem.isEmpty{
  cursor:default;
  color:rgba(167,173,194,.78);
  justify-content:center;
  text-align:center;
}

.msItem.isEmpty:hover{
  background:transparent;
  border-color:transparent;
}

@media (max-width:1280px){
  .categoryAdminEditGrid,
  .categoryAdminColumns{
    grid-template-columns:1fr;
  }

  .categoryAdminColumnServers,
  .categoryAdminColumnAdmins,
  .categoryAdminColumnActivity{
    order:initial;
  }
}

@media (max-width:760px){
  .categoryAdminsHead{
    flex-direction:column;
  }

  .categoryAdminsHeadActions{
    width:100%;
    min-width:0;
    flex-direction:column;
    align-items:stretch;
  }

  .categoryAdminSearchWrap{
    width:100%;
    min-width:0;
  }

  .categoryAdminsHeadActions .btn{
    width:100%;
  }

  .categoryAdminCardHeader{
    grid-template-columns:1fr;
  }

  .categoryAdminHeaderActions{
    justify-content:stretch;
  }

  .categoryAdminHeaderActions .btn{
    flex:1 1 140px;
  }
}

@media (max-width:620px){
  .categoryAdminAddLine{
    grid-template-columns:1fr;
  }

  .categoryAdminAddLine .btn{
    width:100%;
  }

  .categoryAdminServerTop{
    grid-template-columns:34px 34px minmax(0, 1fr);
  }

  .categoryAdminRemoveBtn{
    grid-column:1 / -1;
    width:100%;
  }
}

.userMeta{
  display:flex;
  flex-direction:column;
  flex:1 1 auto;
  min-width:0;
  line-height:1.08;
}

.userName{
  font-size:14.5px;
  font-weight:700;
  color: rgba(231,234,242,.92);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.userId{
  margin-top:4px;
  font-size:11.5px;
  color: rgba(167,173,194,.88);
  letter-spacing:.02em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:clip;
}

@media (max-width:980px){
  .idRow{
    align-items:flex-start;
    flex-wrap:wrap;
  }

  .idRowActions{
    width:100%;
    justify-content:flex-end;
  }

  .userId{
    white-space:normal;
    overflow-wrap:anywhere;
  }
}

body.permLock #layout,
body.permLock #toastWrap,
body.permLock #missingWrap,
body.permLock #loggedOutScreen {
  display: none !important;
}

body.permLock #permBackdrop {
  background: #000 !important;
  opacity: 1 !important;
}

#noAccessCard{
  position: fixed;
  top: 400px;
  left: 50%;
  transform: translateX(-50%);
  width: min(560px, calc(100vw - 32px));
  margin: 0;
  z-index: 60;
}
#noAccessReloadBtn{
  position: absolute;
  top: 10px;
  right: 10px;
  width: 36px;
  height: 36px;
  border-radius: 12px;
  border: 1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.9);
  cursor: pointer;
  display: grid;
  place-items: center;
}

#noAccessReloadBtn:hover{
  background: rgba(255,255,255,.10);
}

.field > label{
  font-size: 13.5px;
  font-weight: 800;
  color: rgba(231,234,242,.88);
  letter-spacing: .2px;
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.subcard > h3{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.helpIcon{
  margin-left:auto;
  width:18px;
  height:18px;
  border-radius:999px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: rgba(231,234,242,.75);
  display:grid;
  place-items:center;
  cursor: help;
  position:relative;
  flex:0 0 auto;
}

.helpIcon::before{
  content:"?";
  font-weight:900;
  font-size:12px;
  line-height:1;
  transform: translateY(-0.5px);
}

.helpIcon::after{
  content:none;
  display:none;
}

.msBtn{
  font-size: 13.5px;
  color: rgba(231,234,242,.92);
}

.msPlaceholder{
  opacity: 1;
  color: rgba(231,234,242,.70);
  font-weight: 800;
}

.msText{
  font-size: 13.5px;
  color: rgba(231,234,242,.92);
}

.msChip{
  font-size: 12.5px;
  color: rgba(231,234,242,.92);
}

:root{
  --cursor-arrow: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%235da8ff%27%2F%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23ffd24a%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23b83bff%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%27M4.5%201.5V22.5L10.5%2016.5H19.5L4.5%201.5Z%27%20fill%3D%27rgba(10%2C11%2C14%2C0.22)%27%20stroke%3D%27rgba(0%2C0%2C0%2C0.55)%27%20stroke-width%3D%272.2%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M4.5%201.5V22.5L10.5%2016.5H19.5L4.5%201.5Z%27%20fill%3D%27rgba(10%2C11%2C14%2C0.22)%27%20stroke%3D%27url(%23g)%27%20stroke-width%3D%271.8%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E") 2 2;
  --cursor-hand: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%235da8ff%27%2F%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23ffd24a%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23b83bff%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%27M4.5%201.5V22.5L10.5%2016.5H19.5L4.5%201.5Z%27%20fill%3D%27url(%23g)%27%20stroke%3D%27rgba(0%2C0%2C0%2C0.55)%27%20stroke-width%3D%272.2%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M4.5%201.5V22.5L10.5%2016.5H19.5L4.5%201.5Z%27%20fill%3D%27none%27%20stroke%3D%27url(%23g)%27%20stroke-width%3D%271.8%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E") 2 2;
  --cursor-text: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%235da8ff%27%2F%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23ffd24a%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23b83bff%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%27M9%204H15M12%204V20M9%2020H15%27%20fill%3D%27none%27%20stroke%3D%27rgba%280%2C0%2C0%2C0.55%29%27%20stroke-width%3D%273.4%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M9%204H15M12%204V20M9%2020H15%27%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%271.8%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E") 12 12;
  --cursor-resize-v: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2730%27%20height%3D%2730%27%20viewBox%3D%270%200%2030%2030%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%235da8ff%27%2F%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23ffd24a%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23b83bff%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%27M15%205V25M10%2010L15%205L20%2010M10%2020L15%2025L20%2020%27%20fill%3D%27none%27%20stroke%3D%27rgba%280%2C0%2C0%2C0.55%29%27%20stroke-width%3D%273.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M15%205V25M10%2010L15%205L20%2010M10%2020L15%2025L20%2020%27%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E") 15 15;
  --cursor-resize-h: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2730%27%20height%3D%2730%27%20viewBox%3D%270%200%2030%2030%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%235da8ff%27%2F%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23ffd24a%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23b83bff%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%27M5%2015H25M10%2010L5%2015L10%2020M20%2010L25%2015L20%2020%27%20fill%3D%27none%27%20stroke%3D%27rgba%280%2C0%2C0%2C0.55%29%27%20stroke-width%3D%273.6%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M5%2015H25M10%2010L5%2015L10%2020M20%2010L25%2015L20%2020%27%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E") 15 15;
  --cursor-resize-d: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2730%27%20height%3D%2730%27%20viewBox%3D%270%200%2030%2030%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%235da8ff%27%2F%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23ffd24a%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23b83bff%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Cpath%20d%3D%27M6%206L24%2024M6%2013V6H13M24%2017V24H17%27%20fill%3D%27none%27%20stroke%3D%27rgba%280%2C0%2C0%2C0.55%29%27%20stroke-width%3D%273.4%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3Cpath%20d%3D%27M6%206L24%2024M6%2013V6H13M24%2017V24H17%27%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%272.2%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E") 15 15;
  --cursor-busy: url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2240%22%20height%3D%2240%22%20viewBox%3D%220%200%2040%2040%22%3E%0A%3Cdefs%3E%0A%20%20%3ClinearGradient%20id%3D%22g%22%20x1%3D%220%22%20y1%3D%220%22%20x2%3D%221%22%20y2%3D%221%22%3E%0A%20%20%20%20%3Cstop%20offset%3D%220%25%22%20stop-color%3D%22%235da8ff%22%2F%3E%0A%20%20%20%20%3Cstop%20offset%3D%2250%25%22%20stop-color%3D%22%23ffd24a%22%2F%3E%0A%20%20%20%20%3Cstop%20offset%3D%22100%25%22%20stop-color%3D%22%23b83bff%22%2F%3E%0A%20%20%3C%2FlinearGradient%3E%0A%3C%2Fdefs%3E%0A%3Cpath%20d%3D%22M14%207.5h12v4.4l-5.2%206.2%205.2%206.2v4.4H14v-4.4l5.2-6.2-5.2-6.2V7.5z%22%0A%20%20%20%20%20%20fill%3D%22rgba(10%2C11%2C14%2C0.10)%22%20stroke%3D%22rgba(0%2C0%2C0%2C0.62)%22%20stroke-width%3D%223.2%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M14%207.5h12v4.4l-5.2%206.2%205.2%206.2v4.4H14v-4.4l5.2-6.2-5.2-6.2V7.5z%22%0A%20%20%20%20%20%20fill%3D%22none%22%20stroke%3D%22url(%23g)%22%20stroke-width%3D%222.4%22%20stroke-linejoin%3D%22round%22%2F%3E%0A%3Cpath%20d%3D%22M16.5%2012.2h7l-3.5%204.1z%22%20fill%3D%22url(%23g)%22%20opacity%3D%220.85%22%2F%3E%0A%3Cpath%20d%3D%22M18.2%2024.1h3.6l2.2%203.2h-8z%22%20fill%3D%22url(%23g)%22%20opacity%3D%220.85%22%2F%3E%0A%3Ccircle%20cx%3D%2220%22%20cy%3D%2220%22%20r%3D%221.4%22%20fill%3D%22url(%23g)%22%20opacity%3D%220.9%22%2F%3E%0A%3C%2Fsvg%3E") 20 20;
  --cursor-disabled: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%2724%27%20height%3D%2724%27%20viewBox%3D%270%200%2024%2024%27%3E%3Cdefs%3E%3ClinearGradient%20id%3D%27g%27%20x1%3D%270%27%20y1%3D%270%27%20x2%3D%271%27%20y2%3D%271%27%3E%3Cstop%20offset%3D%270%25%27%20stop-color%3D%27%235da8ff%27%2F%3E%3Cstop%20offset%3D%2750%25%27%20stop-color%3D%27%23ffd24a%27%2F%3E%3Cstop%20offset%3D%27100%25%27%20stop-color%3D%27%23b83bff%27%2F%3E%3C%2FlinearGradient%3E%3C%2Fdefs%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%278%27%20fill%3D%27rgba%2810%2C11%2C14%2C0.20%29%27%20stroke%3D%27rgba%280%2C0%2C0%2C0.55%29%27%20stroke-width%3D%273.4%27%2F%3E%3Cline%20x1%3D%276.34%27%20y1%3D%2717.66%27%20x2%3D%2717.66%27%20y2%3D%276.34%27%20stroke%3D%27rgba%280%2C0%2C0%2C0.55%29%27%20stroke-width%3D%273.4%27%20stroke-linecap%3D%27round%27%2F%3E%3Ccircle%20cx%3D%2712%27%20cy%3D%2712%27%20r%3D%278%27%20fill%3D%27none%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%272%27%2F%3E%3Cline%20x1%3D%276.34%27%20y1%3D%2717.66%27%20x2%3D%2717.66%27%20y2%3D%276.34%27%20stroke%3D%27url%28%23g%29%27%20stroke-width%3D%272%27%20stroke-linecap%3D%27round%27%2F%3E%3C%2Fsvg%3E") 12 12;
}

*{
  cursor: var(--cursor-arrow), auto !important;
}

a[href],
button,
.btn,
.tile,
.sideIcon,
.backBtn,
.msBtn,
.msItem,
.usersBtn,
.logsNavBtn,
[role="button"],
[onclick],
summary,
input[type="button"],
input[type="submit"],
input[type="checkbox"],
input[type="radio"]{
  cursor: var(--cursor-hand), pointer !important;
}

html.rzV, html.rzV *{ cursor: var(--cursor-resize-v), ns-resize !important; }
html.rzH, html.rzH *{ cursor: var(--cursor-resize-h), ew-resize !important; }
html.rzD, html.rzD *{ cursor: var(--cursor-resize-d), nwse-resize !important; }

input:not([type="button"]):not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
textarea,
select,
[contenteditable="true"]{
  cursor: var(--cursor-text), text !important;
}

html::-webkit-scrollbar,
html::-webkit-scrollbar-track,
html::-webkit-scrollbar-thumb,
html::-webkit-scrollbar-corner,
body::-webkit-scrollbar,
body::-webkit-scrollbar-track,
body::-webkit-scrollbar-thumb,
body::-webkit-scrollbar-corner,
*::-webkit-scrollbar,
*::-webkit-scrollbar-track,
*::-webkit-scrollbar-thumb,
*::-webkit-scrollbar-corner{
  cursor: var(--cursor-arrow), auto !important;
}

html::-webkit-scrollbar-thumb:active,
body::-webkit-scrollbar-thumb:active,
*::-webkit-scrollbar-thumb:active{
  cursor: var(--cursor-arrow), auto !important;
}

@media (hover: none) and (pointer: coarse){
  *{
    cursor: auto !important;
  }
}

button:not(:disabled) *,
a[href] *,
.btn:not(:disabled) *,
.tile *,
[role="button"] *,
[onclick] *{
  cursor: var(--cursor-hand), pointer !important;
}

button:disabled,
.btn:disabled,
[aria-disabled="true"],
.disabled{
  cursor: var(--cursor-disabled), not-allowed !important;
}

button:disabled *,
.btn:disabled *,
[aria-disabled="true"] *,
.disabled *{
  cursor: var(--cursor-disabled), not-allowed !important;
}

body.app-loading,
body.app-loading *{
  cursor: var(--cursor-busy), wait !important;
}

textarea::-webkit-resizer{
  cursor: var(--cursor-resize-v), ns-resize !important;
}

.resize-h::-webkit-resizer{
  cursor: var(--cursor-resize-h), ew-resize !important;
}

.is-busy,
.is-busy *{
  cursor: var(--cursor-busy), wait !important;
}

.topTitle{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
}

.titleText{
  display:flex;
  flex-direction:column;
  min-width:0;
}

.navBtn{
  display:none;
  width:44px;
  height:44px;
  padding:0;
  border-radius:14px;
  justify-content:center;
}

.navOverlay{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.55);
  opacity: 0;
  pointer-events: none;
  transition: opacity .22s ease;
  z-index: 9998;
}

body.sidebar-open .navOverlay{
  opacity: 1;
  pointer-events: auto;
}

@media (max-width: 760px){

  .wrap{ padding: 12px; }

  .topbar .row.space{
    min-height: 64px;
    gap: 10px;
    align-items: center;
  }

  .titleText h1{ font-size: 18px; margin: 0 0 4px; }
  .titleText p{ font-size: 12px; }

  body.mode-config .navBtn{ display:inline-flex; }

  body.mode-config .layout{
    grid-template-columns: 1fr;
  }

  body.mode-config .sidebar{
    width: 280px;
    height: 100vh;
    top: 0;
    position: fixed;
    opacity: 1;
    transform: translateX(-105%);
    transition: transform .25s ease;
    z-index: 9999;
    border-top-right-radius: 18px;
    border-bottom-right-radius: 18px;
  }

  body.sidebar-open .sidebar{
    transform: translateX(0);
  }

  body.sidebar-open{
    overflow: hidden;
  }

  body.mode-config .main.wrap{
    max-width: none;
    width: 100%;
    margin: 0;
  }

  .sidebar .backText{
    font-size: 10px;
  }

  .sideList{
    grid-template-columns: repeat(3, 56px);
    gap: 10px;
  }

  .sideIcon{
    width:56px;
    height:56px;
    border-radius:16px;
  }
}

@media (max-width: 760px){
  .topbar{
    padding-top: env(safe-area-inset-top);
  }

  .wrap{
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
    padding-bottom: max(12px, env(safe-area-inset-bottom));
  }

  body.mode-config .sidebar{
    height: 100vh;
    height: 100dvh;
    padding-top: max(18px, env(safe-area-inset-top));
    padding-bottom: max(18px, env(safe-area-inset-bottom));
  }
}

@media (max-width: 520px){
  .topbar .row.space{
    flex-direction: column;
    align-items: stretch;
  }

  .topActions{
    width: 100%;
    justify-content: space-between;
  }

  .authBox{
    width: 100%;
    min-width: 0;
    justify-content: space-between;
  }

  #actionRow{
    flex-direction: column;
    align-items: stretch;
  }

  #actionRow .btn,
  #actionRow a.btn{
    width: 100%;
  }

  input,
  select,
  textarea{
    font-size: 16px;
  }
}

@media (hover: none) and (pointer: coarse){
  .tile:hover,
  .sideIcon:hover,
  .btn:hover,
  .logsNavBtn:hover{
    transform: none;
    box-shadow: none;
  }

  button,
  a,
  input,
  select,
  textarea{
    -webkit-tap-highlight-color: transparent;
  }
}

.pill.mini{
  padding:6px 10px;
  font-size:12px;
}

.pill.ok{
  border-color: rgba(43,213,118,.45);
  color: var(--ok);
  background: rgba(43,213,118,.10);
}

.pill.bad{
  border-color: rgba(255,77,77,.45);
  color: var(--bad);
  background: rgba(255,77,77,.10);
}

body.mode-servers #serverSelectCard,
body.mode-servers #configCard,
body.mode-servers #logsCard,
body.mode-servers #usersCard,
body.mode-servers #loadingCard{
  display:none !important;
}

body.mode-servers .layout{
  display:block;
}

body.mode-servers .main.wrap{
  width: 100%;
  margin: 0 auto;
  padding-left: 18px;
  padding-right: 18px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
}

body.mode-servers #serversCard{
  display:block !important;
  width: min(1100px, 100%);
  margin: 14px 0 0 0;
}

body.mode-servers #sidebar,
body.mode-servers #backBtn{
  display:none !important;
}

body.mode-servers #toastWrap{
  display:none !important;
}

#serversList{
  display:flex;
  flex-direction:column;
  gap:10px;
}

#serversCard .serversSearchWrap{
  width:100%;
  max-width:100%;
  min-width:0;
}

#twitchStreamerModal .twitchSearchWrap{
  max-width:720px;
}

.pill.warn{
  border-color: rgba(246,194,68,.55);
  color: rgba(255,210,74,.98);
  background: rgba(246,194,68,.10);
}

.srvCard.isProblem{
  border-color: rgba(255,77,77,.55);
  box-shadow: 0 0 0 1px rgba(255,77,77,.12);
  background: rgba(255,77,77,.04);
}

.srvCard.isWarn{
  border-color: rgba(246,194,68,.45);
  background: rgba(246,194,68,.03);
}

.srvTop{
  display:flex;
  align-items:center;
  gap:12px;
}

.srvAvatar{
  width:44px;
  height:44px;
  border-radius:14px;
  overflow:hidden;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  flex:0 0 auto;
}

.srvAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.srvInitials{
  font-weight:900;
  color: rgba(231,234,242,.75);
}

.srvMain{
  flex:1 1 auto;
  min-width:0;
}

.srvTitleRow{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.srvName{
  font-weight:900;
  font-size:18px;
  line-height:1.1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:560px;
}

.srvSub{
  margin-top:4px;
  font-size:12px;
  color: rgba(231,234,242,.70);
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.srvIdText{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
  flex:0 1 auto;
}

.srvMemberText{
  white-space:nowrap;
  flex:0 0 auto;
}

.iconBtn{
  width:28px;
  height:28px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.03);
  display:grid;
  place-items:center;
  cursor:pointer;
  flex:0 0 auto;
  padding:0;
}

.iconBtn:hover{
  background: rgba(255,255,255,.06);
}

.iconBtn svg{
  width:16px;
  height:16px;
  stroke: rgba(231,234,242,.75);
  fill:none;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.srvActions{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
}

.srvGrid{
  margin-top:12px;
  display:grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap:12px;
}

.srvGridActions{
  grid-template-columns: 1fr 1fr 1fr;
}

.srvCard.isCollapsed .srvDetails{
  display:none;
}

.srvInfo{
  border:1px solid rgba(255,255,255,.09);
  background: rgba(255,255,255,.03);
  border-radius:14px;
  padding:10px 10px;
  display:grid;
  gap:6px;
  min-width:0;
}

.srvK{
  font-size:12px;
  color: rgba(231,234,242,.65);
}

.srvV{
  font-size:13px;
  color: rgba(231,234,242,.92);
  min-width:0;
}

.srvVText{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.srvVWrap{
  display:grid;
  gap:8px;
}

.srvMissing{
  color: rgba(255,77,77,.92);
}

.srvV .btn{
  width:100%;
  justify-content:center;
}

.srvUserRow{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.srvUserRow .userAvatar{
  width:32px;
  height:32px;
  border-radius:12px;
}

.userAvatar{
  width:34px;
  height:34px;
  border-radius:14px;
  overflow:hidden;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  flex:0 0 auto;
}

.userAvatarImg{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:14px;
}

.userAvatarFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border-radius:14px;
  font-weight:900;
  font-size:12px;
  color: rgba(231,234,242,.92);
}

@media (max-width: 980px){
  .srvGridActions{ grid-template-columns: 1fr 1fr; }
}

@media (max-width: 920px){
  .srvGrid{ grid-template-columns: 1fr; }
  .srvGridActions{ grid-template-columns: 1fr; }
}

@media (max-width: 720px){
  .srvActions{ flex-direction:column; align-items:stretch; }
  .srvName{ max-width: 100%; }
}

.btn.danger{
  border-color: rgba(255,77,77,.45);
  color: var(--bad);
}

body.mode-servers #serversSearch:focus{
  border-color: transparent !important;
  box-shadow: none !important;
  outline: none !important;
}

body.mode-servers .layout {
  grid-template-columns: 1fr !important;
}

body.mode-servers .main {
  max-width: 1100px;
  margin: 0 auto;
  padding-left: 18px;
  padding-right: 18px;
}

.pillWarn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  border-radius: 999px;
  border: 1px solid rgba(255, 77, 77, .35);
  background: rgba(255, 77, 77, .08);
  color: rgba(255, 210, 74, .98);
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}

html.modalOpen, body.modalOpen{
  overflow:hidden;
}

#twitchStreamerModal{
  padding: 40px 18px 18px;
  overscroll-behavior: contain;
}

#twitchStreamerModal .modalCard{
  height: min(780px, calc(100vh - 80px));
  max-height: calc(100vh - 80px);
  display:flex;
  flex-direction:column;
  overflow:hidden;
  overscroll-behavior: contain;
}

#twitchStreamerModal .twitchSearchResults{
  max-height:none;
  flex:1;
  overflow:auto;
  overscroll-behavior: contain;
  padding-top: 12px;
}

.twitchResultRight{
  display:flex;
  align-items:center;
  gap:10px;
}

.twitchResultRow.selected{
  border-color: rgba(145,70,255,0.45);
  box-shadow: 0 0 0 2px rgba(145,70,255,0.18);
  background: rgba(145,70,255,0.12);
}

.twitchAddBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;

  height:34px;
  padding:8px 10px;
  border-radius:10px;

  border:1px solid rgba(145,70,255,0.55);
  background: linear-gradient(180deg, rgba(145,70,255,1), rgba(118,58,220,1));
  color:#fff;
  font-weight:800;
  cursor:pointer;

  opacity:0;
  pointer-events:none;
  transform: translateX(4px);
  transition: opacity .12s ease, transform .12s ease;
}

.twitchResultRow:hover .twitchAddBtn,
.twitchResultRow:focus .twitchAddBtn,
.twitchResultRow:focus-within .twitchAddBtn,
.twitchResultRow.selected .twitchAddBtn{
  opacity:1;
  pointer-events:auto;
  transform: translateX(0);
}

#twitchStreamerModal .serversSearchWrap{
  width:100%;
  max-width:100%;
}

#twitchStreamerModal .twitchSearchWrap{
  width:100%;
  max-width:680px;
}

#twitchStreamerModal .logsSearchRow{
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
}

#twitchStreamerModal .logsSearchField{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  flex:1 1 auto;
  min-width:0;
  min-height:44px;
  padding:0 8px 0 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

#twitchStreamerModal .logsSearchField:focus-within{
  border-color:rgba(var(--accent-rgb), .22) !important;
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .08) !important;
}

#twitchStreamerModal .logsSearchIcon{
  flex:0 0 auto;
  color:rgba(255,255,255,.62);
}

#twitchStreamerModal .logsSearchField #twitchStreamerQuery{
  appearance:none;
  -webkit-appearance:none;
  flex:1 1 auto;
  min-width:0;
  height:40px;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  outline:none !important;
  box-shadow:none !important;
  color:#fff;
  font-size:.96rem;
}

#twitchStreamerModal .logsSearchField #twitchStreamerQuery::placeholder{
  color:rgba(255,255,255,.55);
}

#twitchStreamerModal .logsSearchField #twitchStreamerQuery:focus,
#twitchStreamerModal .logsSearchField #twitchStreamerQuery:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}

#twitchStreamerModal .logsSearchClearBtn{
  flex:0 0 auto;
  align-self:center;
  margin-left:0;
}

#logsInviteTrackingModal .logsSearchField{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  flex:1 1 auto;
  min-width:0;
  min-height:44px;
  padding:0 8px 0 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

#logsInviteTrackingModal .logsSearchField:focus-within{
  border-color:rgba(255,255,255,.10) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03) !important;
}

#logsInviteTrackingModal .logsSearchIcon{
  flex:0 0 auto;
  color:rgba(255,255,255,.62);
}

#logsInviteTrackingModal .logsSearchField #logsInviteTrackingSearch{
  appearance:none;
  -webkit-appearance:none;
  flex:1 1 auto;
  min-width:0;
  height:40px;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  outline:none !important;
  box-shadow:none !important;
  color:#fff;
  font-size:.96rem;
}

#logsInviteTrackingModal .logsSearchField #logsInviteTrackingSearch::-webkit-search-decoration,
#logsInviteTrackingModal .logsSearchField #logsInviteTrackingSearch::-webkit-search-cancel-button,
#logsInviteTrackingModal .logsSearchField #logsInviteTrackingSearch::-webkit-search-results-button,
#logsInviteTrackingModal .logsSearchField #logsInviteTrackingSearch::-webkit-search-results-decoration{
  -webkit-appearance:none;
  appearance:none;
  display:none;
}

#logsInviteTrackingModal .logsSearchField #logsInviteTrackingSearch::placeholder{
  color:rgba(255,255,255,.55);
}

#logsInviteTrackingModal .logsSearchField #logsInviteTrackingSearch:focus,
#logsInviteTrackingModal .logsSearchField #logsInviteTrackingSearch:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}

#logsInviteTrackingModal .logsSearchClearBtn{
  flex:0 0 auto;
  align-self:center;
  margin-left:0;
}

@media (max-width: 760px){
  #twitchStreamerModal .twitchSearchWrap{
    max-width:100%;
  }
}

.topbar,
.layout,
.loggedOutScreen,
.communityFloatingCard,
.dashboardLangDock,
.dashboardViewerDock,
.dashboardIntroFab,
.dashboardChangelogFab,
.dashboardLatestChangelogDock,
#toastWrap,
#missingWrap,
#dirtyWrap,
.modal{
  zoom: var(--uiScale);
}

.autoAufstCard{
  border:1px solid var(--line);
  background: rgba(255,255,255,.03);
  border-radius:14px;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:12px;
  width: max-content;
  max-width: 100%;
}

.lateButtonsRows{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.lateButtonsRow{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.lateButtonsLabel{
  font-size:13px;
  opacity:.85;
  min-width:64px;
}

.lateMinInput{
  width:110px;
  padding:6px 10px;
  border-radius:8px;
  border:1px solid var(--line);
  background: rgba(255,255,255,.04);
  color: inherit;
}

.lateButtonsRemove{
  padding:4px 10px;
}

.lateButtonsActions{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

@media (max-width: 540px){
  .lateButtonsRow{ width:100%; }
  .lateMinInput{ flex:1 1 auto; min-width:0; }
}

.autoAufstCardsRow{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  align-items:flex-start;
}

.bewachenCardsRow{
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  align-items:flex-start;
}

.bewachenCard{
  border:1px solid var(--line);
  background: rgba(255,255,255,.03);
  border-radius:14px;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:12px;
  flex:1 1 340px;
  min-width:320px;
  max-width:100%;
}

.bewachenInfoNote{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.18);
  color: rgba(231,234,242,.72);
  font-size:12px;
  line-height:1.4;
}

.bewachenEditorRows{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.bewachenEditorHead{
  display:grid;
  grid-template-columns:104px 104px 76px max-content;
  gap:10px;
  align-items:center;
  padding:0 10px;
  width:max-content;
  max-width:100%;
  color:rgba(231,234,242,.62);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.bewachenEditorRow{
  display:grid;
  grid-template-columns:104px 104px 76px max-content;
  gap:10px;
  align-items:center;
  padding:10px;
  width:max-content;
  max-width:100%;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.18);
}

.bewachenEditorRow.isTarget{
  grid-template-columns:minmax(0,1fr) auto;
}

.bewachenEditorRow input[type="text"]{
  width:100%;
}

.bewachenEditorRow input[type="number"]{
  width:100%;
  min-width:0;
  text-align:center;
}

.bewachenEditorRow .btn{
  min-width:88px;
  width:auto;
  justify-self:start;
  white-space:nowrap;
  padding:8px 12px;
}

@media (max-width: 900px){
  .bewachenCard{
    min-width:100%;
  }

  .bewachenEditorHead{
    display:none;
  }

  .bewachenEditorRow{
    grid-template-columns:1fr 1fr;
  }

  .bewachenEditorRow.isSlot > :nth-child(1){
    grid-column:1 / 2;
  }

  .bewachenEditorRow.isSlot > :nth-child(2){
    grid-column:2 / 3;
  }

  .bewachenEditorRow.isSlot > :nth-child(3){
    grid-column:1 / 2;
  }

  .bewachenEditorRow.isSlot > :nth-child(4){
    grid-column:2 / 3;
    justify-self:end;
  }

  .bewachenEditorRow.isTarget{
    grid-template-columns:1fr auto;
  }
}

.autoSanktionFields{
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:stretch;
}

.autoSanktionCard .field{
  width: 100%;
}

.autoSanktionCard.off{
  opacity:.65;
}

.autoSanktionCard.off .ms{
  pointer-events:none;
}

.autoSanktionCard .msBtn{
  align-items:flex-start;
  padding-right: 82px;
}

.autoSanktionCard .msSingleText{
  display:block;
  flex:1 1 auto;
  min-width:0;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:break-word;
  line-height:1.25;
}

.autoAufstHead{
  display:flex;
  flex-direction:column;
  gap:4px;
}

.autoAufstTitle{
  font-weight:1000;
  letter-spacing:.2px;
}

.autoAufstDesc{
  color: rgba(231,234,242,.70);
  font-size:12px;
  line-height:1.35;
}

.stempeluhrStatsCollapseBtn{
  width:100%;
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  padding:0;
  border:0;
  background:transparent;
  color:inherit;
  cursor:pointer;
  text-align:left;
}

.stempeluhrStatsCollapseText{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.stempeluhrStatsCollapseTitleRow{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}

.stempeluhrStatsCollapseTitleRow .helpIcon{
  margin-left:0;
}

.stempeluhrStatsCollapseArrow{
  flex:0 0 auto;
  font-size:18px;
  line-height:1;
  color:rgba(231,234,242,.74);
  transition:transform .22s ease, color .18s ease;
  transform:rotate(0deg);
  margin-top:2px;
}

.stempeluhrStatsCollapseBtn:hover .stempeluhrStatsCollapseArrow{
  color:rgba(231,234,242,.96);
}

.stempeluhrStatsCard.isCollapsed .stempeluhrStatsCollapseArrow{
  transform:rotate(-90deg);
}

.stempeluhrStatsBody{
  overflow:hidden;
  max-height:0;
  opacity:0;
  transition:
    max-height .30s cubic-bezier(.22,1,.36,1),
    opacity .18s ease;
  will-change:max-height, opacity;
}

.stempeluhrStatsBodyInner{
  padding-top:12px;
}

.stempeluhrStatsCard.isCollapsed .stempeluhrStatsBodyInner{
  padding-top:0;
}

@media (prefers-reduced-motion: reduce){
  .stempeluhrStatsCollapseArrow,
  .stempeluhrStatsBody{
    transition:none;
  }
}

.autoAufstPostRow{
  display:grid;
  grid-template-columns: 180px 104px;
  align-items:center;
  column-gap:10px;
  padding:10px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.18);
  width: max-content;
  max-width: 100%;
}

.autoAufstPostLabel{
  font-size: 13.5px;
  font-weight: 800;
  color: rgba(231,234,242,.88);
  letter-spacing: .2px;
}

.autoAufstRows{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.autoAufstRow{
  display:grid;
  grid-template-columns: 180px 104px;
  align-items:center;
  column-gap:10px;
  padding:10px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.18);
  width: max-content;
  max-width: 100%;
}

.autoAufstDay{
  display:flex;
  align-items:center;
  gap:10px;
  font-weight:900;
  color: rgba(231,234,242,.86);
  user-select:none;
}

.autoAufstChk{
  width:18px;
  height:18px;
  accent-color: var(--accent);
}

body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid{
  display:grid !important;
  grid-template-columns:minmax(0, 1.5fr) minmax(320px, .85fr) !important;
  align-items:start !important;
  gap:16px !important;
  width:100% !important;
  max-width:none !important;
}

body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail{
  grid-column:1 !important;
  grid-row:1 !important;
  display:grid !important;
  grid-template-columns:repeat(auto-fit, minmax(220px, 1fr)) !important;
  gap:12px 14px !important;
  min-width:0 !important;
  width:100% !important;
  align-content:start !important;
}

body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail .field{
  min-width:0;
  width:100%;
}

body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail .field:has(textarea),
body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail .field:has(input[type="file"]),
body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail .field:has(.embedImagePreview),
body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail > .embedImageBox,
body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail > .embedImageCard,
body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail > .autoAufstCard,
body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail > .bewachenCard{
  grid-column:1 / -1 !important;
  width:100%;
  max-width:100%;
}

body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungRightRail{
  grid-column:2 !important;
  grid-row:1 !important;
  display:flex !important;
  flex-direction:column;
  gap:14px;
  min-width:0;
  width:100%;
  align-self:start;
}

body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid .aufstellungRightCard{
  width:100%;
  min-width:0;
}

body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid .autoAufstCardsRow.aufstellungRightCard{
  display:flex;
  flex-direction:column;
  gap:14px;
  flex-wrap:nowrap;
  align-items:stretch;
}

body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid .autoAufstCardsRow.aufstellungRightCard .autoAufstCard,
body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid .autoAufstCardsRow.aufstellungRightCard .autoSanktionCard{
  width:100%;
  max-width:none;
}

.autoAufstCurrentCard{
  border:1px solid var(--line);
  background:
    radial-gradient(circle at top left, rgba(var(--accent-rgb), .10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  border-radius:16px;
  padding:14px;
  display:flex;
  flex-direction:column;
  gap:12px;
  width:100%;
  box-shadow:0 18px 44px rgba(0,0,0,.20);
}

.currentAufstToolbar{
  display:flex;
  justify-content:flex-end;
}

.currentAufstList{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.currentAufstRow{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  gap:12px;
  padding:12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.075);
  background:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)),
    rgba(0,0,0,.18);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  transition:
    border-color .18s ease,
    background .18s ease,
    transform .18s ease,
    box-shadow .18s ease;
}

.currentAufstRow:hover{
  border-color:rgba(var(--accent-rgb), .24);
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025)),
    rgba(0,0,0,.20);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 12px 28px rgba(0,0,0,.18);
  transform:translateY(-1px);
}

.currentAufstMeta{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:5px;
}

.currentAufstName{
  font-weight:950;
  color:rgba(231,234,242,.96);
  line-height:1.22;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.currentAufstSub{
  font-size:12px;
  color:rgba(231,234,242,.68);
  line-height:1.3;
  font-variant-numeric:tabular-nums;
}

.currentAufstDescriptionPreview{
  margin-top:3px;
  color:rgba(231,234,242,.72);
  font-size:12.5px;
  line-height:1.42;
  max-height:calc(12.5px * 1.42 * 2);
  overflow:hidden;
  overflow-wrap:anywhere;
}

.currentAufstActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.autoAufstPostTime,
.autoAufstTime,
.currentAufstTime{
  width:104px;
  height:38px;
  padding:7px 34px 7px 12px;
  border-radius:14px;
  border:1px solid rgba(120,160,255,.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.02)),
    rgba(10,14,26,.92);
  color:rgba(240,244,255,.96);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 10px 24px rgba(0,0,0,.18);
  font-weight:800;
  letter-spacing:.25px;
  font-variant-numeric:tabular-nums;
  appearance:none;
  -webkit-appearance:none;
  cursor:text;
  transition:
    border-color .18s ease,
    box-shadow .18s ease,
    background .18s ease,
    transform .18s ease;
}

.autoAufstPostTime:hover,
.autoAufstTime:hover,
.currentAufstTime:hover{
  border-color:rgba(120,160,255,.30);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 12px 28px rgba(0,0,0,.22);
}

.autoAufstPostTime:focus,
.autoAufstTime:focus,
.currentAufstTime:focus{
  border-color:rgba(120,160,255,.42);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 0 3px rgba(78,127,255,.14),
    0 12px 28px rgba(0,0,0,.22);
}

.autoAufstPostTime:disabled,
.autoAufstTime:disabled,
.currentAufstTime:disabled{
  opacity:.55;
  cursor:not-allowed;
  box-shadow:none;
}

.autoAufstPostTime::-webkit-calendar-picker-indicator,
.autoAufstTime::-webkit-calendar-picker-indicator,
.currentAufstTime::-webkit-calendar-picker-indicator{
  opacity:0;
  width:0;
  min-width:0;
  margin:0;
  pointer-events:none;
}

.autoAufstPostTime::-webkit-datetime-edit,
.autoAufstTime::-webkit-datetime-edit,
.currentAufstTime::-webkit-datetime-edit{
  color:rgba(240,244,255,.96);
}

.autoAufstPostTime::-webkit-datetime-edit-hour-field,
.autoAufstPostTime::-webkit-datetime-edit-minute-field,
.autoAufstTime::-webkit-datetime-edit-hour-field,
.autoAufstTime::-webkit-datetime-edit-minute-field,
.currentAufstTime::-webkit-datetime-edit-hour-field,
.currentAufstTime::-webkit-datetime-edit-minute-field{
  padding:1px 2px;
  border-radius:8px;
}

.autoAufstPostTime::-webkit-datetime-edit-hour-field:focus,
.autoAufstPostTime::-webkit-datetime-edit-minute-field:focus,
.autoAufstTime::-webkit-datetime-edit-hour-field:focus,
.autoAufstTime::-webkit-datetime-edit-minute-field:focus,
.currentAufstTime::-webkit-datetime-edit-hour-field:focus,
.currentAufstTime::-webkit-datetime-edit-minute-field:focus{
  background:rgba(78,127,255,.16);
  outline:none;
}

.currentAufstEmpty{
  padding:14px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background: rgba(0,0,0,.18);
  color: rgba(231,234,242,.66);
}

.currentAufstRowExpandable{
  align-items:stretch;
  flex-direction:column;
}

.currentAufstRowExpandable .ticketCategoryHead{
  align-items:center;
}

.currentAufstRowExpandable .ticketCategoryActions{
  align-items:center;
}

.currentAufstRowExpandable .ticketCategoryToggle{
  min-width:140px;
}

.currentAufstPanel{
  display:grid;
  grid-template-rows:1fr;
  opacity:1;
  transition:grid-template-rows .24s cubic-bezier(.22,1,.36,1), opacity .18s ease;
}

.currentAufstRowExpandable.isCollapsed .currentAufstPanel{
  grid-template-rows:0fr;
  opacity:0;
}

.currentAufstPanelBody{
  overflow:hidden;
  padding-top:12px;
  display:grid;
  gap:12px;
}

.currentAufstRowExpandable.isCollapsed .currentAufstPanelBody{
  padding-top:0;
}

.currentAufstEditorGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.currentAufstEditorGrid .field{
  min-width:0;
}

.currentAufstEditorGrid .field.full{
  grid-column:1 / -1;
}

@media (max-width: 820px){
  .currentAufstRow{
    flex-direction:column;
    align-items:flex-start;
  }

  .currentAufstActions{
    width:100%;
  }

  .currentAufstEditorGrid{
    grid-template-columns:1fr;
  }
}

.aufstellungDashboardEditModal{
  align-items:center;
  justify-content:center;
}

.aufstellungDashboardEditCard{
  width:min(680px, calc(100vw - 32px));
  padding:18px;
  border-radius:18px;
  background:
    radial-gradient(circle at top left, rgba(var(--accent-rgb), .13), transparent 34%),
    linear-gradient(180deg, rgba(22,28,44,.98), rgba(13,17,28,.98));
  box-shadow:0 28px 80px rgba(0,0,0,.45);
}

.aufstellungDashboardEditHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:16px;
}

.aufstellungDashboardEditHead h3{
  margin:0 0 4px;
}

.aufstellungDashboardEditClose{
  width:38px;
  height:38px;
  min-width:38px;
  padding:0;
  border-radius:12px;
}

.aufstellungDashboardEditBody{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 140px;
  gap:12px;
}

.aufstellungDashboardEditField{
  min-width:0;
}

.aufstellungDashboardEditField.full{
  grid-column:1 / -1;
}

.aufstellungDashboardEditTextarea{
  width:100%;
  min-height:160px;
  resize:vertical;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.22);
  color:var(--text);
  padding:12px;
  outline:none;
  line-height:1.45;
}

.aufstellungDashboardEditTextarea:focus{
  border-color:rgba(var(--accent-rgb), .42);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .13);
}

.aufstellungDashboardEditDate,
.aufstellungDashboardEditTime{
  width:100%;
  height:38px;
}

.aufstellungDashboardEditActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  margin-top:16px;
}

@media (max-width:960px){
  body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid{
    grid-template-columns:1fr !important;
  }

  body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail,
  body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungRightRail{
    grid-column:1 !important;
    grid-row:auto !important;
  }

  body.mode-config #configModulesGrid.configModulesGrid #aufstellungBox.aufstellungSettingsGrid > .aufstellungLeftRail{
    grid-template-columns:1fr !important;
  }
}

@media (max-width:720px){
  .currentAufstRow{
    grid-template-columns:1fr;
    align-items:stretch;
  }

  .currentAufstActions{
    width:100%;
    justify-content:flex-start;
  }

  .currentAufstActions .btn{
    flex:1 1 auto;
  }

  .aufstellungDashboardEditBody{
    grid-template-columns:1fr;
  }

  .aufstellungDashboardEditActions{
    flex-direction:column-reverse;
    align-items:stretch;
  }

  .aufstellungDashboardEditActions .btn{
    width:100%;
  }
}

.dashTimeWrap{
  position:relative;
  display:inline-block;
  width:104px;
}

.dashTimeWrap .autoAufstPostTime,
.dashTimeWrap .autoAufstTime,
.dashTimeWrap .currentAufstTime{
  width:100%;
  min-width:0;
  pointer-events:auto;
  user-select:text;
  caret-color:rgba(240,244,255,.96);
}

.dashTimeBtn{
  position:absolute;
  top:50%;
  right:7px;
  transform:translateY(-50%);
  width:22px;
  height:22px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.025)),
    rgba(255,255,255,.03);
  color:rgba(231,234,242,.9);
  box-shadow:none;
  cursor:pointer;
  transition:
    border-color .18s ease,
    background .18s ease,
    transform .18s ease,
    box-shadow .18s ease;
}

.dashTimeBtn:hover{
  border-color:rgba(120,160,255,.26);
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)),
    rgba(255,255,255,.04);
}

.dashTimeBtn:focus{
  border-color:rgba(120,160,255,.34);
  box-shadow:0 0 0 2px rgba(78,127,255,.12);
}

.dashTimeBtn svg{
  width:16px;
  height:16px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.9;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.dashTimeWrap.isDisabled .dashTimeBtn{
  opacity:.55;
  cursor:not-allowed;
  box-shadow:none;
}

.dashTimePopup{
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  width:196px;
  padding:10px;
  border-radius:16px;
  border:1px solid rgba(120,160,255,.18);
  background:
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.02)),
    rgba(8,12,24,.98);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 18px 48px rgba(0,0,0,.34);
  backdrop-filter:blur(14px);
  opacity:0;
  transform:translateY(6px) scale(.985);
  pointer-events:none;
  transition:
    opacity .16s ease,
    transform .16s ease,
    box-shadow .18s ease,
    border-color .18s ease;
  z-index:40;
}

.dashTimePopup.isOpen{
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}

.dashTimeWrap.isOpen .autoAufstPostTime,
.dashTimeWrap.isOpen .autoAufstTime,
.dashTimeWrap.isOpen .currentAufstTime{
  border-color:rgba(120,160,255,.42);
  background:
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.03)),
    rgba(12,18,34,.96);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.07),
    0 0 0 3px rgba(78,127,255,.16),
    0 16px 34px rgba(0,0,0,.26);
}

.dashTimeWrap.isOpen .dashTimeBtn{
  border-color:rgba(120,160,255,.34);
  background:
    linear-gradient(180deg, rgba(255,255,255,.10), rgba(255,255,255,.04)),
    rgba(255,255,255,.05);
  box-shadow:
    0 0 0 2px rgba(78,127,255,.10),
    0 8px 18px rgba(0,0,0,.18);
}

.dashTimePopupGrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}

.dashTimeCol{
  min-width:0;
}

.dashTimeColLabel{
  margin:0 0 8px;
  padding:0 2px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.28px;
  text-transform:uppercase;
  color:rgba(231,234,242,.62);
}

.dashTimeWheel{
  height:176px;
  overflow-y:auto;
  padding:6px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    rgba(255,255,255,.02);
}

.dashTimeWheelBtn{
  width:100%;
  height:30px;
  padding:0;
  border:0;
  border-radius:10px;
  background:transparent;
  color:rgba(231,234,242,.82);
  font-weight:800;
  font-variant-numeric:tabular-nums;
  cursor:pointer;
  transition:
    background .14s ease,
    color .14s ease,
    transform .14s ease,
    box-shadow .14s ease;
}

.dashTimeWheelBtn:hover{
  background:rgba(255,255,255,.05);
  color:rgba(240,244,255,.96);
}

.dashTimeWheelBtn.isActive{
  background:
    linear-gradient(180deg, rgba(92,140,255,.28), rgba(70,108,214,.18)),
    rgba(92,140,255,.12);
  color:rgba(245,248,255,.98);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 0 1px rgba(120,160,255,.16);
}

.dashTimeWheelBtn:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.autoAufstTools{
  display:flex;
  gap:10px;
  align-items:center;
}

.autoAufstBtn{
  height:36px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.06);
  color: var(--text);
  padding:0 12px;
  font-weight:900;
  cursor:pointer;
}

.autoAufstBtn:hover{
  background: rgba(255,255,255,.08);
  border-color: rgba(255,255,255,.12);
}

.autoAufstFill{
  width:112px;
  height:36px;
  padding:8px 10px;
  border-radius:10px;
}

.checkbox-wrapper-30{
  --size: .9;
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}

.checkbox-wrapper-30 .checkbox{
  --bg: rgba(255,255,255,.06);
  --brdr: rgba(255,255,255,.16);
  --brdr-hovr: rgba(var(--accent-rgb), .55);
  --brdr-actv: rgba(var(--accent-rgb), 1);
  --dur: calc((var(--size, 2)/2) * 0.6s);

  color: var(--brdr);
  display: inline-block;
  width: calc(var(--size, 1) * 22px);
  position: relative;
}

.checkbox-wrapper-30 .checkbox:after{
  content: "";
  width: 100%;
  padding-top: 100%;
  display: block;
}

.checkbox-wrapper-30 .checkbox > *{
  position: absolute;
}

.checkbox-wrapper-30 .checkbox input{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  -webkit-tap-highlight-color: transparent;

  cursor: pointer;
  background-color: var(--bg);
  border-radius: calc(var(--size, 1) * 5px);
  border: calc(var(--newBrdr, var(--size, 1)) * 1px) solid;
  color: var(--newBrdrClr, var(--brdr));
  outline: none;
  margin: 0;
  padding: 0;
  transition: all calc(var(--dur) / 3) linear;
}

.checkbox-wrapper-30 .checkbox input:focus,
.checkbox-wrapper-30 .checkbox input:focus-visible{
  box-shadow: none !important;
}

.checkbox-wrapper-30 .checkbox input:hover{
  --newBrdrClr: var(--brdr-hovr);
}

.checkbox-wrapper-30 .checkbox input:checked{
  --newBrdrClr: var(--accent);
  transition-delay: calc(var(--dur) / 1.3);
}

.checkbox-wrapper-30 .checkbox input:hover + svg,
.checkbox-wrapper-30 .checkbox input:hover + svg use{
  color: var(--brdr-hovr);
}

.checkbox-wrapper-30 .checkbox input:checked + svg,
.checkbox-wrapper-30 .checkbox input:checked + svg use{
  color: var(--brdr-actv);
}

.checkbox-wrapper-30 .checkbox input:checked + svg{
  --dashArray: 16 93;
  --dashOffset: 109;
}

.checkbox-wrapper-30 .checkbox svg{
  fill: none;
  left: 0;
  pointer-events: none;
  stroke: currentColor;
  stroke-dasharray: var(--dashArray, 93);
  stroke-dashoffset: var(--dashOffset, 94);
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-width: 2.4px;
  top: 0;
  transition: stroke-dasharray var(--dur), stroke-dashoffset var(--dur), color .18s ease;
}

.checkbox-wrapper-30 .checkbox svg,
.checkbox-wrapper-30 .checkbox input{
  display: block;
  height: 100%;
  width: 100%;
}

.autoAufstHdr{
  display:grid;
  grid-template-columns: 180px 104px;
  column-gap:10px;
  padding:0 10px;
  font-size:11px;
  font-weight:900;
  color: rgba(231,234,242,.62);
  width: max-content;
  max-width: 100%;
}

.autoAufstRow.off{
  opacity: .65;
}

@media (min-width: 961px){
  body.mode-config{
    overflow-x: hidden;
    overflow-y: auto;
  }

  body.mode-config .main.wrap{
    max-width: none;
    width: 100%;
    margin: 0;
    padding-left: 18px;
    padding-right: 18px;
    height: auto;
    min-height: 0;
    overflow: visible;
  }

  body.mode-config #configCard{
    margin-top: 0;
    margin-bottom: 14px;
    padding: 0;
    background: transparent;
    border: 0;
    box-shadow: none;
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    height: auto;
    min-height: 0;
    overflow: visible;
    display: block;
  }

  body.mode-config .configLayout{
    position: relative;
    display: block;
    min-height: 0;
  }

  body.mode-config .configMain{
    min-height: 0;
    height: auto;
    width: calc(100% - 312px);
    max-width: calc(100% - 312px);
    overflow: visible;
    padding: 16px;
    margin-right: 0;
    background: linear-gradient(180deg, rgba(15,19,32,.82), rgba(11,13,18,.64));
    border: 1px solid rgba(255,255,255,.06);
    border-radius: 16px;
    box-shadow: none;
  }

  body.mode-config .configRail{
    position: fixed;
    top: 140px;
    right: 18px;
    width: 280px;
    max-height: calc(100vh - 228px);
    display: flex;
    flex-direction: column;
    gap: 14px;
    overflow: hidden;
    z-index: 30;
  }

  body.mode-config .configRail .railBox:last-child{
    flex: 1 1 auto;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
  }

  body.mode-config .modulesDock{
    display: grid;
    gap: 4px;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    align-content: start;
    padding-right: 4px;
  }

  body.mode-config .modulesDock .field{
    min-width: 0;
  }

  body.mode-config .modulesDock .field.fieldInline{
    min-height: 34px;
    grid-template-columns: 1fr auto;
    align-items: center;
    column-gap: 10px;
    row-gap: 0;
  }

  body.mode-config .modulesDock .field.fieldInline label{
    margin: 0;
    color: var(--text);
    font-size: 13px;
    line-height: 1.15;
  }

  body.mode-config .modulesDock .field.fieldInline .toggle{
    justify-self: end;
    gap: 0;
  }

  body.mode-config .modulesDock .field.fieldInline .toggle input[type="checkbox"]{
    transform: scale(.82);
    transform-origin: right center;
  }

  body.mode-config #toastWrap{
    position: fixed;
    top: 18px;
    right: 18px;
    left: auto;
    width: 280px;
    max-width: 280px;
    padding: 0 !important;
    margin: 0 !important;
    z-index: 10021;
    pointer-events: none;
  }

  body.mode-config #missingWrap{
    position: fixed;
    top: 74px;
    right: 18px;
    width: 280px;
    max-width: 280px;
    z-index: 10022;
    pointer-events: none;
  }

  body.mode-config #toast,
  body.mode-config #missingToast{
    width: 100%;
    margin: 0;
    padding: 14px;
    border-radius: 14px;
    background: var(--card2);
    box-shadow: 0 12px 40px rgba(0,0,0,.35);
    backdrop-filter: none;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.15;
  }

  body.mode-config #toast.ok{
    color: rgba(43,213,118,.98);
    border-color: rgba(43,213,118,.35);
  }

  body.mode-config #toast.bad{
    color: rgba(255,77,77,.98);
    border-color: rgba(255,77,77,.35);
  }

  body.mode-config #missingToast{
    color: rgba(255,77,77,.98);
    border-color: rgba(255,77,77,.35);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    letter-spacing: .01em;
  }
}

body.mode-serverview #serverSelectCard,
body.mode-serverview #configCard,
body.mode-serverview #logsCard,
body.mode-serverview #usersCard,
body.mode-serverview #serversCard,
body.mode-serverview #loadingCard{
  display:none !important;
}

body.mode-serverview .layout{
  display:flex;
  flex-direction:column;
  min-height:0;
}

body.mode-serverview #discordViewCard{
  display:flex !important;
  flex-direction:column;
  width:100%;
  margin:0;
  min-height:0;
}

body.mode-serverview #sidebar,
body.mode-serverview #backBtn{
  display:none !important;
}

body.mode-serverview #toastWrap{
  position:fixed;
  top:18px;
  right:18px;
  left:auto;
  width:min(360px, calc(100vw - 36px));
  max-width:360px;
  padding:0 !important;
  margin:0 !important;
  z-index:10021;
  pointer-events:none;
}

body.mode-serverview #toast{
  width:100%;
  margin:0;
  padding:14px;
  border-radius:14px;
  background:#1e1f22;
  box-shadow:0 12px 40px rgba(0,0,0,.35);
  font-size:13px;
  font-weight:800;
  line-height:1.25;
}

.discordViewGuildHead{
  border:0;
  border-bottom:1px solid rgba(0,0,0,.3);
  background:#2b2d31;
  border-radius:0;
  padding:0 16px;
  display:flex;
  align-items:center;
  gap:0;
  flex:0 0 auto;
  height:48px;
  min-height:48px;
  box-sizing:border-box;
  box-shadow:0 1px 0 rgba(4,4,5,.2), 0 1.5px 0 rgba(6,6,7,.05), 0 2px 0 rgba(4,4,5,.05);
}

.discordViewGuildMeta{
  display:flex;
  align-items:center;
  flex:1 1 auto;
  min-width:0;
}

.discordViewGuildName{
  font-size:1rem;
  font-weight:600;
  letter-spacing:0;
  color:#fff;
  line-height:1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordViewSidebar .discordViewTree{
  padding:8px 8px 16px;
}

.discordViewGuildMeta{
  min-width:0;
}

.discordViewGuildName{
  font-size:18px;
  font-weight:900;
  line-height:1.1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordViewGroup{
  display:grid;
  gap:2px;
}

.discordViewGroup + .discordViewGroup{
  margin-top:16px;
}

.discordViewGroupTitle{
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:#949ba4;
  padding:0 8px;
  line-height:1.25;
}

.discordViewNode{
  width:100%;
  border:0;
  background:transparent;
  color:#949ba4;
  border-radius:4px;
  padding:6px 8px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  text-align:left;
  cursor:pointer;
  font-weight:500;
  font-size:1rem;
  line-height:1.25;
  transition:background .1s ease, color .1s ease;
}

.discordViewNode:hover{
  background:#35373c;
  color:#dbdee1;
  border-color:transparent;
}

.discordViewNode.isActive{
  background:#404249;
  color:#fff;
  border-color:transparent;
}

.discordViewNode.isActive .discordViewNodeIcon{
  color:#fff;
  opacity:1;
}

.discordViewNode.isUnread{
  color:#fff;
}

.discordViewNode.isUnread .discordViewNodeName{
  color:#fff;
  font-weight:600;
}

.discordViewNode.isUnread .discordViewNodeIcon{
  color:#fff;
}

.discordViewNodeWrap.hasUnread{
  position:relative;
}

.discordViewNodeWrap.hasUnread::before{
  content:"";
  position:absolute;
  left:-12px;
  top:50%;
  transform:translateY(-50%);
  width:4px;
  height:8px;
  background:#fff;
  border-radius:0 2px 2px 0;
  pointer-events:none;
}

.discordViewNodeUnreadBadge{
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:16px;
  height:16px;
  padding:0 5px;
  box-sizing:border-box;
  background:#f23f42;
  color:#fff;
  border-radius:8px;
  font-size:.75rem;
  font-weight:600;
  line-height:1;
  font-variant-numeric:tabular-nums;
  margin-left:auto;
}

.discordViewNode.isMuted{
  opacity:.78;
}

.discordViewNode:disabled{
  cursor:not-allowed;
  opacity:.62;
}

.discordViewNodeIcon{
  width:20px;
  display:inline-flex;
  justify-content:center;
  flex:0 0 20px;
  color:#80848e;
  font-weight:500;
  font-size:1.125rem;
  line-height:1;
}

.discordViewNodeName{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:500;
}

.discordViewNodeWrap{
  display:grid;
  gap:6px;
}

.discordViewNodeMain{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
  flex:1 1 auto;
}

.discordViewNodeMeta{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:0 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:rgba(231,234,242,.62);
  font-size:11px;
  font-weight:800;
  white-space:nowrap;
}

.discordViewVoiceMembers,
.discordViewVoiceMember{
  display:none;
}

.discordVoiceMemberCard{
  position:relative;
  width:100%;
  aspect-ratio:16 / 11;
  min-height:200px;
  border:0;
  background:rgba(0,0,0,.42);
  color:#fff;
  border-radius:8px;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  cursor:pointer;
  transition:box-shadow .15s ease, transform .15s ease;
  overflow:hidden;
}

.discordVoiceMemberCard::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(155deg, rgb(var(--voice-member-color-rgb, 88, 101, 242)) 0%, rgba(var(--voice-member-color-rgb, 88, 101, 242), .35) 100%);
  z-index:0;
  pointer-events:none;
}

.discordVoiceMemberCard::after{
  content:"";
  position:absolute;
  inset:0;
  background:radial-gradient(ellipse at center top, rgba(0,0,0,0) 0%, rgba(0,0,0,.35) 100%);
  z-index:1;
  pointer-events:none;
}

.discordVoiceMemberCard > *{
  position:relative;
  z-index:2;
}

.discordVoiceMemberCard:hover{
  transform:translateY(-1px);
  box-shadow:0 6px 18px rgba(0,0,0,.32);
}

.discordVoiceMemberCard.isSpeaking{
  box-shadow:0 0 0 2px #23a55a, 0 0 22px rgba(35, 165, 90, .4);
  animation:discordVoiceCardPulse 1.6s ease-in-out infinite;
}

@keyframes discordVoiceCardPulse{
  0%, 100%{ box-shadow:0 0 0 2px #23a55a, 0 0 14px rgba(35, 165, 90, .28); }
  50%{ box-shadow:0 0 0 2px #23a55a, 0 0 26px rgba(35, 165, 90, .55); }
}

.discordMicBridgePanel{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  margin-bottom:10px;
  flex-wrap:wrap;
}

.discordMicBridgePanel.isActive{
  border-color:rgba(35,165,90,.38);
  background:rgba(35,165,90,.06);
}

.discordMicBridgeHead{
  display:flex;
  flex-direction:column;
  gap:2px;
  flex:1 1 auto;
  min-width:0;
}

.discordMicBridgeTitle{
  font-weight:700;
  font-size:.95rem;
  line-height:1.2;
}

.discordMicBridgeSubtitle{
  color:rgba(231,234,242,.6);
  font-size:.8rem;
  line-height:1.25;
}

.discordMicBridgeActions{
  display:inline-flex;
  gap:8px;
  flex-shrink:0;
  align-items:center;
}

.discordMicBridgeActions .btn{
  margin:0;
}

.discordMicBridgeRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  width:100%;
}

.discordMicSettingsBtn{
  width:32px;
  height:32px;
  border:0;
  border-radius:50%;
  background:transparent;
  color:#b5bac1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  transition:background-color .12s ease, color .12s ease;
}

.discordMicSettingsBtn:hover{
  background:rgba(255,255,255,.06);
  color:#fff;
}

.discordMicSettingsBtn.isActive{
  background:rgba(88,101,242,.22);
  color:#fff;
}

.discordMicSettings{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.08);
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
}

.discordMicSettingsRow{
  display:flex;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.discordMicSettingsLabel{
  flex:0 0 140px;
  font-size:.78rem;
  font-weight:600;
  color:#b5bac1;
  text-transform:uppercase;
  letter-spacing:.02em;
  line-height:1.25;
}

.discordMicSettingsSelect{
  flex:1 1 200px;
  min-width:0;
  height:32px;
  padding:4px 10px;
  border:1px solid rgba(255,255,255,.10);
  background:#1e1f22;
  color:#dbdee1;
  font-family:inherit;
  font-size:.875rem;
  border-radius:6px;
  outline:none;
  cursor:pointer;
}

.discordMicSettingsSelect:focus{
  border-color:rgba(88,101,242,.6);
}

.discordMicSettingsSelect:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.discordMicSettingsSlider{
  flex:1 1 200px;
  height:22px;
  accent-color:#5865f2;
  cursor:pointer;
}

#discordAudioSettingsModal .modal-card{
  width:min(560px, calc(100vw - 32px));
  max-height:min(620px, calc(100vh - 40px));
  display:flex;
  flex-direction:column;
  background:#313338;
  color:#dbdee1;
  border-radius:8px;
  overflow:hidden;
}

#discordAudioSettingsModal .modal-head{
  padding:16px 20px;
  background:#2b2d31;
  border-bottom:1px solid rgba(0,0,0,.32);
  display:flex;
  align-items:center;
  justify-content:space-between;
}

#discordAudioSettingsModal .modal-head h2{
  margin:0;
  font-size:1rem;
  font-weight:600;
  color:#fff;
}

#discordAudioSettingsModal .modal-close{
  width:28px;
  height:28px;
  border:0;
  background:transparent;
  color:#b5bac1;
  font-size:20px;
  line-height:1;
  cursor:pointer;
  border-radius:4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

#discordAudioSettingsModal .modal-close:hover{
  color:#fff;
  background:rgba(255,255,255,.06);
}

#discordAudioSettingsModal .modal-body{
  padding:16px 20px 20px;
  overflow-y:auto;
  display:flex;
  flex-direction:column;
  gap:20px;
}

.discordAudioSettingsSection{
  display:flex;
  flex-direction:column;
  gap:12px;
  padding:16px;
  background:#2b2d31;
  border-radius:6px;
}

.discordAudioSettingsSectionTitle{
  font-size:.75rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.04em;
  color:#b5bac1;
  line-height:1;
}

.discordAudioSettingsField{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.discordAudioSettingsField > label{
  display:flex;
  justify-content:space-between;
  align-items:center;
  font-size:.8125rem;
  font-weight:500;
  color:#dbdee1;
  line-height:1.25;
}

.discordAudioSettingsValue{
  font-variant-numeric:tabular-nums;
  color:#b5bac1;
  font-size:.75rem;
}

.discordSelectWrap{
  position:relative;
  display:block;
}

.discordSelectWrap::after{
  content:"";
  position:absolute;
  right:12px;
  top:50%;
  width:8px;
  height:8px;
  border-right:2px solid #b5bac1;
  border-bottom:2px solid #b5bac1;
  transform:translateY(-70%) rotate(45deg);
  pointer-events:none;
}

.discordSelectWrap select{
  width:100%;
  appearance:none;
  -moz-appearance:none;
  height:38px;
  padding:0 36px 0 12px;
  border:0;
  background:#1e1f22;
  color:#dbdee1;
  font-family:inherit;
  font-size:.875rem;
  border-radius:4px;
  cursor:pointer;
  outline:none;
}

.discordSelectWrap select:focus{
  box-shadow:inset 0 0 0 1px #5865f2;
}

.discordSelectWrap select:disabled{
  opacity:.5;
  cursor:not-allowed;
}

.discordAudioSlider{
  width:100%;
  height:22px;
  accent-color:#5865f2;
  cursor:pointer;
}

.discordAudioModeToggle{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.discordAudioModeBtn{
  display:flex;
  align-items:center;
  gap:10px;
  padding:12px;
  background:#1e1f22;
  color:#dbdee1;
  border:1px solid transparent;
  border-radius:6px;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
  transition:border-color .12s ease, background-color .12s ease;
}

.discordAudioModeBtn:hover{
  background:#232428;
  border-color:rgba(255,255,255,.08);
}

.discordAudioModeBtn.isActive{
  background:rgba(88,101,242,.14);
  border-color:#5865f2;
}

.discordAudioModeIcon{
  flex-shrink:0;
  width:36px;
  height:36px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.06);
  color:#b5bac1;
}

.discordAudioModeBtn.isActive .discordAudioModeIcon{
  background:#5865f2;
  color:#fff;
}

.discordAudioModeLabel{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.discordAudioModeName{
  font-size:.875rem;
  font-weight:600;
  color:#f2f3f5;
}

.discordAudioModeHint{
  font-size:.75rem;
  color:#949ba4;
  line-height:1.3;
}

.discordVoiceMemberCard.isContextTarget{
  box-shadow:0 0 0 2px rgba(var(--accent-rgb), .6);
}

.discordViewVoiceMemberAvatar{
  width:30px;
  height:30px;
  border-radius:50%;
  overflow:hidden;
  flex:0 0 auto;
  background:rgba(255,255,255,.06);
  display:grid;
  place-items:center;
  transition:box-shadow .15s ease;
}

.discordVoiceMemberCardAvatar{
  width:88px;
  height:88px;
  border-radius:50%;
  overflow:hidden;
  flex:0 0 auto;
  background:rgba(0,0,0,.3);
  display:grid;
  place-items:center;
  transition:box-shadow .18s ease, transform .18s ease;
  position:relative;
  z-index:2;
}

.discordViewVoiceMember.isSpeaking .discordViewVoiceMemberAvatar{
  box-shadow:0 0 0 3px #23a55a;
}

.discordVoiceMemberCard.isSpeaking .discordVoiceMemberCardAvatar{
  box-shadow:0 0 0 3px #23a55a, 0 0 20px rgba(35, 165, 90, .5);
  animation:discordVoiceAvatarPulse 1.6s ease-in-out infinite;
}

@keyframes discordVoiceAvatarPulse{
  0%, 100%{ transform:scale(1); }
  50%{ transform:scale(1.04); }
}

.discordVoiceMemberCardAvatar .discordViewVoiceMemberAvatarFallback{
  font-size:2rem;
  color:#fff;
}

.discordViewVoiceMemberAvatar img,
.discordVoiceMemberCardAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.discordViewVoiceMemberAvatarFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-weight:900;
  color:rgba(231,234,242,.72);
}

.discordViewVoiceMemberMeta{
  min-width:0;
  display:grid;
  gap:4px;
  flex:1 1 auto;
}

.discordVoiceMemberCardMeta{
  position:absolute;
  bottom:10px;
  left:50%;
  transform:translateX(-50%);
  max-width:calc(100% - 20px);
  min-width:0;
  display:inline-flex;
  align-items:center;
  gap:6px;
  z-index:3;
}

.discordViewVoiceMemberName{
  font-weight:800;
  line-height:1.1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordVoiceMemberCardName{
  font-weight:600;
  font-size:.9375rem;
  line-height:1.2;
  color:#fff;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  padding:4px 10px;
  background:rgba(0,0,0,.62);
  border-radius:4px;
  backdrop-filter:blur(6px);
  max-width:100%;
}

.discordVoiceStateBadges{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.discordVoiceMemberCard .discordVoiceStateBadges{
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;
}

.discordVoiceMemberCard .discordVoiceStateIcon{
  width:28px;
  height:28px;
  background:rgba(0,0,0,.58);
  backdrop-filter:blur(4px);
  color:#fff;
  border-radius:6px;
}

.discordVoiceMemberCard .discordVoiceStateIcon.isMuted{
  background:#f23f42;
  color:#fff;
}

.discordVoiceMemberCard .discordVoiceStateIcon.isDeafened{
  background:#f23f42;
  color:#fff;
}

.discordVoiceMemberCard .discordVoiceStateIcon svg{
  width:14px;
  height:14px;
}

.discordVoiceStateBadge{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:0 7px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:rgba(231,234,242,.68);
  font-size:11px;
  font-weight:800;
  line-height:1;
}

.discordVoiceStateBadge.isBot{
  color:rgba(88,101,242,.95);
  background:rgba(88,101,242,.12);
  border-color:rgba(88,101,242,.28);
}

.discordVoiceStateIcon{
  display:inline-grid;
  place-items:center;
  width:22px;
  height:22px;
  border-radius:6px;
  color:rgba(231,234,242,.55);
  background:transparent;
  flex:0 0 auto;
}

.discordVoiceStateIcon svg{
  width:16px;
  height:16px;
  display:block;
}

.discordVoiceStateIcon.isMuted{
  color:#f04747;
}

.discordVoiceStateIcon.isMuted.isServer{
  color:#fff;
  background:#f04747;
}

.discordVoiceStateIcon.isDeafened{
  color:#f04747;
}

.discordVoiceStateIcon.isDeafened.isServer{
  color:#fff;
  background:#f04747;
}

.discordVoiceStateIcon.isStreaming{
  color:#a368ff;
}

.discordVoiceStateIcon.isVideo{
  color:#43b581;
}

.discordVoiceStateIcon.isSuppressed{
  color:rgba(231,234,242,.48);
}

.discordBotControlBar{
  flex:0 0 auto;
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(32,34,37,.65);
  box-sizing:border-box;
  min-width:0;
}

.discordBotControlProfile{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.discordBotControlAvatar{
  flex:0 0 auto;
  width:32px;
  height:32px;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,.05);
  display:grid;
  place-items:center;
  font-weight:900;
  color:rgba(231,234,242,.72);
  font-size:.8rem;
}

.discordBotControlAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.discordBotControlMeta{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  line-height:1.1;
  overflow:hidden;
}

.discordBotControlName{
  font-weight:900;
  font-size:.88rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordBotControlStatus{
  font-size:.72rem;
  font-weight:700;
  color:rgba(67,181,129,.95);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-top:2px;
}

.discordBotControlStatus.isVoice{
  color:rgba(88,101,242,.95);
}

.discordBotControlActions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:2px;
}

.discordBotControlBtn{
  width:32px;
  height:32px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:rgba(231,234,242,.82);
  cursor:pointer;
  display:grid;
  place-items:center;
  transition:background .12s ease, color .12s ease, transform .12s ease;
}

.discordBotControlBtn:hover:not(:disabled){
  background:rgba(255,255,255,.08);
  color:#fff;
}

.discordBotControlBtn:active:not(:disabled){
  transform:scale(.92);
}

.discordBotControlBtn.isActive{
  color:#f04747;
}

.discordBotControlBtn.isActive:hover{
  background:rgba(240,71,71,.12);
}

.discordBotControlBtn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

@media (max-width: 760px){
  .discordBotControlBar{
    padding:6px 8px;
  }

  .discordBotControlBtn{
    width:30px;
    height:30px;
  }

  .discordBotControlAvatar{
    width:28px;
    height:28px;
  }
}

.discordBotControlBar{
  flex:0 0 auto;
  margin-top:10px;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(32,34,37,.65);
}

.discordBotControlProfile{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.discordBotControlAvatar{
  flex:0 0 auto;
  width:32px;
  height:32px;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,.05);
  display:grid;
  place-items:center;
  font-weight:900;
  color:rgba(231,234,242,.72);
  font-size:.8rem;
}

.discordBotControlAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.discordBotControlMeta{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  line-height:1.1;
}

.discordBotControlName{
  font-weight:900;
  font-size:.88rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordBotControlStatus{
  font-size:.72rem;
  font-weight:700;
  color:rgba(67,181,129,.95);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  margin-top:2px;
}

.discordBotControlStatus.isVoice{
  color:rgba(88,101,242,.95);
}

.discordBotControlActions{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:2px;
}

.discordBotControlBtn{
  width:32px;
  height:32px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:rgba(231,234,242,.82);
  cursor:pointer;
  display:grid;
  place-items:center;
  transition:background .12s ease, color .12s ease, transform .12s ease;
}

.discordBotControlBtn:hover{
  background:rgba(255,255,255,.08);
  color:#fff;
}

.discordBotControlBtn:active{
  transform:scale(.92);
}

.discordBotControlBtn.isActive{
  color:#f04747;
}

.discordBotControlBtn.isActive:hover{
  background:rgba(240,71,71,.12);
}

.discordBotSettingsCard{
  width:min(560px, calc(100vw - 32px));
  max-height:calc(100dvh - 150px);
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.discordBotSettingsHead{
  padding-right:34px;
}

.discordBotSettingsTitle{
  font-size:18px;
  font-weight:900;
  line-height:1.1;
}

.discordBotSettingsSubtitle{
  color:rgba(231,234,242,.62);
  font-size:.92rem;
  margin-top:4px;
}

.discordBotSettingsCloseBtn{
  position:absolute;
  top:12px;
  right:12px;
}

.discordBotSettingsBody{
  display:flex;
  flex-direction:column;
  gap:16px;
  overflow:auto;
  padding-right:4px;
  scrollbar-gutter:stable;
}

.discordBotSettingsSection{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:12px 14px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}

.discordBotSettingsSectionTitle{
  font-size:.74rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(231,234,242,.58);
}

.discordBotSettingsRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  min-width:0;
}

.discordBotSettingsLabel{
  flex:1 1 auto;
  min-width:0;
  font-weight:700;
}

.discordBotSettingsRow .selectWrap{
  flex:0 0 auto;
  min-width:200px;
}

.discordBotSettingsRow select{
  min-width:200px;
}

.discordBotSettingsHint{
  font-size:.82rem;
  color:rgba(231,234,242,.55);
  line-height:1.4;
}

.discordBotSettingsToggle{
  position:relative;
  width:42px;
  height:24px;
  flex:0 0 auto;
  cursor:pointer;
}

.discordBotSettingsToggle input{
  position:absolute;
  inset:0;
  opacity:0;
  cursor:pointer;
}

.discordBotSettingsToggleSlider{
  position:absolute;
  inset:0;
  border-radius:999px;
  background:rgba(255,255,255,.14);
  transition:background .15s ease;
}

.discordBotSettingsToggleSlider::after{
  content:"";
  position:absolute;
  top:3px;
  left:3px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:#fff;
  transition:transform .15s ease;
}

.discordBotSettingsToggle input:checked + .discordBotSettingsToggleSlider{
  background:rgba(var(--accent-rgb), .85);
}

.discordBotSettingsToggle input:checked + .discordBotSettingsToggleSlider::after{
  transform:translateX(18px);
}

.discordBotSettingsConnection{
  font-size:.9rem;
  color:rgba(231,234,242,.78);
}

.discordViewMessageAuthorPin{
  display:inline-flex;
  align-items:center;
  gap:3px;
  font-size:11px;
  font-weight:800;
  color:rgba(231,234,242,.55);
  margin-left:4px;
}

.discordViewReplyRef{
  display:flex;
  align-items:center;
  gap:6px;
  margin-bottom:2px;
  padding-left:2px;
  font-size:.82rem;
  color:rgba(231,234,242,.66);
  cursor:pointer;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordViewReplyRef:hover{
  color:#fff;
}

.discordViewReplyRefArrow{
  flex:0 0 auto;
  color:rgba(231,234,242,.48);
  font-size:13px;
}

.discordViewReplyRefAvatar{
  flex:0 0 auto;
  width:16px;
  height:16px;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,.05);
}

.discordViewReplyRefAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.discordViewReplyRefName{
  flex:0 0 auto;
  font-weight:800;
  color:rgba(231,234,242,.9);
}

.discordViewReplyRefText{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordPollCard{
  margin-top:4px;
  padding:14px 16px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  max-width:520px;
  display:flex;
  flex-direction:column;
  gap:10px;
}

.discordPollHeader{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
}

.discordPollIcon{
  color:rgba(var(--accent-rgb), 1);
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.discordPollQuestion{
  font-size:1rem;
  font-weight:900;
  line-height:1.35;
  color:#fff;
}

.discordPollMulti{
  font-size:.72rem;
  font-weight:800;
  color:rgba(231,234,242,.55);
  padding:1px 7px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
}

.discordPollAnswersList{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.discordPollAnswerRow{
  position:relative;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
  overflow:hidden;
}

.discordPollAnswerBar{
  position:absolute;
  inset:0 auto 0 0;
  background:rgba(var(--accent-rgb), .18);
  transition:width .3s ease;
  z-index:0;
}

.discordPollAnswerContent{
  position:relative;
  z-index:1;
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.discordPollAnswerEmoji{
  flex:0 0 auto;
  font-size:1.05rem;
  line-height:1;
}

.discordPollAnswerText{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:700;
}

.discordPollAnswerVotes{
  flex:0 0 auto;
  font-size:.82rem;
  font-weight:800;
  color:rgba(231,234,242,.72);
  white-space:nowrap;
}

.discordPollFooterLine{
  font-size:.78rem;
  color:rgba(231,234,242,.52);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  flex-wrap:wrap;
}

.discordPollTotalVotes{
  font-weight:700;
}

.discordPollExpires{
  font-weight:700;
}

.discordPollExpires.isEnded{
  color:rgba(240,71,71,.85);
}

.discordBotAudioPanel{
  display:flex;
  flex-direction:column;
  gap:8px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(var(--accent-rgb), .22);
  background:rgba(var(--accent-rgb), .06);
  margin-top:10px;
}

.discordBotAudioHead{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.discordBotAudioTitle{
  font-size:.78rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(var(--accent-rgb), 1);
  flex:0 0 auto;
}

.discordBotAudioNow{
  display:inline-flex;
  align-items:center;
  gap:6px;
  flex:1 1 auto;
  min-width:0;
  font-size:.86rem;
  color:rgba(231,234,242,.85);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordBotAudioNowDot{
  flex:0 0 auto;
  width:8px;
  height:8px;
  border-radius:50%;
  background:#43b581;
  box-shadow:0 0 6px rgba(67,181,129,.6);
  animation:discordBotAudioPulse 1.4s ease-in-out infinite;
}

@keyframes discordBotAudioPulse{
  0%,100%{ opacity:1; transform:scale(1); }
  50%{ opacity:.55; transform:scale(1.25); }
}

.discordBotAudioRow{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

#discordBotAudioTtsInput{
  flex:1 1 220px;
  min-width:160px;
  height:36px;
  padding:0 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-family:inherit;
  font-size:.92rem;
  outline:none;
  transition:border-color .12s ease, background .12s ease;
}

#discordBotAudioTtsInput:focus,
#discordBotAudioTtsInput:focus-visible{
  border-color:rgba(var(--accent-rgb), .38);
  background:rgba(255,255,255,.06);
  box-shadow:none;
}

#discordBotAudioTtsInput:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.discordBotAudioLangWrap{
  flex:0 0 auto;
  min-width:72px;
}

.discordBotAudioLangWrap select{
  min-width:72px;
  height:36px;
}

.discordBotAudioTtsBtn,
.discordBotAudioFileBtn,
.discordBotAudioStopBtn{
  flex:0 0 auto;
  min-height:36px;
  padding:0 14px;
}

.discordBotAudioFileBtn{
  flex:1 1 auto;
}

.discordViewChannelHeadRow{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.discordViewChannelHeadMain{
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:6px;
}

.discordVoicePanel{
  display:grid;
  gap:12px;
}

.discordVoicePanelHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.discordVoicePanelTitle{
  font-size:16px;
  font-weight:900;
  line-height:1.1;
}

.discordVoicePanelMeta{
  color:rgba(231,234,242,.62);
  font-size:12px;
  font-weight:800;
}

.discordVoiceMemberCards{
  display:grid;
  grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
  gap:8px;
  padding:8px;
  align-content:start;
}

.discordVoiceMemberCards:has(> :nth-child(1):last-child){
  grid-template-columns:minmax(320px, 640px);
  justify-content:center;
  padding:24px;
}

.discordVoiceMemberCards:has(> :nth-child(1):last-child) .discordVoiceMemberCard{
  aspect-ratio:16 / 10;
  min-height:340px;
}

.discordVoiceMemberCards:has(> :nth-child(2):last-child){
  grid-template-columns:repeat(2, minmax(280px, 1fr));
  padding:16px;
}

.discordVoiceMemberCards:has(> :nth-child(2):last-child) .discordVoiceMemberCard{
  min-height:260px;
}

.discordVoiceMemberCards:has(> :nth-child(3):last-child),
.discordVoiceMemberCards:has(> :nth-child(4):last-child){
  grid-template-columns:repeat(2, minmax(280px, 1fr));
}

@media (max-width: 1100px){
  .discordVoiceMemberCards{
    grid-template-columns:repeat(auto-fill, minmax(260px, 1fr));
  }
}

@media (max-width: 720px){
  .discordVoiceMemberCards,
  .discordVoiceMemberCards:has(> :nth-child(1):last-child),
  .discordVoiceMemberCards:has(> :nth-child(2):last-child){
    grid-template-columns:1fr;
  }
}

@media (max-width: 860px){
  .discordViewChannelHeadRow,
  .discordVoicePanelHead{
    flex-direction:column;
  }

  .discordViewChannelHeadActions{
    width:100%;
    justify-content:flex-start;
  }
}

.discordViewChannelHead{
  border:0;
  border-bottom:1px solid rgba(0,0,0,.3);
  background:#313338;
  border-radius:0;
  padding:0 16px;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:48px;
  flex:0 0 auto;
  box-shadow:0 1px 0 rgba(4,4,5,.2), 0 1.5px 0 rgba(6,6,7,.05), 0 2px 0 rgba(4,4,5,.05);
}

.discordViewChannelHead:has(.discordViewChannelTopic){
  padding:0 16px;
  gap:8px;
}

.discordViewChannelTitle{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:1rem;
  font-weight:600;
  line-height:1.25;
  color:#fff;
  flex:0 0 auto;
}

.discordViewChannelTitle::before{
  content:"#";
  color:#80848e;
  font-size:1.5rem;
  font-weight:500;
  line-height:1;
  margin-right:2px;
}

.discordViewChannelTopic{
  color:#b5bac1;
  line-height:1.25;
  font-size:.875rem;
  border-left:1px solid #3f4147;
  padding-left:8px;
  margin-left:4px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  flex:1 1 auto;
  min-width:0;
}

.discordViewChannelHeadActions .btn{
  background:transparent;
  border:0;
  color:#b5bac1;
  padding:6px 10px;
  height:32px;
  font-size:.875rem;
  border-radius:4px;
}

.discordViewChannelHeadActions .btn:hover{
  background:#35373c;
  color:#dbdee1;
}

.discordViewTopbarServer{
  color:#dbdee1;
  font-weight:600;
}

.discordViewTopbarSep{
  color:#80848e;
  margin:0 8px;
  font-weight:400;
}

.discordViewTopbarChannel{
  color:#fff;
  font-weight:600;
  display:inline-flex;
  align-items:center;
  gap:4px;
}

.discordViewTopbarChannelIcon{
  color:#80848e;
  font-size:1.1em;
  font-weight:400;
  margin-right:2px;
}

.discordViewMessage{
  display:grid;
  grid-template-columns:40px minmax(0,1fr);
  gap:16px;
  align-items:start;
  padding:2px 48px 2px 16px;
  border:none;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  font-size:1rem;
  line-height:1.375;
  color:#dbdee1;
}

.discordViewMessage.isGrouped{
  padding-top:0;
}

.discordViewMessage.isGrouped .discordViewMsgAvatar{
  background:transparent;
  border-radius:0;
  overflow:visible;
  width:40px;
  height:auto;
  display:flex;
  justify-content:flex-end;
  align-items:flex-start;
  padding-top:3px;
  place-items:initial;
}

.discordViewMessageHoverTime{
  font-size:.6875rem;
  font-weight:500;
  line-height:1.375;
  color:#949ba4;
  opacity:0;
  width:40px;
  text-align:right;
  padding-right:4px;
  font-variant-numeric:tabular-nums;
  transition:opacity .1s ease;
}

.discordViewMessage:hover .discordViewMessageHoverTime{
  opacity:1;
}

.discordViewMessage.isGrouped .discordViewMessageTop{
  display:none;
}

.discordViewMessage.isGrouped .discordViewMessageBody{
  padding-top:0;
}

.discordViewMessage + .discordViewMessage{
  margin-top:17px;
}

.discordViewMessage + .discordViewMessage.isGrouped{
  margin-top:0;
}

.discordViewMessage:hover{
  background:rgba(4,4,5,.07);
}

.discordViewMessage.isHighlighted{
  background:rgba(var(--accent-rgb), .10);
  box-shadow:inset 2px 0 0 rgba(var(--accent-rgb), .55);
}

.discordViewMessage:last-child{
  margin-bottom:0;
}

.discordViewMessage.isContextTarget{
  background:rgba(255,255,255,.06);
}

.discordViewMsgAvatar{
  width:40px;
  height:40px;
  border-radius:50%;
  overflow:hidden;
  border:none;
  background:rgba(255,255,255,.05);
  display:grid;
  place-items:center;
  margin-top:2px;
}

.discordViewMsgAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.discordViewMsgAvatarFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-weight:600;
  font-size:.875rem;
  color:rgba(231,234,242,.72);
}

.discordViewMessageBody{
  min-width:0;
  display:grid;
  gap:4px;
  padding:0;
}

.discordViewMessageTop{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  min-height:1.375rem;
  margin-bottom:2px;
}

.discordViewMessageAuthor{
  font-weight:500;
  font-size:1rem;
  line-height:1.375;
  color:#f2f3f5;
}

.discordViewMessageTime{
  font-size:.75rem;
  line-height:1.375;
  color:#949ba4;
}

.discordViewMessageText{
  min-width:0;
  font-size:1rem;
  line-height:1.375;
  color:#dbdee1;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordViewMessageText:empty{
  display:none;
}

.discordViewAttachments{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.discordViewAttachment{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:var(--text);
  text-decoration:none;
  max-width:100%;
}

.discordViewAttachment:hover{
  background:rgba(255,255,255,.07);
}

.discordViewEmpty{
  color:rgba(231,234,242,.60);
  line-height:1.5;
}

.discordMention{
  display:inline;
  padding:0 2px;
  border-radius:3px;
  font-weight:500;
  line-height:1.375;
  vertical-align:baseline;
  margin:0;
  border:0;
  cursor:pointer;
  transition:background-color .1s ease;
  font-family:inherit;
  font-size:inherit;
}

.discordMentionUser,
.discordMentionChannel{
  background:rgba(88,101,242,.15);
  color:#c9cdfb;
}

.discordMentionUser:hover,
.discordMentionChannel:hover{
  background:rgba(88,101,242,.3);
  color:#dee0fc;
}

.discordMentionRole{
  background:color-mix(in srgb, var(--mention-role, #5865f2) 15%, transparent);
  color:var(--mention-role, #c9cdfb);
}

.discordMentionRole:hover{
  background:color-mix(in srgb, var(--mention-role, #5865f2) 30%, transparent);
}

.discordEmbedDescription .discordMention,
.discordEmbedFieldValue .discordMention,
.discordEmbedFooter .discordMention{
  font-size:inherit;
}

.discordEmbedList{
  display:grid;
  gap:4px;
  justify-items:start;
}

.discordEmbed{
  width:min(100%, 520px);
  max-width:520px;
  border:0;
  border-left:4px solid var(--embed-accent, #5865f2);
  border-radius:4px;
  background:#2b2d31;
  padding:8px 16px 16px 12px;
  display:grid;
  gap:8px;
  box-sizing:border-box;
}

.discordEmbedTop{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  align-items:start;
}

.discordEmbedMediaRow{
  display:block;
  width:100%;
  min-width:0;
}

.discordEmbedMediaLink,
.discordEmbedMediaWrap{
  display:block;
  width:100%;
}

.discordEmbedMediaImage,
.discordEmbedMediaVideo{
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:420px;
  margin:0 auto;
  border-radius:4px;
  object-fit:contain;
}

.discordEmbedMain{
  min-width:0;
  display:grid;
  gap:8px;
}

.discordEmbedAuthor{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.875rem;
  font-weight:600;
  line-height:1.375;
  color:#f2f3f5;
}

.discordEmbedAuthor img{
  width:24px;
  height:24px;
  border-radius:50%;
  object-fit:cover;
}

.discordEmbedFooter img{
  width:20px;
  height:20px;
  border-radius:50%;
  object-fit:cover;
}

.discordEmbedAuthor a,
.discordEmbedTitle a{
  color:inherit;
  text-decoration:none;
}

.discordEmbedAuthor a:hover,
.discordEmbedTitle a:hover{
  text-decoration:underline;
}

.discordEmbedTitle{
  margin:0;
  padding:0;
  text-indent:0;
  font-size:1rem;
  font-weight:600;
  line-height:1.375;
  color:#fff;
  white-space:pre-wrap;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordEmbedDescription{
  font-size:.875rem;
  line-height:1.375;
  color:#dbdee1;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordEmbedFields{
  display:grid;
  grid-template-columns:repeat(12, minmax(0, 1fr));
  gap:8px 12px;
}

.discordEmbedField{
  grid-column:1 / -1;
  min-width:0;
}

.discordEmbedField.isInline{
  grid-column:span 4;
}

.discordEmbedFieldName{
  font-size:.875rem;
  font-weight:600;
  line-height:1.375;
  color:#f2f3f5;
  margin-bottom:2px;
}

.discordEmbedFieldValue{
  font-size:.875rem;
  line-height:1.375;
  color:#dbdee1;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordEmbedThumb{
  width:80px;
  align-self:start;
}

.discordEmbedThumb img{
  width:80px;
  height:80px;
  border-radius:4px;
  object-fit:cover;
  display:block;
}

.discordEmbedImage{
  display:block;
  max-width:100%;
}

.discordEmbedImage img{
  display:block;
  max-width:100%;
  max-height:300px;
  border-radius:4px;
  object-fit:contain;
}

.discordEmbedFooter{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:.75rem;
  line-height:1.375;
  color:#949ba4;
  margin-top:0;
}

.discordViewInlineImages{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}

.discordViewInlineImage img{
  display:block;
  width:auto;
  height:auto;
  max-width:min(520px, 100%);
  max-height:350px;
  object-fit:contain;
  background:#0f1117;
}

.discordViewInlineImage{
  display:block;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
}

.discordSearchResults{
  display:grid;
  gap:10px;
}

.discordSearchResult{
  width:100%;
  text-align:left;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  border-radius:14px;
  padding:12px 14px;
  color:var(--text);
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}

.discordSearchResult:hover{
  background:rgba(255,255,255,.05);
  border-color:rgba(255,255,255,.12);
}

.discordSearchResultTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  margin-bottom:6px;
}

.discordSearchChannel{
  font-weight:900;
  color:#c9cdfb;
}

.discordSearchTime{
  font-size:12px;
  color:rgba(231,234,242,.56);
}

.discordSearchAuthor{
  font-weight:800;
  margin-bottom:4px;
}

.discordSearchSnippet{
  color:rgba(231,234,242,.82);
  line-height:1.45;
  word-break:break-word;
  overflow-wrap:anywhere;
}

@media (max-width: 1100px){
  .discordViewHeaderActions{
    width:100%;
    justify-content:stretch;
    flex-wrap:wrap;
  }

  .discordViewSearchGroup{
    flex:1 1 100%;
    min-width:0;
  }

  .discordEmbedTop{
    grid-template-columns:1fr;
  }

  .discordEmbedThumb{
    width:100%;
  }

  .discordEmbedThumb img{
    width:84px;
    height:84px;
  }
}

.discordMdLine{
  line-height:1.55;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordMdLine + .discordMdLine,
.discordMdH2 + .discordMdLine,
.discordMdLine + .discordMdH2,
.discordMdH2 + .discordMdH2{
  margin-top:2px;
}

.discordMdH2{
  font-size:1.12rem;
  font-weight:900;
  line-height:1.35;
  margin-top:2px;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordUnderline{
  text-decoration:underline;
  text-underline-offset:2px;
}

.discordInlineCode{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size:.92em;
  padding:2px 6px;
  border-radius:6px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
}

.discordSearchActions{
  display:flex;
  justify-content:flex-end;
  margin-top:10px;
}

.discordSearchSnippet{
  margin-top:4px;
}

.discordViewMessagesWrap{
  position:relative;
  flex:1 1 auto;
  min-height:0;
  display:flex;
  flex-direction:column;
}

.discordViewMessagesWrap > .discordViewMessages{
  flex:1 1 auto;
  min-height:0;
}

.discordViewScrollBottomBtn{
  position:absolute;
  right:16px;
  bottom:12px;
  width:44px;
  height:44px;
  border:0;
  border-radius:50%;
  background:#2b2d31;
  color:#dbdee1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  box-shadow:0 2px 8px rgba(0,0,0,.4), 0 0 0 1px rgba(0,0,0,.2);
  transition:background-color .12s ease, color .12s ease, transform .12s ease;
  z-index:20;
}

.discordViewScrollBottomBtn:hover{
  background:#35373c;
  color:#fff;
  transform:translateY(-1px);
}

.discordViewScrollBottomBtn:active{
  transform:translateY(0);
}

.discordViewScrollBottomBtn.hasUnread{
  background:#5865f2;
  color:#fff;
}

.discordViewScrollBottomBtn.hasUnread:hover{
  background:#4752c4;
  color:#fff;
}

.discordViewScrollBottomBadge{
  position:absolute;
  top:-4px;
  right:-4px;
  min-width:20px;
  height:20px;
  padding:0 6px;
  box-sizing:border-box;
  background:#f23f42;
  color:#fff;
  border:2px solid #313338;
  border-radius:10px;
  font-size:.75rem;
  font-weight:600;
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-variant-numeric:tabular-nums;
  pointer-events:none;
}

.discordMdH1,
.discordMdH2,
.discordMdH3,
.discordMdH4,
.discordMdH5,
.discordMdH6{
  font-weight:900;
  line-height:1.28;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordMdH1{ font-size:1.55rem; margin:4px 0 2px; }
.discordMdH2{ font-size:1.35rem; margin:4px 0 2px; }
.discordMdH3{ font-size:1.2rem; margin:4px 0 2px; }
.discordMdH4{ font-size:1.08rem; margin:4px 0 2px; }
.discordMdH5{ font-size:1rem; margin:4px 0 2px; }
.discordMdH6{ font-size:.94rem; margin:4px 0 2px; color:rgba(231,234,242,.78); }

.discordMdLine{
  line-height:1.55;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordMdSpacer{
  height:10px;
}

.discordMdQuote{
  border-left:4px solid rgba(255,255,255,.18);
  padding-left:12px;
  color:rgba(231,234,242,.86);
  line-height:1.55;
}

.discordMdList{
  margin:2px 0 2px 20px;
  padding:0;
  display:grid;
  gap:4px;
}

.discordMdList li{
  line-height:1.55;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordUnderline{
  text-decoration:underline;
  text-underline-offset:2px;
}

.discordStrike{
  text-decoration:line-through;
}

.discordInlineCode{
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size:.92em;
  padding:2px 6px;
  border-radius:6px;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
}

.discordCodeBlock{
  margin:6px 0 2px;
  padding:12px 14px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
  background:#11141a;
  overflow:auto;
}

.discordCodeBlock code{
  display:block;
  white-space:pre-wrap;
  word-break:break-word;
  overflow-wrap:anywhere;
  font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size:.93em;
  line-height:1.5;
}

.discordAnsiBlock{
  background:#101318;
}

.discordSpoiler{
  display:inline-flex;
  align-items:center;
  min-height:22px;
  padding:0 4px;
  border:none;
  border-radius:4px;
  background:rgba(0,0,0,.5);
  color:transparent;
  cursor:pointer;
  vertical-align:baseline;
}

.discordSpoiler .discordSpoilerInner{
  color:transparent;
  user-select:none;
}

.discordSpoiler:not(.isRevealed) *{
  pointer-events:none;
  color:transparent !important;
  background:transparent !important;
  border-color:transparent !important;
  box-shadow:none !important;
}

.discordSpoiler.isRevealed{
  background:rgba(255,255,255,.08);
  color:var(--text);
}

.discordSpoiler.isRevealed .discordSpoilerInner{
  color:var(--text);
  user-select:text;
}

.discordSpoiler.isRevealed .discordMentionUser,
.discordSpoiler.isRevealed .discordMentionChannel{
  background:rgba(88,101,242,.18) !important;
  color:#c9cdfb !important;
}

.discordSpoiler.isRevealed .discordMentionRole{
  background:color-mix(in srgb, var(--mention-role, #5865f2) 18%, transparent) !important;
  color:var(--mention-role, #c9cdfb) !important;
}

.discordViewCategoryBtn{
  width:100%;
  border:0;
  background:transparent;
  color:#949ba4;
  display:flex;
  align-items:center;
  gap:4px;
  padding:16px 8px 4px;
  border-radius:0;
  cursor:pointer;
  text-align:left;
  font-size:.75rem;
  font-weight:600;
  letter-spacing:.02em;
  text-transform:uppercase;
  line-height:1.25;
}

.discordViewCategoryBtn:hover{
  color:#dbdee1;
  background:transparent;
}

.discordViewCategoryArrow{
  display:inline-flex;
  width:12px;
  justify-content:center;
  transition:transform .15s ease;
  color:currentColor;
  font-size:.75rem;
}

.discordViewCategoryBtn.isCollapsed .discordViewCategoryArrow{
  transform:rotate(-90deg);
}

.discordViewCategoryBtn .discordViewGroupTitle{
  padding:0;
  color:inherit;
}

.discordMdSubtext{
  font-size:.78rem;
  line-height:1.35;
  color:rgba(231,234,242,.58);
  margin-top:2px;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordViewInlineImages,
.discordViewInlineVideos,
.discordViewInlineAudios{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}

.discordViewInlineImage,
.discordViewInlineVideoWrap,
.discordViewInlineAudioWrap{
  display:inline-flex;
  align-items:flex-start;
  justify-content:flex-start;
  border-radius:14px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  max-width:min(520px, 100%);
}

.discordViewInlineImage img,
.discordViewInlineVideo{
  display:block;
  width:auto;
  height:auto;
  max-width:min(520px, 100%);
  max-height:350px;
  object-fit:contain;
  background:#0f1117;
}

.discordViewInlineVideo{
  width:min(520px, 100%);
  height:auto;
}

.discordViewInlineAudioWrap{
  padding:10px 12px;
}

.discordViewInlineAudio{
  width:min(420px, calc(100vw - 120px));
  max-width:100%;
}

.discordMessageLink{
  color:#00a8fc;
  text-decoration:none;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.discordMessageLink:hover{
  text-decoration:underline;
}

.discordMessageJumpLink{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:3px 10px;
  border:1px solid rgba(88,101,242,.35);
  background:rgba(88,101,242,.14);
  color:#c9d8ff;
  border-radius:10px;
  font-size:.88rem;
  font-weight:700;
  cursor:pointer;
  vertical-align:middle;
  line-height:1.25;
  transition:background .12s ease, border-color .12s ease, color .12s ease, transform .12s ease;
  text-decoration:none;
  font-family:inherit;
}

.discordMessageJumpLink.isInternal{
  border-color:rgba(var(--accent-rgb), .38);
  background:rgba(var(--accent-rgb), .15);
}

.discordMessageJumpLink:hover{
  background:rgba(88,101,242,.24);
  border-color:rgba(88,101,242,.55);
  color:#fff;
}

.discordMessageJumpLink.isInternal:hover{
  background:rgba(var(--accent-rgb), .26);
  border-color:rgba(var(--accent-rgb), .55);
}

.discordMessageJumpLink:active{
  transform:scale(.96);
}

.discordMessageJumpIcon{
  font-size:14px;
  opacity:.85;
  flex:0 0 auto;
}

.discordMessageJumpLabel{
  white-space:nowrap;
}

.discordLinkPreview{
  display:flex;
  flex-direction:column;
  gap:6px;
  max-width:min(440px, 100%);
  margin-top:6px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  border-left:3px solid rgba(var(--accent-rgb), .55);
  border-radius:8px;
  cursor:pointer;
  transition:background .12s ease, border-color .12s ease, transform .12s ease;
}

.discordLinkPreview:hover{
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.14);
  border-left-color:rgba(var(--accent-rgb), .85);
}

.discordLinkPreview:active{
  transform:scale(.995);
}

.discordLinkPreviewHead{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.discordLinkPreviewAvatar{
  width:24px;
  height:24px;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,.1);
  flex:0 0 auto;
  display:grid;
  place-items:center;
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,.75);
}

.discordLinkPreviewAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.discordLinkPreviewAuthor{
  font-weight:800;
  font-size:.92rem;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  flex:0 1 auto;
  min-width:0;
  color:#fff;
}

.discordLinkPreviewChannel{
  font-size:.78rem;
  font-weight:700;
  color:rgba(var(--accent-rgb), .85);
  background:rgba(var(--accent-rgb), .12);
  padding:1px 8px;
  border-radius:999px;
  white-space:nowrap;
  flex:0 0 auto;
  margin-left:auto;
}

.discordLinkPreviewBody{
  font-size:.9rem;
  line-height:1.35;
  color:rgba(231,234,242,.9);
  word-break:break-word;
  display:-webkit-box;
  -webkit-line-clamp:3;
  line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}

.discordLinkPreviewImg{
  margin-top:2px;
  border-radius:6px;
  overflow:hidden;
  max-width:100%;
  max-height:180px;
  line-height:0;
}

.discordLinkPreviewImg img{
  display:block;
  width:100%;
  height:auto;
  max-height:180px;
  object-fit:cover;
}

.discordLinkPreviewHint{
  font-size:.82rem;
  font-style:italic;
  color:rgba(231,234,242,.6);
}

.discordSearchResults{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding:4px 2px;
  width:100%;
}

.discordSearchResultsHead{
  padding:6px 10px 10px;
  font-size:11px;
  font-weight:800;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(219,222,225,.55);
  border-bottom:1px solid rgba(255,255,255,.06);
  margin-bottom:4px;
}

.discordSearchResult{
  display:block;
  width:100%;
  text-align:left;
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.06);
  border-left:3px solid rgba(88,101,242,.55);
  border-radius:8px;
  padding:8px 12px;
  cursor:pointer;
  transition:background .12s ease, border-color .12s ease, transform .12s ease;
  font-family:inherit;
  color:inherit;
}

.discordSearchResult:hover{
  background:rgba(88,101,242,.1);
  border-color:rgba(88,101,242,.28);
  border-left-color:rgba(88,101,242,.85);
}

.discordSearchResult:active{
  transform:scale(.995);
}

.discordSearchResultHead{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:4px;
}

.discordSearchResultAvatar{
  width:24px;
  height:24px;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,.1);
  flex:0 0 auto;
  display:grid;
  place-items:center;
  font-size:11px;
  font-weight:800;
  color:rgba(255,255,255,.75);
}

.discordSearchResultAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.discordSearchResultMeta{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex:1 1 auto;
  min-width:0;
  flex-wrap:wrap;
}

.discordSearchResultAuthor{
  font-weight:800;
  font-size:.9rem;
  color:#fff;
  white-space:nowrap;
}

.discordSearchResultChannel{
  font-size:.76rem;
  font-weight:700;
  color:rgba(88,101,242,.9);
  background:rgba(88,101,242,.12);
  padding:1px 7px;
  border-radius:999px;
  white-space:nowrap;
}

.discordSearchResultTime{
  font-size:.74rem;
  color:rgba(219,222,225,.5);
  margin-left:auto;
  white-space:nowrap;
}

.discordSearchResultJumpHint{
  font-size:16px;
  color:rgba(88,101,242,.6);
  flex:0 0 auto;
  transition:transform .12s ease, color .12s ease;
}

.discordSearchResult:hover .discordSearchResultJumpHint{
  color:rgba(88,101,242,1);
  transform:translate(2px, -2px);
}

.discordSearchResultBody{
  font-size:.9rem;
  line-height:1.4;
  color:rgba(231,234,242,.92);
  word-break:break-word;
  overflow:hidden;
  display:-webkit-box;
  -webkit-line-clamp:3;
  line-clamp:3;
  -webkit-box-orient:vertical;
  padding-left:32px;
}

.discordSearchResultHint{
  font-style:italic;
  font-size:.85rem;
  color:rgba(219,222,225,.7);
  padding-left:32px;
}

@media (max-width: 760px){
  .discordLinkPreview{
    max-width:100%;
  }
}

.discordImageGrid{
  display:grid;
  gap:4px;
  margin-top:6px;
  max-width:min(520px, 100%);
}

.discordImageGrid.isOne{
  display:inline-block;
  max-width:min(420px, 100%);
  border-radius:8px;
  overflow:hidden;
  line-height:0;
  background:transparent;
}

.discordImageGrid.isOne .discordImageGridItem{
  display:block;
  border-radius:8px;
  overflow:hidden;
  min-height:0;
  background:transparent;
  border:0;
  padding:0;
  cursor:zoom-in;
}

.discordImageGrid.isOne .discordImageGridItem img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:380px;
  object-fit:contain;
  border-radius:8px;
}

.discordImageGrid.isTwo{
  grid-template-columns:1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.discordImageGrid.isThree{
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.discordImageGrid.isThree .discordImageGridItem:first-child{
  grid-row:span 2;
}

.discordImageGrid.isFour{
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.discordImageGrid.isSix{
  grid-template-columns:1fr 1fr 1fr;
  grid-template-rows:1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.discordImageGrid.isNine,
.discordImageGrid.isMany{
  grid-template-columns:1fr 1fr 1fr;
  grid-template-rows:1fr 1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.discordImageGridItem{
  position:relative;
  display:block;
  overflow:hidden;
  background:rgba(255,255,255,.04);
  border:0;
  padding:0;
  cursor:zoom-in;
  transition:opacity .12s ease;
  min-height:90px;
}

.discordImageGrid:not(.isOne) .discordImageGridItem img{
  width:100%;
  height:100%;
  min-height:120px;
  max-height:220px;
  object-fit:cover;
  display:block;
}

.discordImageGrid.isThree .discordImageGridItem:first-child img{
  max-height:none;
  height:100%;
}

.discordImageGridItem:hover{
  opacity:.88;
}

.discordImageGridMore{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:rgba(0,0,0,.56);
  color:#fff;
  font-size:1.4rem;
  font-weight:900;
  pointer-events:none;
  text-shadow:0 2px 8px rgba(0,0,0,.4);
}

.discordImageLightbox{
  position:fixed;
  inset:0;
  z-index:10100;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:0;
  transition:opacity .18s ease;
}

.discordImageLightbox.isOpen{
  opacity:1;
}

.discordImageLightboxBackdrop{
  position:absolute;
  inset:0;
  background:rgba(0,0,0,.88);
  backdrop-filter:blur(6px);
  cursor:zoom-out;
}

.discordImageLightboxFrame{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  gap:12px;
  max-width:min(92vw, 1400px);
  max-height:92dvh;
  padding:14px;
}

.discordImageLightboxImgWrap{
  flex:1 1 auto;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}

.discordImageLightboxImgWrap img{
  max-width:100%;
  max-height:calc(92dvh - 90px);
  width:auto;
  height:auto;
  object-fit:contain;
  display:block;
  border-radius:8px;
  box-shadow:0 24px 60px rgba(0,0,0,.6);
}

.discordImageLightboxClose{
  position:absolute;
  top:0;
  right:0;
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.1);
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:18px;
  font-weight:900;
  z-index:2;
  transition:background .15s ease, transform .12s ease;
}

.discordImageLightboxClose:hover{
  background:rgba(255,255,255,.2);
}

.discordImageLightboxClose:active{
  transform:scale(.92);
}

.discordImageLightboxNav{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  width:48px;
  height:48px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.1);
  color:#fff;
  font-size:30px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  display:grid;
  place-items:center;
  z-index:2;
  transition:background .15s ease, transform .12s ease;
}

.discordImageLightboxNav.isPrev{
  left:-60px;
}

.discordImageLightboxNav.isNext{
  right:-60px;
}

.discordImageLightboxNav:hover{
  background:rgba(255,255,255,.22);
}

.discordImageLightboxNav:active{
  transform:translateY(-50%) scale(.92);
}

.discordImageLightboxToolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  color:#fff;
}

.discordImageLightboxMeta{
  display:flex;
  align-items:baseline;
  gap:10px;
  flex:1 1 auto;
  min-width:0;
}

.discordImageLightboxName{
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  max-width:480px;
}

.discordImageLightboxCounter{
  color:rgba(255,255,255,.55);
  font-size:.88rem;
  font-weight:700;
  flex:0 0 auto;
}

.discordImageLightboxActions{
  display:flex;
  gap:8px;
  flex:0 0 auto;
}

.discordImageLightboxActions .btn{
  height:36px;
  padding:0 14px;
  font-size:.92rem;
}

html.discordLightboxOpen{
  overflow:hidden;
}

@media (max-width: 900px){
  .discordImageLightboxNav.isPrev{
    left:4px;
  }

  .discordImageLightboxNav.isNext{
    right:4px;
  }
}

@media (max-width: 760px){
  .discordImageGrid{
    max-width:100%;
  }

  .discordImageGrid.isOne .discordImageGridItem img{
    max-height:320px;
  }

  .discordMessageJumpLink{
    font-size:.82rem;
    padding:2px 8px;
  }

  .discordImageLightboxFrame{
    padding:8px;
    max-width:100vw;
  }

  .discordImageLightboxImgWrap img{
    max-height:calc(92dvh - 120px);
  }

  .discordImageLightboxToolbar{
    flex-direction:column;
    align-items:stretch;
  }

  .discordImageLightboxMeta{
    flex-direction:column;
    gap:2px;
  }

  .discordImageLightboxName{
    max-width:100%;
  }
}

.discordViewSearchGroup{
  flex:0 1 560px;
  min-width:360px;
  max-width:560px;
  margin:0;
}

.discordViewSearchGroup .logsSearchWrap{
  width:100%;
  min-width:0;
  margin:0;
}

.discordViewSearchGroup .logsSearchRow{
  display:flex;
  align-items:center;
}

.discordViewSearchGroup .logsSearchField{
  min-height:42px;
  border-radius:12px;
  background:rgba(10,12,18,.78);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

.discordViewSearchGroup .logsSearchField:focus-within{
  border-color:rgba(var(--accent-rgb), .38);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .12);
}

.discordViewSearchGroup .logsSearchIcon{
  opacity:.78;
}

.discordViewSearchGroup .logsSearchField input{
  background:transparent;
}

.discordViewSearchGroup .logsSearchField .logsNavBtn{
  border-radius:10px;
  height:32px;
}

.discordComponentRows{
  display:grid;
  gap:8px;
  margin-top:8px;
}

.discordComponentRow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.discordComponentBtn{
  min-height:32px;
  padding:0 14px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.08);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:700;
  font-size:.92rem;
  text-decoration:none;
  color:#fff;
  background:#4f545c;
}

.discordComponentBtn.isStyle1{ background:#5865f2; }
.discordComponentBtn.isStyle2{ background:#4f545c; }
.discordComponentBtn.isStyle3{ background:#248046; }
.discordComponentBtn.isStyle4{ background:#da373c; }
.discordComponentBtn.isStyle5{
  background:#4f545c;
  color:#fff;
  border-color:transparent;
}

.discordComponentBtn.isDisabled{
  opacity:.55;
  pointer-events:none;
}

.discordComponentEmoji{
  display:inline-flex;
  align-items:center;
}

.discordMdQuote.discordMdQuoteSubtext{
  font-size:.78rem;
  line-height:1.35;
  color:rgba(231,234,242,.58);
}

.discordViewHeaderActions{
  gap:12px;
}

.discordViewLoadingState{
  flex:1 1 auto;
  width:100%;
  min-height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  color:rgba(231,234,242,.72);
  font-weight:800;
  text-align:center;
}

.discordInlineLoader{
  width: 16px;
  height: 16px;
  border-radius: 999px;
  border: 2px solid rgba(255,255,255,.18);
  border-top-color: rgba(255,255,255,.92);
  animation: discordInlineSpin .72s linear infinite;
  flex: 0 0 auto;
}

#discordViewSearchBtn .discordInlineLoader{
  width: 15px;
  height: 15px;
}

@keyframes discordInlineSpin{
  to{
    transform: rotate(360deg);
  }
}

.discordInlineEmoji{
  width:1.28em;
  height:1.28em;
  vertical-align:-0.24em;
  object-fit:contain;
}

.discordComponentEmoji{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.discordComponentEmojiImg{
  width:1.15em;
  height:1.15em;
  object-fit:contain;
}

.discordMentionMenu{
  position:fixed;
  z-index:9999;
  min-width:220px;
  max-width:min(280px, calc(100vw - 24px));
  padding:8px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(15,18,28,.98);
  box-shadow:0 18px 40px rgba(0,0,0,.38);
  backdrop-filter:blur(14px);
}

.discordMentionMenuHead{
  padding:6px 8px 10px;
  font-weight:800;
  line-height:1.25;
  color:#fff;
  word-break:break-word;
}

.discordMentionMenuAction{
  width:100%;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);
  color:#fff;
  border-radius:10px;
  padding:10px 12px;
  text-align:left;
  font-weight:700;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}

.discordMentionMenuAction:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.12);
}

body.mode-serverview #discordViewCard,
.discordViewSidebar,
.discordViewContent,
.discordViewTree,
.discordViewMessages{
  box-sizing:border-box;
}

body.mode-serverview,
body.mode-serverview html{
  overscroll-behavior:none;
}

body.mode-serverview{
  overflow:hidden;
  height:100dvh;
  max-height:100dvh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
}

body.mode-serverview > .topbar{
  flex:0 0 auto;
}

body.mode-serverview > .navOverlay{
  flex:0 0 auto;
}

body.mode-serverview .layout{
  display:flex !important;
  flex-direction:column;
  flex:1 1 auto;
  width:100%;
  height:auto;
  max-height:none;
  min-height:0;
  overflow:hidden;
}

body.mode-serverview .main.wrap{
  width:100%;
  max-width:none;
  margin:0;
  padding:8px 10px 8px 10px;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  justify-content:stretch;
  overflow:hidden;
  flex:1 1 auto;
  min-height:0;
  height:auto;
}

body.mode-serverview #discordViewCard{
  width:100%;
  max-width:none;
  margin:0;
  height:100%;
  min-height:0;
  flex:1 1 auto;
  display:flex !important;
  flex-direction:column;
  overflow:hidden;

  background:#1e1f22;
  border:1px solid var(--line);
  border-radius:14px;
  color:#dbdee1;
  padding:0;
  box-sizing:border-box;

  font-family: "gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-feature-settings: "cv11", "ss01", "ss03";
}

body.mode-serverview #discordViewCard *{
  font-family: inherit;
}

body.mode-serverview .discordViewTitleInTopbar,
body.mode-serverview .discordViewHeaderActionsInTopbar,
body.mode-serverview .discordViewHeaderActionsInTopbar *{
  font-family: inherit;
}

.discordViewTopbar{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  margin-bottom:8px;
  padding:4px 2px 6px 2px;
  border-bottom:1px solid rgba(255,255,255,.06);
  flex-wrap:nowrap;
}

.discordViewTitle{
  margin:0;
  flex:0 0 auto;
  font-size:18px;
  font-weight:900;
  color:#fff;
  letter-spacing:.2px;
  white-space:nowrap;
}

.discordViewHeaderActions{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  min-width:0;
  flex-wrap:nowrap;
}

.discordViewIconBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  height:36px;
  padding:0 12px;
  border-radius:10px;
  background:rgba(255,255,255,.04);
  color:#dbdee1;
  border:1px solid rgba(255,255,255,.08);
  font-weight:700;
  font-size:13px;
  letter-spacing:.15px;
  transition:background .15s ease, border-color .15s ease, color .15s ease, transform .1s ease;
  flex:0 0 auto;
}

.discordViewIconBtn:hover:not(:disabled){
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.16);
  color:#fff;
}

.discordViewIconBtn:active:not(:disabled){
  transform:translateY(1px);
}

.discordViewIconBtnIcon{
  display:inline-grid;
  place-items:center;
  flex:0 0 auto;
  color:inherit;
  transition:transform .3s cubic-bezier(.2,.8,.2,1);
}

.discordViewIconBtnIcon svg{
  display:block;
}

.discordViewBackBtnCta:hover:not(:disabled) .discordViewIconBtnIcon{
  transform:translateX(-3px);
}

.discordViewAuditBtnCta:hover:not(:disabled) .discordViewIconBtnIcon{
  transform:rotate(-8deg) scale(1.08);
}

.discordViewIconBtnLabel{
  white-space:nowrap;
}

.discordViewSearchGroup{
  flex:0 1 320px;
  min-width:200px;
  max-width:380px;
  margin:0;
}

.discordViewSearchGroup .logsSearchWrap{
  width:100%;
  min-width:0;
  margin:0;
}

.discordViewSearchGroup .logsSearchRow{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;
}

.discordViewSearchGroup .logsSearchField{
  min-height:36px;
  height:36px;
  border-radius:10px;
  background:rgba(30,31,34,.9);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:none;
  padding:0 8px;
  display:flex;
  align-items:center;
  gap:6px;
  flex:1 1 auto;
  min-width:0;
}

.discordViewSearchGroup .logsSearchField:focus-within{
  border-color:rgba(88,101,242,.55);
  box-shadow:0 0 0 3px rgba(88,101,242,.15);
}

.discordViewSearchGroup .logsSearchIcon{
  opacity:.72;
  flex:0 0 auto;
  font-size:15px;
}

.discordViewSearchGroup .logsSearchField input{
  flex:1 1 auto;
  min-width:0;
  height:30px;
  padding:0;
  font-size:13px;
  color:#dbdee1;
  background:transparent;
  border:0;
  outline:none;
}

.discordViewSearchGroup .logsSearchField input::placeholder{
  color:rgba(219,222,225,.45);
}

.discordViewSearchGroup .logsSearchClearBtn{
  flex:0 0 auto;
  width:22px;
  height:22px;
  border-radius:50%;
  background:transparent;
  border:0;
  color:rgba(219,222,225,.55);
  font-size:11px;
  cursor:pointer;
  display:none;
  align-items:center;
  justify-content:center;
  padding:0;
}

.discordViewSearchGroup .logsSearchClearBtn.isVisible,
.discordViewSearchGroup .logsSearchField:has(input:not(:placeholder-shown)) .logsSearchClearBtn{
  display:inline-flex;
}

.discordViewSearchGroup .logsSearchClearBtn:hover{
  background:rgba(255,255,255,.08);
  color:#fff;
}

.discordViewSearchBtnCta{
  flex:0 0 auto;
  height:36px;
  padding:0 14px;
  border-radius:10px;
  background:transparent;
  color:rgba(88,101,242,1);
  border:1px solid rgba(88,101,242,.55);
  font-weight:700;
  font-size:13px;
  transition:background .15s ease, color .15s ease, border-color .15s ease, filter .15s ease, transform .1s ease;
  white-space:nowrap;
}

.discordViewSearchBtnCta:hover:not(:disabled){
  background:rgba(88,101,242,.1);
  color:#c9d8ff;
  border-color:rgba(88,101,242,.8);
}

.discordViewSearchBtnCta.isFilled{
  background:linear-gradient(180deg, rgba(99,117,244,1), rgba(79,97,214,1));
  color:#fff;
  border-color:rgba(88,101,242,.5);
}

.discordViewSearchBtnCta.isFilled:hover:not(:disabled){
  filter:brightness(1.08);
  background:linear-gradient(180deg, rgba(99,117,244,1), rgba(79,97,214,1));
  color:#fff;
}

.discordViewSearchBtnCta:active:not(:disabled){
  transform:translateY(1px);
}

.discordViewSidebar,
.discordViewContent{
  background:rgba(0,0,0,.15);
  border:1px solid rgba(255,255,255,.04);
  border-radius:8px;
}

.discordViewSidebar{
  background:#2b2d31;
}

.discordViewContent{
  background:#313338;
}

@media (max-width: 860px){
  .discordViewTopbar{
    flex-wrap:wrap;
  }

  .discordViewSearchGroup{
    flex:1 1 100%;
    max-width:100%;
    order:10;
  }

  .discordViewHeaderActions{
    flex-wrap:wrap;
  }
}

@media (max-width: 560px){
  .discordViewIconBtnLabel{
    display:none;
  }

  .discordViewIconBtn{
    padding:0 10px;
    width:36px;
  }
}

body.mode-serverview #discordViewCard > .usersHeader{
  flex:0 0 auto;
}

body.mode-serverview #discordViewCard > .discordViewShell{
  flex:1 1 auto;
  min-height:0;
}

body.mode-serverview.isSearching .discordViewNode.isActive{
  background:transparent !important;
  color:rgba(219,222,225,.75) !important;
}

body.mode-serverview.isSearching .discordViewNode.isActive::before,
body.mode-serverview.isSearching .discordViewNode.isActive::after{
  display:none !important;
}

.guildAdminBadge{
  display:inline-block;
  margin-left:6px;
  padding:1px 7px;
  border-radius:999px;
  font-size:.68rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(88,101,242,1);
  background:rgba(88,101,242,.14);
  border:1px solid rgba(88,101,242,.32);
  vertical-align:middle;
}

.tile.isAdminAccess{
  border-style:dashed;
  border-color:rgba(88,101,242,.35);
}

.tile.isAdminAccess .guildMeta{
  color:rgba(88,101,242,.75);
}

.discordViewHeaderActions{
  flex:1 1 auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  min-width:0;
}

.discordViewSearchGroup{
  flex:0 1 560px;
  min-width:360px;
  max-width:560px;
  margin:0;
}

.discordViewSearchGroup .logsSearchWrap{
  width:100%;
  min-width:0;
  margin:0;
}

.discordViewSearchGroup .logsSearchRow{
  display:flex;
  align-items:center;
  gap:10px;
}

.discordViewSearchGroup .logsSearchField{
  flex:1 1 auto;
  min-width:0;
  height:42px;
  padding-right:6px;
}

.discordViewSearchGroup .logsSearchField,
.discordViewSearchGroup .logsSearchField:focus-within{
  border-color:rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

#serversCard .serversSearchWrap .logsSearchRow{
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
  min-width:0;
}

#serversCard .serversSearchWrap .logsSearchField{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  flex:1 1 auto;
  min-width:0;
  min-height:44px;
  padding:0 8px 0 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

#serversCard .serversSearchWrap .logsSearchField:focus-within{
  border-color:rgba(var(--accent-rgb), .22) !important;
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .08) !important;
}

#serversCard .serversSearchWrap .logsSearchIcon{
  flex:0 0 auto;
  color:rgba(255,255,255,.62);
}

#serversCard .serversSearchWrap #serversSearch{
  appearance:none;
  -webkit-appearance:none;
  flex:1 1 auto;
  min-width:0;
  height:40px;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  outline:none !important;
  box-shadow:none !important;
  color:#fff;
  font-size:.96rem;
}

#serversCard .serversSearchWrap #serversSearch::placeholder{
  color:rgba(255,255,255,.55);
}

#serversCard .serversSearchWrap #serversSearch:focus,
#serversCard .serversSearchWrap #serversSearch:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}

#serversCard .serversSearchWrap .logsSearchClearBtn{
  flex:0 0 auto;
  align-self:center;
  margin-left:0;
}

#serversCard #serversSearchCount.logsCountBadge{
  flex:0 0 auto;
  align-self:center;
  white-space:nowrap;
}

#discordViewSearchInput,
#discordAuditLogQueryInput,
#serversSearch{
  flex:1 1 auto;
  min-width:0;
  height:42px;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  outline:none !important;
  box-shadow:none !important;
  color:#fff;
  font-size:.96rem;
}

#discordViewSearchInput::placeholder,
#discordAuditLogQueryInput::placeholder,
#serversSearch::placeholder{
  color:rgba(255,255,255,.55);
}

#discordViewSearchInput:focus,
#discordViewSearchInput:focus-visible,
#discordAuditLogQueryInput:focus,
#discordAuditLogQueryInput:focus-visible,
#serversSearch:focus,
#serversSearch:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}

#serversSearch::-webkit-search-decoration,
#serversSearch::-webkit-search-cancel-button,
#serversSearch::-webkit-search-results-button,
#serversSearch::-webkit-search-results-decoration{
  -webkit-appearance:none;
  appearance:none;
  display:none;
}

.logsSearchClearBtn{
  width:28px;
  height:28px;
  min-width:28px;
  border:0;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  color:rgba(231,234,242,.78);
  display:grid;
  place-items:center;
  font-size:16px;
  font-weight:900;
  line-height:1;
  opacity:0;
  pointer-events:none;
  transition:opacity .12s ease, background .12s ease, transform .12s ease;
}

.logsSearchClearBtn.show{
  opacity:1;
  pointer-events:auto;
}

.logsSearchClearBtn:hover{
  background:rgba(255,255,255,.09);
}

.logsSearchClearBtn:active{
  transform:scale(.97);
}

.logsSearchClearBtn:focus{
  outline:none;
  box-shadow:none;
}

#discordViewSearchBtn{
  position:relative;
  height:42px;
  min-width:112px;
  padding:0 16px;
  border-radius:14px;
  flex:0 0 auto;
  justify-content:center;
  overflow:hidden;
}

.discordViewShell{
  display:grid;
  grid-template-columns:240px minmax(0, 1fr);
  gap:0;
  flex:1 1 auto;
  min-height:0;
  height:100%;
  align-items:stretch;
  box-sizing:border-box;
  overflow:hidden;
}

.discordViewShell.hasMemberList{
  grid-template-columns:240px minmax(0, 1fr) 240px;
}

@media (max-width: 1000px){
  .discordViewShell,
  .discordViewShell.hasMemberList{
    grid-template-columns:240px minmax(0, 1fr);
  }
  .discordViewShell .discordViewMemberPanel{
    display:none !important;
  }
}

.discordViewMemberPanel{
  min-height:0;
  min-width:0;
  display:none;
  flex-direction:column;
  background:#2b2d31;
  box-sizing:border-box;
  overflow:hidden;
}

.discordViewShell.hasMemberList .discordViewMemberPanel{
  display:flex;
}

.discordViewHeaderSearch{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  margin-left:8px;
}

.discordViewHeaderSearchField{
  display:flex;
  align-items:center;
  background:#1e1f22;
  border-radius:4px;
  height:24px;
  width:144px;
  transition:width .2s ease;
  position:relative;
  padding:0 4px 0 6px;
}

.discordViewHeaderSearchField:focus-within{
  width:240px;
}

#discordViewSearchInput{
  flex:1 1 auto;
  min-width:0;
  background:transparent;
  border:0;
  outline:0;
  color:#dbdee1;
  font-size:.875rem;
  font-weight:500;
  font-family:inherit;
  padding:0;
  height:22px;
  line-height:22px;
}

#discordViewSearchInput::placeholder{
  color:#949ba4;
  font-weight:500;
}

.discordViewHeaderSearchClear,
.discordViewHeaderSearchSubmit{
  border:0;
  background:transparent;
  color:#b5bac1;
  cursor:pointer;
  padding:0;
  width:18px;
  height:18px;
  border-radius:0;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
  display:inline-flex;
  margin-left:4px;
}

.discordViewHeaderSearchClear{
  display:none;
}

#discordViewSearchInput:not(:placeholder-shown) ~ .discordViewHeaderSearchClear{
  display:inline-flex;
}

#discordViewSearchInput:not(:placeholder-shown) ~ .discordViewHeaderSearchSubmit{
  display:none;
}

.discordViewHeaderSearchClear:hover,
.discordViewHeaderSearchSubmit:hover{
  color:#dbdee1;
}

@media (max-width: 760px){
  .discordViewHeaderSearchField{
    width:100px;
  }

  .discordViewHeaderSearchField:focus-within{
    width:160px;
  }
}

#discordViewMemberList{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:8px 0;
}

#discordViewMemberList::-webkit-scrollbar{
  width:8px;
}

#discordViewMemberList::-webkit-scrollbar-track{
  background:transparent;
}

#discordViewMemberList::-webkit-scrollbar-thumb{
  background:#1a1b1e;
  border-radius:4px;
}

.discordViewShell.hasMemberList{
  grid-template-columns:clamp(280px, 18vw, 360px) minmax(0, 1fr) 240px;
}

@media (max-width: 1000px){
  .discordViewShell.hasMemberList{
    grid-template-columns:240px minmax(0, 1fr);
  }
  .discordViewShell.hasMemberList .discordViewMemberPanel{
    display:none !important;
  }
}

.discordViewSidebar,
.discordViewContent{
  min-height:0;
  min-width:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  border:0;
  border-radius:0;
  padding:0;
  align-self:stretch;
  box-sizing:border-box;
}

.discordViewSidebar{
  background:#2b2d31;
  padding:0;
}

.discordViewContent{
  background:#313338;
  display:flex;
  flex-direction:column;
}

.discordViewMemberList{
  color:#dbdee1;
  display:flex;
  flex-direction:column;
}

.discordViewMemberListEmpty{
  padding:24px 16px;
  text-align:center;
  color:#949ba4;
  font-size:.875rem;
  line-height:1.375;
}

.discordViewMemberGroup{
  display:flex;
  flex-direction:column;
}

.discordViewMemberGroupHeader{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:24px 8px 4px 16px;
  font-size:.75rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#949ba4;
  line-height:1.25;
}

.discordViewMemberItem{
  margin:0 8px;
  padding:1px 8px;
  height:42px;
  border-radius:4px;
  gap:12px;
}

.discordViewMemberGroupHeader .discordViewMemberGroupCount{
  font-size:.75rem;
  font-weight:500;
  color:inherit;
  opacity:.65;
}

.discordViewMemberGroupList{
  display:flex;
  flex-direction:column;
}

.discordViewMemberItem{
  display:flex;
  align-items:center;
  gap:12px;
  padding:1px 8px;
  margin:0 8px;
  height:42px;
  border:0;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
  border-radius:4px;
  font-family:inherit;
  transition:background-color .08s ease;
  min-width:0;
}

.discordViewMemberItem:hover,
.discordViewMemberItem:focus-visible{
  background:#35373c;
  outline:0;
}

.discordViewMemberItem.isOffline{
  opacity:.4;
}

.discordViewMemberItem.isOffline:hover{
  opacity:1;
}

.discordViewMemberAvatar{
  position:relative;
  width:32px;
  height:32px;
  flex-shrink:0;
}

.discordViewMemberAvatar img{
  width:32px;
  height:32px;
  border-radius:50%;
  object-fit:cover;
  display:block;
}

.discordViewMemberAvatarFallback{
  width:32px;
  height:32px;
  border-radius:50%;
  background:rgba(88,101,242,.24);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.875rem;
  font-weight:500;
}

.discordViewMemberStatus{
  position:absolute;
  right:-2px;
  bottom:-2px;
  width:14px;
  height:14px;
  border-radius:50%;
  border:3px solid #2b2d31;
  box-sizing:border-box;
  background:#80848e;
}

.discordViewMemberStatus.isStatus-online{
  background:#23a55a;
}

.discordViewMemberStatus.isStatus-idle{
  background:#f0b232;
}

.discordViewMemberStatus.isStatus-dnd{
  background:#f23f42;
}

.discordViewMemberStatus.isStatus-offline{
  background:#80848e;
}

.discordViewMemberName{
  flex:1 1 auto;
  font-size:1rem;
  font-weight:500;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
}

.discordViewMemberBotBadge{
  flex-shrink:0;
  font-size:.625rem;
  font-weight:700;
  letter-spacing:.02em;
  background:#5865f2;
  color:#fff;
  padding:1px 4px;
  border-radius:3px;
  line-height:1.25;
  text-transform:uppercase;
}

.discordViewMemberListToggleBtn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:32px;
  height:32px;
  border:0;
  background:transparent;
  color:#b5bac1;
  border-radius:4px;
  cursor:pointer;
  transition:color .08s ease, background-color .08s ease;
  flex-shrink:0;
}

.discordViewMemberListToggleBtn:hover{
  color:#dbdee1;
  background:rgba(255,255,255,.04);
}

.discordViewMemberListToggleBtn.isActive{
  color:#dbdee1;
}

.discordViewContent > .discordViewComposer{
  flex:0 0 auto;
  margin-top:6px;
  padding-top:8px;
  padding-bottom:0;
}

.discordViewGuildHead{
  flex:0 0 auto;
  margin-bottom:14px;
}

.discordViewChannelHead{
  flex:0 0 auto;
  margin-bottom:10px;
}

.discordViewMessagesWrap{
  flex:1 1 auto;
  min-height:0;
}

.discordViewTree{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:0 4px 16px 0;
  box-sizing:border-box;
  border:none;
  background:transparent;
  border-radius:0;
  scrollbar-gutter:stable;
}

.discordViewTree::after{
  content:"";
  display:block;
  height:10px;
}

.discordViewMessages{
  flex:1 1 auto;
  min-height:0;
  height:auto;
  overflow:auto;
  overscroll-behavior:contain;
  display:flex;
  flex-direction:column;
  gap:0;
  padding:0 0 16px 0;
  scroll-padding-bottom:16px;
  border:none;
  background:transparent;
  border-radius:0;
  box-shadow:none;
  scrollbar-gutter:stable;
}

.discordViewMessages > .discordViewDateDivider:first-child,
.discordViewMessages > .discordViewMessage:first-child,
.discordViewMessages > .discordSearchResults:first-child,
.discordViewMessages > .discordViewEmpty:first-child{
  margin-top:auto;
}

.discordSearchLoader{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:18px;
  padding:32px 16px;
  width:100%;
}

.discordSearchLoaderIcon{
  position:relative;
  width:56px;
  height:56px;
  animation:discordSearchLoaderPulse 1.6s ease-in-out infinite;
}

.discordSearchLoaderCircle{
  position:absolute;
  top:0;
  left:0;
  width:40px;
  height:40px;
  border:3px solid rgba(88,101,242,.85);
  border-top-color:rgba(88,101,242,.2);
  border-radius:50%;
  animation:discordSearchLoaderSpin 1.1s linear infinite;
}

.discordSearchLoaderHandle{
  position:absolute;
  bottom:3px;
  right:3px;
  width:18px;
  height:3px;
  background:rgba(88,101,242,.85);
  border-radius:2px;
  transform:rotate(45deg);
  transform-origin:left center;
  box-shadow:0 0 6px rgba(88,101,242,.6);
}

@keyframes discordSearchLoaderSpin{
  to { transform:rotate(360deg); }
}

@keyframes discordSearchLoaderPulse{
  0%, 100% { transform:scale(1); }
  50% { transform:scale(1.08); }
}

.discordSearchLoaderText{
  display:flex;
  align-items:baseline;
  gap:2px;
  font-size:14px;
  font-weight:600;
  color:rgba(219,222,225,.85);
  letter-spacing:.2px;
}

.discordSearchLoaderDots{
  display:inline-flex;
  margin-left:1px;
}

.discordSearchLoaderDots span{
  display:inline-block;
  opacity:0;
  animation:discordSearchLoaderDot 1.4s infinite;
  font-weight:900;
}

.discordSearchLoaderDots span:nth-child(2){
  animation-delay:.2s;
}

.discordSearchLoaderDots span:nth-child(3){
  animation-delay:.4s;
}

@keyframes discordSearchLoaderDot{
  0%, 60%, 100% { opacity:0; transform:translateY(0); }
  30% { opacity:1; transform:translateY(-3px); }
}

.discordSearchLoaderSkel{
  display:flex;
  flex-direction:column;
  gap:10px;
  width:100%;
  max-width:680px;
  padding:0 8px;
}

.discordSearchLoaderSkelItem{
  height:56px;
  border-radius:8px;
  border-left:3px solid rgba(88,101,242,.35);
  background:linear-gradient(100deg,
    rgba(255,255,255,.04) 0%,
    rgba(88,101,242,.12) 30%,
    rgba(255,255,255,.04) 60%
  );
  background-size:200% 100%;
  animation:discordSearchLoaderShimmer 1.8s ease-in-out infinite;
}

.discordSearchLoaderSkelItem:nth-child(1){ animation-delay:0s; }
.discordSearchLoaderSkelItem:nth-child(2){ animation-delay:.15s; }
.discordSearchLoaderSkelItem:nth-child(3){ animation-delay:.3s; }

@keyframes discordSearchLoaderShimmer{
  0% { background-position:200% 0; }
  100% { background-position:-200% 0; }
}

.discordViewMessages > .discordViewLoadingState:first-child{
  margin:auto 0;
}

.discordViewMessages::after{
  content:"";
  display:block;
  flex:0 0 10px;
}

.discordViewDateDivider{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  margin:16px 0 8px;
  pointer-events:none;
}

.discordViewDateDivider::before,
.discordViewDateDivider::after{
  content:"";
  flex:1 1 auto;
  height:1px;
  background:rgba(255,255,255,.10);
}

.discordViewDateDividerLabel{
  flex:0 0 auto;
  padding:4px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:#313338;
  color:rgba(231,234,242,.72);
  font-size:12px;
  font-weight:800;
  line-height:1.2;
  letter-spacing:.01em;
  box-shadow:0 6px 18px rgba(0,0,0,.16);
}

.discordViewComposer{
  display:block;
  margin-top:0;
  padding:0 16px 22px 16px;
  border-top:0;
  flex:0 0 auto;
  box-sizing:border-box;
  background:#313338;
}

.discordViewSystemText{
  color:rgba(231,234,242,.62);
  font-style:italic;
  line-height:1.45;
}

.discordComposerBar{
  display:flex;
  align-items:flex-start;
  gap:0;
  padding:0;
  border-radius:8px;
  border:0;
  background:#383a40;
  transition:none;
  position:relative;
}

.discordComposerBar:focus-within{
  border:0;
  background:#383a40;
}

.discordComposerActionBtn{
  flex:0 0 auto;
  width:40px;
  height:44px;
  border:0;
  border-radius:8px 0 0 8px;
  background:transparent;
  color:#b5bac1;
  cursor:pointer;
  display:grid;
  place-items:center;
  line-height:1;
  align-self:flex-start;
  margin-top:0;
  transition:color .12s ease;
}

.discordComposerActionBtn:hover:not(:disabled){
  background:transparent;
  color:#dbdee1;
}

.discordComposerActionBtn:active:not(:disabled){
  transform:none;
}

.discordComposerActionBtn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.discordComposerPlusIconSvg{
  width:24px;
  height:24px;
  color:#b5bac1;
  display:block;
}

.discordComposerActionBtn:hover .discordComposerPlusIconSvg{
  color:#dbdee1;
}

.discordComposerEmojiBtn{
  flex:0 0 auto;
  width:40px;
  height:44px;
  border:0;
  border-radius:0;
  background:transparent;
  color:#b5bac1;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  align-self:flex-start;
  transition:color .12s ease;
}

.discordComposerEmojiBtn:hover:not(:disabled){
  background:transparent;
  color:#dbdee1;
}

.discordComposerEmojiBtn:active:not(:disabled){
  transform:none;
}

.discordComposerEmojiBtn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

#discordViewComposerInput{
  flex:1 1 auto;
  min-width:0;
  min-height:22px;
  max-height:336px;
  padding:11px 0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#dbdee1;
  font-family:inherit;
  font-size:1rem;
  line-height:1.375;
  resize:none;
  overflow-y:auto;
  overflow-x:hidden;
  align-self:stretch;
}

#discordViewComposerInput::placeholder{
  color:#6d6f78;
}

#discordViewComposerInput:focus,
#discordViewComposerInput:focus-visible{
  outline:none;
  box-shadow:none;
}

.discordComposerSendBtn{
  flex:0 0 auto;
  width:40px;
  height:44px;
  border:0;
  border-radius:0 8px 8px 0;
  background:transparent;
  color:#5865f2;
  align-self:flex-start;
  background:rgba(var(--accent-rgb), .85);
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
  line-height:1;
  align-self:flex-end;
  transition:background .15s ease, transform .12s ease;
}

.discordComposerSendBtn:hover:not(:disabled){
  background:transparent;
  color:#7984f5;
}

.discordComposerSendBtn:active:not(:disabled){
  transform:none;
}

.discordComposerSendBtn:disabled{
  opacity:.35;
  cursor:not-allowed;
  color:#b5bac1;
}

.discordComposerSendIcon{
  font-size:18px;
  transform:translateX(0);
  line-height:1;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.discordComposerActionBtn.isOpen{
  background:rgba(var(--accent-rgb), .22);
  color:#fff;
}

.discordComposerPreview{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:8px 6px 10px 6px;
}

.discordComposerPreviewItem{
  position:relative;
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  max-width:100%;
}

.discordComposerPreviewItem.isImage{
  padding:0;
  overflow:hidden;
}

.discordComposerPreviewItem.isImage img{
  display:block;
  width:96px;
  height:96px;
  object-fit:cover;
}

.discordComposerPreviewFile{
  display:flex;
  align-items:center;
  gap:8px;
  max-width:240px;
  min-width:0;
}

.discordComposerPreviewIcon{
  font-size:18px;
  line-height:1;
  flex:0 0 auto;
}

.discordComposerPreviewName{
  font-weight:700;
  font-size:.9rem;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
}

.discordComposerPreviewRemove{
  position:absolute;
  top:4px;
  right:4px;
  width:22px;
  height:22px;
  border:0;
  border-radius:50%;
  background:rgba(0,0,0,.68);
  color:#fff;
  font-size:13px;
  font-weight:900;
  line-height:1;
  cursor:pointer;
  display:grid;
  place-items:center;
  transition:background .15s ease, transform .12s ease;
}

.discordComposerPreviewRemove:hover{
  background:rgba(0,0,0,.85);
}

.discordComposerPreviewRemove:active{
  transform:scale(.92);
}

.discordComposerMenu{
  position:fixed;
  z-index:9999;
  min-width:240px;
  max-width:min(300px, calc(100vw - 24px));
  padding:6px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(15,18,28,.98);
  box-shadow:0 18px 40px rgba(0,0,0,.38);
  backdrop-filter:blur(14px);
  display:grid;
  gap:4px;
}

.discordComposerMenuAction{
  width:100%;
  border:0;
  background:transparent;
  color:#fff;
  border-radius:10px;
  padding:10px 12px;
  text-align:left;
  font-weight:700;
  cursor:pointer;
  display:flex;
  align-items:center;
  gap:10px;
  transition:background .12s ease;
}

.discordComposerMenuAction:hover{
  background:rgba(255,255,255,.08);
}

.discordComposerMenuAction:active{
  background:rgba(255,255,255,.12);
}

.discordComposerMenuIcon{
  width:22px;
  font-size:18px;
  line-height:1;
  text-align:center;
  flex:0 0 auto;
}

.discordComposerMenuLabel{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordSlashAutocomplete{
  position:fixed;
  z-index:9998;
  max-width:min(520px, calc(100vw - 24px));
  padding:6px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(15,18,28,.98);
  box-shadow:0 18px 40px rgba(0,0,0,.38);
  backdrop-filter:blur(14px);
  display:flex;
  flex-direction:column;
  gap:4px;
}

.discordSlashAutocompleteHeader{
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(231,234,242,.52);
  padding:6px 8px 2px;
}

.discordSlashAutocompleteList{
  display:flex;
  flex-direction:column;
  gap:2px;
  max-height:260px;
  overflow:auto;
  scrollbar-gutter:stable;
}

.discordSlashAutocompleteItem{
  width:100%;
  border:0;
  background:transparent;
  color:#fff;
  border-radius:10px;
  padding:8px 10px;
  text-align:left;
  cursor:pointer;
  display:flex;
  align-items:baseline;
  gap:10px;
  transition:background .12s ease;
}

.discordSlashAutocompleteItem:hover,
.discordSlashAutocompleteItem.isActive{
  background:rgba(var(--accent-rgb), .16);
}

.discordSlashAutocompleteName{
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:.92rem;
  font-weight:800;
  color:#c9d8ff;
  flex:0 0 auto;
  white-space:nowrap;
}

.discordSlashAutocompleteDesc{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:rgba(231,234,242,.70);
  font-size:.88rem;
}

.discordSlashAutocompleteItem.isUnsupported .discordSlashAutocompleteName{
  color:rgba(231,234,242,.62);
}

.discordSlashAutocompleteItem.isUnsupported::after{
  content:attr(data-unsupported-label);
  flex:0 0 auto;
  font-size:.72rem;
  font-weight:700;
  color:rgba(255,200,120,.85);
  padding:2px 8px;
  border-radius:999px;
  background:rgba(255,160,80,.14);
  border:1px solid rgba(255,160,80,.24);
  white-space:nowrap;
}

.discordMentionAutocomplete{
  position:fixed;
  z-index:9000;
  background:#2b2d31;
  border-radius:8px;
  box-shadow:0 8px 16px rgba(0,0,0,.24), 0 0 0 1px rgba(0,0,0,.32);
  padding:8px 0 0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
  user-select:none;
}

.discordMentionAutocompleteHeader{
  font-size:.75rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#b5bac1;
  padding:4px 10px 6px;
  line-height:1.25;
}

.discordMentionAutocompleteList{
  display:flex;
  flex-direction:column;
  max-height:280px;
  overflow-y:auto;
  padding:0 8px 8px;
  gap:2px;
}

.discordMentionAutocompleteList::-webkit-scrollbar{
  width:8px;
}

.discordMentionAutocompleteList::-webkit-scrollbar-track{
  background:transparent;
}

.discordMentionAutocompleteList::-webkit-scrollbar-thumb{
  background:rgba(0,0,0,.28);
  border-radius:4px;
}

.discordMentionAutocompleteItem{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 8px;
  border:0;
  border-radius:4px;
  background:transparent;
  color:#dbdee1;
  font-size:.875rem;
  line-height:1.25;
  text-align:left;
  cursor:pointer;
  font-family:inherit;
  transition:background-color .08s ease, color .08s ease;
  min-height:32px;
}

.discordMentionAutocompleteItem:hover,
.discordMentionAutocompleteItem.isActive{
  background:#404249;
  color:#fff;
  outline:0;
}

.discordMentionAutocompleteAvatar{
  width:22px;
  height:22px;
  border-radius:50%;
  flex-shrink:0;
  object-fit:cover;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  font-size:.75rem;
  font-weight:500;
  color:rgba(231,234,242,.72);
}

.discordMentionAutocompleteAvatar.isFallback{
  background:rgba(88,101,242,.24);
  color:#fff;
}

.discordMentionAutocompleteRoleDot{
  width:14px;
  height:14px;
  border-radius:50%;
  flex-shrink:0;
  margin-left:4px;
}

.discordMentionAutocompleteMain{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.discordMentionAutocompleteName{
  font-size:.9375rem;
  font-weight:500;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordMentionAutocompleteSub{
  font-size:.75rem;
  color:#949ba4;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordMentionAutocompleteBotBadge{
  font-size:.625rem;
  font-weight:700;
  letter-spacing:.02em;
  background:#5865f2;
  color:#fff;
  padding:1px 4px;
  border-radius:3px;
  line-height:1.25;
  text-transform:uppercase;
  flex-shrink:0;
}

.discordMentionAutocompleteEmpty{
  padding:12px 10px;
  color:#949ba4;
  text-align:center;
  font-size:.875rem;
}

.discordViewMessage.isEphemeral{
  padding-top:4px;
  padding-bottom:2px;
}

.discordViewMessage.isEphemeral .discordViewMsgAvatar{
  opacity:.75;
}

.discordEphemeralBadge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  font-size:.7rem;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(var(--accent-rgb), 1);
  padding:2px 8px;
  border-radius:999px;
  background:rgba(var(--accent-rgb), .14);
  border:1px solid rgba(var(--accent-rgb), .28);
}

.discordEphemeralHint{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:4px;
  font-size:.78rem;
  color:rgba(231,234,242,.55);
}

.discordEphemeralHintText{
  flex:0 0 auto;
}

.discordEphemeralDismissBtn{
  flex:0 0 auto;
  border:0;
  background:transparent;
  color:rgba(var(--accent-rgb), 1);
  cursor:pointer;
  font-size:.78rem;
  font-weight:800;
  padding:0;
  text-decoration:underline;
  text-decoration-style:dotted;
  text-underline-offset:2px;
}

.discordEphemeralDismissBtn:hover{
  color:#fff;
}

.discordComposerSlashInput{
  flex:1 1 auto;
  min-width:0;
  min-height:36px;
  display:flex;
  align-items:center;
  gap:6px;
  padding:4px 6px;
  flex-wrap:wrap;
}

.discordComposerSlashPill{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  gap:6px;
  height:28px;
  padding:0 6px 0 10px;
  border:0;
  border-radius:8px;
  background:rgba(var(--accent-rgb), .28);
  color:#fff;
  cursor:pointer;
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:.88rem;
  font-weight:800;
  transition:background .12s ease;
}

.discordComposerSlashPill:hover{
  background:rgba(var(--accent-rgb), .4);
}

.discordComposerSlashPill:focus,
.discordComposerSlashPill:focus-visible{
  outline:none;
  box-shadow:0 0 0 2px rgba(var(--accent-rgb), .45);
}

.discordComposerSlashPillName::before{
  content:"/";
  opacity:.75;
  margin-right:1px;
}

.discordComposerSlashPillClose{
  opacity:.6;
  font-weight:900;
  font-size:14px;
  line-height:1;
  padding:0 2px;
}

.discordComposerSlashPill:hover .discordComposerSlashPillClose{
  opacity:1;
}

.discordComposerSlashOptions{
  display:flex;
  align-items:center;
  gap:6px;
  flex:1 1 auto;
  flex-wrap:wrap;
  min-width:0;
}

.discordComposerSlashOption{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:2px 8px;
  border-radius:8px;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.08);
  font-size:.86rem;
  min-width:0;
  flex:0 1 auto;
  transition:border-color .12s ease, background .12s ease;
}

.discordComposerSlashOption:focus-within{
  border-color:rgba(var(--accent-rgb), .38);
  background:rgba(255,255,255,.07);
}

.discordComposerSlashOptionLabel{
  font-weight:800;
  color:rgba(231,234,242,.68);
  flex:0 0 auto;
  white-space:nowrap;
  font-size:.76rem;
  letter-spacing:.02em;
  text-transform:lowercase;
}

.discordComposerSlashOptionReq{
  color:#ff8080;
  font-weight:900;
  margin-left:1px;
}

.discordComposerSlashOptionInput{
  flex:1 1 auto;
  min-width:60px;
  max-width:220px;
  width:auto;
  height:24px;
  border:0;
  background:transparent;
  color:#fff;
  font-family:inherit;
  font-size:.92rem;
  outline:none;
  padding:0 2px;
}

.discordComposerSlashOptionInput::placeholder{
  color:rgba(255,255,255,.32);
}

.discordComposerSlashOptionInput:focus,
.discordComposerSlashOptionInput:focus-visible{
  outline:none;
  box-shadow:none;
}

select.discordComposerSlashOptionInput{
  min-width:80px;
  padding:0 4px;
  border-radius:4px;
}

.discordComposerSlashChannelPicker{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:4px;
  flex:1 1 auto;
  min-width:0;
  max-width:220px;
}

.discordComposerSlashChannelChip{
  display:inline-flex;
  align-items:center;
  gap:4px;
  height:22px;
  padding:0 2px 0 6px;
  border-radius:3px;
  background:rgba(88,101,242,.3);
  color:#dee0fc;
  font-size:.875rem;
  line-height:1.375;
  white-space:nowrap;
  max-width:100%;
  overflow:hidden;
}

.discordComposerSlashChannelChipIcon{
  color:rgba(222,224,252,.75);
  font-weight:500;
  flex-shrink:0;
}

.discordComposerSlashChannelChipName{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordComposerSlashChannelChipClear{
  background:transparent;
  border:0;
  color:rgba(222,224,252,.75);
  font-size:14px;
  line-height:1;
  padding:0 3px;
  cursor:pointer;
  border-radius:2px;
  flex-shrink:0;
}

.discordComposerSlashChannelChipClear:hover{
  color:#fff;
  background:rgba(0,0,0,.24);
}

.discordComposerSlashChannelInput{
  max-width:100%;
}

.discordComposerSlashChannelDropdown{
  position:absolute;
  left:0;
  bottom:calc(100% + 8px);
  min-width:260px;
  max-width:340px;
  max-height:280px;
  overflow-y:auto;
  padding:6px;
  background:#2b2d31;
  border-radius:8px;
  box-shadow:0 8px 16px rgba(0,0,0,.24), 0 0 0 1px rgba(0,0,0,.24);
  display:flex;
  flex-direction:column;
  gap:1px;
  z-index:40;
}

.discordComposerSlashChannelItem{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  padding:6px 8px;
  border:0;
  background:transparent;
  color:#dbdee1;
  font-size:.875rem;
  line-height:1.25;
  text-align:left;
  border-radius:4px;
  cursor:pointer;
}

.discordComposerSlashChannelItem:hover,
.discordComposerSlashChannelItem.isActive{
  background:#404249;
  color:#fff;
}

.discordComposerSlashChannelItemIcon{
  color:rgba(163,166,170,.75);
  font-weight:500;
  width:20px;
  text-align:center;
  flex-shrink:0;
}

.discordComposerSlashChannelItemName{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordComposerSlashChannelEmpty{
  padding:12px 8px;
  color:#949ba4;
  text-align:center;
  font-size:.875rem;
}

.discordComposerSlashEntityItem{
  min-height:32px;
}

.discordComposerSlashEntityAvatar{
  width:22px;
  height:22px;
  border-radius:50%;
  flex-shrink:0;
  object-fit:cover;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  font-size:.75rem;
  font-weight:500;
  color:rgba(231,234,242,.72);
}

.discordComposerSlashEntityAvatar.isFallback{
  background:rgba(88,101,242,.24);
  color:#fff;
}

.discordComposerSlashEntityItemMain{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.discordComposerSlashEntityItemSub{
  font-size:.75rem;
  color:#949ba4;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordComposerSlashEntityBotBadge{
  font-size:.625rem;
  font-weight:700;
  letter-spacing:.02em;
  background:#5865f2;
  color:#fff;
  padding:1px 4px;
  border-radius:3px;
  line-height:1.25;
  text-transform:uppercase;
  flex-shrink:0;
}

.discordComposerSlashEntityRoleDot{
  width:14px;
  height:14px;
  border-radius:50%;
  flex-shrink:0;
}

.discordComposerSlashEntityChip .discordComposerSlashEntityAvatar{
  width:18px;
  height:18px;
  font-size:.6875rem;
}

.discordComposerSlashEntityChip .discordComposerSlashEntityRoleDot{
  width:12px;
  height:12px;
}

.discordSlashModalCard{
  width:min(440px, calc(100vw - 32px));
  background:#313338;
  border:0;
  border-radius:4px;
  box-shadow:0 8px 16px rgba(0,0,0,.24);
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:20px;
}

.discordSlashModalClose{
  position:absolute;
  top:8px;
  right:8px;
  background:transparent;
  border:0;
  color:#b5bac1;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  width:32px;
  height:32px;
  border-radius:4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.discordSlashModalClose:hover{
  color:#fff;
  background:rgba(255,255,255,.06);
}

.discordSlashModalHead{
  padding-right:32px;
}

.discordSlashModalTitle{
  font-size:1.25rem;
  font-weight:600;
  color:#fff;
  line-height:1.25;
  margin:0;
}

.discordSlashModalBody{
  display:flex;
  flex-direction:column;
  gap:20px;
}

.discordSlashModalField{
  display:flex;
  flex-direction:column;
  gap:8px;
  position:relative;
}

.discordSlashModalLabel{
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#b5bac1;
  line-height:1.25;
}

.discordSlashModalReq{
  color:#f23f42;
  margin-left:4px;
}

.discordSlashModalInput{
  width:100%;
  background:#1e1f22;
  border:0;
  border-radius:3px;
  color:#dbdee1;
  font-size:1rem;
  font-family:inherit;
  padding:10px;
  outline:none;
  box-sizing:border-box;
  line-height:1.375;
}

.discordSlashModalInput:focus{
  outline:none;
  box-shadow:inset 0 0 0 1px rgba(88,101,242,.6);
}

.discordSlashModalInput::placeholder{
  color:#6d6f78;
}

.discordSlashModalInputArea{
  resize:vertical;
  min-height:80px;
  max-height:300px;
  font-family:inherit;
}

.discordSlashModalCount{
  position:absolute;
  right:0;
  bottom:-16px;
  font-size:.7rem;
  color:#949ba4;
}

.discordSlashModalFooter{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin-top:4px;
}

.discordSlashModalFooter .btn{
  min-height:38px;
  padding:2px 16px;
  font-size:.875rem;
  font-weight:500;
  border-radius:3px;
  border:0;
}

.discordSlashModalFooter .btn.ghost{
  background:transparent;
  color:#fff;
}

.discordSlashModalFooter .btn.ghost:hover{
  text-decoration:underline;
  background:transparent;
}

.discordSlashModalFooter .btn.primary{
  background:#5865f2;
  color:#fff;
}

.discordSlashModalFooter .btn.primary:hover{
  background:#4752c4;
}

.discordSlashModalFooter .btn.primary:disabled{
  background:rgba(88,101,242,.5);
  cursor:not-allowed;
}

.discordComposerSlashPreview{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:10px 14px 8px;
  background:#2b2d31;
  border-top-left-radius:8px;
  border-top-right-radius:8px;
  border-bottom:1px solid #1e1f22;
  color:#dbdee1;
  font-size:.875rem;
  line-height:1.375;
}

.discordComposerSlashPreviewTitle{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:.9375rem;
}

.discordComposerSlashPreviewCmd{
  color:#fff;
  font-weight:600;
}

.discordComposerSlashPreviewArgs{
  display:inline-flex;
  gap:6px;
  flex-wrap:wrap;
  align-items:center;
}

.discordComposerSlashPreviewArg{
  color:#949ba4;
  padding:0 4px;
  border-radius:3px;
  font-size:.875rem;
}

.discordComposerSlashPreviewArg.isCurrent{
  color:#fff;
  background:rgba(88,101,242,.3);
  font-weight:600;
}

.discordComposerSlashPreviewArg.isFilled{
  color:#72767d;
  text-decoration:line-through;
}

.discordComposerSlashPreviewDesc{
  color:#b5bac1;
  font-size:.8125rem;
  line-height:1.375;
  display:flex;
  align-items:baseline;
  gap:6px;
  flex-wrap:wrap;
}

.discordComposerSlashPreviewDescLabel{
  color:#fff;
  font-weight:600;
}

.discordComposerSlashPreviewDescLabel::after{
  content:":";
  margin-left:1px;
}

.discordComposerSlashPreviewDescReq{
  color:#f23f42;
  margin-left:2px;
}

.discordComposerSlashPreviewHint{
  color:#949ba4;
  font-size:.75rem;
  font-style:italic;
}

.discordTimestamp{
  background:rgba(255,255,255,.06);
  color:#dbdee1;
  border-radius:3px;
  padding:0 2px;
  cursor:default;
  white-space:nowrap;
  font-variant-numeric:tabular-nums;
}

.discordTimestamp:hover{
  background:rgba(79,84,92,.48);
}

.discordEmbedDescription .discordTimestamp,
.discordEmbedFieldValue .discordTimestamp,
.discordEmbedFooter .discordTimestamp{
  font-size:inherit;
}

.discordUserContextMenu{
  position:fixed;
  z-index:1200;
  min-width:200px;
  max-width:260px;
  padding:6px 8px;
  background:#111214;
  border-radius:4px;
  box-shadow:0 8px 16px rgba(0,0,0,.24), 0 0 0 1px rgba(0,0,0,.32);
  color:#dbdee1;
  font-size:.875rem;
  line-height:1.375;
  user-select:none;
}

.discordUserContextHead{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 8px 10px;
  min-width:0;
}

.discordUserContextHeadAvatar{
  width:32px;
  height:32px;
  border-radius:50%;
  object-fit:cover;
  flex-shrink:0;
  background:rgba(255,255,255,.05);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  font-size:.875rem;
  font-weight:500;
  color:rgba(231,234,242,.72);
}

.discordUserContextHeadAvatar.isFallback{
  background:rgba(88,101,242,.24);
  color:#fff;
}

.discordUserContextHeadName{
  font-weight:600;
  color:#f2f3f5;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordUserContextDivider{
  height:1px;
  background:rgba(163,166,170,.15);
  margin:4px 0;
}

.discordUserContextItems{
  display:flex;
  flex-direction:column;
  gap:1px;
}

.discordUserContextItem{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  padding:6px 8px;
  border:0;
  background:transparent;
  color:#dbdee1;
  font-size:.875rem;
  line-height:1.25;
  text-align:left;
  border-radius:2px;
  cursor:pointer;
  font-family:inherit;
  transition:background-color .08s ease, color .08s ease;
}

.discordUserContextItem:hover,
.discordUserContextItem:focus-visible{
  background:#5865f2;
  color:#fff;
  outline:0;
}

.discordUserContextItem.isDestructive{
  color:#f23f42;
}

.discordUserContextItem.isDestructive:hover,
.discordUserContextItem.isDestructive:focus-visible{
  background:#f23f42;
  color:#fff;
}

.discordUserContextItemIcon{
  flex-shrink:0;
  opacity:.9;
}

.discordUserContextItemLabel{
  flex:1 1 auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordMessageMenuReactionBtn.isMore{
  font-size:16px;
  opacity:.85;
}

.discordUserActionCard{
  width:min(440px, calc(100vw - 32px));
  background:#313338;
  border:0;
  border-radius:4px;
  box-shadow:0 8px 16px rgba(0,0,0,.24);
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:20px;
  overflow:visible;
}

.discordUserActionClose{
  position:absolute;
  top:8px;
  right:8px;
  background:transparent;
  border:0;
  color:#b5bac1;
  font-size:18px;
  line-height:1;
  cursor:pointer;
  width:32px;
  height:32px;
  border-radius:4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.discordUserActionClose:hover{
  color:#fff;
  background:rgba(255,255,255,.06);
}

.discordUserActionHead{
  padding-right:32px;
  display:flex;
  flex-direction:column;
  gap:4px;
}

.discordUserActionTitle{
  font-size:1.25rem;
  font-weight:600;
  color:#fff;
  line-height:1.25;
  margin:0;
}

.discordUserActionSubtitle{
  font-size:.875rem;
  color:#b5bac1;
  line-height:1.375;
}

.discordUserActionSubtitle:empty{
  display:none;
}

.discordUserActionBody{
  display:flex;
  flex-direction:column;
  gap:16px;
  min-height:40px;
}

.discordUserActionField{
  display:flex;
  flex-direction:column;
  gap:8px;
  position:relative;
}

.discordUserActionLabel{
  font-size:.75rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#b5bac1;
  line-height:1.25;
}

.discordUserActionInput,
.discordUserActionSelect{
  width:100%;
  background:#1e1f22;
  border:0;
  border-radius:3px;
  color:#dbdee1;
  font-size:1rem;
  font-family:inherit;
  padding:10px;
  outline:none;
  box-sizing:border-box;
  line-height:1.375;
  appearance:none;
  -webkit-appearance:none;
}

.discordUserActionSelect{
  padding-right:32px;
  background-image:linear-gradient(45deg, transparent 50%, #b5bac1 50%), linear-gradient(135deg, #b5bac1 50%, transparent 50%);
  background-position:calc(100% - 14px) 50%, calc(100% - 9px) 50%;
  background-size:5px 5px, 5px 5px;
  background-repeat:no-repeat;
  cursor:pointer;
}

.discordUserActionInput:focus,
.discordUserActionSelect:focus{
  outline:none;
  box-shadow:inset 0 0 0 1px rgba(88,101,242,.6);
}

.discordUserActionInput::placeholder{
  color:#6d6f78;
}

.discordUserActionHint{
  font-size:.75rem;
  color:#949ba4;
  line-height:1.375;
}

.discordUserActionWarning{
  font-size:.8125rem;
  color:#faa61a;
  line-height:1.375;
  padding:8px 10px;
  background:rgba(250,166,26,.08);
  border-radius:3px;
  border-left:3px solid #faa61a;
}

.discordUserActionRolesSearchWrap{
  position:relative;
}

.discordUserActionRolesList{
  display:flex;
  flex-direction:column;
  gap:2px;
  max-height:340px;
  overflow-y:auto;
  padding:4px;
  background:#1e1f22;
  border-radius:3px;
}

.discordUserActionRoleItem{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-radius:3px;
  cursor:pointer;
  transition:background-color .08s ease;
  color:#dbdee1;
  font-size:.875rem;
  line-height:1.25;
}

.discordUserActionRoleItem:hover{
  background:#35373c;
}

.discordUserActionRoleItem.isDisabled{
  opacity:.5;
  cursor:not-allowed;
}

.discordUserActionRoleItem.isDisabled:hover{
  background:transparent;
}

.discordUserActionRoleCheckbox{
  width:16px;
  height:16px;
  border-radius:3px;
  border:2px solid #4e5058;
  flex-shrink:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#1e1f22;
  transition:background-color .08s ease, border-color .08s ease;
}

.discordUserActionRoleItem.isChecked .discordUserActionRoleCheckbox{
  background:#5865f2;
  border-color:#5865f2;
}

.discordUserActionRoleCheckbox::after{
  content:"";
  display:none;
  width:4px;
  height:8px;
  border:solid #fff;
  border-width:0 2px 2px 0;
  transform:rotate(45deg) translate(-1px, -1px);
}

.discordUserActionRoleItem.isChecked .discordUserActionRoleCheckbox::after{
  display:block;
}

.discordUserActionRoleDot{
  width:10px;
  height:10px;
  border-radius:50%;
  flex-shrink:0;
}

.discordUserActionRoleName{
  flex:1 1 auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordUserActionRoleHoist{
  font-size:.6875rem;
  color:#949ba4;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.02em;
  flex-shrink:0;
}

.discordUserActionRolesEmpty{
  padding:14px;
  text-align:center;
  color:#949ba4;
  font-size:.875rem;
}

.discordUserActionRolesLoading{
  padding:14px;
  text-align:center;
  color:#949ba4;
  font-size:.875rem;
}

.discordUserActionFooter{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin-top:4px;
}

.discordUserActionFooter .btn{
  min-height:38px;
  padding:2px 16px;
  font-size:.875rem;
  font-weight:500;
  border-radius:3px;
  border:0;
}

.discordUserActionFooter .btn.ghost{
  background:transparent;
  color:#fff;
}

.discordUserActionFooter .btn.ghost:hover{
  text-decoration:underline;
  background:transparent;
}

.discordUserActionFooter .btn.primary{
  background:#5865f2;
  color:#fff;
}

.discordUserActionFooter .btn.primary:hover{
  background:#4752c4;
}

.discordUserActionFooter .btn.primary.isDestructive{
  background:#f23f42;
}

.discordUserActionFooter .btn.primary.isDestructive:hover{
  background:#c72f32;
}

.discordUserActionFooter .btn.primary:disabled{
  background:rgba(88,101,242,.5);
  cursor:not-allowed;
}

.discordUserActionFooter .btn.primary.isDestructive:disabled{
  background:rgba(242,63,66,.5);
}

.discordUserActionRolesHint{
  padding:10px 12px;
  background:rgba(88,101,242,.08);
  border-left:3px solid #5865f2;
  border-radius:3px;
  color:#b5bac1;
  font-size:.8125rem;
  line-height:1.375;
}

.discordUserActionRolesSection{
  display:flex;
  flex-direction:column;
  gap:2px;
}

.discordUserActionRolesSection + .discordUserActionRolesSection{
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.06);
}

.discordUserActionRolesSectionHeader{
  display:flex;
  align-items:center;
  gap:6px;
  padding:4px 8px 6px;
  font-size:.6875rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#949ba4;
  line-height:1.25;
}

.discordUserActionRolesSectionCount{
  font-size:.6875rem;
  font-weight:500;
  color:#6d6f78;
}

.discordUserProfileHero{
  position:relative;
  margin:-16px -16px 0;
  height:120px;
  border-radius:4px 4px 0 0;
  overflow:visible;
}

.discordUserProfileBanner{
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, #5865f2 0%, #4752c4 100%);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  border-radius:4px 4px 0 0;
  overflow:hidden;
}

.discordUserProfileAvatar{
  position:absolute;
  left:16px;
  bottom:-40px;
  width:92px;
  height:92px;
  border-radius:50%;
  background:#313338;
  padding:6px;
  box-sizing:border-box;
  z-index:2;
}

.discordUserProfileAvatar img{
  width:80px;
  height:80px;
  border-radius:50%;
  display:block;
  object-fit:cover;
}

.discordUserProfileAvatarFallback{
  width:80px;
  height:80px;
  border-radius:50%;
  background:rgba(88,101,242,.32);
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:1.75rem;
  font-weight:600;
}

.discordUserProfileMain{
  padding-top:52px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.discordUserProfileNameRow{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  flex-wrap:wrap;
}

.discordUserProfileName{
  font-size:1.375rem;
  font-weight:700;
  color:#f2f3f5;
  line-height:1.25;
  overflow:hidden;
  text-overflow:ellipsis;
}

.discordUserProfileHandle{
  font-size:.875rem;
  color:#949ba4;
  line-height:1.25;
  margin-top:-6px;
}

.discordUserProfileBotBadge{
  font-size:.625rem;
  font-weight:700;
  letter-spacing:.02em;
  background:#5865f2;
  color:#fff;
  padding:2px 5px;
  border-radius:3px;
  line-height:1.25;
  text-transform:uppercase;
}

.discordUserProfileSection{
  background:#1e1f22;
  border-radius:3px;
  padding:12px;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.discordUserProfileSectionTitle{
  font-size:.6875rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.02em;
  color:#b5bac1;
  line-height:1.25;
  display:flex;
  align-items:baseline;
  gap:6px;
}

.discordUserProfileRolesCount{
  font-size:.6875rem;
  font-weight:500;
  color:#6d6f78;
}

.discordUserProfileInfo{
  display:flex;
  flex-direction:column;
  gap:6px;
}

.discordUserProfileInfoRow{
  display:flex;
  align-items:baseline;
  gap:12px;
  font-size:.875rem;
  line-height:1.375;
}

.discordUserProfileInfoLabel{
  flex:0 0 110px;
  color:#949ba4;
  font-size:.75rem;
  text-transform:uppercase;
  letter-spacing:.02em;
  font-weight:600;
}

.discordUserProfileInfoValue{
  flex:1 1 auto;
  color:#dbdee1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
}

.discordUserProfileMono{
  font-family:ui-monospace, "Consolas", "Monaco", monospace;
  font-size:.8125rem;
  color:#dbdee1;
  background:rgba(255,255,255,.04);
  padding:2px 5px;
  border-radius:3px;
}

.discordUserProfileRoles{
  display:flex;
  flex-wrap:wrap;
  gap:4px;
}

.discordUserProfileRoleChip{
  display:inline-flex;
  align-items:center;
  gap:4px;
  padding:4px 8px 4px 6px;
  background:#2b2d31;
  border:1px solid rgba(255,255,255,.06);
  border-radius:4px;
  font-size:.8125rem;
  color:#dbdee1;
  line-height:1.25;
}

.discordUserProfileRoleDot{
  width:10px;
  height:10px;
  border-radius:50%;
  flex-shrink:0;
}

.discordEmojiPicker{
  position:fixed;
  z-index:10000;
  width:min(420px, calc(100vw - 24px));
  max-height:min(520px, calc(100dvh - 40px));
  padding:0;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:#1e1f22;
  box-shadow:0 18px 40px rgba(0,0,0,.38);
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.discordEmojiPickerHead{
  padding:10px 10px 6px 10px;
  flex:0 0 auto;
}

.discordEmojiPickerSearch{
  display:flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:6px;
  border:0;
  background:#111214;
}

.discordEmojiPickerSearch input{
  flex:1 1 auto;
  min-width:0;
  height:26px;
  border:0;
  background:transparent;
  color:#dbdee1;
  font-family:inherit;
  font-size:.9rem;
  outline:none;
}

.discordEmojiPickerSearch input::placeholder{
  color:#72767d;
}

.discordEmojiPickerBody{
  flex:1 1 auto;
  min-height:0;
  display:grid;
  grid-template-columns:44px 1fr;
  gap:0;
}

.discordEmojiPickerTabs{
  display:flex;
  flex-direction:column;
  align-items:stretch;
  gap:2px;
  padding:4px 2px;
  background:#2b2d31;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:none;
}

.discordEmojiPickerTabs::-webkit-scrollbar{
  display:none;
}

.discordEmojiPickerTab{
  border:0;
  background:transparent;
  width:40px;
  height:40px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:20px;
  line-height:1;
  border-radius:6px;
  color:inherit;
  transition:background-color .08s ease;
  flex-shrink:0;
}

.discordEmojiPickerTab:hover{
  background:rgba(255,255,255,.06);
}

.discordEmojiPickerTab.isActive{
  background:rgba(88,101,242,.18);
}

.discordEmojiPickerContent{
  overflow-y:auto;
  overflow-x:hidden;
  padding:4px 6px 8px 10px;
  scrollbar-gutter:stable;
}

.discordEmojiPickerContent::-webkit-scrollbar{
  width:8px;
}

.discordEmojiPickerContent::-webkit-scrollbar-track{
  background:transparent;
}

.discordEmojiPickerContent::-webkit-scrollbar-thumb{
  background:rgba(0,0,0,.32);
  border-radius:4px;
}

.discordEmojiPickerSection{
  margin:0 0 10px 0;
}

.discordEmojiPickerSection:last-child{
  margin-bottom:4px;
}

.discordEmojiPickerSectionLabel{
  position:sticky;
  top:0;
  z-index:1;
  margin:0 -6px;
  padding:8px 6px 4px 6px;
  background:#1e1f22;
  color:#b5bac1;
  font-size:.75rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.02em;
  line-height:1;
}

.discordEmojiPickerGrid{
  display:grid;
  grid-template-columns:repeat(9, 1fr);
  gap:0;
}

.discordEmojiPickerBtn{
  width:100%;
  aspect-ratio:1;
  min-height:36px;
  border:0;
  border-radius:4px;
  background:transparent;
  color:#fff;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:22px;
  line-height:1;
  transition:background-color .08s ease, transform .08s ease;
  padding:0;
}

.discordEmojiPickerBtn:hover{
  background:rgba(255,255,255,.06);
}

.discordEmojiPickerBtn:active{
  transform:scale(.9);
}

.discordEmojiPickerCustomRow{
  flex:0 0 auto;
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  border-top:1px solid rgba(0,0,0,.32);
  background:#2b2d31;
}

.discordEmojiPickerCustomLabel{
  font-size:.72rem;
  color:#b5bac1;
  flex:0 0 auto;
  text-transform:uppercase;
  font-weight:600;
  letter-spacing:.02em;
}

.discordEmojiPickerCustomInput{
  flex:1 1 auto;
  min-width:0;
  height:26px;
  padding:3px 8px;
  border:0;
  background:#1e1f22;
  color:#dbdee1;
  font-family:inherit;
  font-size:.85rem;
  border-radius:4px;
  outline:none;
}

.discordEmojiPickerCustomInput:focus{
  outline:2px solid rgba(88,101,242,.6);
  outline-offset:-1px;
}

.discordEmojiPickerEmpty{
  padding:24px 8px;
  text-align:center;
  color:#949ba4;
  font-size:.875rem;
}

.discordPollAnswerEmojiBtn{
  flex:0 0 auto;
  width:54px;
  height:42px;
  border-radius:12px;
  border:1px dashed rgba(255,255,255,.14);
  background:rgba(255,255,255,.03);
  color:var(--text);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:20px;
  line-height:1;
  transition:background .12s ease, border-color .12s ease, transform .12s ease;
}

.discordPollAnswerEmojiBtn:hover{
  background:rgba(255,255,255,.06);
  border-color:rgba(var(--accent-rgb), .32);
  border-style:solid;
}

.discordPollAnswerEmojiBtn:active{
  transform:scale(.94);
}

.discordPollAnswerEmojiBtn.hasEmoji{
  border-style:solid;
  border-color:rgba(255,255,255,.14);
  background:rgba(255,255,255,.05);
}

.discordPollAnswerEmojiBtn .discordPollAnswerEmojiEmpty{
  opacity:.5;
  font-size:15px;
}

.discordMessageMenu{
  position:fixed;
  z-index:9999;
  min-width:220px;
  max-width:min(280px, calc(100vw - 24px));
  padding:8px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(15,18,28,.98);
  box-shadow:0 18px 40px rgba(0,0,0,.38);
  backdrop-filter:blur(14px);
}

.discordMessageMenuAction{
  width:100%;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);
  color:#fff;
  border-radius:10px;
  padding:10px 12px;
  text-align:left;
  font-weight:700;
  cursor:pointer;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}

.discordMessageMenuAction:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(255,255,255,.12);
}

.discordMessageMenuAddReaction{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:4px;
}

.discordMessageMenuAddReaction .discordMessageMenuIcon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
}

.discordMessageMenuAddReaction > span:nth-child(2){
  flex:1 1 auto;
  min-width:0;
}

.discordMessageMenuChevron{
  flex-shrink:0;
  color:#b5bac1;
  font-size:18px;
  line-height:1;
  opacity:.72;
}

.discordMessageMenuAction.danger{
  color:#ffb3b3;
  border-color:rgba(255,77,77,.24);
}

.discordMessageMenuAction.danger:hover{
  background:rgba(255,77,77,.12);
  border-color:rgba(255,77,77,.34);
}

.discordMessageMenuReactions{
  display:flex;
  align-items:center;
  gap:4px;
  padding:2px;
  margin-bottom:6px;
}

.discordMessageMenuReactionBtn{
  flex:1 1 auto;
  min-width:36px;
  height:36px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:18px;
  line-height:1;
  transition:background .12s ease, transform .12s ease;
}

.discordMessageMenuReactionBtn:hover{
  background:rgba(255,255,255,.10);
}

.discordMessageMenuReactionBtn:active{
  transform:scale(.92);
}

.discordMessageMenuReactionBtn.isActive{
  background:rgba(88,101,242,.2);
  box-shadow:inset 0 0 0 1px rgba(88,101,242,.7);
}

.discordMessageMenuReactionBtn.isActive:hover{
  background:rgba(88,101,242,.32);
}

.discordMessageMenuDivider{
  height:1px;
  background:rgba(255,255,255,.08);
  margin:6px 2px;
}

.discordMessageMenu .discordMessageMenuAction{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:4px;
}

.discordMessageMenu .discordMessageMenuAction:first-of-type{
  margin-top:0;
}

.discordMessageMenuIcon{
  width:22px;
  font-size:15px;
  line-height:1;
  text-align:center;
  flex:0 0 auto;
  opacity:.85;
}

.discordComposerReplyBar{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 10px;
  margin-bottom:6px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(var(--accent-rgb), .10);
  font-size:.9rem;
}

.discordTypingIndicator{
  display:flex;
  align-items:center;
  gap:6px;
  height:22px;
  padding:2px 10px 0;
  color:#b5bac1;
  font-size:.8125rem;
  line-height:1.25;
  user-select:none;
  pointer-events:none;
}

.discordTypingDots{
  display:inline-flex;
  gap:2px;
  align-items:flex-end;
  height:8px;
  flex-shrink:0;
}

.discordTypingDots > span{
  width:4px;
  height:4px;
  border-radius:50%;
  background:#b5bac1;
  animation:discordTypingPulse 1.4s ease-in-out infinite;
}

.discordTypingDots > span:nth-child(2){
  animation-delay:.2s;
}

.discordTypingDots > span:nth-child(3){
  animation-delay:.4s;
}

@keyframes discordTypingPulse{
  0%, 60%, 100%{ opacity:.25; transform:translateY(0); }
  30%{ opacity:1; transform:translateY(-2px); }
}

.discordTypingText{
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordTypingText strong{
  font-weight:600;
  color:#dbdee1;
}

.discordComposerReplyIcon{
  font-size:14px;
  line-height:1;
  color:rgba(var(--accent-rgb), 1);
  flex:0 0 auto;
}

.discordComposerReplyLabel{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:700;
}

.discordComposerReplyCancel{
  flex:0 0 auto;
  width:24px;
  height:24px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.08);
  color:#fff;
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:13px;
  font-weight:900;
  line-height:1;
  transition:background .12s ease, transform .12s ease;
}

.discordComposerReplyCancel:hover{
  background:rgba(255,255,255,.14);
}

.discordComposerReplyCancel:active{
  transform:scale(.92);
}

@media (max-width: 1100px){
  .discordViewHeaderActions{
    width:100%;
    justify-content:stretch;
    flex-wrap:wrap;
  }

  .discordViewSearchGroup{
    flex:1 1 100%;
    min-width:0;
    max-width:none;
  }

  #discordViewSearchBtn{
    min-width:96px;
  }

  .discordComposerActionBtn,
  .discordComposerSendBtn{
    width:34px;
    height:34px;
  }

  .discordComposerPlusIcon{
    font-size:20px;
  }

  .discordComposerSendIcon{
    font-size:13px;
  }

  .discordViewShell{
    grid-template-columns:1fr;
  }

  body.mode-serverview .main.wrap{
    height:calc(100dvh - 86px);
  }

  body.mode-serverview #discordViewCard{
    height:100%;
  }
}

.discordPollModalCard{
  width:min(640px, calc(100vw - 32px));
  max-height:calc(100dvh - 150px);
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.discordPollHead{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding-right:34px;
}

.discordPollTitle{
  font-size:18px;
  font-weight:900;
  line-height:1.1;
}

.discordPollSubtitle{
  color:rgba(231,234,242,.62);
  font-size:.92rem;
  margin-top:4px;
}

.discordPollCloseBtn{
  position:absolute;
  top:12px;
  right:12px;
}

.discordPollBody{
  display:flex;
  flex-direction:column;
  gap:14px;
  overflow:auto;
  padding-right:4px;
  scrollbar-gutter:stable;
}

.discordPollField{
  display:flex;
  flex-direction:column;
  gap:6px;
  min-width:0;
}

.discordPollLabel{
  font-size:.82rem;
  font-weight:800;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(231,234,242,.72);
}

#discordPollQuestionInput{
  width:100%;
  min-height:42px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-family:inherit;
  font-size:.96rem;
  outline:none;
  transition:border-color .15s ease, background .15s ease;
}

#discordPollQuestionInput:focus,
#discordPollQuestionInput:focus-visible{
  border-color:rgba(var(--accent-rgb), .32);
  background:rgba(255,255,255,.06);
  box-shadow:none;
}

.discordPollHint{
  font-size:.78rem;
  color:rgba(231,234,242,.48);
  text-align:right;
}

.discordPollAnswers{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.discordPollAnswer{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.discordPollAnswerEmoji{
  flex:0 0 auto;
  width:54px;
  height:42px;
  padding:8px 6px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-family:inherit;
  font-size:1rem;
  text-align:center;
  outline:none;
  transition:border-color .15s ease, background .15s ease;
}

.discordPollAnswerText{
  flex:1 1 auto;
  min-width:0;
  height:42px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:var(--text);
  font-family:inherit;
  font-size:.96rem;
  outline:none;
  transition:border-color .15s ease, background .15s ease;
}

.discordPollAnswerEmoji:focus,
.discordPollAnswerEmoji:focus-visible,
.discordPollAnswerText:focus,
.discordPollAnswerText:focus-visible{
  border-color:rgba(var(--accent-rgb), .32);
  background:rgba(255,255,255,.06);
  box-shadow:none;
}

.discordPollAnswerRemove{
  flex:0 0 auto;
  width:36px;
  height:36px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.06);
  color:var(--text);
  cursor:pointer;
  display:grid;
  place-items:center;
  font-size:14px;
  font-weight:900;
  transition:background .15s ease, transform .12s ease;
}

.discordPollAnswerRemove:hover:not(:disabled){
  background:rgba(255,77,77,.18);
  color:#ffb3b3;
}

.discordPollAnswerRemove:active:not(:disabled){
  transform:scale(.94);
}

.discordPollAnswerRemove:disabled{
  opacity:.35;
  cursor:not-allowed;
}

.discordPollAddAnswerBtn{
  align-self:flex-start;
  margin-top:2px;
}

.discordPollRow{
  display:flex;
  align-items:flex-end;
  gap:14px;
  flex-wrap:wrap;
}

.discordPollFieldDuration{
  flex:1 1 240px;
  min-width:200px;
}

.discordPollFieldDuration .selectWrap{
  width:100%;
}

.discordPollFieldDuration select{
  width:100%;
  min-height:42px;
}

.discordPollCheckbox{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 0;
  cursor:pointer;
  user-select:none;
  font-weight:700;
  flex:0 0 auto;
}

.discordPollCheckbox input[type="checkbox"]{
  width:18px;
  height:18px;
  accent-color:rgba(var(--accent-rgb), 1);
  cursor:pointer;
}

.discordPollFooter{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  padding-top:4px;
  border-top:1px solid rgba(255,255,255,.08);
  margin-top:4px;
  padding:12px 0 0 0;
}

#discordPollSubmitBtn{
  min-width:160px;
}

#discordPollSubmitBtn:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.discordCustomCommandModalCard{
  width:min(720px, calc(100vw - 32px));
  max-height:calc(100dvh - 150px);
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.discordCustomCommandHead{
  display:flex;
  align-items:flex-start;
  gap:14px;
  padding-right:34px;
}

.discordCustomCommandTitle{
  font-size:18px;
  font-weight:900;
  line-height:1.1;
}

.discordCustomCommandSubtitle{
  color:rgba(231,234,242,.62);
  font-size:.92rem;
  margin-top:4px;
}

.discordCustomCommandCloseBtn{
  position:absolute;
  top:12px;
  right:12px;
}

.discordCustomCommandToolbar{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.discordCustomCommandSearchGroup{
  flex:1 1 100%;
  min-width:0;
}

.discordCustomCommandSearchGroup .logsSearchWrap{
  width:100%;
  min-width:0;
  margin:0;
}

.discordCustomCommandSearchGroup .logsSearchRow{
  display:flex;
  align-items:center;
  gap:10px;
}

.discordCustomCommandSearchGroup .logsSearchField{
  flex:1 1 auto;
  min-width:0;
  height:42px;
  padding-right:6px;
  border-color:rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}

#discordCustomCommandSearchInput{
  flex:1 1 auto;
  min-width:0;
  height:42px;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  outline:none !important;
  box-shadow:none !important;
  color:#fff;
  font-size:.96rem;
}

#discordCustomCommandSearchInput::placeholder{
  color:rgba(255,255,255,.55);
}

#discordCustomCommandSearchInput:focus,
#discordCustomCommandSearchInput:focus-visible{
  outline:none !important;
  box-shadow:none !important;
}

.discordCustomCommandList{
  flex:1 1 auto;
  min-height:180px;
  max-height:min(60dvh, 560px);
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:6px;
  padding-right:4px;
  scrollbar-gutter:stable;
}

.discordCustomCommandItem{
  width:100%;
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:12px;
  background:rgba(255,255,255,.04);
  color:var(--text);
  cursor:pointer;
  text-align:left;
  transition:background .12s ease, border-color .12s ease, transform .12s ease;
}

.discordCustomCommandItem:hover:not(:disabled){
  background:rgba(255,255,255,.07);
  border-color:rgba(255,255,255,.12);
}

.discordCustomCommandItem:active:not(:disabled){
  transform:scale(.995);
}

.discordCustomCommandItem:disabled{
  opacity:.55;
  cursor:not-allowed;
}

.discordCustomCommandTrigger{
  font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size:.9rem;
  font-weight:800;
  padding:3px 8px;
  border-radius:8px;
  background:rgba(var(--accent-rgb), .16);
  color:#c9d8ff;
  flex:0 0 auto;
  white-space:nowrap;
}

.discordCustomCommandName{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:700;
}

.discordCustomCommandWarn{
  flex:0 0 auto;
  font-size:.78rem;
  font-weight:700;
  color:rgba(255,200,120,.85);
  padding:2px 8px;
  border-radius:999px;
  background:rgba(255,160,80,.14);
  border:1px solid rgba(255,160,80,.24);
  white-space:nowrap;
}

.discordCustomCommandLoading,
.discordCustomCommandEmpty{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:24px 12px;
  color:rgba(231,234,242,.60);
  line-height:1.5;
  text-align:center;
}

.discordAuditLogModalCard{
  width:min(1240px, calc(100vw - 32px));
  max-height:calc(100dvh - 150px);
  padding:18px;
  display:flex;
  flex-direction:column;
  gap:14px;
  overflow:hidden;
}

.discordAuditLogCloseBtn{
  position:absolute;
  top:12px;
  right:12px;
  z-index:2;
}

.discordAuditLogHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding-right:42px;
}

.discordAuditLogTitle{
  font-size:1.28rem;
  font-weight:900;
  line-height:1.1;
  color:#fff;
}

.discordAuditLogSubtitle{
  margin-top:4px;
  color:rgba(231,234,242,.66);
  font-size:.92rem;
}

.discordAuditLogToolbar{
  display:grid;
  grid-template-columns:minmax(0, 1.2fr) minmax(260px, .9fr) 240px auto auto;
  gap:10px;
  align-items:center;
}

.discordAuditLogSearchGroup{
  min-width:0;
  max-width:none;
}

.discordAuditLogSearchGroup.discordViewSearchGroup{
  flex:1 1 auto;
  min-width:0;
  max-width:none;
}

.discordAuditLogSelectWrap{
  min-width:0;
}

.discordAuditLogSelectWrap .ms{
  width:100%;
}

.discordAuditLogSelectWrap .msBtn{
  min-height:42px;
}

.discordAuditLogSelectWrap .msPanel{
  z-index:260;
}

.discordAuditLogSelectWrap .msSearch{
  width:100%;
}

.discordAuditLogSelectWrap select{
  display:none !important;
}

.discordAuditLogBody{
  min-height:340px;
  max-height:calc(100dvh - 345px);
  overflow:auto;
  padding-right:4px;
  display:flex;
  flex-direction:column;
}

.discordAuditEntry + .discordAuditEntry{
  border-top:1px solid rgba(255,255,255,.07);
}

.discordAuditLogFooter{
  display:flex;
  justify-content:center;
  align-items:center;
  min-height:40px;
}

.discordAuditEntry{
  display:grid;
  grid-template-columns:40px minmax(0, 1fr);
  gap:12px;
  padding:12px 8px;
  border:none;
  border-radius:12px;
  background:transparent;
  transition:background .15s ease;
}

.discordAuditEntry:hover{
  background:rgba(255,255,255,.035);
}

.discordAuditEntryAvatar{
  width:40px;
  height:40px;
  border-radius:50%;
  overflow:hidden;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  flex:0 0 auto;
}

.discordAuditEntryAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.discordAuditEntryAvatarFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-weight:900;
  color:#fff;
  background:linear-gradient(135deg, rgba(88,101,242,.9), rgba(64,78,237,.7));
}

.discordAuditEntryMain{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.discordAuditEntryTop{
  display:flex;
  align-items:baseline;
  gap:8px;
  min-width:0;
}

.discordAuditEntryActor{
  font-weight:900;
  color:#fff;
  word-break:break-word;
}

.discordAuditEntryTime{
  color:rgba(231,234,242,.56);
  font-size:.82rem;
  margin-left:auto;
  white-space:nowrap;
}

.discordAuditEntrySummary{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  line-height:1.45;
  word-break:break-word;
}

.discordAuditEntryAction{
  color:rgba(231,234,242,.74);
  font-weight:800;
}

.discordAuditEntryTarget{
  font-weight:900;
  color:#fff;
}

.discordAuditEntryBadges{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.discordAuditEntryBadge{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:rgba(231,234,242,.82);
  font-size:.82rem;
  font-weight:700;
  line-height:1.25;
}

.discordAuditChanges{
  display:flex;
  flex-direction:column;
  gap:6px;
  padding-top:2px;
}

.discordAuditChange{
  display:grid;
  grid-template-columns:minmax(120px, 170px) minmax(0, 1fr);
  gap:10px;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.03);
}

.discordAuditChangeKey{
  font-weight:800;
  color:#fff;
  word-break:break-word;
}

.discordAuditChangeDiff{
  min-width:0;
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
}

.discordAuditChangeOld,
.discordAuditChangeNew{
  min-width:0;
  white-space:pre-wrap;
  word-break:break-word;
}

.discordAuditChangeOld{
  color:#fca5a5;
}

.discordAuditChangeNew{
  color:#86efac;
}

.discordAuditChangeArrow{
  color:rgba(231,234,242,.52);
  font-weight:900;
}

.discordAuditEmpty{
  min-height:320px;
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  color:rgba(231,234,242,.66);
  font-weight:800;
  padding:24px;
}

@media (max-width: 1180px){
  .discordAuditLogToolbar{
    grid-template-columns:1fr 1fr;
  }
}

@media (max-width: 760px){
  .discordAuditLogToolbar{
    grid-template-columns:1fr;
  }

  .discordAuditLogBody{
    max-height:calc(100dvh - 390px);
  }

  .discordAuditEntryTop{
    flex-wrap:wrap;
  }

  .discordAuditEntryTime{
    margin-left:0;
  }

  .discordAuditChange{
    grid-template-columns:1fr;
  }
}

.discordEmbedMediaLink{
  display:block;
  width:min(100%, 520px);
  max-width:100%;
  text-decoration:none;
  color:inherit;
}

.discordEmbedMediaWrap{
  position:relative;
  width:100%;
  border-radius:12px;
  overflow:hidden;
  background:#11141a;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

.discordEmbedMediaImage,
.discordEmbedMediaVideo{
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:420px;
  margin:0 auto;
  object-fit:contain;
  background:#11141a;
}

.discordEmbedMediaVideo{
  outline:none;
}

.discordEmbedGifBadge{
  position:absolute;
  right:10px;
  bottom:10px;
  min-height:22px;
  padding:0 8px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.04em;
  color:#fff;
  background:rgba(0,0,0,.58);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(8px);
}

.discordEmbed.isGifEmbed .discordEmbedThumb{
  display:none;
}

.sanktionKatalogForm{
  margin-top:12px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.sanktionKatalogRow{
  display:grid;
  grid-template-columns:minmax(0, 170px) minmax(0, 170px);
  gap:12px;
  align-items:start;
}

.sanktionFieldSmall{
  min-width:0;
}

.sanktionFieldText{
  min-width:0;
}

.sanktionInputShell{
  position:relative;
  display:flex;
  align-items:center;
}

.sanktionInputShell input{
  width:100%;
  min-width:0;
  height:44px;
}

.sanktionInputPrefix,
.sanktionInputSuffix{
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  pointer-events:none;
  font-size:.92rem;
  font-weight:900;
  color:rgba(231,234,242,.72);
}

.sanktionInputPrefix{
  left:14px;
}

.sanktionInputSuffix{
  right:14px;
}

#sanktionParaNr{
  padding-left:34px;
}

#sanktionParaStrafe{
  padding-right:34px;
}

#sanktionParaText{
  min-height:140px;
  resize:vertical;
}

@media (max-width: 700px){
  .sanktionKatalogRow{
    grid-template-columns:1fr;
  }
}

:root{
  --dash-bg-color:#121214;
  --dash-bg-image:none;
  --dash-bg-size:auto;
  --dash-bg-position:center center;
  --dash-bg-repeat:no-repeat;
  --dash-bg-blur:0px;
  --dash-bg-dim:0;
  --dash-topbar-blur:10px;
  --dash-theme-card-glow:0 12px 40px rgba(0,0,0,.35);
}

html{
  background-color: var(--dash-bg-color) !important;
  background-image: none !important;
}

body{
  position:relative;
  isolation:isolate;
  background:#121214 !important;
}

body::before{
  content:none !important;
}

body::after{
  content:none !important;
}

.topbar{
  backdrop-filter:blur(var(--dash-topbar-blur)) !important;
}

.card{
  box-shadow:var(--dash-theme-card-glow) !important;
}

@media (max-width: 760px){
  .wrap{
    padding: 12px;
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
    padding-bottom: max(12px, env(safe-area-inset-bottom));
  }

  .topbar{
    padding-top: env(safe-area-inset-top);
  }

  .topbar .row.space{
    min-height: auto;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .topTitle{
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
  }

  .titleText h1{
    margin: 0;
    font-size: 18px;
    line-height: 1.15;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .titleText p{
    font-size: 12px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .topActions{
    width: 100%;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    align-items: stretch;
  }

  .topActions > .btn,
  .topActions > .authBox{
    width: 100%;
    min-width: 0;
  }

  .topActions > .authBox{
    grid-column: 1 / -1;
  }

  .usersBtn{
    min-height: 48px;
    height: auto;
    padding: 12px;
    justify-content: center;
    text-align: center;
    white-space: normal;
  }

  .authBox{
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    justify-content: initial;
    min-height: 56px;
    width: 100%;
  }

  .authBox > div{
    min-width: 0;
  }

  .authGoodName,
  .authBox .muted.small{
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .authBox .btn{
    min-width: 0;
  }

  .card,
  .subcard,
  .field,
  .selectWrap,
  .ms{
    min-width: 0;
  }

  input,
  select,
  textarea{
    font-size: 16px;
  }

  .usersHeader{
    flex-direction: column;
    align-items: stretch;
  }

  .usersHeaderActions{
    width: 100%;
    justify-content: stretch;
    flex-wrap: wrap;
  }

  .usersHeaderActions .btn{
    min-width: 0;
  }

  .serverGrid{
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  }

  #actionRow{
    flex-direction: column;
    align-items: stretch;
  }

  #actionRow .btn,
  #actionRow a.btn{
    width: 100%;
    min-width: 0;
  }

  .btn.big{
    width: 100%;
    min-width: 0;
  }

  .factionGrid{
    grid-template-columns: 1fr;
  }

  .factionActions{
    justify-content: stretch;
  }

  .factionActions .btn{
    width: 100%;
  }

  body.mode-config .layout{
    grid-template-columns: 1fr;
  }

  body.mode-config .main.wrap{
    max-width: none;
    width: 100%;
    margin: 0;
    padding-left: 0;
    padding-right: 0;
  }

  body.mode-config .sidebar{
    width: min(300px, calc(100vw - 28px));
    height: 100vh;
    height: 100dvh;
    top: 0;
    position: fixed;
    opacity: 1;
    transform: translateX(-105%);
    transition: transform .25s ease;
    z-index: 9999;
    border-top-right-radius: 18px;
    border-bottom-right-radius: 18px;
    padding-top: max(18px, env(safe-area-inset-top));
    padding-bottom: max(18px, env(safe-area-inset-bottom));
  }

  body.sidebar-open .sidebar{
    transform: translateX(0);
  }

  body.sidebar-open{
    overflow: hidden;
  }

  .sidebar .backText{
    font-size: 10px;
  }

  .sideList{
    grid-template-columns: repeat(3, 56px);
    gap: 10px;
  }

  .sideIcon{
    width: 56px;
    height: 56px;
    border-radius: 16px;
  }

  body.mode-config .configLayout{
    display: flex;
    flex-direction: column;
    gap: 12px;
  }

  body.mode-config .configRail{
    order: -1;
    position: static;
    top: auto;
    display: grid;
    gap: 12px;
  }

  body.mode-config .configMain{
    order: 2;
    padding-right: 0;
  }

  body.mode-config .configRail .railBox{
    padding: 12px;
  }

  body.mode-config .modulesDock{
    max-height: none;
    padding-right: 0;
  }

  body.mode-config #toastWrap,
  body.mode-config #missingWrap{
    position: static;
    top: auto;
    right: auto;
    left: auto;
    width: 100%;
    max-width: none;
    padding: 0 !important;
    margin: 0 0 12px 0 !important;
  }

  body.mode-config #toast,
  body.mode-config #missingToast{
    width: 100%;
    white-space: normal;
    overflow: visible;
    text-overflow: clip;
  }

  .msPanel{
    max-height: min(52dvh, 360px);
  }

  .logsTop{
    flex-direction: column;
    align-items: stretch;
  }

  .logsTitle{
    width: 100%;
    min-width: 0;
  }

  #logsTitleServer{
    max-width: none !important;
  }

  .logsMainFilter{
    width: 100%;
    display: grid !important;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .logsMainFilterMeta{
    min-width: 0;
  }

  .logsToolbar{
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .logsToolbar .logsToolGroup{
    width: 100%;
    min-width: 0;
  }

  .logsSearchRow{
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .logsSearchField{
    width: 100%;
    min-width: 0;
  }

  .logsSearchNav{
    margin-left: auto;
  }

  .logsCountBadge{
    width: 100%;
    text-align: left;
  }

  .logsActionGroup{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .logsBackGroup{
    display: grid;
    grid-template-columns: 1fr;
  }

  .logsActionGroup .btn,
  .logsBackGroup .btn{
    width: 100%;
    min-width: 0;
  }

  .logBox{
    min-height: 55dvh;
  }

  body.mode-users .main.wrap,
  body.mode-servers .main.wrap,
  body.mode-logs .main.wrap,
  body.mode-serverview .main.wrap{
    padding-left: 12px;
    padding-right: 12px;
  }

  .idRow{
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .userCell{
    flex: 1 1 auto;
  }

  .idRowActions{
    width: 100%;
    justify-content: stretch;
    flex-wrap: wrap;
  }

  .idRowActions .btn,
  .idRowActions .btn.sm{
    width: 100%;
    min-width: 0;
  }

  body.mode-serverview{
    overflow: auto;
  }

  body.mode-serverview .layout{
    height: auto;
    overflow: visible;
  }

  body.mode-serverview #discordViewCard{
    height: auto;
    min-height: 0;
  }

  .discordViewHeaderActions{
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }

  .discordViewSearchGroup{
    grid-column: 1 / -1;
    min-width: 0;
    max-width: none;
  }

  .discordViewSearchGroup .logsSearchRow{
    flex-wrap: wrap;
  }

  #discordViewBackBtn,
  #discordViewRefreshBtn,
  #discordViewAuditLogBtn,
  #discordViewSearchBtn{
    width: 100%;
    min-width: 0;
  }

  .discordViewShell{
    grid-template-columns: 1fr;
    height: auto;
    padding-bottom: 0;
    gap: 12px;
  }

  .discordViewContent{
    order: 1;
  }

  .discordViewSidebar{
    order: 2;
  }

  .discordViewTree{
    max-height: 38dvh;
  }

  .discordViewMessages{
    min-height: 48dvh;
    max-height: none;
  }

  .discordComposerPreviewItem.isImage img{
    width: 76px;
    height: 76px;
  }

  .discordComposerPreviewFile{
    max-width: 180px;
  }

  .discordComposerMenu{
    min-width: 220px;
  }

  .discordCustomCommandModalCard{
    width: 100%;
    max-height: min(92dvh, 920px);
    padding: 14px;
  }

  .discordCustomCommandList{
    max-height: 60dvh;
  }

  .discordCustomCommandItem{
    flex-wrap: wrap;
  }

  .discordPollModalCard{
    width: 100%;
    max-height: min(92dvh, 920px);
    padding: 14px;
  }

  .discordPollAnswerEmoji{
    width: 46px;
  }

  .discordPollRow{
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .discordPollFieldDuration{
    min-width: 0;
  }

  .discordPollFooter{
    flex-direction: column-reverse;
  }

  .discordEmojiPicker{
    width: calc(100vw - 24px);
  }

  .discordEmojiPickerGrid{
    grid-template-columns: repeat(7, 1fr);
  }

  .discordPollAnswerEmojiBtn{
    width: 46px;
  }

  .discordBotControlBar{
    padding: 6px 8px;
  }

  .discordBotControlBtn{
    width: 30px;
    height: 30px;
  }

  .discordBotSettingsCard{
    width: 100%;
    max-height: min(92dvh, 920px);
    padding: 14px;
  }

  .discordBotSettingsRow{
    flex-direction: column;
    align-items: stretch;
  }

  .discordBotSettingsRow .selectWrap,
  .discordBotSettingsRow select{
    min-width: 0;
    width: 100%;
  }

  .discordPollCard{
    max-width: 100%;
  }

  .discordBotAudioRow{
    flex-direction: column;
    align-items: stretch;
  }

  #discordBotAudioTtsInput,
  .discordBotAudioLangWrap,
  .discordBotAudioLangWrap select,
  .discordBotAudioTtsBtn,
  .discordBotAudioFileBtn,
  .discordBotAudioStopBtn{
    width: 100%;
    min-width: 0;
  }

  #discordPollSubmitBtn,
  #discordPollCancelBtn{
    width: 100%;
    min-width: 0;
  }

  .discordAuditLogModalCard{
    width: 100%;
    max-height: min(92dvh, 920px);
    padding: 14px;
  }

  .discordAuditLogHead{
    padding-right: 34px;
  }

  .discordAuditLogToolbar{
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .discordAuditLogToolbar .btn,
  .discordAuditLogToolbar .selectWrap,
  .discordAuditLogToolbar .ms,
  .discordAuditLogToolbar .logsSearchWrap{
    width: 100%;
  }

  .discordAuditLogBody{
    min-height: 0;
    max-height: 48dvh;
  }

  .modal{
    align-items: flex-end;
    padding: 12px;
  }

  .modalCard,
  .resetCard,
  .dashboardDmConfirmCard,
  .discordAuditLogModalCard{
    width: 100%;
    max-width: none;
    max-height: min(92dvh, 920px);
    padding: 14px;
  }

  .logsInviteTrackingModalCard{
    width:100%;
    max-width:none;
    max-height:min(92dvh, 920px);
    padding:14px;
  }

  .logsInviteTrackingHead{
    flex-direction:column;
    align-items:stretch;
  }

  .logsInviteTrackingToolbar{
    grid-template-columns:1fr;
  }

  .logsInviteTrackingToolbar .selectWrap,
  .logsInviteTrackingToolbar select,
  .logsInviteTrackingToolbar .ms,
  .logsInviteTrackingToolbar .logsInviteTrackingSearchWrap{
    width:100%;
  }

  .logsInviteTrackingBody{
    max-height:52dvh;
  }

  .logsInviteCardTop{
    flex-direction:column;
  }

  .logsInviteCardCode{
    width:100%;
    white-space:normal;
  }

  .logsInviteCardGrid{
    grid-template-columns:1fr;
  }

  .dashboardDmConfirmPanel{
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
  }

  .dashboardDmConfirmName{
    white-space: normal;
  }

  .dashboardDmConfirmActions{
    flex-wrap: wrap;
  }

  .dashboardDmConfirmActions .btn{
    flex: 1 1 100%;
    width: 100%;
  }

  @media (max-width: 540px){
    .serverGrid{
      grid-template-columns: 1fr;
    }
  }
}

@media (max-width: 520px){
  .topActions{
    grid-template-columns: 1fr;
  }

  .usersBtn{
    justify-content: flex-start;
    text-align: left;
  }
}

.dashboardChangelogFab{
  position:fixed;
  left:18px;
  bottom:82px;
  z-index:9997;
  height:52px;
  padding:0 16px 0 14px;
  border-radius:18px;
  gap:10px;
  font-weight:900;
  letter-spacing:.01em;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .08), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow:
    0 18px 42px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.06);
}

.dashboardChangelogFab:hover{
  border-color:rgba(var(--accent-rgb), .22);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .12), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.052), rgba(255,255,255,.022));
  box-shadow:
    0 22px 50px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.08);
}

.dashboardChangelogFabIcon{
  width:28px;
  height:28px;
  border-radius:12px;
  display:grid;
  place-items:center;
  color:rgba(245,248,255,.96);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

.dashboardFabBadge{
  position:absolute;
  top:-7px;
  right:-7px;
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#ff4d4d;
  color:#fff;
  font-size:12px;
  font-weight:900;
  line-height:1;
  box-shadow:
    0 12px 24px rgba(255,77,77,.32),
    0 0 0 2px rgba(11,13,18,.92);
}

#dashboardChangelogModal .modalBackdrop,
#dashboardChangelogCreateModal .modalBackdrop{
  background:rgba(2,8,15,.72);
  backdrop-filter:blur(8px);
}

#dashboardChangelogModal .dashboardChangelogCard,
#dashboardChangelogCreateModal .dashboardChangelogCreateCard{
  padding:20px;
  overflow:hidden;
  transform:translateY(14px) scale(.985);
  opacity:0;
  transition:
    transform .22s cubic-bezier(.22,1,.36,1),
    opacity .18s ease,
    box-shadow .18s ease;
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .08), transparent 28%),
    linear-gradient(180deg, rgba(18,24,35,.98), rgba(10,14,22,.96));
  border:1px solid rgba(255,255,255,.09);
  box-shadow:
    0 28px 72px rgba(0,0,0,.56),
    inset 0 1px 0 rgba(255,255,255,.05);
}

#dashboardChangelogModal .dashboardChangelogCard{
  width:min(920px, calc(100vw - 32px));
}

#dashboardChangelogCreateModal .dashboardChangelogCreateCard{
  width:min(760px, calc(100vw - 32px));
}

#dashboardChangelogModal.show .dashboardChangelogCard,
#dashboardChangelogCreateModal.show .dashboardChangelogCreateCard{
  transform:translateY(0) scale(1);
  opacity:1;
}

#dashboardChangelogModal .dashboardChangelogCard::before,
#dashboardChangelogCreateModal .dashboardChangelogCreateCard::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:1px;
  background:linear-gradient(90deg, rgba(var(--accent-rgb), 0), rgba(var(--accent-rgb), .32), rgba(var(--accent-rgb), 0));
  pointer-events:none;
}

.dashboardChangelogTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:16px;
}

.dashboardChangelogTopLeft{
  display:flex;
  flex-direction:column;
  gap:4px;
  min-width:0;
}

.dashboardChangelogTop h3{
  margin:0;
  font-size:26px;
  line-height:1.08;
  letter-spacing:-.02em;
}

.dashboardChangelogEyebrow{
  display:inline-flex;
  align-self:flex-start;
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(241,246,255,.96);
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
}

.dashboardChangelogHeadActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
  flex:0 0 auto;
}

.dashboardChangelogCount{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:rgba(231,234,242,.88);
  font-size:13px;
  font-weight:800;
}

.dashboardChangelogBody{
  display:grid;
  gap:12px;
  max-height:min(68vh, 720px);
  overflow:auto;
  padding-right:4px;
}

.dashboardChangelogEmpty{
  padding:18px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.03);
  color:rgba(231,234,242,.82);
  line-height:1.6;
  text-align:center;
}

.dashboardChangelogItem{
  padding:16px;
  border-radius:20px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    rgba(7,10,16,.62);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 14px 34px rgba(0,0,0,.18);
}

.dashboardChangelogItemHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.dashboardChangelogItemHeadLeft{
  min-width:0;
  flex:1 1 auto;
}

.dashboardChangelogItemTitle{
  font-size:19px;
  font-weight:900;
  line-height:1.15;
  color:rgba(231,234,242,.98);
}

.dashboardChangelogItemMeta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
}

.dashboardChangelogMetaPill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:6px 10px;
  border-radius:999px;
  font-size:12px;
  font-weight:800;
  color:rgba(231,234,242,.84);
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
}

.dashboardChangelogDeleteBtn{
  min-width:112px;
}

.dashboardChangelogItemText{
  margin-top:14px;
  color:rgba(231,234,242,.82);
  line-height:1.65;
  font-size:14px;
}

.dashboardChangelogForm{
  display:grid;
  gap:12px;
  margin-top:12px;
}

.dashboardChangelogFormRow{
  display:grid;
  grid-template-columns:minmax(0, 128px) minmax(0, 1fr);
  gap:12px;
  align-items:start;
}

.dashboardChangelogFormRow > :first-child{
  width:128px;
  max-width:128px;
}

.dashboardChangelogFormRow > :last-child{
  min-width:0;
}

.dashboardChangelogFormRow .field{
  min-width:0;
  width:100%;
}

.dashboardChangelogFormRow input{
  width:100%;
  min-width:0;
}

.dashboardChangelogTextarea{
  min-height:220px;
}

.dashboardChangelogHint{
  padding:14px 16px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.03);
  color:rgba(231,234,242,.78);
  line-height:1.55;
  font-size:13.5px;
}

.dashboardChangelogActions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
  margin-top:18px;
}

@media (max-width: 1180px), (max-height: 860px){
  .dashboardIntroFab{
    left:14px;
    bottom:16px;
  }

  .dashboardChangelogFab{
    left:14px;
    bottom:96px;
  }

  .dashboardLatestChangelogDock{
    left:14px;
    top:96px;
    bottom:176px;
    transform:none;
    width:min(320px, calc(100vw - 28px));
    padding:14px;
    border-radius:18px;
  }
}

@media (max-width: 640px){
  .dashboardIntroFab{
    left:12px;
    right:12px;
    top:auto;
    bottom:12px;
    width:auto;
    justify-content:center;
  }

  .dashboardChangelogFab{
    left:12px;
    right:12px;
    top:auto;
    bottom:90px;
    width:auto;
    justify-content:center;
  }

  .dashboardLatestChangelogDock{
    left:12px;
    right:12px;
    top:96px;
    bottom:168px;
    transform:none;
    width:auto;
    padding:14px;
    border-radius:18px;
  }

  .dashboardChangelogFormRow{
    grid-template-columns:1fr;
  }

  .dashboardChangelogTop,
  .dashboardChangelogItemHead{
    flex-direction:column;
  }

  .dashboardChangelogHeadActions,
  .dashboardChangelogActions{
    width:100%;
    justify-content:stretch;
  }

  .dashboardChangelogHeadActions .btn,
  .dashboardChangelogActions .btn{
    flex:1 1 100%;
    width:100%;
  }
}

.dashboardViewerDock{
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:9997;
  width:min(340px, calc(100vw - 36px));
  padding:14px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at top right, rgba(41,211,178,.16), transparent 34%),
    radial-gradient(circle at bottom left, rgba(var(--accent-rgb), .10), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.018));
  box-shadow:
    0 22px 52px rgba(0,0,0,.38),
    inset 0 1px 0 rgba(255,255,255,.08);
  backdrop-filter:blur(16px);
  display:grid;
  gap:12px;
}

.dashboardViewerDockTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.dashboardViewerDockTopText{
  min-width:0;
  flex:1 1 auto;
}

.dashboardViewerDockEyebrow{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  color:rgba(241,246,255,.96);
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.dashboardViewerDockPulse{
  width:8px;
  height:8px;
  border-radius:999px;
  background:#2bd576;
  box-shadow:
    0 0 0 0 rgba(43,213,118,.42),
    0 0 18px rgba(43,213,118,.24);
  animation:dashboardViewerDockPulse 1.8s ease-out infinite;
}

.dashboardViewerDockTitle{
  margin-top:10px;
  font-size:20px;
  line-height:1.08;
  font-weight:900;
  letter-spacing:-.02em;
  color:#f5f8ff;
}

.dashboardViewerDockSub{
  margin-top:6px;
  font-size:13px;
  line-height:1.45;
  color:rgba(231,234,242,.78);
}

.dashboardViewerDockCount{
  min-width:38px;
  height:38px;
  padding:0 10px;
  border-radius:13px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  color:#fff;
  font-size:18px;
  font-weight:900;
  line-height:1;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06);
}

.dashboardViewerDockStack{
  display:flex;
  align-items:center;
  min-height:44px;
  padding-left:10px;
}

.dashboardViewerDockFace{
  width:42px;
  height:42px;
  margin-left:-10px;
  border-radius:14px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:
    0 12px 24px rgba(0,0,0,.24),
    0 0 0 2px rgba(11,13,18,.74);
}

.dashboardViewerDockFace:first-child{
  margin-left:0;
}

.dashboardViewerDockFace.isSelf{
  border-color:rgba(41,211,178,.52);
  box-shadow:
    0 14px 28px rgba(0,0,0,.28),
    0 0 0 2px rgba(41,211,178,.18);
}

.dashboardViewerDockFaceImg{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.dashboardViewerDockFaceFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:900;
  color:#f5f8ff;
}

.dashboardViewerDockMore{
  min-width:38px;
  height:38px;
  margin-left:10px;
  padding:0 10px;
  border-radius:12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.05);
  color:#f5f8ff;
  font-size:12px;
  font-weight:900;
}

.dashboardViewerDockList{
  display:grid;
  gap:8px;
}

.dashboardViewerDockRow{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  padding:10px 11px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

.dashboardViewerDockRowAvatar{
  width:36px;
  height:36px;
  border-radius:12px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.10);
  flex:0 0 auto;
}

.dashboardViewerDockRowAvatar.isSelf{
  border-color:rgba(41,211,178,.52);
}

.dashboardViewerDockRowAvatarImg{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.dashboardViewerDockRowAvatarFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  font-size:11px;
  font-weight:900;
  color:#f5f8ff;
}

.dashboardViewerDockRowText{
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:2px;
}

.dashboardViewerDockRowName{
  font-size:13px;
  font-weight:800;
  color:#f5f8ff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.dashboardViewerDockRowMeta{
  font-size:11px;
  line-height:1.2;
  color:rgba(231,234,242,.68);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.dashboardViewerDockRowBadge{
  padding:6px 9px;
  border-radius:999px;
  border:1px solid rgba(41,211,178,.32);
  background:rgba(41,211,178,.12);
  color:#9ef1dc;
  font-size:11px;
  font-weight:900;
  line-height:1;
  flex:0 0 auto;
}

@keyframes dashboardViewerDockPulse{
  0%{
    box-shadow:
      0 0 0 0 rgba(43,213,118,.42),
      0 0 18px rgba(43,213,118,.24);
  }

  70%{
    box-shadow:
      0 0 0 10px rgba(43,213,118,0),
      0 0 22px rgba(43,213,118,.16);
  }

  100%{
    box-shadow:
      0 0 0 0 rgba(43,213,118,0),
      0 0 18px rgba(43,213,118,.24);
  }
}

@media (max-width: 760px){
  .dashboardViewerDock{
    top:154px;
    right:12px;
    bottom:auto;
    width:min(300px, calc(100vw - 24px));
    padding:13px;
  }

  .dashboardViewerDockTitle{
    font-size:18px;
  }

  .dashboardViewerDockCount{
    min-width:36px;
    height:36px;
    font-size:16px;
  }
}

@media (max-width: 640px){
  .dashboardViewerDock{
    top:150px;
    left:12px;
    right:12px;
    bottom:auto;
    width:auto;
  }
}

.dashboardLatestChangelogDock{
  position:fixed;
  left:18px;
  top:108px;
  bottom:150px;
  transform:none;
  z-index:9996;
  width:min(420px, calc(100vw - 36px));
  display:none;
  grid-template-rows:auto minmax(0, 1fr);
  align-content:stretch;
  gap:12px;
  padding:16px;
  border-radius:22px;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .12), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  box-shadow:
    0 22px 52px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.06);
  overflow:hidden;
}

.dashboardLatestChangelogDockHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
}

.dashboardLatestChangelogDockLeft{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
}

.dashboardLatestChangelogDockTitle{
  font-size:18px;
  font-weight:900;
  line-height:1.1;
  color:rgba(231,234,242,.98);
}

.dashboardLatestChangelogBadge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:26px;
  padding:0 10px;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(231,234,242,.86);
}

.dashboardLatestChangelogUnread{
  min-width:22px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  background:#ff4d4d;
  color:#fff;
  font-size:12px;
  font-weight:900;
  line-height:1;
  box-shadow:0 10px 22px rgba(255,77,77,.28);
  flex:0 0 auto;
}

.dashboardLatestChangelogList{
  display:grid;
  gap:10px;
  min-height:0;
  overflow:auto;
  padding-right:4px;
  align-content:start;
}

.dashboardLatestChangelogItem{
  width:100%;
  display:grid;
  gap:8px;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015)),
    rgba(7,10,16,.54);
  text-align:left;
  color:inherit;
  cursor:pointer;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease, filter .18s ease;
}

.dashboardLatestChangelogItem:hover{
  transform:translateY(-2px);
  border-color:rgba(var(--accent-rgb), .22);
  box-shadow:
    0 18px 36px rgba(0,0,0,.26),
    inset 0 1px 0 rgba(255,255,255,.05);
  filter:brightness(1.02);
}

.dashboardLatestChangelogItem.isEmpty{
  cursor:default;
}

.dashboardLatestChangelogItem.isEmpty:hover{
  transform:none;
  filter:none;
  border-color:rgba(255,255,255,.08);
  box-shadow:none;
}

.dashboardLatestChangelogItemBadge{
  display:inline-flex;
  align-items:center;
  width:max-content;
  min-height:24px;
  padding:0 9px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.05);
  color:rgba(231,234,242,.82);
  font-size:10px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.dashboardLatestChangelogItemTitle{
  font-size:16px;
  font-weight:900;
  line-height:1.2;
  color:rgba(231,234,242,.98);
  display:block;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
  overflow-wrap:anywhere;
}

.dashboardLatestChangelogItemMeta{
  font-size:12px;
  font-weight:700;
  line-height:1.45;
  color:rgba(167,173,194,.92);
}

.dashboardLatestChangelogItemText{
  color:rgba(231,234,242,.82);
  font-size:13.5px;
  line-height:1.6;
  display:block;
  overflow:visible;
}

.dashboardChangelogRichList{
  display:grid;
  gap:8px;
}

.dashboardChangelogRichList + .dashboardChangelogRichList{
  margin-top:12px;
}

.dashboardChangelogRichList.isCompact{
  gap:6px;
}

.dashboardChangelogRichItem{
  display:grid;
  grid-template-columns:12px minmax(0, 1fr);
  gap:8px;
  align-items:start;
}

.dashboardChangelogRichBullet{
  color:rgba(var(--accent-rgb), .96);
  font-weight:900;
  line-height:1.55;
}

.dashboardChangelogRichContent{
  min-width:0;
  white-space:pre-wrap;
  overflow-wrap:anywhere;
}

.dashboardChangelogRichStrong{
  font-weight:900;
  color:rgba(245,247,255,.96);
}

.dashboardLatestChangelogItemText .dashboardChangelogRichItem{
  gap:7px;
}

.dashboardLatestChangelogItemText .dashboardChangelogRichContent{
  font-size:13.5px;
  line-height:1.6;
  color:rgba(231,234,242,.82);
}

.dashboardChangelogItemText .dashboardChangelogRichContent{
  font-size:14px;
  line-height:1.65;
  color:rgba(231,234,242,.82);
}

@media (max-width: 760px){
  .dashboardLatestChangelogDockTitle{
    font-size:16px;
  }
}

.dashboardLangDock{
  position:fixed !important;
  top:104px !important;
  left:auto !important;
  right:24px !important;
  bottom:auto !important;
  z-index:9997 !important;
  display:grid;
  gap:10px;
  width:218px !important;
  transform:none !important;
  transition:none !important;
}

.dashboardLangBtn{
  width:100%;
  min-height:62px;
  padding:10px 12px;
  border-radius:18px;
  display:flex;
  align-items:center;
  gap:12px;
  justify-content:flex-start;
  text-align:left;
  border:1px solid rgba(255,255,255,.10);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .10), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02));
  box-shadow:
    0 18px 42px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.06);
}

.dashboardLangBtnFlag{
  width:32px;
  height:32px;
  flex:0 0 32px;
  display:grid;
  place-items:center;
  line-height:0;
  overflow:hidden;
}

.dashboardLangFlagCombo{
  position:relative;
  width:22px;
  height:22px;
  display:block;
  overflow:visible;
  flex:0 0 22px;
}

.dashboardLangFlagMini{
  position:absolute;
  width:14px !important;
  height:14px !important;
  min-width:14px !important;
  min-height:14px !important;
  max-width:14px !important;
  max-height:14px !important;
  display:block !important;
  object-fit:cover;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  box-shadow:0 4px 10px rgba(0,0,0,.24);
}

.dashboardLangFlagMini.tl{
  top:0;
  left:0;
}

.dashboardLangFlagMini.br{
  right:0;
  bottom:0;
}

.dashboardLangBtnText{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.dashboardLangBtnLabel{
  font-size:14px;
  font-weight:900;
  line-height:1.1;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.dashboardLangBtnHint{
  line-height:1.15;
  color:rgba(231,234,242,.74);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.dashboardLangBtnCaret{
  flex:0 0 auto;
  font-size:13px;
  color:rgba(231,234,242,.72);
}

.dashboardLangMenu{
  display:none;
  position:absolute;
  top:calc(100% + 8px);
  right:0;
  width:100%;
  padding:8px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:
    linear-gradient(180deg, rgba(18,24,35,.98), rgba(10,14,22,.96));
  box-shadow:
    0 22px 50px rgba(0,0,0,.34),
    inset 0 1px 0 rgba(255,255,255,.05);
}

.dashboardLangDock.isOpen .dashboardLangMenu{
  display:grid;
  gap:6px;
}

.dashboardLangOption{
  width:100%;
  min-height:52px;
  padding:9px 10px;
  border-radius:14px;
  display:flex;
  align-items:center;
  gap:10px;
  background:transparent;
  border:1px solid transparent;
  color:var(--text);
  cursor:pointer;
}

.dashboardLangOption:hover{
  background:rgba(255,255,255,.04);
  border-color:rgba(255,255,255,.08);
}

.dashboardLangOption.isActive{
  background:rgba(var(--accent-rgb), .10);
  border-color:rgba(var(--accent-rgb), .22);
}

.dashboardLangOptionFlag{
  width:32px;
  height:32px;
  flex:0 0 32px;
  display:grid;
  place-items:center;
  line-height:0;
  overflow:hidden;
}

.dashboardLangOptionText{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.dashboardLangOptionName{
  font-size:13px;
  font-weight:900;
  line-height:1.1;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.dashboardLangOptionMeta{
  font-size:11px;
  line-height:1.15;
  color:rgba(231,234,242,.68);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.dashboardLangBtnFlag img,
.dashboardLangOptionFlag img,
.dashboardLangFlagCombo img{
  display:block;
}

@media (max-width: 1180px), (max-height: 860px){
  .dashboardLangDock{
    top:118px !important;
    left:auto !important;
    right:18px !important;
    width:210px !important;
  }
}

@media (max-width: 900px) and (min-width: 641px){
  .dashboardLangDock{
    top:150px !important;
    left:auto !important;
    right:14px !important;
    width:210px !important;
  }
}

@media (max-width: 640px){
  .dashboardLangDock{
    top:84px !important;
    left:12px !important;
    right:12px !important;
    width:auto !important;
  }

  .dashboardLangBtn{
    min-height:56px;
    padding:10px 12px;
  }
}

.customCommandsModalCard{
  width:min(1760px, calc(100vw - 24px));
  height:min(940px, calc(100vh - 40px));
  max-height:calc(100vh - 40px);
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:22px;
}

.customCommandsModalCard #customCommandsModalBody{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  padding:0 6px 22px 0;
}

.customCommandsModalFooter{
  position:sticky;
  bottom:0;
  z-index:5000;
  padding-top:14px;
  background:linear-gradient(180deg, rgba(13,17,32,0), rgba(13,17,32,.97) 36%, rgba(13,17,32,.99));
}

.customCommandsModalFooter .btn{
  position:relative;
  z-index:5001;
}

.customCommandsModalCard .ms.open{
  z-index:1200;
}

.customCommandsModalCard .msPanel{
  z-index:1300;
  max-height:260px;
}

.customCommandImportModalCard{
  width:min(920px, calc(100vw - 28px));
  max-height:calc(100vh - 52px);
  overflow:visible;
  display:flex;
  flex-direction:column;
  padding:20px;
}

.customCommandImportBody{
  min-height:0;
  overflow:visible;
  display:grid;
  gap:14px;
  padding:16px 4px 6px 0;
}

.customCommandImportFooter{
  justify-content:flex-end;
  padding-top:14px;
  margin-top:8px;
  border-top:1px solid rgba(255,255,255,.08);
}

.customCommandImportModalCard .ms.open{
  z-index:6200;
}

.customCommandImportModalCard .msPanel{
  z-index:6300;
  max-height:min(420px, calc(100vh - 260px));
}

.customCommandImportDetails{
  display:grid;
  gap:8px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
}

.customCommandImportDetailsTitle{
  font-weight:900;
  font-size:14px;
  color:rgba(231,234,242,.96);
  overflow-wrap:anywhere;
}

.customCommandImportDetailsMeta{
  font-size:12px;
  color:rgba(231,234,242,.66);
  line-height:1.45;
  overflow-wrap:anywhere;
}

.customCommandImportEmpty{
  padding:14px;
  border-radius:14px;
  border:1px dashed rgba(255,255,255,.12);
  color:rgba(231,234,242,.68);
  background:rgba(255,255,255,.025);
  font-size:13px;
}

.customCommandsModalGrid{
  display:grid;
  grid-template-columns:minmax(620px, 1.12fr) minmax(500px, .88fr);
  gap:20px;
  align-items:start;
}

.customCommandsEditorCol{
  min-width:0;
}

.customCommandsPreviewCol{
  min-width:0;
  position:sticky;
  top:0;
}

.customCommandsPreviewCard{
  display:grid;
  gap:10px;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.02));
  box-shadow:0 12px 40px rgba(0,0,0,.24);
}

.customCommandsPreview{
  min-height:660px;
}

.customCommandsPreviewSurface{
  min-height:660px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(88,101,242,.16), transparent 34%),
    linear-gradient(180deg, rgba(49,51,56,.96), rgba(43,45,49,.98));
  padding:18px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

.customCommandsPreviewMessage{
  display:flex;
  align-items:flex-start;
  gap:12px;
}

.customCommandsPreviewMessage.isStacked{
  margin-top:4px;
}

.customCommandsPreviewAvatarGhost{
  opacity:0;
  background:transparent;
  box-shadow:none;
}

.customCommandsPreviewAvatar{
  width:40px;
  height:40px;
  flex:0 0 40px;
  border-radius:999px;
  display:grid;
  place-items:center;
  overflow:hidden;
  font-weight:900;
  color:#fff;
  background:linear-gradient(135deg, rgba(var(--accent-rgb), 1), rgba(var(--accent-rgb), .55));
  box-shadow:0 10px 24px rgba(0,0,0,.24);
}

.customCommandsPreviewAvatarImg{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.customCommandsPreviewAvatarFallback{
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
}

.customCommandsPreviewBody{
  min-width:0;
  flex:1 1 auto;
}

.customCommandsPreviewBody.isStacked{
  padding-top:2px;
}

.customCommandsPreviewHead{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
  margin-bottom:4px;
}

.customCommandsPreviewName{
  font-weight:800;
  color:#fff;
}

.customCommandsPreviewMeta{
  font-size:12px;
  color:rgba(219,222,225,.62);
}

.customCommandsPreviewContent{
  min-width:0;
  color:#dbdee1;
}

.customCommandsButtonPreviewDivider{
  display:grid;
  grid-template-columns:1fr;
  gap:8px;
  margin:18px 0 12px;
}

.customCommandsButtonPreviewLine{
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.20), transparent);
}

.customCommandsButtonPreviewTitle{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
  padding:8px 10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
  color:rgba(231,234,242,.92);
  font-size:12px;
  font-weight:900;
}

.customCommandsButtonPreviewTitle small{
  color:rgba(219,222,225,.62);
  font-size:11px;
  font-weight:800;
}

.customCommandsButtonPreviewGroup{
  display:grid;
  gap:4px;
}

.customCommandsEditorSection{
  display:grid;
  gap:10px;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
}

.customCommandsEditorSectionTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

.customCommandsEditorCards{
  display:grid;
  gap:10px;
}

.customCommandsEditorCard{
  display:grid;
  gap:10px;
  padding:12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(0,0,0,.18);
}

.customCommandsEditorCardHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  flex-wrap:wrap;
}

@media (max-width: 1180px){
  .customCommandsModalGrid{
    grid-template-columns:1fr;
  }

  .customCommandsPreviewCol{
    position:static;
  }

  .customCommandsPreview{
    min-height:unset;
  }

  .customCommandsPreviewSurface{
    min-height:340px;
  }
}

@media (max-width: 760px){
  .customCommandsModalCard{
    width:calc(100vw - 12px);
    height:calc(100vh - 20px);
    max-height:calc(100vh - 20px);
    padding:14px;
  }
}

.bewachenActionRow{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

.stempeluhrStatsToolbar{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:flex-end;
}

.stempeluhrStatsWeekField{
  min-width:190px;
  max-width:220px;
}

.stempeluhrStatsRows{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.stempeluhrStatsRow{
  display:grid;
  grid-template-columns:180px minmax(0, 1fr);
  align-items:center;
  gap:10px;
  padding:10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.06);
  background:rgba(0,0,0,.18);
  width:100%;
  min-width:0;
}

.stempeluhrStatsLabel{
  font-size:13.5px;
  font-weight:800;
  color:rgba(231,234,242,.88);
  letter-spacing:.2px;
}

.stempeluhrStatsInputs{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
  min-width:0;
}

.stempeluhrStatsInputGroup{
  display:flex;
  align-items:center;
  gap:8px;
}

.stempeluhrStatsInputGroup input{
  width:96px;
  min-width:0;
  text-align:center;
}

.stempeluhrStatsSingleInput{
  width:120px;
  min-width:0;
  text-align:center;
}

.stempeluhrStatsInputSuffix{
  font-size:12px;
  font-weight:800;
  color:rgba(231,234,242,.68);
}

@media (max-width: 900px){
  .stempeluhrStatsWeekField{
    min-width:0;
    max-width:none;
    flex:1 1 220px;
  }

  .stempeluhrStatsRow{
    grid-template-columns:1fr;
  }

  .stempeluhrStatsInputs{
    width:100%;
  }

  .stempeluhrStatsInputGroup{
    width:100%;
    display:grid;
    grid-template-columns:minmax(0, 1fr) auto minmax(0, 1fr) auto;
    align-items:center;
  }

  .stempeluhrStatsInputGroup input,
  .stempeluhrStatsSingleInput{
    width:100%;
  }
}

.stempelOverviewPage{
  display:block;
}

.stempelOverviewTopRow{
  grid-template-columns:minmax(0, 1680px);
}

.stempelOverviewStandalone .dashboardOverviewCard{
  width:100%;
  overflow:hidden;
  border-radius:16px;
}

.stempelOverviewStandalone .dashOverviewHero{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  margin-bottom:14px;
}

.stempelOverviewStandalone .bewOverviewStats{
  display:grid;
  grid-template-columns:repeat(5, minmax(0, 1fr));
  gap:10px;
}

.stempelOverviewStandalone .bewOverviewStatCard{
  min-width:0;
  padding:12px 13px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(12,16,29,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
}

.stempelOverviewStandalone .bewOverviewStatValue{
  display:block;
  width:100%;
  font-size:23px;
  line-height:1.04;
  font-weight:900;
  letter-spacing:-.02em;
  color:rgba(240,244,255,.96);
  min-height:24px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.stempelOverviewStandalone .bewOverviewStatLabel{
  margin-top:10px;
  font-size:12px;
  font-weight:800;
  color:var(--muted);
}

.stempelOverviewActiveCard{
  width:100%;
}

.stempelOverviewStandalone .bewOverviewMembersGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.stempelOverviewStandalone .bewOverviewMemberCard{
  appearance:none;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:inherit;
  border-radius:12px;
  padding:12px;
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
  text-align:left;
  cursor:pointer;
  transition:background .14s ease, border-color .14s ease, transform .14s ease;
}

.stempelOverviewStandalone .bewOverviewMemberCard:hover{
  transform:translateY(-1px);
  border-color:rgba(var(--accent-rgb), .28);
  background:rgba(var(--accent-rgb), .07);
}

.stempelOverviewActiveActions{
  margin-left:auto;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex:0 0 auto;
}

.stempelOverviewMiniBtn{
  min-height:32px;
  padding:7px 10px;
  font-size:12px;
  border-radius:10px;
  white-space:nowrap;
}

.stempelOverviewSaveBtn.isHidden{
  display:none !important;
}

.stempelOverviewSessionItem{
  align-items:stretch;
  position:relative;
  padding-right:48px;
}

.stempelOverviewSessionActions{
  position:absolute;
  top:8px;
  right:8px;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:6px;
  z-index:2;
}

.stempelOverviewIconBtn{
  width:26px;
  height:26px;
  padding:0;
  border-radius:9px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.22);
  color:rgba(231,234,242,.74);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  font-size:14px;
  font-weight:900;
  line-height:1;
  transition:background .16s ease, color .16s ease, border-color .16s ease, transform .16s ease;
}

.stempelOverviewIconBtn:hover{
  transform:translateY(-1px);
  background:rgba(var(--accent-rgb), .12);
  border-color:rgba(var(--accent-rgb), .32);
  color:#fff;
}

.stempelOverviewIconBtn.isActive{
  background:rgba(var(--accent-rgb), .18);
  border-color:rgba(var(--accent-rgb), .42);
  color:#fff;
}

.stempelOverviewDeleteBtn:hover{
  background:rgba(255,77,77,.14);
  border-color:rgba(255,77,77,.40);
  color:#fff;
}

.stempelOverviewSessionText{
  padding-right:6px;
}

.stempelOverviewSessionEdit{
  margin-top:10px;
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
  align-items:stretch;
  max-width:100%;
}

.stempelOverviewSessionEdit.isHidden{
  display:none !important;
}

.stempelOverviewSessionEdit label{
  display:grid;
  gap:5px;
  font-size:11px;
  font-weight:900;
  color:rgba(231,234,242,.68);
}

.stempelOverviewSessionEdit input{
  width:100%;
  min-height:36px;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
  color:var(--text);
  outline:none;
}

.stempelOverviewSessionEdit input:focus{
  border-color:rgba(var(--accent-rgb), .55);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .14);
}

.stempelOverviewSessionHint{
  margin-top:8px;
}

@media (max-width:760px){
  .stempelOverviewStandalone .bewOverviewMembersGrid{
    grid-template-columns:1fr;
  }

  .stempelOverviewActiveActions{
    width:100%;
    justify-content:space-between;
  }

  .stempelOverviewSessionItem{
    padding-right:42px;
  }

  .stempelOverviewSessionActions{
    top:7px;
    right:7px;
  }

  .stempelOverviewIconBtn{
    width:24px;
    height:24px;
    border-radius:8px;
    font-size:13px;
  }

}

.stempelOverviewStandalone .bewOverviewAvatar{
  width:40px;
  height:40px;
  border-radius:999px;
  object-fit:cover;
  flex:0 0 auto;
  background:rgba(255,255,255,.08);
}

.stempelOverviewStandalone .bewOverviewAvatarFallback{
  display:flex;
  align-items:center;
  justify-content:center;
  font-weight:1000;
  color:rgba(231,234,242,.84);
}

.stempelOverviewStandalone .bewOverviewMemberMeta{
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:4px;
}

.stempelOverviewStandalone .bewOverviewMemberName{
  font-size:14px;
  font-weight:950;
  color:rgba(231,234,242,.94);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.stempelOverviewStandalone .bewOverviewMemberSub{
  font-size:12px;
  color:rgba(231,234,242,.58);
  line-height:1.3;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.stempelOverviewStandalone .bewOverviewBadge{
  flex:0 0 auto;
  padding:6px 9px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.06);
  color:rgba(231,234,242,.72);
  font-size:11px;
  font-weight:950;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.stempelOverviewStandalone .bewOverviewBadge.ok{
  border-color:rgba(43,213,118,.28);
  background:rgba(43,213,118,.14);
  color:rgba(174,247,199,.96);
}

.stempelOverviewTableWrap{
  width:100%;
  overflow-x:auto;
  overflow-y:auto;
  max-height:980px;
  scrollbar-gutter:stable;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}

.stempelOverviewTable{
  width:100%;
  min-width:980px;
  border-collapse:separate;
  border-spacing:0;
}

.stempelOverviewTable thead th{
  position:sticky;
  top:0;
  z-index:1;
  background:rgba(12,16,29,.96);
  backdrop-filter:blur(8px);
  text-align:left;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(231,234,242,.72);
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.stempelOverviewTable tbody td{
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
  font-size:13px;
  vertical-align:middle;
  background:transparent;
}

.stempelOverviewTable tr{
  cursor:pointer;
  transition:background .14s ease, box-shadow .14s ease;
}

.stempelOverviewTable tr.isSelected,
.stempelOverviewTable tr:hover{
  background:rgba(var(--accent-rgb), .08);
  box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb), .20);
}

.stempelOverviewUserCell{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.stempelOverviewDurationCell{
  display:grid;
  gap:6px;
  min-width:140px;
}

.stempelOverviewFilters{
  grid-template-columns:minmax(180px, 260px) minmax(220px, 320px);
  justify-content:start;
  align-items:end;
}

.stempelOverviewFilters .field{
  width:100%;
}

.stempelOverviewSearchField{
  max-width:320px;
}

.stempelOverviewSearchField input{
  max-width:320px;
}

.stempelOverviewTable thead th.stempelOverviewRankHead,
.stempelOverviewTable tbody td.stempelOverviewRankCell{
  width:76px;
  min-width:76px;
  max-width:76px;
  padding-left:14px !important;
  padding-right:14px !important;
  text-align:center !important;
  font-variant-numeric:tabular-nums;
}

.stempelOverviewLiveStateHidden{
  display:none !important;
}

.stempelOverviewConfirmOverlay{
  position:fixed;
  inset:0;
  z-index:9999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(0,0,0,.58);
  backdrop-filter:blur(10px);
}

.stempelOverviewConfirmModal{
  width:min(420px, 100%);
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background:linear-gradient(180deg, rgba(22,27,43,.98), rgba(14,17,29,.98));
  box-shadow:0 24px 80px rgba(0,0,0,.58);
  padding:18px;
  display:grid;
  gap:12px;
}

.stempelOverviewConfirmTitle{
  font-size:17px;
  font-weight:1000;
  color:rgba(231,234,242,.96);
}

.stempelOverviewConfirmText{
  font-size:13px;
  line-height:1.5;
  color:rgba(231,234,242,.68);
}

.stempelOverviewConfirmActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  margin-top:4px;
}

@media (max-width:520px){
  .stempelOverviewConfirmActions{
    display:grid;
    grid-template-columns:1fr;
  }

  .stempelOverviewConfirmActions .btn{
    width:100%;
  }
}

.stempelOverviewRankCell{
  color:rgba(231,234,242,.68);
  font-weight:900;
}

.stempelOverviewDetailSessions{
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.02);
  overflow:hidden;
}

.stempelOverviewDetailSessions > summary{
  min-height:46px;
  padding:12px 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  cursor:pointer;
  user-select:none;
  list-style:none;
  font-size:13px;
  font-weight:950;
  color:rgba(231,234,242,.92);
}

.stempelOverviewDetailSessions > summary::-webkit-details-marker{
  display:none;
}

.stempelOverviewDetailSessions > summary::after{
  content:'Aufklappen';
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:rgba(231,234,242,.68);
  font-size:11px;
  font-weight:900;
}

.stempelOverviewDetailSessions[open] > summary::after{
  content:'Zuklappen';
}

.stempelOverviewDetailFeed{
  padding:12px;
  border-top:1px solid rgba(255,255,255,.08);
}

.stempelOverviewDetailFeed .bewOverviewFeedItem{
  grid-template-columns:1fr;
  gap:6px;
}

@media (max-width:760px){
  .stempelOverviewFilters{
    grid-template-columns:1fr;
  }

  .stempelOverviewSearchField,
  .stempelOverviewSearchField input{
    max-width:none;
  }

  .stempelOverviewTable thead th.stempelOverviewRankHead,
  .stempelOverviewTable tbody td.stempelOverviewRankCell{
    width:58px;
    min-width:58px;
    max-width:58px;
    padding-left:10px !important;
    padding-right:10px !important;
    text-align:center !important;
  }
}

.stempelOverviewProgress{
  width:100%;
  height:8px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.08);
}

.stempelOverviewProgressBar{
  height:100%;
  border-radius:999px;
  background:rgba(var(--accent-rgb), .78);
}

.stempelOverviewStandalone .bewOverviewDetailEmpty,
.stempelOverviewStandalone .bewOverviewEmpty{
  padding:14px;
  border-radius:14px;
  border:1px dashed rgba(255,255,255,.10);
  color:rgba(231,234,242,.58);
  background:rgba(0,0,0,.14);
  font-size:13px;
}

.stempelOverviewStandalone .bewOverviewDetailBody{
  display:grid;
  gap:14px;
}

.stempelOverviewStandalone .bewOverviewDetailUser{
  display:flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.stempelOverviewStandalone .bewOverviewDetailName{
  font-size:16px;
  font-weight:1000;
  color:rgba(231,234,242,.94);
}

.stempelOverviewStandalone .bewOverviewDetailStats{
  display:grid;
  grid-template-columns:1fr;
  gap:10px;
}

.stempelOverviewStandalone .bewOverviewDetailFeed{
  display:grid;
  gap:8px;
}

@media (max-width:1180px){
  .stempelOverviewStandalone .bewOverviewStats{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .stempelOverviewStandalone .bewOverviewMembersGrid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width:760px){
  .stempelOverviewTopRow{
    grid-template-columns:1fr;
  }

  .stempelOverviewStandalone .dashOverviewHero{
    flex-direction:column;
    align-items:stretch;
  }

  .stempelOverviewStandalone .bewOverviewStats,
  .stempelOverviewStandalone .bewOverviewMembersGrid{
    grid-template-columns:1fr;
  }

  .stempelOverviewStandalone .bewOverviewMemberSub{
    white-space:normal;
  }
}

@media (max-width:560px){
  .stempelOverviewStandalone .topbar > .row.space{
    grid-template-columns:1fr;
  }
}

main.wrap.bewOverviewPage{
  max-width:2440px;
  width:min(2440px, calc(100vw - 28px));
  margin:0 auto;
  padding-bottom:40px;
}

.bewOverviewTopRow{
  display:grid;
  grid-template-columns:minmax(0, 1520px);
  justify-content:center;
  gap:10px;
  align-items:start;
  margin-bottom:8px;
}

.bewOverviewTopRow .dashboardOverviewCard{
  grid-column:1;
  width:100%;
  margin:0;
}

.bewOverviewLowerShell{
  display:grid;
  grid-template-columns:380px minmax(0, 1520px) 380px;
  justify-content:center;
  gap:10px;
  align-items:start;
}

.bewOverviewSideSpacer{
  width:380px;
  min-width:0;
  pointer-events:none;
}

.bewOverviewContentStack{
  grid-column:2;
  display:flex;
  flex-direction:column;
  gap:8px;
  min-width:0;
  width:100%;
}

.bewOverviewSideCol{
  grid-column:3;
  min-width:0;
  width:380px;
}

.bewOverviewFilters{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(180px, 1fr));
  gap:12px;
  margin:14px 0 10px;
  align-items:end;
}

.bewOverviewFiltersInCard{
  margin:0 0 12px;
}

.bewOverviewFilters .field{
  min-width:0;
  width:100%;
}

.bewOverviewFilters .selectWrap,
.bewOverviewFilters .ms,
.bewOverviewFilters input{
  width:100%;
  min-width:0;
}

.bewOverviewStats{
  display:grid;
  grid-template-columns:repeat(6, minmax(0, 1fr));
  gap:10px;
}

.bewOverviewStat{
  border:1px solid rgba(255,255,255,.10);
  border-radius:16px;
  padding:12px 13px;
  background:rgba(12,16,29,.58);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  min-width:0;
}

.bewOverviewStatLabel{
  font-size:12px;
  font-weight:800;
  color:var(--muted);
  margin-bottom:10px;
}

.bewOverviewStatValue{
  display:block;
  width:100%;
  font-size:23px;
  line-height:1.04;
  font-weight:900;
  letter-spacing:-.02em;
  min-height:24px;
}

.bewOverviewStatMeta{
  margin-top:6px;
  font-size:12px;
  color:var(--muted);
  line-height:1.35;
}

.bewOverviewTableCard,
.bewOverviewFeedCard,
.bewOverviewDetailCard{
  min-height:0;
}

.bewOverviewContentStack > .card,
.bewOverviewSideCol > .card{
  margin:0;
}

.bewOverviewTableCard,
.bewOverviewFeedCard{
  width:100%;
}

.bewOverviewDetailCard{
  position:sticky;
  top:104px;
  max-height:calc(100vh - 122px);
  overflow:auto;
}

.bewOverviewDetailHead{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  min-height:56px;
  margin-bottom:12px;
}

.bewOverviewTableWrap{
  overflow-x:auto;
  overflow-y:auto;
  max-height:1374px;
  scrollbar-gutter:stable;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.02);
}

.bewOverviewTable{
  width:100%;
  border-collapse:separate;
  border-spacing:0;
  min-width:1480px;
}

.bewOverviewTable thead th{
  position:sticky;
  top:0;
  z-index:1;
  background:rgba(12,16,29,.96);
  backdrop-filter:blur(8px);
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(231,234,242,.72);
  text-align:left;
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.bewOverviewTable tbody td{
  padding:12px 14px;
  border-bottom:1px solid rgba(255,255,255,.06);
  vertical-align:middle;
}

.bewOverviewRow{
  cursor:pointer;
  transition:background .14s ease, box-shadow .14s ease;
}

.bewOverviewRow:hover{
  background:rgba(255,255,255,.03);
}

.bewOverviewRow.isActive{
  background:rgba(255,210,74,.08);
  box-shadow:inset 0 0 0 1px rgba(255,210,74,.24);
}

@media (max-width: 2300px){
  .bewOverviewLowerShell{
    grid-template-columns:minmax(0, 1fr) 380px;
    justify-content:center;
  }

  .bewOverviewSideSpacer{
    display:none;
  }

  .bewOverviewContentStack{
    grid-column:1;
    width:100%;
    min-width:0;
  }

  .bewOverviewSideCol{
    grid-column:2;
    width:380px;
    min-width:0;
  }

  .bewOverviewDetailCard{
    position:sticky;
    top:104px;
  }

  .bewOverviewStats{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .bewOverviewFilters{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 1520px){
  .bewOverviewLowerShell{
    grid-template-columns:minmax(0, 1fr);
    justify-content:center;
  }

  .bewOverviewContentStack,
  .bewOverviewSideCol{
    grid-column:auto;
    width:min(1520px, 100%);
    margin:0 auto;
  }

  .bewOverviewDetailCard{
    position:static;
    top:auto;
    max-height:none;
    overflow:visible;
  }
}

@media (max-width: 760px){
  .bewOverviewStats{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .bewOverviewFilters{
    grid-template-columns:1fr;
  }

  .bewOverviewFeedItem{
    grid-template-columns:1fr;
  }

  .bewOverviewTrendItem{
    grid-template-columns:1fr;
  }

  .bewOverviewDetailStats{
    grid-template-columns:1fr;
  }

  .bewOverviewProgressWrap{
    flex-direction:column;
    align-items:stretch;
  }

  .bewOverviewHeroRow{
    flex-direction:column;
    align-items:stretch;
  }

  .bewOverviewHeroActions{
    width:100%;
    justify-content:flex-start;
  }

  .bewOverviewAdminBtn{
    width:100%;
  }

  .bewOverviewAdminGrid{
    grid-template-columns:1fr;
  }

  .bewOverviewAdminModalCard{
    width:min(100vw - 20px, 760px);
    padding:16px;
  }
}

.bewOverviewStatus{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:0 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
}

.bewOverviewStatus.active{
  color:#aef7c7;
  background:rgba(24,126,74,.22);
  border:1px solid rgba(70,204,129,.32);
}

.bewOverviewStatus.inactive{
  color:rgba(231,234,242,.82);
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08);
}

.bewOverviewDetailEmpty{
  min-height:220px;
  display:grid;
  place-items:center;
  text-align:center;
  color:rgba(231,234,242,.66);
  border:1px dashed rgba(255,255,255,.10);
  border-radius:14px;
  background:rgba(255,255,255,.02);
}

.bewOverviewDetailBody{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.bewOverviewDetailTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.bewOverviewDetailName{
  font-size:clamp(18px, 1.45vw, 22px);
  font-weight:1000;
  line-height:1.05;
  overflow-wrap:anywhere;
  word-break:break-word;
}

.bewOverviewDetailScore,
.bewOverviewDetailCount{
  padding:8px 10px;
  border-radius:12px;
  background:rgba(255,210,74,.10);
  border:1px solid rgba(255,210,74,.22);
  font-weight:900;
  white-space:nowrap;
  flex:0 0 auto;
  max-width:100%;
}

.bewOverviewDetailStats{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
}

.bewOverviewMiniStat{
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  padding:12px;
  background:rgba(255,255,255,.03);
  display:flex;
  flex-direction:column;
  gap:8px;
}

.bewOverviewMiniStat span{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.bewOverviewMiniStat strong{
  font-size:18px;
  font-weight:1000;
  line-height:1.05;
}

.bewOverviewTrend{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.bewOverviewTrendItem{
  display:grid;
  grid-template-columns:90px 1fr auto;
  gap:10px;
  align-items:center;
}

.bewOverviewTrendLabel{
  font-size:12px;
  font-weight:900;
  color:rgba(231,234,242,.72);
}

.bewOverviewTrendBarWrap{
  height:12px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.06);
}

.bewOverviewTrendBar{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(255,210,74,.92), rgba(255,171,59,.96));
}

.bewOverviewTrendMeta{
  font-size:12px;
  font-weight:900;
  color:rgba(231,234,242,.88);
  white-space:nowrap;
}

.bewOverviewHeroRow{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.bewOverviewHeroActions{
  display:flex;
  align-items:flex-start;
  justify-content:flex-end;
  flex:0 0 auto;
}

.bewOverviewAdminBtn{
  min-height:42px;
  white-space:nowrap;
}

.bewOverviewAdminModalCard{
  width:min(760px, calc(100vw - 32px));
  padding:18px;
}

.bewOverviewAdminTop{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:14px;
}

.bewOverviewAdminGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:12px;
}

.bewOverviewAdminGrid .field{
  min-width:0;
}

.bewOverviewAdminHint{
  margin-top:14px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:rgba(231,234,242,.88);
  line-height:1.45;
}

.bewOverviewAdminHint.isBad{
  border-color:rgba(255,77,77,.28);
  background:rgba(255,77,77,.08);
  color:rgba(255,214,214,.96);
}

.bewOverviewFeed{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.bewOverviewFeedItem{
  display:grid;
  grid-template-columns:170px 1fr;
  gap:12px;
  align-items:flex-start;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}

.bewOverviewFeedTime{
  font-size:12px;
  font-weight:900;
  color:rgba(231,234,242,.72);
  white-space:nowrap;
}

.bewOverviewFeedText{
  line-height:1.45;
  color:rgba(231,234,242,.96);
}

.bewOverviewFeedEmpty{
  padding:16px;
  border-radius:14px;
  border:1px dashed rgba(255,255,255,.10);
  background:rgba(255,255,255,.02);
  color:rgba(231,234,242,.66);
  text-align:center;
}

@media (max-width: 1180px){
  .bewOverviewStats{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .bewOverviewFilters{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .bewOverviewGrid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 760px){
  .bewOverviewStats{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .bewOverviewFilters{
    grid-template-columns:1fr;
  }

  .bewOverviewFeedItem{
    grid-template-columns:1fr;
  }

  .bewOverviewTrendItem{
    grid-template-columns:1fr;
  }

  .bewOverviewDetailStats{
    grid-template-columns:1fr;
  }
}

.bewOverviewPage input:not([type="checkbox"]):not([type="color"]),
.bewOverviewPage select,
.bewOverviewPage textarea{
  border-radius: 14px;
  border: 1px solid rgba(255,255,255,.09);
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.06),
    0 10px 26px rgba(0,0,0,.22);
  transition: border-color .15s ease, box-shadow .15s ease, transform .15s ease, background .15s ease;
}

.bewOverviewPage input:not([type="checkbox"]):not([type="color"]):hover,
.bewOverviewPage select:hover,
.bewOverviewPage textarea:hover{
  border-color: rgba(255,255,255,.16);
}

.bewOverviewPage input:not([type="checkbox"]):not([type="color"]):focus,
.bewOverviewPage select:focus,
.bewOverviewPage textarea:focus{
  border-color: rgba(93,168,255,.55);
  box-shadow:
    0 0 0 3px rgba(93,168,255,.18),
    inset 0 1px 0 rgba(255,255,255,.08),
    0 14px 30px rgba(0,0,0,.28);
}

.bewOverviewFilters .selectWrap{
  position: relative;
}

.bewOverviewFilters select{
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  padding-right: 46px;
  background-image:
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018)),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 24 24'%3E%3Cpath fill='rgba(231,234,242,0.72)' d='M7 10l5 6 5-6z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 0 0, right 14px center;
  background-size: auto, 18px 18px;
}

.bewOverviewTableCard{
  overflow: visible;
}

.bewOverviewFiltersInCard{
  position: relative;
  z-index: 60;
  overflow: visible;
}

.bewOverviewFiltersInCard .field{
  min-width: 0;
}

.bewOverviewFiltersInCard .selectWrap{
  width: 100%;
}

.bewOverviewFiltersInCard .ms{
  width: 100%;
}

.bewOverviewFiltersInCard .msPanel{
  max-height: 280px;
}

.bewOverviewFiltersInCard .msSearch{
  min-height: 40px;
}

.bewOverviewFiltersInCard .msText,
.bewOverviewFiltersInCard .msSingleText{
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.bewOverviewAvatar,
.bewOverviewDetailAvatar{
  width: 34px;
  height: 34px;
  border-radius: 10px;
  object-fit: cover;
  display: block;
  border: 1px solid rgba(255,255,255,.08);
  background: rgba(255,255,255,.04);
  flex: 0 0 auto;
}

.bewOverviewAvatarFallback{
  display: grid;
  place-items: center;
  font-weight: 900;
  color: rgba(231,234,242,.88);
}

.bewOverviewNameMeta{
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.bewOverviewUserId{
  font-size: 11px;
  color: rgba(231,234,242,.56);
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.bewOverviewDetailIdentity{
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1 1 auto;
}

.bewOverviewDetailIdentityText{
  min-width: 0;
  flex: 1 1 auto;
}

.bewOverviewDetailUserId{
  margin-top: 4px;
  font-size: 12px;
  color: rgba(231,234,242,.58);
  line-height: 1.2;
  word-break: break-all;
}

.bewOverviewPage{
  width:min(1620px, 100%);
}

.bewOverviewPage .bewOverviewGrid{
  display:grid;
  grid-template-columns:minmax(0, 1.9fr) minmax(340px, .78fr);
  gap:14px;
  align-items:start;
}

.bewOverviewPage .bewOverviewTable{
  width:100%;
  min-width:1400px;
  table-layout:fixed;
}

.bewOverviewPage .bewOverviewTable thead th,
.bewOverviewPage .bewOverviewTable tbody td{
  font-variant-numeric:tabular-nums;
}

.bewOverviewPage .bewOverviewTable thead th:nth-child(1),
.bewOverviewPage .bewOverviewTable tbody td:nth-child(1){
  width:64px;
  text-align:center;
}

.bewOverviewPage .bewOverviewTable thead th:nth-child(2),
.bewOverviewPage .bewOverviewTable tbody td:nth-child(2){
  width:360px;
}

.bewOverviewPage .bewOverviewTable thead th:nth-child(n + 3):nth-child(-n + 8),
.bewOverviewPage .bewOverviewTable tbody td:nth-child(n + 3):nth-child(-n + 8){
  width:162px;
  text-align:center;
  white-space:nowrap;
}

.bewOverviewDetailCard{
  position:sticky;
  top:104px;
}

.bewOverviewDetailHead{
  display:flex;
  align-items:center;
  justify-content:center;
  text-align:center;
}

.bewOverviewPage .bewOverviewRow{
  cursor:pointer;
  transition:background .14s ease, box-shadow .14s ease, border-color .14s ease;
}

.bewOverviewPage .bewOverviewRow:hover{
  background:rgba(255,255,255,.03);
}

.bewOverviewPage .bewOverviewRow.isActive{
  background:rgba(255,210,74,.08);
  box-shadow:inset 0 0 0 1px rgba(255,210,74,.24);
}

.bewOverviewPage .bewOverviewRow.isGoalMet{
  background:rgba(43,213,118,.07);
  box-shadow:inset 0 0 0 1px rgba(43,213,118,.18);
}

.bewOverviewPage .bewOverviewRow.isGoalMet.isActive{
  background:linear-gradient(180deg, rgba(43,213,118,.08), rgba(255,210,74,.08));
  box-shadow:
    inset 0 0 0 1px rgba(255,210,74,.24),
    inset 0 0 0 2px rgba(43,213,118,.14);
}

.bewOverviewPage .bewOverviewRow.isNoActivity{
  background:rgba(255,77,77,.055);
  box-shadow:inset 0 0 0 1px rgba(255,77,77,.12);
}

.bewOverviewPage .bewOverviewRow.isNoActivity.isActive{
  background:linear-gradient(180deg, rgba(255,77,77,.07), rgba(255,210,74,.08));
  box-shadow:
    inset 0 0 0 1px rgba(255,210,74,.24),
    inset 0 0 0 2px rgba(255,77,77,.12);
}

.bewOverviewPage .bewOverviewNameCell{
  display:flex;
  align-items:flex-start;
  gap:10px;
  min-width:0;
}

.bewOverviewNameStack{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:6px;
}

.bewOverviewNameBadges{
  display:flex;
  flex-direction:column;
  align-items:flex-end;
  gap:6px;
  flex:0 0 auto;
}

.bewOverviewGoalPill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:0 8px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#aef7c7;
  background:rgba(24,126,74,.22);
  border:1px solid rgba(70,204,129,.32);
  white-space:nowrap;
}

.bewOverviewProgressWrap{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
}

.bewOverviewProgressTrack{
  position:relative;
  flex:1 1 auto;
  height:8px;
  border-radius:999px;
  overflow:hidden;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.06);
  min-width:84px;
}

.bewOverviewProgressTrack.isLarge{
  height:12px;
}

.bewOverviewProgressBar{
  height:100%;
  border-radius:999px;
  background:linear-gradient(90deg, rgba(93,168,255,.98), rgba(255,210,74,.94));
}

.bewOverviewProgressMeta{
  flex:0 0 auto;
  font-size:11px;
  font-weight:800;
  color:rgba(231,234,242,.72);
  white-space:nowrap;
}

.bewOverviewDetailTop{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}

.bewOverviewDetailProgress{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.bewOverviewDetailProgressTop{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.bewOverviewDetailProgressTop span{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.bewOverviewDetailProgressTop strong{
  font-size:12px;
  font-weight:900;
  color:rgba(231,234,242,.92);
}

@media (max-width: 1180px){
  .bewOverviewPage .bewOverviewGrid{
    grid-template-columns:1fr;
  }

  .bewOverviewDetailCard{
    position:static;
    top:auto;
  }
}

@media (max-width: 760px){
  .bewOverviewNameCell{
    align-items:flex-start;
  }

  .bewOverviewNameBadges{
    align-items:flex-start;
  }

  .bewOverviewProgressWrap{
    flex-direction:column;
    align-items:stretch;
  }

  .bewOverviewDetailTop,
  .bewOverviewDetailProgressTop{
    flex-direction:column;
    align-items:flex-start;
  }
}

.ticketLogPage .main{
  min-height:0;
  display:flex;
  flex-direction:column;
}

.ticketLogMain{
  width:min(1280px, 100%);
  margin:0 auto;
  padding-bottom:42px;
}

.ticketLogHero{
  width:min(1280px, 100%);
  margin:0 auto 14px;
}

.ticketLogHeroHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
}

.ticketLogHeroText{
  min-width:0;
  flex:1 1 auto;
  display:grid;
  gap:6px;
}

.ticketLogEyebrow{
  display:inline-flex;
  align-self:flex-start;
  padding:6px 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(var(--accent-rgb), .96);
  border:1px solid rgba(var(--accent-rgb), .18);
  background:rgba(var(--accent-rgb), .08);
}

.ticketLogTitle{
  margin:0;
  font-size:30px;
  line-height:1.08;
  letter-spacing:-.02em;
}

.ticketLogSub{
  font-size:14px;
  line-height:1.45;
}

.ticketLogActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}

.ticketLogStats{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:10px;
  margin-top:14px;
}

.ticketLogStat{
  padding:14px 16px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  display:grid;
  gap:6px;
}

.ticketLogStatLabel{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.ticketLogStatValue{
  font-size:24px;
  font-weight:900;
  line-height:1;
}

.ticketLogGrid{
  width:min(1280px, 100%);
  margin:0 auto;
  display:grid;
  grid-template-columns:minmax(0, 1.15fr) minmax(320px, .85fr);
  gap:14px;
}

.ticketLogSectionHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.ticketLogInfoRows{
  display:grid;
  gap:10px;
}

.ticketLogInfoRow{
  display:grid;
  grid-template-columns:160px minmax(0, 1fr);
  gap:12px;
  align-items:start;
}

.ticketLogInfoLabel{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.ticketLogInfoValue{
  min-width:0;
  color:var(--text);
  line-height:1.55;
  word-break:break-word;
}

.ticketLogPeopleList{
  display:flex;
  flex-direction:column;
  gap:8px;
}

.ticketLogPeopleRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
}

.ticketLogPeopleMain{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.ticketLogPeopleName{
  font-weight:800;
  min-width:0;
  word-break:break-word;
}

.ticketLogPeopleCount{
  min-width:34px;
  height:34px;
  padding:0 10px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-weight:900;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
}

.ticketLogRoleBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:24px;
  padding:0 10px;
  border-radius:999px;
  font-size:11px;
  font-weight:900;
  letter-spacing:.05em;
  text-transform:uppercase;
  background:rgba(255,255,255,.05);
  border:1px solid rgba(255,255,255,.08);
  color:rgba(231,234,242,.9);
}

.ticketLogRoleBadge.support{
  background:rgba(246,194,68,.14);
  border-color:rgba(246,194,68,.3);
  color:#ffe7a2;
}

.ticketLogRoleBadge.owner{
  background:rgba(93,168,255,.14);
  border-color:rgba(93,168,255,.3);
  color:#cfe7ff;
}

.ticketLogRoleBadge.bot{
  background:rgba(43,213,118,.14);
  border-color:rgba(43,213,118,.28);
  color:#bdf2d3;
}

.ticketLogMessagesCard{
  width:min(1280px, 100%);
  margin:14px auto 0;
}

.ticketLogMessages{
  display:flex;
  flex-direction:column;
}

.ticketLogDayDivider{
  display:flex;
  align-items:center;
  gap:12px;
  padding:6px 0 10px;
  margin-top:4px;
}

.ticketLogDayDivider:first-child{
  padding-top:0;
}

.ticketLogDayLine{
  flex:1 1 auto;
  height:1px;
  background:rgba(255,255,255,.08);
}

.ticketLogDayText{
  flex:0 0 auto;
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:var(--muted);
}

.ticketLogMessageCard{
  display:grid;
  grid-template-columns:44px minmax(0, 1fr);
  gap:12px;
  padding:2px 0;
  border-top:0;
  border-radius:4px;
  position:relative;
}

.ticketLogMessageCard:not(.grouped){
  padding-top:10px;
  margin-top:2px;
}

.ticketLogMessageCard.grouped{
  padding-top:0;
}

.ticketLogMessageCard:hover{
  background:rgba(255,255,255,.025);
}

.ticketLogMessageAvatarCol{
  width:44px;
  display:flex;
  align-items:flex-start;
  justify-content:center;
}

.ticketLogMessageAvatar{
  width:40px;
  height:40px;
  border-radius:50%;
  object-fit:cover;
  background:rgba(255,255,255,.05);
}

.ticketLogMessageAvatarFallback{
  width:40px;
  height:40px;
  border-radius:50%;
}

.ticketLogCompactTime{
  width:44px;
  padding-top:3px;
  text-align:center;
  color:rgba(219,222,225,.62);
  font-size:10px;
  font-weight:600;
  opacity:0;
  transition:opacity .08s ease;
}

.ticketLogMessageCard.grouped:hover .ticketLogCompactTime{
  opacity:1;
}

.ticketLogMessageBody{
  min-width:0;
  display:grid;
  gap:2px;
  align-content:start;
}

.ticketLogMessageHead{
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}

.ticketLogMessageAuthor{
  font-weight:900;
  color:#fff;
}

.ticketLogMessageMeta{
  color:var(--muted);
  font-size:12px;
}

.ticketLogMessageEdited{
  color:var(--muted);
  font-size:11px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.05em;
}

.ticketLogMessageEmpty{
  color:var(--muted);
  font-size:13px;
}

.ticketLogReply{
  display:grid;
  grid-template-columns:auto 1fr;
  align-items:center;
  gap:6px;
  min-width:0;
  color:var(--muted);
  font-size:12px;
}

.ticketLogReplyLine{
  width:22px;
  height:10px;
  border-left:2px solid rgba(255,255,255,.2);
  border-top:2px solid rgba(255,255,255,.2);
  border-top-left-radius:5px;
}

.ticketLogReplyText{
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.ticketLogEmbedList{
  display:grid;
  gap:4px;
  justify-items:start;
  max-width:100%;
}

.ticketLogEmbed{
  width:min(100%, 520px);
  max-width:520px;
  padding:8px 16px 16px 12px;
  border-radius:4px;
  border:0;
  border-left:4px solid var(--embed-accent, rgba(var(--accent-rgb), .8));
  background:#2b2d31;
  display:grid;
  gap:8px;
  min-width:0;
  box-sizing:border-box;
}

.ticketLogEmbedAuthor{
  color:#fff;
  font-size:12px;
  font-weight:700;
}

.ticketLogEmbedTitle{
  color:#fff;
  font-size:15px;
  font-weight:800;
  line-height:1.3;
}

.ticketLogEmbedDescription{
  color:rgba(231,234,242,.9);
  line-height:1.55;
  word-break:break-word;
}

.ticketLogEmbedFields{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
}

.ticketLogEmbedField{
  min-width:0;
}

.ticketLogEmbedField.inline{
  min-width:0;
}

.ticketLogEmbedFieldName{
  color:#fff;
  font-size:11px;
  font-weight:800;
  margin-bottom:3px;
  text-transform:uppercase;
  letter-spacing:.04em;
}

.ticketLogEmbedFieldValue{
  color:rgba(231,234,242,.88);
  font-size:12px;
  line-height:1.45;
  word-break:break-word;
}

.ticketLogEmbedFooter{
  color:var(--muted);
  font-size:11px;
}

.ticketLogAttachmentList{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.ticketLogAttachment{
  min-width:0;
  max-width:100%;
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.03);
  color:var(--text);
  text-decoration:none;
}

.ticketLogAttachment:hover{
  background:rgba(255,255,255,.05);
}

.ticketLogAttachmentKind{
  font-size:11px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.05em;
  color:var(--accent);
}

.ticketLogAttachmentName{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.ticketLogAttachmentSize{
  color:var(--muted);
  font-size:12px;
  white-space:nowrap;
}

.ticketLogPillList{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.ticketLogPill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:0 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  color:rgba(231,234,242,.88);
  font-size:12px;
  font-weight:700;
}

.ticketLogEmpty{
  padding:16px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.07);
  background:rgba(255,255,255,.03);
  color:rgba(231,234,242,.75);
  line-height:1.55;
}

@media (max-width: 980px){
  .ticketLogStats{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }

  .ticketLogGrid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 700px){
  .ticketLogTitle{
    font-size:24px;
  }

  .ticketLogStats{
    grid-template-columns:1fr;
  }

  .ticketLogInfoRow{
    grid-template-columns:1fr;
    gap:6px;
  }

  .ticketLogMessageCard{
    grid-template-columns:38px minmax(0, 1fr);
    gap:10px;
  }

  .ticketLogMessageAvatarCol{
    width:38px;
  }

  .ticketLogCompactTime{
    width:38px;
    font-size:10px;
  }

  .ticketLogEmbedFields{
    grid-template-columns:1fr;
  }

  .ticketLogActions{
    width:100%;
    justify-content:stretch;
  }

  .ticketLogActions .btn{
    width:100%;
  }
}

.twitchFilterRow{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:8px;
  margin-top:10px;
  margin-bottom:6px;
}

.twitchFilterSearchWrap{
  position:relative;
  flex:1 1 220px;
  min-width:0;
  display:flex;
  align-items:center;
}

.twitchFilterSearchInput{
  width:100%;
  padding-right:32px;
}

.twitchFilterSearchClear{
  position:absolute;
  right:6px;
  top:50%;
  transform:translateY(-50%);
  width:24px;
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:none;
  background:rgba(255,255,255,.08);
  color:rgba(231,234,242,.85);
  border-radius:999px;
  cursor:pointer;
  font-size:14px;
  line-height:1;
  padding:0;
}

.twitchFilterSearchClear:hover{
  background:rgba(255,255,255,.18);
}

.twitchFilterSelectHost{
  flex:0 0 auto;
  min-width:160px;
  max-width:240px;
  position:relative;
}

.twitchFilterSelectHost .twitchFilterMs{
  width:100%;
}

.twitchFilterMs .msBtn{
  min-height:38px;
  padding:8px 36px 8px 12px;
  border-radius:12px;
}

.twitchFilterMs .msBtn::after{
  right:12px;
  width:14px;
  height:14px;
  background-size:14px 14px;
}

.twitchFilterMs .msPanel{
  border-radius:12px;
}

.twitchFilterCount{
  margin-left:auto;
  white-space:nowrap;
}

.twitchGroupHeader{
  display:flex;
  align-items:center;
  gap:8px;
  margin-top:14px;
  margin-bottom:2px;
  padding:6px 4px 4px 4px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.twitchCards .twitchGroupHeader:first-child{
  margin-top:6px;
}

.twitchGroupTitle{
  font-weight:800;
  font-size:13px;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:rgba(231,234,242,.92);
}

.twitchGroupCount{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:22px;
  height:20px;
  padding:0 7px;
  border-radius:999px;
  background:rgba(145,70,255,.18);
  border:1px solid rgba(145,70,255,.32);
  color:#e0c8ff;
  font-size:11px;
  font-weight:700;
}

.twitchCategoryChip{
  display:inline-flex;
  align-items:center;
  gap:6px;
}

.twitchCategoryChipLabel{
  line-height:1;
}

.twitchCategoryChipCount{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:rgba(255,255,255,.10);
  font-size:11px;
  font-weight:700;
  color:rgba(231,234,242,.85);
}

.twitchCategoryChipX{
  opacity:.6;
  font-size:14px;
  line-height:1;
}

@media (max-width:540px){
  .twitchFilterSelectHost{
    flex:1 1 calc(50% - 4px);
    min-width:0;
    max-width:none;
  }

  .twitchFilterCount{
    flex:1 1 100%;
    margin-left:0;
    margin-top:2px;
  }
}

@keyframes dashAnimFadeUp{
  from{ opacity:0; transform:translate3d(0,12px,0); }
  to{ opacity:1; transform:translate3d(0,0,0); }
}

@keyframes dashAnimPopIn{
  0%  { opacity:0; transform:translate3d(0,18px,0) scale(.96); }
  60% { opacity:1; transform:translate3d(0,-2px,0) scale(1.005); }
  100%{ opacity:1; transform:translate3d(0,0,0) scale(1); }
}

@keyframes dashAnimModalIn{
  from{ opacity:0; transform:translate3d(0,16px,0) scale(.97); }
  to{ opacity:1; transform:translate3d(0,0,0) scale(1); }
}

@keyframes dashAnimBackdropIn{
  from{ opacity:0; }
  to{ opacity:1; }
}

@keyframes dashAnimCountFlash{
  0%  { filter:brightness(1); text-shadow:none; }
  45% { filter:brightness(1.18); text-shadow:0 0 18px rgba(var(--accent-rgb), .35); }
  100%{ filter:brightness(1); text-shadow:none; }
}

.dashboardOverviewCard{
  animation: dashAnimFadeUp .42s cubic-bezier(.22,1,.36,1) both;
}

#serverSelectCard{
  animation: dashAnimFadeUp .48s .06s cubic-bezier(.22,1,.36,1) both;
}

.dashOverviewStat{
  animation: dashAnimPopIn .55s cubic-bezier(.22,1,.36,1) both;
  transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
  will-change: transform;
}

.dashOverviewStat:nth-child(1){ animation-delay:.04s; }
.dashOverviewStat:nth-child(2){ animation-delay:.10s; }
.dashOverviewStat:nth-child(3){ animation-delay:.16s; }
.dashOverviewStat:nth-child(4){ animation-delay:.22s; }
.dashOverviewStat:nth-child(5){ animation-delay:.28s; }
.dashOverviewStat:nth-child(6){ animation-delay:.34s; }

.dashOverviewStat:hover{
  transform:translate3d(0,-2px,0);
  border-color:rgba(var(--accent-rgb), .26);
  box-shadow: 0 12px 28px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.06);
}

.dashOverviewStatValue.isCounting{
  animation: dashAnimCountFlash .65s ease both;
}

.dashOverviewPanel{
  animation: dashAnimFadeUp .55s .26s cubic-bezier(.22,1,.36,1) both;
}

#configCard,
#logsCard,
#usersCard,
#serversCard,
#discordViewCard{
  animation: dashAnimSoftIn .32s ease both;
}

.modal.show .modalBackdrop{
  animation: dashAnimBackdropIn .22s ease both;
}

.modal.show .modalCard{
  animation: dashAnimModalIn .32s cubic-bezier(.22,1,.36,1) both;
  transform-origin: center center;
}

@media (prefers-reduced-motion: reduce){
  .dashboardOverviewCard,
  #serverSelectCard,
  .dashOverviewStat,
  .dashOverviewPanel,
  #configCard,
  #logsCard,
  #usersCard,
  #serversCard,
  #discordViewCard,
  .modal.show .modalBackdrop,
  .modal.show .modalCard,
  .dashOverviewStatValue.isCounting{
    animation:none !important;
  }
  .dashOverviewStat{
    transition:none;
  }
  .dashOverviewStat:hover{
    transform:none;
  }
}

#serverGrid.staggerOnce .serverGridSectionTiles .tile{
  animation: dashAnimFadeUp .38s cubic-bezier(.22,1,.36,1) both;
}

#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(1){ animation-delay:0s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(2){ animation-delay:.03s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(3){ animation-delay:.06s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(4){ animation-delay:.09s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(5){ animation-delay:.12s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(6){ animation-delay:.15s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(7){ animation-delay:.18s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(8){ animation-delay:.21s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(9){ animation-delay:.24s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(10){ animation-delay:.27s; }
#serverGrid.staggerOnce .serverGridSectionTiles .tile:nth-child(n+11){ animation-delay:.30s; }

#sideList.staggerOnce .sideIcon{
  animation: dashAnimFadeUp .34s cubic-bezier(.22,1,.36,1) both;
}

#sideList.staggerOnce .sideIcon:nth-child(1){ animation-delay:.04s; }
#sideList.staggerOnce .sideIcon:nth-child(2){ animation-delay:.07s; }
#sideList.staggerOnce .sideIcon:nth-child(3){ animation-delay:.10s; }
#sideList.staggerOnce .sideIcon:nth-child(4){ animation-delay:.13s; }
#sideList.staggerOnce .sideIcon:nth-child(5){ animation-delay:.16s; }
#sideList.staggerOnce .sideIcon:nth-child(6){ animation-delay:.19s; }
#sideList.staggerOnce .sideIcon:nth-child(7){ animation-delay:.22s; }
#sideList.staggerOnce .sideIcon:nth-child(8){ animation-delay:.25s; }
#sideList.staggerOnce .sideIcon:nth-child(n+9){ animation-delay:.28s; }

.btn:active:not(:disabled){
  transform: translateY(0) scale(.97);
  transition: transform .08s ease;
}

.tile:focus-visible,
.sideIcon:focus-visible,
.dashOverviewStat:focus-within{
  outline:none;
  box-shadow: 0 0 0 2px rgba(var(--accent-rgb), .55), 0 12px 28px rgba(0,0,0,.30);
}

@media (prefers-reduced-motion: reduce){
  #serverGrid.staggerOnce .serverGridSectionTiles .tile,
  #sideList.staggerOnce .sideIcon,
  .dashOverviewBarFill,
  .dashboardViewerDock{
    animation:none !important;
  }
  .btn:active:not(:disabled){
    transform:none;
  }
}

@keyframes dashAnimSoftIn{
  from{ opacity:0; }
  to{ opacity:1; }
}

@keyframes dashAnimBarRise{
  from{ height:0; opacity:.5; }
  to  { height:var(--target-h, 12px); opacity:1; }
}

.dashOverviewBarFill{
  height: var(--target-h, 12px);
  transition:
    height 2.2s cubic-bezier(.22,1,.36,1),
    filter .2s ease;
}

.dashOverviewBarFill.firstRender{
  animation: dashAnimBarRise 2.2s cubic-bezier(.22,1,.36,1) both;
}

.dashboardViewerDockRow{
  transition: background .18s ease, border-color .18s ease, transform .18s ease;
}

.dashboardViewerDockRow:hover{
  transform: translate3d(0,-1px,0);
}

@keyframes dashAnimToastIn{
  0%   { opacity:0; transform: translate3d(0,-12px,0) scale(.96); }
  60%  { opacity:1; transform: translate3d(0,2px,0) scale(1.01); }
  100% { opacity:1; transform: translate3d(0,0,0) scale(1); }
}

.toast.ok,
.toast.bad,
.toast.warn{
  animation: dashAnimToastIn .42s cubic-bezier(.22,1,.36,1) both;
  transform-origin: top left;
}

#configCard .subcard{
  transition:
    transform .22s cubic-bezier(.22,1,.36,1),
    border-color .22s ease,
    box-shadow .22s ease,
    background .22s ease;
}

#configCard .subcard:hover{
  transform: translate3d(0,-2px,0);
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 14px 32px rgba(0,0,0,.30), inset 0 1px 0 rgba(255,255,255,.05);
}

#configCard .subcard:active{
  transform: translate3d(0,-2px,0);
}

@media (prefers-reduced-motion: reduce){
  #configCard .subcard:active{
    transform:none;
  }
}

.dashOverviewPanel{
  transition:
    transform .22s cubic-bezier(.22,1,.36,1),
    border-color .22s ease,
    box-shadow .22s ease;
}

.dashOverviewPanel:hover{
  transform: translate3d(0,-2px,0);
  border-color: rgba(var(--accent-rgb), .22);
  box-shadow: 0 16px 32px rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.05);
}

.dashOverviewBarItem{
  transition: transform .2s cubic-bezier(.22,1,.36,1);
}

.dashOverviewBarItem:hover{
  transform: translate3d(0,-2px,0);
}

.dashOverviewBarItem:hover .dashOverviewBarFill{
  filter: brightness(1.12) saturate(1.05);
}

@media (max-width: 760px){
  body.mode-config .sidebar{
    transition: transform .32s cubic-bezier(.22,1,.36,1);
  }

  .navOverlay{
    transition: opacity .3s cubic-bezier(.22,1,.36,1);
  }
}

@media (prefers-reduced-motion: reduce){
  .toast.ok,
  .toast.bad,
  .toast.warn{
    animation:none !important;
  }

  #configCard .subcard,
  .dashOverviewPanel,
  .dashOverviewBarItem,
  .dashOverviewBarFill{
    transition:none !important;
  }

  #configCard .subcard:hover,
  .dashOverviewPanel:hover,
  .dashOverviewBarItem:hover{
    transform:none;
  }
}

@keyframes dashAnimStatusPulse{
  0%   { box-shadow: 0 0 0 0 rgba(43,213,118,.55), 0 0 14px rgba(43,213,118,.30); }
  70%  { box-shadow: 0 0 0 10px rgba(43,213,118,0), 0 0 18px rgba(43,213,118,.18); }
  100% { box-shadow: 0 0 0 0 rgba(43,213,118,0), 0 0 14px rgba(43,213,118,.30); }
}

.dashOverviewStat.isStatusOnline #overviewBotStatus,
.dashOverviewStat.isStatusOffline #overviewBotStatus,
.dashOverviewStat.isStatusError #overviewBotStatus{
  display:inline-flex;
  align-items:center;
  gap:9px;
  overflow:visible;
  text-overflow:clip;
  padding-left:2px;
}

.dashOverviewStat.isStatusOnline #overviewBotStatus::before,
.dashOverviewStat.isStatusOffline #overviewBotStatus::before,
.dashOverviewStat.isStatusError #overviewBotStatus::before{
  content:'';
  flex:0 0 auto;
  width:9px;
  height:9px;
  border-radius:999px;
}

.dashOverviewStat.isStatusOnline{
  border-color: rgba(43,213,118,.30);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 0 28px rgba(43,213,118,.10);
}

.dashOverviewStat.isStatusOnline #overviewBotStatus{
  color:#5be39d;
}

.dashOverviewStat.isStatusOnline #overviewBotStatus::before{
  background:#2bd576;
  animation: dashAnimStatusPulse 1.8s ease-out infinite;
}

.dashOverviewStat.isStatusOffline{
  border-color: rgba(255,107,107,.28);
}

.dashOverviewStat.isStatusOffline #overviewBotStatus{
  color:#ff8a8a;
}

.dashOverviewStat.isStatusOffline #overviewBotStatus::before{
  background:#ff6b6b;
  box-shadow: 0 0 0 1px rgba(255,107,107,.35), 0 0 12px rgba(255,107,107,.18);
}

.dashOverviewStat.isStatusError{
  border-color: rgba(246,194,68,.32);
}

.dashOverviewStat.isStatusError #overviewBotStatus{
  color:#fbcf6e;
}

.dashOverviewStat.isStatusError #overviewBotStatus::before{
  background:#f6c244;
  box-shadow: 0 0 0 1px rgba(246,194,68,.35), 0 0 12px rgba(246,194,68,.18);
}

#botStatusPill.isStatusOnline,
#botStatusPill.isStatusOffline{
  display:inline-flex;
  align-items:center;
  gap:9px;
}

#botStatusPill.isStatusOnline::before,
#botStatusPill.isStatusOffline::before{
  content:'';
  flex:0 0 auto;
  width:8px;
  height:8px;
  border-radius:999px;
}

#botStatusPill.isStatusOnline::before{
  background:#2bd576;
  animation: dashAnimStatusPulse 1.8s ease-out infinite;
}

#botStatusPill.isStatusOffline::before{
  background:#ff6b6b;
  box-shadow: 0 0 0 1px rgba(255,107,107,.35), 0 0 12px rgba(255,107,107,.18);
}

@media (prefers-reduced-motion: reduce){
  .dashOverviewStat.isStatusOnline #overviewBotStatus::before,
  #botStatusPill.isStatusOnline::before{
    animation:none !important;
  }
}

@keyframes dashAnimSavePulse{
  0%, 100%{
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.06),
      0 0 0 0 rgba(var(--accent-rgb), .42);
  }
  50%{
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.06),
      0 0 0 6px rgba(var(--accent-rgb), 0);
  }
}

@media (prefers-reduced-motion: reduce){
  #saveBtn[data-state="saving"]{
    animation:none !important;
  }
}

@keyframes dashAnimAvatarPop{
  0%   { opacity:0; transform: scale(.5) translate3d(0,6px,0); }
  60%  { opacity:1; transform: scale(1.06) translate3d(0,-1px,0); }
  100% { opacity:1; transform: scale(1) translate3d(0,0,0); }
}

.dashboardViewerDockFace.isNew{
  animation: dashAnimAvatarPop .5s cubic-bezier(.22,1,.36,1) both;
  transform-origin: center center;
}

.dashboardViewerDockRow.isNew{
  animation: dashAnimFadeUp .4s cubic-bezier(.22,1,.36,1) both;
}

@media (prefers-reduced-motion: reduce){
  .dashboardViewerDockFace.isNew,
  .dashboardViewerDockRow.isNew{
    animation:none !important;
  }
}

.discordBotSettingsSecureSection .discordBotSettingsSectionTitle{
  display:flex;
  align-items:center;
  gap:6px;
}

.discordBotSettingsSecureSection .discordBotSettingsSectionTitle::before{
  content:"🔒";
  font-size:13px;
}

.discordViewComposer.isSecureMode{
  opacity:.65;
  pointer-events:auto;
}

.discordViewComposer.isSecureMode .discordViewComposerInput{
  background:rgba(255,255,255,.04);
  cursor:not-allowed;
}

.discordViewComposer.isSecureMode .discordViewComposerInput::placeholder{
  color:rgba(231,234,242,.55);
  font-style:italic;
}

.discordViewComposer.isSecureMode .discordComposerPlusBtn,
.discordViewComposer.isSecureMode .discordViewComposerSendBtn,
.discordViewComposer.isSecureMode .discordComposerEmojiBtn,
.discordViewComposer.isSecureMode .discordComposerAttachBtn{
  pointer-events:none;
  opacity:.45;
}

.discordAudioSettingsSecureSection .discordAudioSecureRow{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  cursor:pointer;
  width:100%;
}

.discordAudioSecureText{
  display:flex;
  flex-direction:column;
  gap:2px;
  flex:1 1 auto;
  min-width:0;
}

.discordAudioSecureName{
  font-weight:600;
  color:rgba(231,234,242,.92);
}

.discordAudioSecureHint{
  font-size:12px;
  color:rgba(231,234,242,.6);
  line-height:1.35;
}

@media (max-width:540px){
  .discordAudioSettingsSecureSection .discordAudioSecureRow{
    flex-wrap:wrap;
  }

  .discordAudioSecureText{
    flex:1 1 100%;
  }
}

@keyframes dashAnimSaveSuccess{
  0%   { box-shadow: 0 0 0 0 rgba(43,213,118,.5), inset 0 1px 0 rgba(255,255,255,.06); }
  70%  { box-shadow: 0 0 0 14px rgba(43,213,118,0), inset 0 1px 0 rgba(255,255,255,.06); }
  100% { box-shadow: 0 0 0 0 rgba(43,213,118,0), inset 0 1px 0 rgba(255,255,255,.06); }
}

@keyframes dashAnimSavedPop{
  0%{transform:scale(1)}
  40%{transform:scale(1.05)}
  100%{transform:scale(1)}
}

#saveBtn.justSaved{
  animation: dashAnimSaveSuccess 1.2s ease-out;
  border-color: rgba(43,213,118, .50);
  transition: border-color .9s ease;
}

@media (prefers-reduced-motion: reduce){
  #saveBtn.justSaved{
    animation:none !important;
  }
}

.discordVoiceLockBanner{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  margin:8px 0 4px;
  border-radius:10px;
  font-size:13px;
  font-weight:500;
  line-height:1.3;
}

.discordVoiceLockBanner.isOther{
  background:rgba(245,158,11,.10);
  border:1px solid rgba(245,158,11,.30);
  color:#fcd34d;
}

.discordVoiceLockBanner.isMine{
  background:rgba(34,197,94,.10);
  border:1px solid rgba(34,197,94,.30);
  color:#86efac;
}

@keyframes dashAnimTilePop{
  0%   { transform: scale(.97); }
  55%  { transform: scale(1.025); }
  100% { transform: scale(1); }
}

@keyframes dashAnimBtnAppear{
  from{ opacity:0; transform: translate3d(0,4px,0) scale(.96); }
  to  { opacity:1; transform: translate3d(0,0,0) scale(1); }
}

#inviteBtn,
#configureBtn,
#logsBtn,
#mirrorBtn{
  animation: dashAnimBtnAppear .32s cubic-bezier(.22,1,.36,1) both;
}

#configureBtn:disabled,
#logsBtn:disabled,
#mirrorBtn:disabled{
  filter: brightness(.72);
  opacity: .55;
}

#inviteBtn:disabled{
  filter: brightness(.85);
  opacity: .6;
}

@media (prefers-reduced-motion: reduce){
  .tile.active,
  #inviteBtn,
  #configureBtn,
  #logsBtn,
  #mirrorBtn{
    animation:none !important;
  }
}

.discordTreeVoiceRows{
  display:flex;
  flex-direction:column;
  gap:1px;
  padding:2px 0 4px 22px;
  margin-top:2px;
}

.discordTreeVoiceRow{
  display:flex;
  align-items:center;
  gap:8px;
  padding:3px 8px 3px 6px;
  border-radius:4px;
  cursor:default;
  color:rgba(231,234,242,.78);
  font-size:13px;
  line-height:1.2;
  min-height:26px;
  transition:background .12s ease;
}

.discordTreeVoiceRow:hover{
  background:rgba(255,255,255,.04);
  color:#fff;
}

.discordTreeVoiceRow.isMuted,
.discordTreeVoiceRow.isDeafened{
  color:rgba(231,234,242,.55);
}

.discordTreeVoiceRowAvatar{
  position:relative;
  width:22px;
  height:22px;
  border-radius:50%;
  overflow:visible;
  flex:0 0 auto;
  background:rgba(255,255,255,.06);
  display:grid;
  place-items:center;
}

.discordTreeVoiceRowAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:50%;
  display:block;
}

.discordTreeVoiceRowAvatarFallback{
  font-size:9px;
  font-weight:900;
  color:rgba(231,234,242,.7);
  text-transform:uppercase;
}

.discordTreeVoiceRow.isSpeaking .discordTreeVoiceRowAvatar{
  box-shadow:0 0 0 2px #23a55a;
}

.discordTreeVoiceRow.isSpeaking .discordTreeVoiceRowAvatar img{
  border-radius:50%;
}

.discordTreeVoiceRowAvatarOverlay{
  position:absolute;
  right:-3px;
  bottom:-3px;
  width:13px;
  height:13px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:#f23f42;
  color:#fff;
  border:2px solid var(--discord-bg, #1e2024);
  z-index:2;
}

.discordTreeVoiceRowAvatarOverlay svg{
  width:8px;
  height:8px;
}

.discordTreeVoiceRowName{
  flex:1 1 auto;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:500;
}

.discordVoiceMemberCard > .discordVoiceStateBadges{
  position:absolute;
  top:10px;
  right:10px;
  z-index:3;
  display:flex;
  gap:4px;
}

.discordVoiceMemberCardMeta .discordVoiceStateBadges{
  display:none;
}

.discordViewGroup.discordViewGroupNoTitle{
  margin-top:0;
}

.discordViewGroup.discordViewGroupNoTitle + .discordViewGroup{
  margin-top:16px;
}

.discordViewGroup + .discordViewGroup.discordViewGroupNoTitle{
  margin-top:0;
}

.discordViewNode{
  font-size:.96875rem;
  line-height:1.25rem;
  padding:6px 8px;
  margin:1px 0;
  border-radius:4px;
  color:#80848e;
  font-weight:500;
}

.discordViewNode:hover{
  background:rgba(78,80,88,.32);
  color:#dbdee1;
}

.discordViewNode.isActive{
  background:rgba(78,80,88,.6);
  color:#fff;
}

.discordViewNode.isActive:hover{
  background:rgba(78,80,88,.6);
}

.discordViewNodeIcon{
  opacity:.62;
  flex-shrink:0;
  width:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:1.25rem;
  line-height:1;
}

.discordViewNode:hover .discordViewNodeIcon{
  opacity:.88;
}

.discordViewNode.isActive .discordViewNodeIcon{
  opacity:1;
}

.discordViewGroup{
  gap:1px;
}

.discordViewGroup + .discordViewGroup{
  margin-top:14px;
}

.discordViewGroupTitle{
  font-size:.6875rem;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  color:#80848e;
  padding:16px 8px 4px;
  line-height:1.3334;
}

.discordViewCategoryBtn{
  color:#80848e;
  padding:16px 8px 4px;
  font-size:.6875rem;
  font-weight:700;
  letter-spacing:.02em;
  text-transform:uppercase;
  line-height:1.3334;
}

.discordViewCategoryBtn:hover{
  color:#dbdee1;
}

.discordViewCategoryArrow,
.discordViewCategoryCaret{
  width:12px;
  height:12px;
  font-size:11px;
  line-height:1;
}

.discordViewNodeUnreadBadge{
  font-size:.75rem;
  height:16px;
  min-width:16px;
  padding:0 4px;
  border-radius:8px;
}

.discordTreeVoiceRows{
  padding:0 0 2px 22px;
  gap:0;
}

.discordTreeVoiceRow{
  padding:1px 8px 1px 6px;
  min-height:28px;
  font-size:.875rem;
  border-radius:4px;
  color:#dbdee1;
}

.discordTreeVoiceRow.isMuted,
.discordTreeVoiceRow.isDeafened{
  color:#80848e;
}

.discordTreeVoiceRowAvatar{
  width:24px;
  height:24px;
}

.discordTreeVoiceRow:hover{
  background:rgba(78,80,88,.32);
  color:#fff;
}

.discordTreeVoiceRowName{
  font-size:.9375rem;
  font-weight:500;
  line-height:1.25;
}

.serverSelectPrompt{
  margin-top:10px;
  padding:14px 18px;
  border-radius:14px;
  border:1px dashed rgba(var(--accent-rgb), .28);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .08), transparent 38%),
    rgba(255,255,255,.025);
  color:rgba(231,234,242,.92);
  font-size:14px;
  font-weight:700;
  letter-spacing:.005em;
  min-height:76px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-align:center;
  animation: dashAnimFadeUp .38s cubic-bezier(.22,1,.36,1) both;
}

.serverSelectPromptIcon{
  flex:0 0 auto;
  width:34px;
  height:34px;
  border-radius:10px;
  display:grid;
  place-items:center;
  color:rgba(var(--accent-rgb), 1);
  background:rgba(var(--accent-rgb), .12);
  border:1px solid rgba(var(--accent-rgb), .26);
}

.serverSelectPromptText{
  min-width:0;
  flex:1 1 auto;
  line-height:1.35;
}

@media (max-width: 560px){
  .serverSelectPrompt{
    font-size:13px;
    padding:12px 14px;
  }

  .serverSelectPromptIcon{
    width:30px;
    height:30px;
  }
}

@media (prefers-reduced-motion: reduce){
  .serverSelectPrompt{
    animation:none !important;
  }
}

body.mode-serverview #discordViewCard > .discordViewTopbar{
  padding:14px 16px 12px 16px;
  background:transparent;
  border-bottom:0;
  flex:0 0 auto;
  margin-bottom:0;
}

.discordViewSidebar .discordBotControlBar{
  margin:0;
  border-radius:0;
  border:0;
  border-top:1px solid rgba(0,0,0,.3);
  background:#232428;
  padding:8px;
  flex:0 0 auto;
}

#selectedHint{
  min-height: 20px;
  margin-bottom: 0;
}

@keyframes dashAnimPromptArrow{
  0%   { transform: translate3d(0,0,0); }
  50%  { transform: translate3d(5px,0,0); }
  100% { transform: translate3d(0,0,0); }
}

@keyframes dashAnimPromptBorder{
  0%, 100% {
    border-color: rgba(var(--accent-rgb), .28);
    box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0);
  }
  50% {
    border-color: rgba(var(--accent-rgb), .55);
    box-shadow: 0 0 0 4px rgba(var(--accent-rgb), .10);
  }
}

.serverSelectPrompt{
  animation:
    dashAnimFadeUp .38s cubic-bezier(.22,1,.36,1) both,
    dashAnimPromptBorder 2.4s ease-in-out 0.4s infinite;
}

.serverSelectPromptIcon svg{
  animation: dashAnimPromptArrow 1.8s ease-in-out infinite;
}

@media (prefers-reduced-motion: reduce){
  .serverSelectPrompt,
  .serverSelectPromptIcon svg{
    animation:none !important;
  }
}

body.dashFirstLoad .dashboardIntroFab,
body.dashFirstLoad .dashboardChangelogFab,
body.dashFirstLoad .dashboardLatestChangelogDock{
  animation: dashAnimFadeUp .5s cubic-bezier(.22,1,.36,1) both;
}

body.dashFirstLoad .dashboardLatestChangelogDock{
  transform-origin: bottom left;
  animation-delay: .12s;
}

body.dashFirstLoad .dashboardIntroFab{
  animation-delay: .04s;
}

body.dashFirstLoad .dashboardChangelogFab{
  animation-delay: .08s;
}

body.dashFirstLoad .dashboardLatestChangelogItem{
  animation: dashAnimFadeUp .42s cubic-bezier(.22,1,.36,1) both;
}

body.dashFirstLoad .dashboardLatestChangelogItem:nth-child(1){ animation-delay: .18s; }
body.dashFirstLoad .dashboardLatestChangelogItem:nth-child(2){ animation-delay: .24s; }
body.dashFirstLoad .dashboardLatestChangelogItem:nth-child(3){ animation-delay: .30s; }
body.dashFirstLoad .dashboardLatestChangelogItem:nth-child(4){ animation-delay: .36s; }
body.dashFirstLoad .dashboardLatestChangelogItem:nth-child(n+5){ animation-delay: .42s; }

@media (prefers-reduced-motion: reduce){
  body.dashFirstLoad .dashboardIntroFab,
  body.dashFirstLoad .dashboardChangelogFab,
  body.dashFirstLoad .dashboardLatestChangelogDock,
  body.dashFirstLoad .dashboardLatestChangelogItem{
    animation:none !important;
  }
}

.discordViewChannelHead > .discordViewChannelHeadRow{
  flex:1 1 auto;
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  min-width:0;
}

.discordViewChannelHeadRow > .discordViewChannelHeadMain{
  flex:1 1 auto;
  min-width:0;
  display:flex;
  align-items:center;
  gap:8px;
}

.discordViewChannelHeadRow > .discordViewChannelHeadActions{
  flex:0 0 auto;
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:4px;
  flex-wrap:nowrap;
  width:auto;
}

.discordViewChannelHead .discordViewChannelTitle{
  flex:0 0 auto;
}

.discordViewChannelHead .discordViewChannelTopic{
  flex:1 1 auto;
  min-width:0;
}

@keyframes dashAnimModeFadeOut{
  from{ opacity:1; transform:translate3d(0,0,0); }
  to  { opacity:0; transform:translate3d(0,8px,0); }
}

.main > .card.isModeFadingOut{
  animation: dashAnimModeFadeOut .14s ease forwards;
  pointer-events:none;
}

@media (prefers-reduced-motion: reduce){
  .main > .card.isModeFadingOut{
    animation:none !important;
    opacity:0;
  }
}

.discordViewGuildHeadBtn{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  height:100%;
  border:0;
  background:transparent;
  padding:0;
  margin:0;
  cursor:pointer;
  font-family:inherit;
  text-align:left;
  color:inherit;
  border-radius:0;
}

.discordViewGuildHeadBtn:hover{
  background:rgba(78,80,88,.16);
}

.discordViewGuildHeadBtn .discordViewGuildMeta{
  flex:1 1 auto;
  min-width:0;
}

.discordViewGuildHeadCaret{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:#b5bac1;
  width:20px;
  height:20px;
}

.discordViewGuildHeadBtn:hover .discordViewGuildHeadCaret{
  color:#fff;
}

.discordServerActionMenu{
  position:fixed;
  z-index:9000;
  background:#111214;
  border-radius:4px;
  padding:6px 8px;
  box-shadow:0 8px 16px rgba(0,0,0,.24);
  min-width:220px;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.discordServerActionItem{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  height:32px;
  padding:0 8px;
  border:0;
  background:transparent;
  color:#dbdee1;
  font-family:inherit;
  font-size:.875rem;
  font-weight:500;
  text-align:left;
  cursor:pointer;
  border-radius:2px;
  line-height:1.2;
}

.discordServerActionItem:hover,
.discordServerActionItem:focus-visible{
  background:#5865f2;
  color:#fff;
  outline:0;
}

.discordServerActionIcon{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:18px;
  height:18px;
  color:#b5bac1;
}

.discordServerActionItem:hover .discordServerActionIcon,
.discordServerActionItem:focus-visible .discordServerActionIcon{
  color:#fff;
}

.discordServerActionLabel{
  flex:1 1 auto;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.discordServerActionDivider{
  height:1px;
  background:rgba(78,80,88,.48);
  margin:4px 0;
}

@keyframes dashAnimBtnRipple{
  0%   { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), .25), inset 0 1px 0 rgba(255,255,255,.06); }
  60%  { box-shadow: 0 0 0 10px rgba(var(--accent-rgb), 0), inset 0 1px 0 rgba(255,255,255,.06); }
  100% { box-shadow: 0 0 0 0 rgba(var(--accent-rgb), 0), inset 0 1px 0 rgba(255,255,255,.06); }
}

.btn:not(:disabled):active{
  animation: dashAnimBtnRipple .5s ease-out;
}

@media (prefers-reduced-motion: reduce){
  .btn:not(:disabled):active{
    animation:none !important;
  }
}

#discordViewMessages{
  transition: opacity .28s cubic-bezier(.22,1,.36,1);
}

#discordViewMessages.isChannelSwitching{
  opacity: 0;
  transition: opacity .14s ease;
}

@media (prefers-reduced-motion: reduce){
  #discordViewMessages,
  #discordViewMessages.isChannelSwitching{
    transition:none !important;
    opacity:1 !important;
  }
}

.dashTabBar{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:max-content;
  max-width:100%;
  min-width:0;
  padding:6px;
  background:rgba(13,17,32,.42);
  border:1px solid rgba(255,255,255,.06);
  border-radius:16px;
  position:relative;
  white-space:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:none;
  -webkit-overflow-scrolling:touch;
}

.dashTabBar::-webkit-scrollbar{
  display:none;
}

.dashTabBtn{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  flex:0 0 auto;

  padding:9px 13px;
  height:40px;

  border-radius:11px;
  border:1px solid transparent;
  background:transparent;

  color:rgba(231,234,242,.78);
  font-weight:800;
  font-size:13px;
  letter-spacing:.005em;
  cursor:pointer;
  white-space:nowrap;

  font-family:inherit;
  line-height:1;
  text-decoration:none;
  appearance:none;
  -webkit-appearance:none;


  transition:
    background .25s cubic-bezier(.22,1,.36,1),
    color .22s ease,
    transform .15s ease,
    border-color .22s ease,
    box-shadow .22s ease;
}

.dashTabBtn:hover:not(.isActiveMode){
  background: rgba(255,255,255,.05);
  color: #fff;
}

.dashTabBtn:active:not(.isActiveMode){
  transform: scale(.97);
}

.dashTabBtn .dashTabIcon{
  display: inline-grid;
  place-items: center;
  flex: 0 0 auto;
  color: inherit;
}

.dashTabBtn .dashTabIcon svg{
  display: block;
}

.dashTabBtn.isActiveMode{
  background: linear-gradient(180deg, rgba(var(--accent-rgb), .12), rgba(var(--accent-rgb), .06));
  border-color: rgba(var(--accent-rgb), .32);
  color: #fff;
  box-shadow:
    0 0 0 1px rgba(var(--accent-rgb), .14) inset,
    inset 0 1px 0 rgba(255,255,255,.06);
}

.dashTabBtn.isActiveMode .dashTabIcon{
  color: rgba(var(--accent-rgb), 1);
}

.dashTabBtn.isActiveMode::after{
  content: '';
  position: absolute;
  left: 50%;
  bottom: -7px;
  transform: translateX(-50%);
  width: 18px;
  height: 2px;
  border-radius: 999px;
  background: rgba(var(--accent-rgb), .85);
  box-shadow: 0 0 6px rgba(var(--accent-rgb), .30);
  animation: dashAnimTabBarIndicator .42s cubic-bezier(.22,1,.36,1) both;
}

.overviewTopbar .overviewDashTabBtn,
.overviewTopbar .overviewDashTabBtn:hover,
.overviewTopbar .overviewDashTabBtn:focus{
  text-decoration:none;
}

@keyframes dashAnimTabBarIndicator{
  from{ opacity:0; transform: translateX(-50%) scaleX(.2); }
  to  { opacity:1; transform: translateX(-50%) scaleX(1); }
}

@media (max-width: 1180px){
  .topbar.wrap{
    width:min(calc(100% - 28px), 1600px);
    padding:12px 12px;
  }

  .topbar > .row.space{
    grid-template-columns:minmax(135px, auto) minmax(0, 1fr) minmax(135px, auto);
    gap:7px;
  }

  .dashTabBar{
    width:100%;
    justify-content:flex-start;
  }

  .dashTabBtn{
    padding:9px 9px;
  }

  .authGoodName{
    max-width:132px;
  }
}

@media (max-width: 760px){
  .dashTabBtn .dashTabLabel{
    display:none;
  }
}

@media (prefers-reduced-motion: reduce){
  .dashTabBtn.isActiveMode::after{
    animation:none !important;
  }
  .dashTabBtn:active:not(.isActiveMode){
    transform:none;
  }
}

.ticketLogMessageContent{
  white-space:normal;
  word-break:break-word;
  line-height:1.55;
}

.ticketLogMessageContent strong,
.ticketLogReplyText strong,
.ticketLogEmbedDescription strong,
.ticketLogEmbedFieldValue strong{
  font-weight:700;
  color:#fff;
}

.ticketLogMessageContent em,
.ticketLogReplyText em,
.ticketLogEmbedDescription em,
.ticketLogEmbedFieldValue em{
  font-style:italic;
}

.ticketLogUnderline{
  text-decoration:underline;
}

.ticketLogStrike{
  text-decoration:line-through;
}

.ticketLogSpoiler{
  background:#202225;
  color:transparent;
  border-radius:3px;
  padding:0 2px;
  cursor:pointer;
  transition:color .2s ease, background .2s ease;
  user-select:none;
}

.ticketLogSpoiler:hover{
  background:rgba(32,34,37,.8);
}

.ticketLogSpoiler.isRevealed{
  background:rgba(32,34,37,.45);
  color:inherit;
  cursor:auto;
  user-select:text;
}

.ticketLogInlineCode{
  background:#2b2d31;
  color:#dbdee1;
  padding:0 4px;
  border-radius:3px;
  border:1px solid rgba(0,0,0,.3);
  font-family:Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
  font-size:.875em;
}

.ticketLogCodeBlock{
  background:#2b2d31;
  color:#dbdee1;
  padding:8px 10px;
  border-radius:4px;
  border:1px solid rgba(0,0,0,.3);
  font-family:Consolas, "Andale Mono WT", "Andale Mono", "Lucida Console", "DejaVu Sans Mono", monospace;
  font-size:.875em;
  white-space:pre-wrap;
  word-break:break-word;
  margin:4px 0;
  max-width:100%;
  overflow-x:auto;
}

.ticketLogCodeBlock code{
  background:transparent;
  padding:0;
  border:0;
  font-family:inherit;
  color:inherit;
}

.ticketLogQuote{
  border-left:4px solid #4f545c;
  padding:0 8px;
  color:#dbdee1;
  margin:2px 0;
  line-height:1.45;
}

.ticketLogBullet{
  padding-left:8px;
  line-height:1.45;
}

.ticketLogHeading{
  font-weight:700;
  color:#fff;
  margin:6px 0 2px;
  line-height:1.3;
}

.ticketLogHeading.h1{ font-size:1.5em; }
.ticketLogHeading.h2{ font-size:1.25em; }
.ticketLogHeading.h3{ font-size:1.1em; }

.ticketLogLink{
  color:#00a8fc;
  text-decoration:none;
  word-break:break-all;
}

.ticketLogLink:hover{
  text-decoration:underline;
}

.ticketLogMention{
  background:rgba(88,101,242,.15);
  color:#c9cdfb;
  padding:0 2px;
  border-radius:3px;
  font-weight:500;
}

.ticketLogTimestamp{
  background:rgba(255,255,255,.06);
  padding:0 4px;
  border-radius:3px;
  color:#dbdee1;
  font-size:.95em;
}

.ticketLogCustomEmoji{
  width:1.375em;
  height:1.375em;
  vertical-align:bottom;
  margin:0 1px;
  display:inline-block;
  object-fit:contain;
}

.ticketLogEmbedTop{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:16px;
  align-items:start;
  min-width:0;
}

.ticketLogEmbedMain{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:8px;
}

.ticketLogEmbedThumb{
  flex:0 0 auto;
  width:80px;
  height:80px;
  border-radius:6px;
  overflow:hidden;
  background:rgba(0,0,0,.2);
}

.ticketLogEmbedThumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

.ticketLogEmbedMediaRow{
  margin-top:4px;
}

.ticketLogEmbedMediaLink{
  display:block;
  position:relative;
  width:100%;
  border-radius:4px;
  overflow:hidden;
  max-width:100%;
  text-decoration:none;
  background:rgba(0,0,0,.2);
}

.ticketLogEmbedMediaImage,
.ticketLogEmbedMediaVideo{
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:420px;
  margin:0 auto;
  border-radius:4px;
  object-fit:contain;
}

.ticketLogEmbedGifBadge{
  position:absolute;
  top:8px;
  left:8px;
  background:rgba(0,0,0,.75);
  color:#fff;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
  padding:2px 6px;
  border-radius:4px;
  pointer-events:none;
}

.ticketLogEmbed.isGifEmbed{
  background:transparent;
  border:0;
  border-left:0;
  padding:0;
}

.ticketLogEmbed.isGifEmbed .ticketLogEmbedTop{
  display:none;
}

.ticketLogEmbed.isGifEmbed .ticketLogEmbedMediaRow{
  margin:0;
}

.ticketLogAttachmentMedia{
  display:flex;
  flex-direction:column;
  gap:4px;
  text-decoration:none;
  color:inherit;
  position:relative;
  max-width:100%;
}

.ticketLogAttachmentImageLink{
  display:inline-block;
  position:relative;
  border-radius:6px;
  overflow:hidden;
}

.ticketLogAttachmentImage{
  display:block;
  max-width:400px;
  max-height:300px;
  width:auto;
  height:auto;
  border-radius:6px;
  object-fit:contain;
}

.ticketLogAttachmentVideo{
  max-width:400px;
  max-height:300px;
  width:100%;
  border-radius:6px;
  background:#000;
}

.ticketLogAttachmentAudio{
  max-width:400px;
  width:100%;
}

.ticketLogAttachmentCaption{
  font-size:12px;
  color:var(--muted);
  text-decoration:none;
  word-break:break-word;
}

a.ticketLogAttachmentImageLink .ticketLogAttachmentCaption{
  position:absolute;
  bottom:0;
  left:0;
  right:0;
  padding:6px 8px;
  background:linear-gradient(to bottom, transparent, rgba(0,0,0,.75));
  color:#fff;
  opacity:0;
  transition:opacity .2s ease;
}

a.ticketLogAttachmentImageLink:hover .ticketLogAttachmentCaption{
  opacity:1;
}

.logsGuildFallback.isMainBotIcon{
  display: grid !important;
  place-items: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(var(--accent-rgb), .22), rgba(var(--accent-rgb), .08));
  color: rgba(var(--accent-rgb), 1);
  font-size: 0;
}

.logsGuildFallback.isMainBotIcon svg{
  width: 62%;
  height: 62%;
}

@media (max-width: 760px){
  .topbar > .row.space{
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:12px;
    padding:10px 0;
  }

  .topbar > .row.space > .topTitle{
    justify-self: stretch;
    width: 100%;
  }

  .topbar > .row.space > .dashTabBar{
    justify-self:stretch;
    width:100%;
    max-width:100%;
    overflow-x:auto;
    overflow-y:hidden;
    justify-content:flex-start;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  .topbar > .row.space > .dashTabBar::-webkit-scrollbar{
    display: none;
  }

  .topbar > .row.space > .topActions{
    justify-self: stretch;
    width: 100%;
  }

  .topActions > .authBox{
    width: 100%;
  }

  .dashboardLatestChangelogDock{
    display: none !important;
  }

  .dashboardViewerDock{
    display: none !important;
  }

  .communityFloatingCard{
    position: static !important;
    inset: auto !important;
    transform: none !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 12px 0 0 0 !important;
  }

  .dashboardLangDock{
    position: fixed !important;
    top: auto !important;
    left: auto !important;
    right: 14px !important;
    bottom: 76px !important;
    width: auto !important;
    z-index: 9990 !important;
  }

  .dashboardLangDock .dashboardLangBtn{
    width: auto !important;
    min-width: 0 !important;
    min-height: 48px !important;
    padding: 10px 12px !important;
    border-radius: 14px !important;
  }

  .dashboardLangDock .dashboardLangBtnText{
    display: none !important;
  }

  .dashboardLangDock .dashboardLangBtnCaret{
    display: none !important;
  }

  .dashboardIntroFab,
  .dashboardChangelogFab{
    position: fixed !important;
    width: 48px !important;
    height: 48px !important;
    min-width: 0 !important;
    padding: 0 !important;
    justify-content: center !important;
    border-radius: 14px !important;
    right: auto !important;
    top: auto !important;
  }

  .dashboardIntroFab{
    left: 14px !important;
    bottom: 14px !important;
  }

  .dashboardChangelogFab{
    left: 14px !important;
    bottom: 78px !important;
  }

  #dashboardIntroFabLabel,
  #dashboardChangelogFabLabel,
  #dashboardChangelogFabBadge{
    display: none !important;
  }

  body{
    padding-bottom: 144px;
  }
}

@media (max-width: 880px){
  .dashOverviewStats{
    grid-template-columns: 1fr 1fr !important;
  }
}

@media (max-width: 480px){
  .dashOverviewStats{
    grid-template-columns: 1fr !important;
  }
}

.ticketLogPendingBox{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
  padding:18px;
  border-radius:18px;
  border:1px solid rgba(246,194,68,.22);
  background:
    radial-gradient(circle at top right, rgba(246,194,68,.16), transparent 36%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

.ticketLogPendingIcon{
  width:44px;
  height:44px;
  display:grid;
  place-items:center;
  border-radius:16px;
  border:1px solid rgba(246,194,68,.24);
  background:rgba(246,194,68,.12);
  font-size:22px;
}

.ticketLogPendingTitle{
  font-size:20px;
  line-height:1.15;
  font-weight:900;
  color:rgba(231,234,242,.98);
}

.ticketLogPendingText{
  max-width:760px;
  color:rgba(231,234,242,.78);
  line-height:1.55;
  font-size:14px;
}

.ticketLogMessageCard.isPinned{
  border-left:3px solid rgba(246,194,68,.55);
  padding-left:8px;
  background:linear-gradient(90deg, rgba(246,194,68,.055), transparent 42%);
}

.ticketLogPinnedBadge{
  display:inline-flex;
  align-items:center;
  gap:4px;
  min-height:20px;
  padding:0 7px;
  border-radius:999px;
  border:1px solid rgba(246,194,68,.28);
  background:rgba(246,194,68,.11);
  color:#ffe7a2;
  font-size:11px;
  font-weight:800;
}

.ticketLogEmbedMediaImage,
.ticketLogEmbedMediaVideo,
.ticketLogAttachmentImage,
.ticketLogAttachmentVideo{
  max-width:min(400px, 100%);
}

.ticketLogEmbedMediaLink.isBrokenMedia,
.ticketLogAttachmentMedia.isBrokenMedia,
.ticketLogEmbedThumb.isBrokenMedia{
  min-width:220px;
  min-height:86px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px dashed rgba(255,255,255,.18);
  background:rgba(255,255,255,.035);
  color:var(--muted);
}

.ticketLogEmbedMediaLink.isBrokenMedia::after,
.ticketLogAttachmentMedia.isBrokenMedia::after,
.ticketLogEmbedThumb.isBrokenMedia::after{
  content:"Medium nicht mehr verfügbar";
  padding:12px;
  font-size:12px;
  font-weight:800;
  text-align:center;
}

.ticketLogEmbedMediaLink.isBrokenMedia img,
.ticketLogEmbedMediaLink.isBrokenMedia video,
.ticketLogAttachmentMedia.isBrokenMedia img,
.ticketLogAttachmentMedia.isBrokenMedia video,
.ticketLogAttachmentMedia.isBrokenMedia audio,
.ticketLogEmbedThumb.isBrokenMedia img{
  display:none;
}

.ticketLogParagraph{
  margin:0;
}

.ticketLogSpacer{
  height:8px;
}

.ticketLogBullet{
  display:flex;
  align-items:flex-start;
  gap:7px;
  padding-left:2px;
}

.ticketLogBulletDot{
  flex:0 0 auto;
  color:rgba(231,234,242,.92);
}

.ticketLogTimestamp{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:0 4px;
  border-radius:4px;
  background:rgba(79,84,92,.28);
  color:#dbdee1;
  font-weight:600;
}

.ticketLogSystemMessage{
  display:grid;
  grid-template-columns:24px minmax(0, 1fr);
  gap:8px;
  align-items:center;
  padding:8px 0 8px 52px;
  border-top:1px solid rgba(255,255,255,.06);
  color:rgba(219,222,225,.88);
  font-size:14px;
  line-height:1.45;
}

.ticketLogSystemIcon{
  width:24px;
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  opacity:.95;
}

.ticketLogSystemText{
  min-width:0;
  word-break:break-word;
}

.ticketLogSystemText strong{
  color:#fff;
  font-weight:800;
  margin-right:4px;
}

.ticketLogSystemTime{
  color:var(--muted);
  font-size:12px;
  margin-left:4px;
}

.ticketLogV2List{
  display:grid;
  gap:8px;
  justify-items:start;
  max-width:720px;
}

.ticketLogV2Container{
  display:grid;
  gap:10px;
  padding:8px 16px 16px 12px;
  border-radius:4px;
  border:0;
  border-left:4px solid var(--embed-accent, rgba(var(--accent-rgb), .85));
  background:#2b2d31;
  color:#dbdee1;
  width:min(100%, 520px);
  max-width:520px;
  min-width:0;
}

.ticketLogV2ActionRow{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:8px;
}

.ticketLogV2Text{
  line-height:1.375;
  word-break:break-word;
  overflow-wrap:anywhere;
}

.ticketLogV2Text .ticketLogHeading{
  margin-top:0;
}

.ticketLogV2Separator{
  height:1px;
  background:rgba(255,255,255,.1);
  margin:2px 0;
}

.ticketLogV2Button{
  min-height:32px;
  padding:0 14px;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.08);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:700;
  font-size:.92rem;
  text-decoration:none;
  color:#fff;
  background:#4f545c;
  max-width:100%;
  cursor:default;
}

.ticketLogV2Button.isStyle1{
  background:#5865f2;
}

.ticketLogV2Button.isStyle2{
  background:#4f545c;
}

.ticketLogV2Button.isStyle3{
  background:#248046;
}

.ticketLogV2Button.isStyle4{
  background:#da373c;
}

.ticketLogV2Button.isStyle5{
  background:#4f545c;
  color:#fff;
  border-color:transparent;
  cursor:pointer;
}

.ticketLogV2Button.isDisabled{
  opacity:.55;
  pointer-events:none;
}

.ticketLogV2ButtonEmoji{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}

.ticketLogV2ButtonEmoji img{
  width:1.15em;
  height:1.15em;
  object-fit:contain;
}

.ticketLogV2ExternalIcon{
  opacity:.82;
  font-size:.82em;
  line-height:1;
}

.ticketLogV2Select{
  width:min(360px, 100%);
  min-height:40px;
  border-radius:8px;
  background:#3a3c43;
  border:1px solid rgba(255,255,255,.08);
  overflow:hidden;
}

.ticketLogV2SelectTop{
  min-height:40px;
  padding:0 12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.ticketLogV2SelectLabel{
  min-width:0;
  color:#dbdee1;
  font-size:14px;
  font-weight:700;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.ticketLogV2SelectCaret{
  color:rgba(219,222,225,.74);
  font-size:18px;
  line-height:1;
}

.ticketLogV2SelectPreview{
  display:flex;
  align-items:center;
  gap:8px;
  padding:8px 12px 10px;
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.12);
}

.ticketLogV2SelectPreviewText{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
  color:#dbdee1;
  font-size:13px;
  font-weight:700;
}

.ticketLogV2SelectPreviewText small{
  color:rgba(219,222,225,.62);
  font-size:12px;
  font-weight:500;
}

.ticketLogV2MediaGrid{
  display:grid;
  gap:8px;
  max-width:520px;
}

.ticketLogV2MediaItem{
  display:block;
  overflow:hidden;
  border-radius:8px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.16);
}

.ticketLogV2MediaItem img{
  display:block;
  max-width:100%;
  height:auto;
}

.ticketLogImageGrid{
  display:grid;
  gap:4px;
  margin-top:4px;
  max-width:min(520px, 100%);
}

.ticketLogImageGrid.isOne{
  display:inline-block;
  max-width:min(420px, 100%);
  border-radius:8px;
  overflow:hidden;
  line-height:0;
  background:transparent;
}

.ticketLogImageGrid.isTwo{
  grid-template-columns:1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.ticketLogImageGrid.isThree{
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.ticketLogImageGrid.isThree .ticketLogImageGridItem:first-child{
  grid-row:span 2;
}

.ticketLogImageGrid.isFour{
  grid-template-columns:1fr 1fr;
  grid-template-rows:1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.ticketLogImageGrid.isSix{
  grid-template-columns:1fr 1fr 1fr;
  grid-template-rows:1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.ticketLogImageGrid.isNine,
.ticketLogImageGrid.isMany{
  grid-template-columns:1fr 1fr 1fr;
  grid-template-rows:1fr 1fr 1fr;
  border-radius:12px;
  overflow:hidden;
}

.ticketLogImageGridItem{
  position:relative;
  display:block;
  overflow:hidden;
  background:rgba(255,255,255,.04);
  border:0;
  padding:0;
  cursor:zoom-in;
  transition:opacity .12s ease;
  min-height:90px;
  color:inherit;
}

.ticketLogImageGrid.isOne .ticketLogImageGridItem{
  display:block;
  border-radius:8px;
  overflow:hidden;
  min-height:0;
  background:transparent;
  border:0;
  padding:0;
  cursor:zoom-in;
}

.ticketLogImageGridItem:hover{
  opacity:.88;
}

.ticketLogImageGrid:not(.isOne) .ticketLogImageGridItem img{
  width:100%;
  height:100%;
  min-height:120px;
  max-height:220px;
  object-fit:cover;
  display:block;
  background:rgba(0,0,0,.22);
}

.ticketLogImageGrid.isOne .ticketLogImageGridItem img{
  display:block;
  width:auto;
  max-width:100%;
  max-height:380px;
  object-fit:contain;
  border-radius:8px;
  background:rgba(0,0,0,.22);
}

.ticketLogImageGrid.isThree .ticketLogImageGridItem:first-child img{
  min-height:244px;
}

.ticketLogImageGrid.isSix .ticketLogImageGridItem img,
.ticketLogImageGrid.isNine .ticketLogImageGridItem img,
.ticketLogImageGrid.isMany .ticketLogImageGridItem img{
  min-height:106px;
  max-height:160px;
}

.ticketLogImageGridMore{
  position:absolute;
  inset:0;
  display:grid;
  place-items:center;
  background:rgba(0,0,0,.62);
  color:#fff;
  font-size:1.45rem;
  font-weight:900;
  pointer-events:none;
  text-shadow:0 2px 8px rgba(0,0,0,.45);
}

.ticketLogInlineVideos,
.ticketLogInlineAudios,
.ticketLogFileList{
  display:grid;
  gap:8px;
  max-width:min(520px, 100%);
}

.ticketLogVideoBlock{
  width:min(520px, 100%);
}

.ticketLogVideoBlock .ticketLogAttachmentVideo{
  width:100%;
  max-width:100%;
  max-height:420px;
}

.ticketLogMediaLightbox .discordImageLightboxImgWrap img{
  max-width:100%;
  max-height:calc(92dvh - 90px);
  width:auto;
  height:auto;
  object-fit:contain;
}

@media (max-width: 620px){
  .ticketLogImageGrid{
    max-width:100%;
  }

  .ticketLogImageGrid.isOne{
    max-width:100%;
  }

  .ticketLogImageGrid:not(.isOne) .ticketLogImageGridItem img{
    min-height:92px;
    max-height:180px;
  }

  .ticketLogImageGrid.isThree .ticketLogImageGridItem:first-child img{
    min-height:188px;
  }

  .ticketLogImageGrid.isSix .ticketLogImageGridItem img,
  .ticketLogImageGrid.isNine .ticketLogImageGridItem img,
  .ticketLogImageGrid.isMany .ticketLogImageGridItem img{
    min-height:82px;
    max-height:128px;
  }

  .ticketLogImageGrid.isOne .ticketLogImageGridItem img{
    max-height:320px;
  }
}

.ticketLogImageGridItem.isBrokenMedia,
.ticketLogV2MediaItem.isBrokenMedia{
  min-width:180px;
  min-height:110px;
  display:grid;
  place-items:center;
  border:1px dashed rgba(255,255,255,.18);
  background:rgba(255,255,255,.035);
  color:var(--muted);
  cursor:default;
}

.ticketLogImageGridItem.isBrokenMedia img,
.ticketLogV2MediaItem.isBrokenMedia img{
  display:none;
}

.ticketLogImageGridItem.isBrokenMedia::after,
.ticketLogV2MediaItem.isBrokenMedia::after{
  content:"Bild nicht mehr verfügbar";
  padding:12px;
  font-size:12px;
  font-weight:800;
  text-align:center;
}

.customCommandsModalGrid{
  grid-template-columns: minmax(170px,.42fr) minmax(0,1.18fr) minmax(360px,.9fr);
}

.customCommandsPaletteCol{
  position:sticky;
  top:0;
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:14px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.18);
}

.customCommandsPaletteCol .btn{
  width:100%;
  justify-content:flex-start;
}

.customCommandsV2Section{
  margin-top:12px;
}

.customCommandsV2BlockCard textarea{
  min-height:110px;
}

.discordV2Text{
  color:#dbdee1;
  line-height:1.38;
  white-space:normal;
}

.discordV2Separator{
  margin:10px 0;
}

.discordV2Separator.large{
  margin:18px 0;
}

.discordV2Separator:not(.noDivider)::before{
  content:"";
  display:block;
  height:1px;
  background:rgba(255,255,255,.14);
}

.discordV2Container{
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
}

@media (max-width: 1180px){
  .customCommandsModalGrid{
    grid-template-columns:1fr;
  }

  .customCommandsPaletteCol{
    position:static;
  }
}

.customCommandsModalGrid{
  grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr) !important;
}

.customCommandsPaletteCol{
  display:none !important;
}

.discordComponentRows{
  display:grid;
  gap:8px;
  margin-top:8px;
}

.discordComponentRow{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

.discordComponentBtn{
  min-height:32px;
  padding:0 14px;
  border-radius:8px;
  border:0;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-weight:700;
  font-size:14px;
  line-height:32px;
  text-decoration:none;
  color:#fff;
  cursor:default;
  opacity:1 !important;
  filter:none !important;
  box-shadow:none;
  pointer-events:auto;
  user-select:none;
}

.discordComponentBtn:hover{
  transform:none;
  box-shadow:none;
  filter:brightness(1.04);
}

.discordComponentBtn.isStyle1{
  background:#5865f2;
}

.discordComponentBtn.isStyle2{
  background:#4e5058;
}

.discordComponentBtn.isStyle3{
  background:#248046;
}

.discordComponentBtn.isStyle4{
  background:#da373c;
}

.discordComponentBtn.isStyle5{
  background:#4e5058;
  color:#fff;
}

.discordComponentBtn.isStyle5:hover{
  background:#5c5f66;
}

.discordComponentBtn.isDisabled{
  opacity:1 !important;
  filter:none !important;
}

.discordComponentExternalIcon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:12px;
  line-height:1;
  opacity:.82;
  transform:translateY(-1px);
}

.discordV2Text{
  color:#dbdee1;
  font-size:15px;
  line-height:1.38;
  white-space:normal;
  overflow-wrap:anywhere;
}

.discordV2Text h1,
.discordV2Text h2,
.discordV2Text h3{
  margin:0 0 6px;
}

.discordV2Separator{
  margin:10px 0;
}

.discordV2Separator.large{
  margin:18px 0;
}

.discordV2Separator:not(.noDivider)::before{
  content:"";
  display:block;
  height:1px;
  background:rgba(255,255,255,.14);
}

.discordV2MediaGallery{
  display:grid;
  gap:8px;
  width:min(520px,100%);
  margin-top:8px;
}

.discordV2MediaItem{
  display:block;
  width:100%;
  padding:0;
  border:0;
  border-radius:8px;
  overflow:hidden;
  background:#2b2d31;
  cursor:default;
  text-align:left;
}

.discordV2MediaItem img{
  display:block;
  width:auto;
  max-width:100%;
  height:auto;
  max-height:420px;
  margin:0 auto;
  object-fit:contain;
  background:#1e1f22;
}

.discordV2MediaItem.isSpoiler{
  position:relative;
}

.discordV2MediaItem.isSpoiler img{
  filter:blur(18px) brightness(.65);
}

.discordV2MediaItem.isSpoiler::after{
  content:"SPOILER";
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  padding:4px 8px;
  border-radius:4px;
  background:#111214;
  color:#f2f3f5;
  font-size:11px;
  font-weight:800;
  letter-spacing:.04em;
}

.discordV2MediaAlt{
  display:block;
  padding:7px 9px;
  color:rgba(219,222,225,.72);
  font-size:12px;
  line-height:1.3;
}

.discordV2Container{
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
}

.customCommandsV2Head{
  align-items:flex-start;
}

.customCommandsV2AddRow{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

.customCommandsV2AddBtn{
  min-height:34px;
  padding:8px 10px;
}

.customCommandsV2Cards{
  gap:10px;
}

.customCommandsV2BlockCard{
  border-color:rgba(var(--accent-rgb),.16);
  background:rgba(255,255,255,.025);
}

.customCommandsV2BlockHead{
  padding-bottom:8px;
  border-bottom:1px solid rgba(255,255,255,.07);
}

.customCommandsV2Empty{
  padding:14px;
  border-radius:12px;
  border:1px dashed rgba(255,255,255,.14);
  color:rgba(231,234,242,.62);
  font-size:13px;
  text-align:center;
}

.customCommandsV2ButtonCards{
  margin-top:10px;
}

.customCommandsV2ButtonCard{
  background:rgba(0,0,0,.14);
}

@media (max-width:1180px){
  .customCommandsModalGrid{
    grid-template-columns:1fr !important;
  }

  .customCommandsPreviewCol{
    position:static;
  }

  .customCommandsV2Head{
    flex-direction:column;
    gap:10px;
  }

  .customCommandsV2AddRow{
    justify-content:flex-start;
  }
}

.bewOverviewPage.aufOverviewPage .bewOverviewTable.aufOverviewTable{
  min-width:1160px;
}

.bewOverviewPage.aufOverviewPage .bewOverviewTable.aufOverviewTable thead th:nth-child(1),
.bewOverviewPage.aufOverviewPage .bewOverviewTable.aufOverviewTable tbody td:nth-child(1){
  width:360px;
  text-align:left;
}

.bewOverviewPage.aufOverviewPage .bewOverviewTable.aufOverviewTable thead th:nth-child(n + 2),
.bewOverviewPage.aufOverviewPage .bewOverviewTable.aufOverviewTable tbody td:nth-child(n + 2){
  width:130px;
  text-align:center;
  white-space:nowrap;
}

.bewOverviewPage.aufOverviewPage .bewOverviewTable.aufOverviewTable thead th:nth-child(7),
.bewOverviewPage.aufOverviewPage .bewOverviewTable.aufOverviewTable tbody td:nth-child(7){
  width:160px;
}

.bewOverviewPage.aufOverviewPage .bewOverviewNameCell{
  align-items:center;
}

.bewOverviewPage.aufOverviewPage .bewOverviewStatus.active{
  color:#aef7c7;
  background:rgba(24,126,74,.22);
  border-color:rgba(70,204,129,.32);
}

.bewOverviewPage.aufOverviewPage .bewOverviewStatus.absent{
  color:#ffb4b4;
  background:rgba(255,77,77,.16);
  border-color:rgba(255,77,77,.28);
}

.bewOverviewPage.aufOverviewPage .bewOverviewStatus.late{
  color:#ffe5a0;
  background:rgba(246,194,68,.16);
  border-color:rgba(246,194,68,.28);
}

.bewOverviewPage.aufOverviewPage .bewOverviewStatus.missing{
  color:#ffb4b4;
  background:rgba(255,77,77,.18);
  border-color:rgba(255,77,77,.32);
}

.bewOverviewPage.aufOverviewPage .bewOverviewStatus.inactive{
  color:rgba(231,234,242,.72);
  background:rgba(255,255,255,.06);
  border-color:rgba(255,255,255,.08);
}

@media (max-width:760px){
  .bewOverviewPage.aufOverviewPage .bewOverviewTable.aufOverviewTable{
    min-width:1020px;
  }
}

body.mode-dms,
body.mode-dms html{
  overscroll-behavior:none;
}

body.mode-dms{
  overflow:hidden;
  height:100dvh;
  max-height:100dvh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
}

body.mode-dms > .topbar{
  flex:0 0 auto;
}

body.mode-dms > .navOverlay{
  flex:0 0 auto;
}

body.mode-dms .layout{
  height:calc(var(--botDmsViewportHeight, 100dvh) - var(--botDmsTopbarHeight, 122px));
  max-height:calc(var(--botDmsViewportHeight, 100dvh) - var(--botDmsTopbarHeight, 122px));
  min-height:0;
  flex:1 1 auto;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}

body.mode-dms .main.wrap{
  width:100%;
  max-width:none;
  margin:0;
  padding:8px 10px 0 10px;
  box-sizing:border-box;
  display:flex;
  flex-direction:column;
  justify-content:stretch;
  overflow:hidden;
  flex:1 1 auto;
  min-height:0;
  height:100%;
  max-height:100%;
}

body.mode-dms #serverSelectCard,
body.mode-dms #configCard,
body.mode-dms #logsCard,
body.mode-dms #usersCard,
body.mode-dms #serversCard,
body.mode-dms #discordViewCard{
  display:none !important;
}

body.mode-dms #sidebar,
body.mode-dms #backBtn,
body.mode-dms #toastWrap{
  display:none !important;
}

body.mode-dms #botDmsCard{
  display:flex !important;
}

.botDmsTabUnread{
  min-width:18px;
  height:18px;
  padding:0 5px;
  border-radius:999px;
  background:#ed4245;
  color:#fff;
  font-size:11px;
  font-weight:900;
  line-height:18px;
  align-items:center;
  justify-content:center;
  box-shadow:0 0 0 3px rgba(237,66,69,.16);
  margin-left:2px;
}

.botDmsCard{
  width:100%;
  max-width:none;
  margin:0;
  height:100%;
  max-height:100%;
  min-height:0;
  flex:1 1 auto;
  flex-direction:column;
  overflow:hidden;
  background:#1e1f22;
  border:1px solid var(--line);
  border-bottom:0;
  border-radius:14px 14px 0 0;
  color:#dbdee1;
  padding:0;
  box-sizing:border-box;
  box-shadow:0 12px 40px rgba(0,0,0,.35);
  font-family:"gg sans", "Noto Sans", "Helvetica Neue", Helvetica, Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-feature-settings:"cv11", "ss01", "ss03";
}

.botDmsCard *{
  font-family:inherit;
}

.botDmsShell{
  display:grid;
  grid-template-columns:320px minmax(0, 1fr);
  width:100%;
  height:100%;
  min-height:0;
  flex:1 1 auto;
  overflow:hidden;
  background:#313338;
}

.botDmsSidebar{
  min-width:0;
  min-height:0;
  border-right:1px solid rgba(0,0,0,.3);
  background:#2b2d31;
  display:flex;
  flex-direction:column;
  overflow:hidden;
}

.botDmsSideHead{
  height:48px;
  min-height:48px;
  padding:0 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-bottom:1px solid rgba(0,0,0,.3);
  background:#2b2d31;
  box-shadow:0 1px 0 rgba(4,4,5,.2), 0 1.5px 0 rgba(6,6,7,.05), 0 2px 0 rgba(4,4,5,.05);
  flex:0 0 auto;
}

.botDmsSideHead h2{
  margin:0;
  font-size:16px;
  font-weight:900;
  line-height:1.1;
  color:#fff;
}

.botDmsSideHead .muted.small{
  display:none;
}

.botDmsSearchWrap{
  width:100%;
  min-width:0;
  margin:0;
  padding:10px 10px 8px;
  flex:0 0 auto;
}

.botDmsSearchWrap .logsSearchRow{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;
}

.botDmsSearchWrap .logsSearchField{
  min-height:36px;
  height:36px;
  border-radius:10px;
  background:rgba(30,31,34,.9);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:none;
  padding:0 8px;
  display:flex;
  align-items:center;
  gap:6px;
  flex:1 1 auto;
  min-width:0;
}

.botDmsSearchWrap .logsSearchField:focus-within{
  border-color:rgba(88,101,242,.55);
  box-shadow:0 0 0 3px rgba(88,101,242,.15);
}

.botDmsSearchWrap .logsSearchIcon{
  opacity:.72;
  flex:0 0 auto;
  font-size:15px;
}

#botDmsSearch{
  appearance:none;
  -webkit-appearance:none;
  flex:1 1 auto;
  min-width:0;
  height:30px;
  padding:0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
  outline:none !important;
  color:#dbdee1;
  font-size:13px;
}

#botDmsSearch::placeholder{
  color:rgba(219,222,225,.45);
}

#botDmsSearch:focus,
#botDmsSearch:focus-visible{
  outline:none !important;
  box-shadow:none !important;
  transform:none !important;
}

#botDmsSearch::-webkit-search-decoration,
#botDmsSearch::-webkit-search-cancel-button,
#botDmsSearch::-webkit-search-results-button,
#botDmsSearch::-webkit-search-results-decoration{
  -webkit-appearance:none;
  appearance:none;
  display:none;
}

.botDmsSearchWrap .logsSearchClearBtn{
  flex:0 0 auto;
  width:22px;
  height:22px;
  min-width:22px;
  border-radius:50%;
  background:transparent;
  border:0;
  color:rgba(219,222,225,.55);
  font-size:11px;
  cursor:pointer;
  display:none;
  align-items:center;
  justify-content:center;
  padding:0;
  opacity:1;
  pointer-events:auto;
}

.botDmsSearchWrap .logsSearchClearBtn.show{
  display:inline-flex;
}

.botDmsSearchWrap .logsSearchClearBtn:hover{
  background:rgba(255,255,255,.08);
  color:#fff;
}

.botDmsStartBox{
  display:none !important;
}

.botDmsList{
  flex:1 1 auto;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  padding:0 8px 12px;
  display:flex;
  flex-direction:column;
  gap:2px;
}

.botDmsListItem{
  width:100%;
  min-height:44px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#dbdee1;
  display:flex;
  align-items:center;
  gap:10px;
  padding:6px 8px;
  cursor:pointer;
  text-align:left;
  position:relative;
}

.botDmsListItem:hover{
  background:#35373c;
}

.botDmsListItem.isActive{
  background:#404249;
}

.botDmsListItem.hasUnread{
  background:rgba(237,66,69,.12);
}

.botDmsAvatar{
  position:relative;
  width:32px;
  height:32px;
  min-width:32px;
  min-height:32px;
  border-radius:999px;
  overflow:visible;
  display:block;
  flex:0 0 32px;
  background:#1e1f22;
  border:0;
  font-weight:900;
  color:#dbdee1;
  isolation:isolate;
}

.botDmsAvatar.isLarge{
  width:32px;
  height:32px;
  border-radius:999px;
}

.botDmsAvatarInner{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  border-radius:inherit;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:#1e1f22;
}

.botDmsAvatar img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
  border-radius:inherit;
}

.botDmsAvatarFallback{
  width:100%;
  height:100%;
  display:grid;
  place-items:center;
  border-radius:inherit;
}

.botDmsListStatus{
  position:absolute;
  right:-2px;
  bottom:-2px;
  width:14px;
  height:14px;
  border-radius:999px;
  border:3px solid #232428;
  box-sizing:border-box;
  background:#80848e;
  z-index:4;
  display:block;
  pointer-events:none;
  box-shadow:0 0 0 1px rgba(0,0,0,.14);
}

.botDmsListStatus.isStatus-online{
  background:#23a55a;
}

.botDmsListStatus.isStatus-idle{
  background:#f0b232;
}

.botDmsListStatus.isStatus-dnd{
  background:#f23f42;
}

.botDmsListStatus.isStatus-offline,
.botDmsListStatus.isStatus-invisible{
  background:#80848e;
}

.botDmsListText{
  min-width:0;
  flex:1 1 auto;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.botDmsListName{
  min-width:0;
  font-size:14px;
  font-weight:700;
  line-height:1.15;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.botDmsListMeta{
  min-width:0;
  font-size:12px;
  line-height:1.25;
  color:#949ba4;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.botDmsBotBadge{
  display:inline-flex;
  align-items:center;
  padding:1px 5px;
  border-radius:5px;
  background:rgba(88,101,242,.22);
  color:#dbdee1;
  font-size:10px;
  font-weight:900;
  vertical-align:middle;
}

.botDmsUnreadDot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:#ed4245;
  box-shadow:0 0 0 3px rgba(237,66,69,.14);
  flex:0 0 auto;
}

.botDmsEmpty{
  min-height:180px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:8px;
  text-align:center;
  color:#949ba4;
  padding:18px;
}

.botDmsEmpty strong{
  color:#dbdee1;
}

.botDmsMain{
  position:relative;
  min-width:0;
  min-height:0;
  height:100%;
  overflow:hidden;
  display:grid;
  grid-template-rows:48px minmax(0, 1fr) auto;
  background:#313338;
}

.botDmsChatHead{
  height:48px;
  min-height:48px;
  padding:0 16px;
  border-bottom:1px solid rgba(0,0,0,.3);
  background:#313338;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  box-shadow:0 1px 0 rgba(4,4,5,.2), 0 1.5px 0 rgba(6,6,7,.05), 0 2px 0 rgba(4,4,5,.05);
  flex:0 0 auto;
}

.botDmsChatTitle{
  min-width:0;
  font-size:16px;
  font-weight:900;
  color:#fff;
  line-height:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.botDmsChatUser{
  min-width:0;
  display:flex;
  align-items:center;
  gap:10px;
}

.botDmsChatUserText{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:3px;
}

.botDmsChatUserText strong{
  font-size:16px;
  line-height:1.15;
  color:#f2f3f5;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.botDmsChatUserText span{
  color:#949ba4;
  font-size:12px;
}

.botDmsMessages{
  min-height:0;
  height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  padding:16px 0 20px;
  background:#313338;
}

.botDmsMessages > .discordViewEmpty{
  min-height:100%;
  height:100%;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  gap:8px;
  padding:24px;
}

.botDmsComposer{
  flex:0 0 auto;
  padding:0 16px 22px 16px;
  border-top:0;
  background:#313338;
  display:flex;
  flex-direction:column;
  gap:0;
}

.botDmsComposerBar,
.botDmsComposer .discordComposerBar{
  width:100%;
}

#botDmsComposerInput{
  flex:1 1 auto;
  min-width:0;
  min-height:22px;
  max-height:336px;
  padding:11px 0;
  margin:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:#dbdee1;
  font-family:inherit;
  font-size:1rem;
  line-height:1.375;
  resize:none;
  overflow-y:auto;
  overflow-x:hidden;
  align-self:stretch;
}

#botDmsComposerInput::placeholder{
  color:#6d6f78;
}

#botDmsComposerInput:focus,
#botDmsComposerInput:focus-visible{
  outline:none;
  box-shadow:none;
}

.botDmsCard.isDraggingFile .botDmsMain::after{
  content:"";
  position:absolute;
  inset:10px;
  z-index:20;
  pointer-events:none;
  border-radius:14px;
  border:2px dashed rgba(var(--accent-rgb), .62);
  background:rgba(var(--accent-rgb), .075);
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.06),
    0 0 34px rgba(var(--accent-rgb), .16);
}

.botDmsCard.isDraggingFile .botDmsComposer .discordComposerBar{
  border-color:rgba(var(--accent-rgb), .62);
  box-shadow:
    0 0 0 3px rgba(var(--accent-rgb), .16),
    0 12px 26px rgba(0,0,0,.24);
}

.botDmsLoadOlderBtn{
  display:flex;
  align-items:center;
  justify-content:center;
  width:max-content;
  margin:0 auto 16px;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:#2b2d31;
  color:#dbdee1;
  cursor:pointer;
  font-weight:800;
}

.botDmsLoadOlderBtn:hover{
  background:#35373c;
}

@media (max-width: 900px){
  body.mode-dms .main.wrap{
    padding:8px 8px 0 8px;
  }

  .botDmsShell{
    grid-template-columns:1fr;
    grid-template-rows:minmax(210px, 34dvh) minmax(0, 1fr);
    height:100%;
    min-height:0;
  }

  .botDmsSidebar{
    min-height:0;
    border-right:0;
    border-bottom:1px solid rgba(0,0,0,.3);
  }

  .botDmsMain{
    min-height:0;
  }

  .botDmsComposer{
    padding:0 10px 14px;
  }
}

body.mode-dms{
  overflow:hidden !important;
  height:100dvh !important;
  max-height:100dvh !important;
}

body.mode-dms #layout{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  top:var(--botDmsTopbarHeight, 122px) !important;
  bottom:0 !important;
  width:100% !important;
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  display:block !important;
  overflow:hidden !important;
}

body.mode-dms .main.wrap{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  max-width:none !important;
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  margin:0 !important;
  padding:8px 10px 8px 10px !important;
  display:flex !important;
  flex-direction:column !important;
  overflow:hidden !important;
}

body.mode-dms #botDmsCard,
body.mode-dms .botDmsCard{
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  margin:0 !important;
  flex:1 1 auto !important;
  display:flex !important;
  overflow:hidden !important;
  border-bottom:1px solid var(--line) !important;
  border-radius:14px !important;
}

body.mode-dms .botDmsShell{
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  flex:1 1 auto !important;
}

body.mode-dms .botDmsMain{
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
}

@media (max-width:900px){
  body.mode-dms .main.wrap{
    padding:8px !important;
  }

  body.mode-dms #botDmsCard,
  body.mode-dms .botDmsCard{
    border-radius:12px !important;
  }
}

body.mode-logs #logsCard{
  padding:16px !important;
  border:1px solid var(--line) !important;
  border-radius:16px !important;
  background:linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.02)) !important;
  box-shadow:0 12px 40px rgba(0,0,0,.35) !important;
}

body.mode-config #configCard{
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}

body.mode-blueprints .layout{
  grid-template-columns:minmax(0, 1fr);
}

body.mode-blueprints .sidebar,
body.mode-blueprints #backBtn{
  display:none !important;
}

body.mode-blueprints .main.wrap{
  width:100%;
  max-width:1320px;
  margin:0 auto;
  padding:18px;
}

body.mode-blueprints #dashboardOverviewCard,
body.mode-blueprints #serverSelectCard{
  display:none !important;
}

body.mode-blueprints #serverBuilderBlueprintsCard{
  width:min(1180px, 100%);
  margin:14px auto;
}

.serverBuilderBlueprintsPageCard{
  display:grid;
  gap:14px;
}

.serverBuilderBlueprintsPageHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px;
}

.serverBuilderBlueprintsPageHead h2{
  margin:0 0 6px;
}

.serverBuilderBlueprintsPageHead .btn{
  flex:0 0 auto;
}

#serverBuilderBlueprintsPageBody{
  display:grid;
  gap:12px;
}

.serverBuilderBlueprintBox{
  display:grid;
  gap:12px;
  padding:14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:rgba(255,255,255,.025);
}

.serverBuilderBlueprintToolbar{
  display:grid;
  grid-template-columns:minmax(240px, 1fr) auto;
  gap:12px;
  align-items:center;
}

.serverBuilderBlueprintSearchWrap{
  position:relative;
  min-width:0;
  height:42px;
  display:flex;
  align-items:center;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.045);
  box-shadow:0 0 0 1px rgba(255,255,255,.03) inset;
}

.serverBuilderBlueprintSearchWrap::before{
  content:"⌕";
  width:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(255,255,255,.62);
  font-size:14px;
  pointer-events:none;
}

.serverBuilderBlueprintSearchWrap:focus-within{
  border-color:rgba(var(--accent-rgb), .38);
  background:rgba(255,255,255,.06);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .12);
}

.serverBuilderBlueprintSearchInput{
  flex:1 1 auto;
  min-width:0;
  width:100%;
  height:40px;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text);
  padding:0 12px 0 0 !important;
  outline:none !important;
  box-shadow:none !important;
}

.serverBuilderBlueprintSearchInput::placeholder{
  color:rgba(231,234,242,.55);
}

.serverBuilderBlueprintActions{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:flex-end;
  flex-wrap:wrap;
}

.serverBuilderExtensionLaunchBtn{
  position:relative;
  isolation:isolate;
  min-height:38px;
  padding:7px 12px 7px 8px;
  gap:8px;
  overflow:hidden;
  border-color:rgba(88,101,242,.34);
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.13), transparent 28%),
    radial-gradient(circle at 100% 100%, rgba(43,213,118,.11), transparent 36%),
    linear-gradient(135deg, rgba(88,101,242,.88), rgba(43,145,255,.78));
  color:#ffffff;
  font-weight:900;
  box-shadow:
    0 9px 22px rgba(43,145,255,.13),
    0 0 0 1px rgba(255,255,255,.045) inset;
}

.serverBuilderExtensionLaunchBtn::before{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:-1;
  border-radius:inherit;
  background:linear-gradient(120deg, transparent 0%, rgba(255,255,255,.105) 44%, transparent 68%);
  transform:translateX(-120%);
  opacity:.42;
  transition:transform .68s cubic-bezier(.22,1,.36,1);
}

.serverBuilderExtensionLaunchBtn::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  border-radius:inherit;
  background:
    radial-gradient(circle at var(--mx, 50%) var(--my, 50%), rgba(255,255,255,.18), transparent 42%),
    linear-gradient(135deg, rgba(88,101,242,.80), rgba(43,213,118,.34));
  opacity:0;
  transition:opacity .18s ease;
}

.serverBuilderExtensionLaunchBtn:hover{
  transform:translateY(-1px) scale(1.012);
  border-color:rgba(120,134,255,.52);
  background:
    radial-gradient(circle at 18% 0%, rgba(255,255,255,.16), transparent 30%),
    radial-gradient(circle at 100% 100%, rgba(43,213,118,.15), transparent 38%),
    linear-gradient(135deg, rgba(96,109,255,.94), rgba(48,166,255,.86));
  box-shadow:
    0 12px 30px rgba(43,145,255,.18),
    0 0 14px rgba(88,101,242,.09),
    0 0 0 1px rgba(255,255,255,.055) inset;
}

.serverBuilderExtensionLaunchBtn:hover::before{
  transform:translateX(120%);
}

.serverBuilderExtensionLaunchBtn:hover::after{
  opacity:1;
}

.serverBuilderExtensionLaunchIcon{
  width:24px;
  height:24px;
  min-width:24px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:9px;
  background:rgba(255,255,255,.10);
  border:1px solid rgba(255,255,255,.13);
  color:#ffffff;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08);
  transition:
    transform .34s cubic-bezier(.22,1,.36,1),
    background .18s ease,
    border-color .18s ease;
}

.serverBuilderExtensionLaunchBtn:hover .serverBuilderExtensionLaunchIcon{
  transform:rotate(-6deg) scale(1.045);
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.20);
}

.serverBuilderExtensionLaunchLabel{
  line-height:1;
  white-space:nowrap;
}

.serverBuilderBlueprintList{
  display:grid;
  gap:8px;
  max-height:min(52vh, 560px);
  overflow:auto;
  padding-right:2px;
}

.serverBuilderBlueprintUsage{
  justify-self:start;
  min-height:28px;
  display:inline-flex;
  align-items:center;
  padding:0 10px;
  border-radius:999px;
  border:1px solid rgba(var(--accent-rgb), .22);
  background:rgba(var(--accent-rgb), .075);
  color:rgba(231,234,242,.92);
  font-size:12px;
  font-weight:900;
}

.serverBuilderBlueprintUsage.isLimitReached{
  border-color:rgba(255,77,77,.35);
  background:rgba(255,77,77,.10);
  color:#ffd0d0;
}

.serverBuilderBlueprintCreateCard{
  width:min(720px, calc(100vw - 32px));
  max-height:min(820px, calc(100vh - 32px));
  overflow:hidden;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr) auto;
  gap:14px;
}

.serverBuilderBlueprintCreateHead{
  display:grid;
  gap:6px;
}

.serverBuilderBlueprintCreateHead h3{
  margin:0;
  font-size:24px;
  line-height:1.1;
}

.serverBuilderBlueprintCreateBody{
  display:grid;
  gap:14px;
  min-height:0;
}

.serverBuilderBlueprintCreateNameField{
  min-width:0;
}

.serverBuilderBlueprintCreateNameField input{
  width:100%;
}

.serverBuilderBlueprintCreateSourceField{
  min-width:0;
  display:grid;
  gap:7px;
}

.serverBuilderBlueprintCreateSourceField label{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.serverBuilderBlueprintSourceSearchWrap{
  position:relative;
  min-width:0;
  height:42px;
  display:flex;
  align-items:center;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.045);
  box-shadow:0 0 0 1px rgba(255,255,255,.03) inset;
}

.serverBuilderBlueprintSourceSearchWrap::before{
  content:"⌕";
  width:34px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(255,255,255,.62);
  font-size:14px;
  pointer-events:none;
}

.serverBuilderBlueprintSourceSearchWrap:focus-within{
  border-color:rgba(var(--accent-rgb), .38);
  background:rgba(255,255,255,.06);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .12);
}

.serverBuilderBlueprintSourceSearch{
  flex:1 1 auto;
  min-width:0;
  width:100%;
  height:40px;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  color:var(--text);
  padding:0 12px 0 0 !important;
  outline:none !important;
  box-shadow:none !important;
}

.serverBuilderBlueprintSourceSearch::placeholder{
  color:rgba(231,234,242,.55);
}

.serverBuilderBlueprintSourceList{
  display:grid;
  gap:8px;
  max-height:min(420px, 48vh);
  overflow:auto;
  padding-right:2px;
}

.serverBuilderBlueprintSourceItem{
  width:100%;
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border-radius:13px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.16);
  color:var(--text);
  cursor:pointer;
  text-align:left;
}

.serverBuilderBlueprintSourceItem:hover{
  border-color:rgba(var(--accent-rgb), .32);
  background:rgba(var(--accent-rgb), .075);
}

.serverBuilderBlueprintSourceItem.isSelected{
  border-color:rgba(var(--accent-rgb), .55);
  background:rgba(var(--accent-rgb), .12);
}

.serverBuilderBlueprintSourceText{
  min-width:0;
  display:grid;
  gap:3px;
}

.serverBuilderBlueprintSourceName{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  font-weight:900;
}

.serverBuilderBlueprintSourceMeta{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:rgba(231,234,242,.62);
  font-size:12px;
}

.serverBuilderBlueprintSourceStatus{
  justify-self:end;
  white-space:nowrap;
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  color:rgba(231,234,242,.72);
  font-size:11px;
  font-weight:900;
}

.serverBuilderBlueprintSourceItem.isSelected .serverBuilderBlueprintSourceStatus{
  color:rgba(220,240,255,.95);
  border-color:rgba(var(--accent-rgb), .38);
  background:rgba(var(--accent-rgb), .14);
}

.serverBuilderBlueprintSourceEmpty{
  padding:10px 12px;
  border:1px dashed rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(0,0,0,.12);
}

.serverBuilderBlueprintCreateButtons{
  display:flex;
  justify-content:flex-end;
  gap:8px;
}

.serverBuilderBlueprintItem{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:10px;
  align-items:center;
  padding:10px 12px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:12px;
  background:rgba(0,0,0,.16);
}

.serverBuilderBlueprintItemMain{
  min-width:0;
  display:grid;
  gap:4px;
}

.serverBuilderBlueprintItemActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}

.serverBuilderBlueprintDeleteBtn,
.serverBuilderBlueprintEditBtn{
  min-height:32px;
  padding:7px 10px;
  font-size:12px;
  border-radius:10px;
}

.serverBuilderBlueprintPreviewBtn{
  position:relative;
  min-height:34px;
  padding:8px 14px;
  gap:8px;
  color:#eafff6;
  border-color:rgba(20,184,138,.45);
  background:linear-gradient(180deg, #14b88a, #0f9b75);
  box-shadow:
    0 6px 16px rgba(12,140,104,.30),
    inset 0 1px 0 rgba(255,255,255,.14);
  font-weight:750;
  transition:background .16s ease, box-shadow .16s ease, transform .12s ease, filter .16s ease;
}

.serverBuilderBlueprintPreviewBtn:hover{
  color:#ffffff;
  border-color:rgba(20,184,138,.65);
  background:linear-gradient(180deg, #18c897, #129e78);
  box-shadow:
    0 8px 20px rgba(12,140,104,.40),
    inset 0 1px 0 rgba(255,255,255,.18);
}

.serverBuilderBlueprintPreviewBtn:active{
  transform:translateY(1px);
  box-shadow:
    0 4px 12px rgba(12,140,104,.30),
    inset 0 1px 0 rgba(255,255,255,.12);
}

.serverBuilderPreviewBtnEye{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  flex:0 0 auto;
}

.serverBuilderPreviewBtnEyeSvg{
  overflow:visible;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.serverBuilderPreviewBtnEyeShape{
  transition:opacity .2s ease, transform .2s ease;
  transform-box:fill-box;
  transform-origin:center;
}

.serverBuilderPreviewBtnEyeLid{
  opacity:0;
  transition:opacity .2s ease;
}

.serverBuilderPreviewBtnIris{
  fill:currentColor;
  stroke:none;
  transform-box:fill-box;
  transform-origin:center;
  transition:transform .2s ease, opacity .2s ease;
}

.serverBuilderBlueprintPreviewBtn:hover .serverBuilderPreviewBtnEyeShape{
  opacity:0;
  transform:scaleY(.1);
}

.serverBuilderBlueprintPreviewBtn:hover .serverBuilderPreviewBtnEyeLid{
  opacity:1;
}

.serverBuilderBlueprintPreviewBtn:hover .serverBuilderPreviewBtnIris{
  opacity:0;
  transform:scaleY(.1);
}

.serverBuilderBlueprintPreviewBtn:disabled{
  opacity:.7;
  filter:saturate(.85) brightness(.92);
}

@media (prefers-reduced-motion: reduce){
  .serverBuilderBlueprintPreviewBtn,
  .serverBuilderPreviewBtnEyeShape,
  .serverBuilderPreviewBtnEyeLid,
  .serverBuilderPreviewBtnIris{
    transition:none;
  }
}

.serverBuilderBlueprintItemTitle{
  font-size:13px;
  font-weight:900;
  color:rgba(231,234,242,.96);
}

.serverBuilderBlueprintItemMeta{
  font-size:12px;
  color:rgba(231,234,242,.62);
}

.serverBuilderBlueprintEmpty{
  padding:10px 12px;
  border:1px dashed rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(0,0,0,.12);
}

@media (max-width: 860px){
  .serverBuilderBlueprintsPageHead{
    flex-direction:column;
  }

  .serverBuilderBlueprintsPageHead .btn{
    width:100%;
  }
}

@media (max-width: 860px){
  .serverBuilderBlueprintToolbar{
    grid-template-columns:1fr;
  }

  .serverBuilderBlueprintActions{
    justify-content:stretch;
  }

  .serverBuilderBlueprintActions .btn{
    flex:1 1 auto;
  }

  .serverBuilderExtensionLaunchBtn{
    justify-content:center;
  }

  .serverBuilderBlueprintItem{
    grid-template-columns:1fr;
  }

  .serverBuilderBlueprintItemActions{
    justify-content:stretch;
  }

  .serverBuilderBlueprintDeleteBtn,
  .serverBuilderBlueprintEditBtn,
  .serverBuilderBlueprintPreviewBtn{
    width:100%;
  }

  .serverBuilderBlueprintSourceItem{
    grid-template-columns:auto minmax(0, 1fr);
  }

  .serverBuilderBlueprintSourceStatus{
    grid-column:1 / -1;
    justify-self:stretch;
    text-align:center;
  }

  .serverBuilderBlueprintCreateButtons{
    flex-direction:column-reverse;
  }

  .serverBuilderBlueprintCreateButtons .btn{
    width:100%;
  }
}

.msSingleIcon,
.msOptionIcon{
  width:22px;
  height:22px;
  min-width:22px;
  border-radius:7px;
  object-fit:cover;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
}

.msBtn .msSingleIcon{
  margin-right:8px;
}

.msItem .msOptionIcon{
  margin-right:8px;
}

.serverBuilderPublicBlueprintBox{
  border-color:rgba(20,184,138,.16);
  background:
    radial-gradient(circle at 0% 0%, rgba(20,184,138,.075), transparent 34%),
    rgba(255,255,255,.025);
}

.serverBuilderPublicBlueprintList{
  max-height:min(48vh, 520px);
}

.serverBuilderBlueprintPublicBadge{
  display:inline-flex;
  align-items:center;
  min-height:20px;
  padding:0 7px;
  border-radius:999px;
  border:1px solid rgba(20,184,138,.34);
  background:rgba(20,184,138,.12);
  color:#bcf7df;
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  white-space:nowrap;
}

.serverBuilderBlueprintItemTitle.hasIcon{
  display:flex;
  align-items:center;
  gap:8px;
  min-width:0;
  flex-wrap:wrap;
}

.serverBuilderBlueprintSourceIcon{
  width:24px;
  height:24px;
  min-width:24px;
  border-radius:8px;
  object-fit:cover;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.08);
}

.serverBuilderBlueprintSourceIcon.fallback{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:9px;
  font-weight:900;
  color:rgba(231,234,242,.82);
}

.serverBuilderBlueprintPreviewCard{
  width:min(1860px, calc(100vw - 8px));
  height:min(1120px, calc(100vh - 8px));
  max-height:min(1120px, calc(100vh - 8px));
  overflow:hidden;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr) auto;
  gap:12px;
  padding:0;
  background:#313338;
  border-color:rgba(255,255,255,.10);
}

.serverBuilderBlueprintPreviewHead{
  min-height:82px;
  display:grid;
  grid-template-columns:auto minmax(0, 1fr) auto;
  align-items:center;
  gap:14px;
  padding:16px 18px;
  background:#1e1f22;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.serverBuilderBlueprintPreviewServerBadge{
  width:48px;
  height:48px;
  border-radius:16px;
  overflow:hidden;
  background:#2b2d31;
  border:none;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#fff;
  font-size:13px;
  font-weight:900;
}

.serverBuilderBlueprintPreviewServerBadge img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.serverBuilderBlueprintPreviewHeadText{
  min-width:0;
  display:grid;
  gap:4px;
}

.serverBuilderBlueprintPreviewHeadText h3{
  margin:0;
  font-size:22px;
  line-height:1.1;
}

.serverBuilderBlueprintPreviewMeta{
  color:rgba(231,234,242,.68);
  font-size:12px;
  font-weight:800;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.serverBuilderBlueprintPreviewHeadActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
}

.serverBuilderBlueprintPreviewRolesOpenBtn,
.serverBuilderBlueprintPreviewCloseBtn{
  min-height:36px;
  padding:8px 12px;
  white-space:nowrap;
}

.serverBuilderBlueprintPreviewShell{
  min-height:0;
  display:grid;
  grid-template-columns:360px minmax(0, 1fr);
  overflow:hidden;
}

.serverBuilderBlueprintPreviewChannels{
  min-height:0;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  background:#2b2d31;
  border-right:1px solid rgba(0,0,0,.28);
}

.serverBuilderBlueprintPreviewDetails{
  min-width:0;
  min-height:0;
  overflow:hidden;
  display:grid;
  grid-template-rows:auto minmax(0, 1fr);
  background:#313338;
}

.serverBuilderBlueprintPreviewPaneTitle{
  height:44px;
  display:flex;
  align-items:center;
  padding:0 14px;
  color:rgba(231,234,242,.74);
  font-size:12px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  border-bottom:1px solid rgba(255,255,255,.055);
  background:rgba(0,0,0,.12);
}

.serverBuilderBlueprintPreviewChannelList,
.serverBuilderBlueprintPreviewRoleList{
  min-height:0;
  overflow:auto;
  padding:10px;
}

.serverBuilderBlueprintPreviewDetailBody{
  min-height:0;
  overflow:hidden;
  padding:10px;
  display:grid;
  grid-template-rows:auto auto auto minmax(0, 1fr);
  align-content:stretch;
}

.serverBuilderBlueprintPreviewChannelBtn,
.serverBuilderBlueprintPreviewRoleBtn{
  width:100%;
  min-height:34px;
  align-items:center;
  gap:8px;
  padding:7px 9px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#949ba4;
  cursor:pointer;
  text-align:left;
  font-size:14px;
  font-weight:700;
}

.serverBuilderBlueprintPreviewChannelBtn{
  display:grid;
  grid-template-columns:18px minmax(0, 1fr);
}

.serverBuilderBlueprintPreviewRoleBtn{
  display:flex;
}

.serverBuilderBlueprintPreviewChannelBtn:hover,
.serverBuilderBlueprintPreviewRoleBtn:hover{
  background:rgba(255,255,255,.055);
  color:#dbdee1;
}

.serverBuilderBlueprintPreviewChannelBtn.active,
.serverBuilderBlueprintPreviewRoleBtn.active{
  background:#404249;
  color:#fff;
}

.serverBuilderBlueprintPreviewCategoryArrow{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:14px;
  height:14px;
  flex:0 0 auto;
  color:rgba(255,255,255,.5);
  border-radius:4px;
  transition:transform .16s ease, color .16s ease, background .16s ease;
}

.serverBuilderBlueprintPreviewCategoryArrow svg{
  width:12px;
  height:12px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.4;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.serverBuilderBlueprintPreviewCategoryArrow:hover{
  color:rgba(255,255,255,.85);
  background:rgba(255,255,255,.06);
}

.serverBuilderBlueprintPreviewChannelBtn.category.collapsed .serverBuilderBlueprintPreviewCategoryArrow{
  transform:rotate(-90deg);
}

.serverBuilderBlueprintPreviewChannelBtn.category{
  margin-top:8px;
  color:#949ba4;
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
}

.serverBuilderBlueprintPreviewChannelBtn.category:first-child{
  margin-top:0;
}

.serverBuilderBlueprintPreviewChannelIcon.hasLock{
  position:relative;
  overflow:visible;
}

.serverBuilderBlueprintPreviewChannelLock{
  position:absolute;
  right:-4px;
  bottom:-4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:13px;
  height:13px;
  border-radius:50%;
  background:#2b2d31;
  color:rgba(255,255,255,.55);
  pointer-events:none;
}

.serverBuilderBlueprintPreviewChannelBtn:hover .serverBuilderBlueprintPreviewChannelLock,
.serverBuilderBlueprintPreviewChannelBtn.active .serverBuilderBlueprintPreviewChannelLock{
  background:#35373c;
}

.serverBuilderBlueprintPreviewChannelLock svg{
  width:9px;
  height:9px;
  fill:none;
  stroke:currentColor;
  stroke-width:2.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.serverBuilderBlueprintPreviewChannelBtn.active .serverBuilderBlueprintPreviewChannelLock,
.serverBuilderBlueprintPreviewChannelBtn:hover .serverBuilderBlueprintPreviewChannelLock{
  color:rgba(255,255,255,.78);
}

.serverBuilderBlueprintPreviewChannelBtn.nested{
  padding-left:22px;
}

.serverBuilderBlueprintPreviewChannelIcon{
  width:18px;
  height:18px;
  min-width:18px;
  max-width:18px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:currentColor;
  opacity:.78;
  line-height:0;
  overflow:hidden;
}

.serverBuilderBlueprintPreviewChannelIcon svg{
  width:18px;
  height:18px;
  min-width:18px;
  max-width:18px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:2;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.serverBuilderBlueprintPreviewChannelIcon.text svg{
  stroke-width:2.05;
}

.serverBuilderBlueprintPreviewChannelIcon.voice svg,
.serverBuilderBlueprintPreviewChannelIcon.stage svg,
.serverBuilderBlueprintPreviewChannelIcon.announcement svg{
  stroke-width:2.05;
}

.serverBuilderBlueprintPreviewChannelIcon.forum svg,
.serverBuilderBlueprintPreviewChannelIcon.media svg{
  stroke-width:2;
}

.serverBuilderBlueprintPreviewChannelIcon.category svg{
  stroke-width:2.75;
}

.serverBuilderBlueprintPreviewChannelName{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.serverBuilderBlueprintPreviewChannelBtn:hover .serverBuilderBlueprintPreviewChannelIcon,
.serverBuilderBlueprintPreviewChannelBtn.active .serverBuilderBlueprintPreviewChannelIcon{
  opacity:1;
}

.serverBuilderBlueprintPreviewDetailHeader{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:14px;
  border-radius:14px;
  background:rgba(0,0,0,.16);
  border:1px solid rgba(255,255,255,.07);
}

.serverBuilderBlueprintPreviewDetailName{
  min-width:0;
  display:grid;
  grid-template-columns:24px minmax(0, 1fr);
  align-items:center;
  gap:10px;
  color:#f2f3f5;
  font-size:22px;
  font-weight:900;
  line-height:1.15;
  overflow-wrap:anywhere;
}

.serverBuilderBlueprintPreviewDetailName > span:last-child{
  min-width:0;
  overflow-wrap:anywhere;
}

.serverBuilderBlueprintPreviewChannelIcon.detail{
  width:24px;
  height:24px;
  min-width:24px;
  max-width:24px;
  opacity:.9;
}

.serverBuilderBlueprintPreviewChannelIcon.detail svg{
  width:24px;
  height:24px;
  min-width:24px;
  max-width:24px;
}

.serverBuilderBlueprintPreviewDetailType{
  flex:0 0 auto;
  padding:5px 8px;
  border-radius:999px;
  background:rgba(88,101,242,.16);
  border:1px solid rgba(88,101,242,.30);
  color:#c9d1ff;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}

.serverBuilderBlueprintPreviewInfoGrid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:8px;
  margin-top:10px;
}

.serverBuilderPreviewInfoRow{
  min-width:0;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:9px 10px;
  border-radius:11px;
  background:rgba(0,0,0,.14);
  border:1px solid rgba(255,255,255,.055);
  color:rgba(231,234,242,.62);
  font-size:12px;
}

.serverBuilderPreviewInfoRow strong{
  min-width:0;
  color:rgba(231,234,242,.92);
  font-size:12px;
  text-align:right;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.serverBuilderBlueprintPreviewSectionTitle{
  margin:16px 0 8px;
  color:rgba(231,234,242,.90);
  font-size:13px;
  font-weight:900;
}

.serverBuilderBlueprintPreviewOverwrite{
  min-height:0;
  height:100%;
  max-height:none;
  display:grid;
  grid-template-columns:minmax(190px, 260px) minmax(0, 1fr);
  align-items:stretch;
  gap:10px;
  padding:10px;
  margin-bottom:0;
  overflow:hidden;
  border-radius:12px;
  background:rgba(0,0,0,.16);
  border:1px solid rgba(255,255,255,.06);
}

.serverBuilderBlueprintPreviewOverwriteList{
  min-height:0;
  max-height:100%;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:4px;
  border-right:1px solid rgba(255,255,255,.065);
}

.serverBuilderBlueprintPreviewOverwriteRoleBtn{
  width:100%;
  min-height:38px;
  display:grid;
  grid-template-columns:18px minmax(0, 1fr);
  align-items:center;
  gap:9px;
  padding:0 9px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#b5bac1;
  cursor:pointer;
  text-align:left;
  font-size:13px;
  font-weight:750;
}

.serverBuilderBlueprintPreviewOverwriteRoleBtn:hover{
  background:rgba(255,255,255,.055);
  color:#dbdee1;
}

.serverBuilderBlueprintPreviewOverwriteRoleBtn.active{
  background:#404249;
  color:#fff;
}

.serverBuilderBlueprintPreviewOverwriteRoleDot{
  width:11px;
  height:11px;
  border-radius:999px;
  background:#8b949e;
  border:1px solid rgba(255,255,255,.16);
}

.serverBuilderBlueprintPreviewOverwriteRoleBtn span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.serverBuilderBlueprintPreviewOverwritePanel{
  min-width:0;
  min-height:0;
  height:100%;
  max-height:100%;
  overflow-x:hidden;
  overflow-y:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  padding-right:4px;
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionPanel{
  min-width:0;
  min-height:max-content;
  overflow:visible;
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionRows{
  min-height:max-content;
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionPanel{
  min-width:0;
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionPanelHead{
  min-height:34px;
  font-size:12px;
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionRow{
  min-height:38px;
  grid-template-columns:32px minmax(0, 1fr);
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionStatus{
  width:32px;
  height:32px;
  flex-basis:32px;
  border-radius:3px;
  font-size:0;
  color:transparent;
  background:#202126;
  border-color:rgba(78,80,88,.92);
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionStatus.allow,
.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionStatus.deny,
.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionStatus.neutral{
  font-size:0;
  color:transparent;
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionStatus.neutral{
  font-size:23px;
}

.serverBuilderBlueprintPreviewOverwritePanel .serverBuilderPreviewPermissionName{
  font-size:13px;
}

@media (max-width: 860px){
  .serverBuilderBlueprintPreviewOverwrite{
    height:auto;
    min-height:0;
    max-height:none;
    grid-template-columns:1fr;
    overflow:visible;
  }

  .serverBuilderBlueprintPreviewOverwriteList{
    max-height:190px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.065);
    padding-right:0;
    padding-bottom:8px;
  }
}

.serverBuilderPreviewPermissionPanel{
  overflow:hidden;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.075);
  background:#25262b;
}

.serverBuilderPreviewPermissionPanelHead{
  min-height:36px;
  display:flex;
  align-items:center;
  padding:0 12px;
  color:rgba(242,243,245,.82);
  font-size:12px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  background:rgba(0,0,0,.18);
  border-bottom:1px solid rgba(255,255,255,.075);
}

.serverBuilderPreviewPermissionRows{
  display:grid;
}

.serverBuilderPreviewPermissionRow{
  min-height:52px;
  display:grid;
  grid-template-columns:50px minmax(0, 1fr);
  align-items:center;
  gap:0;
  padding:0 16px;
  border-bottom:1px solid rgba(255,255,255,.06);
  color:#dbdee1;
}

.serverBuilderPreviewPermissionRow:last-child{
  border-bottom:0;
}

.serverBuilderPreviewPermissionRow:hover{
  background:rgba(255,255,255,.035);
}

.serverBuilderPreviewPermissionStatus{
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  position:relative;
  flex:0 0 34px;
  overflow:hidden;
  border-radius:8px;
  font-size:0;
  line-height:0;
  font-weight:400;
  color:transparent;
  background:#1e1f22;
  border:1px solid rgba(86,88,96,.95);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.18);
}

.serverBuilderPreviewPermissionStatus::before,
.serverBuilderPreviewPermissionStatus::after{
  content:"";
  position:absolute;
  display:block;
  pointer-events:none;
}

.serverBuilderPreviewPermissionStatus.allow::before{
  width:7px;
  height:13px;
  left:50%;
  top:46%;
  margin-left:-3.5px;
  margin-top:-7.5px;
  border-right:2.4px solid #3ba55d;
  border-bottom:2.4px solid #3ba55d;
  transform:rotate(40deg);
  border-radius:1.5px;
}

.serverBuilderPreviewPermissionStatus.deny::before,
.serverBuilderPreviewPermissionStatus.deny::after{
  width:17px;
  height:2.4px;
  left:50%;
  top:50%;
  margin-left:-8.5px;
  margin-top:-1.2px;
  border-radius:999px;
  background:#ed4245;
}

.serverBuilderPreviewPermissionStatus.deny::before{
  transform:rotate(45deg);
}

.serverBuilderPreviewPermissionStatus.deny::after{
  transform:rotate(-45deg);
}

.serverBuilderPreviewPermissionStatus.neutral::before{
  width:2.4px;
  height:22px;
  left:50%;
  top:50%;
  margin-left:-1.2px;
  margin-top:-11px;
  border-radius:999px;
  background:#c4c9d0;
  transform:rotate(35deg);
}

.serverBuilderPreviewPermissionStatus.allow,
.serverBuilderPreviewPermissionStatus.deny,
.serverBuilderPreviewPermissionStatus.neutral{
  font-size:0;
  color:transparent;
}

.serverBuilderPreviewPermissionName{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#dbdee1;
  font-size:15px;
  font-weight:650;
}

.serverBuilderRolePermissionsCard{
  width:min(1180px, calc(100vw - 10px));
  height:min(1040px, calc(100vh - 8px));
  max-height:min(1040px, calc(100vh - 8px));
  overflow:hidden;
  display:grid;
  grid-template-rows:68px minmax(0, 1fr);
  padding:0;
  background:#242529;
  border-color:rgba(255,255,255,.10);
}

.serverBuilderRolePermissionsHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:0 20px 0 26px;
  background:#242529;
  border-bottom:1px solid rgba(255,255,255,.075);
}

.serverBuilderRolePermissionsTitleWrap{
  min-width:0;
  display:flex;
  align-items:center;
  gap:12px;
}

.serverBuilderRolePermissionsIcon{
  width:24px;
  height:24px;
  display:flex;
  align-items:center;
  justify-content:center;
  color:#d64f7e;
  font-size:20px;
  line-height:1;
}

.serverBuilderRolePermissionsTitle{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#f2f3f5;
  font-size:17px;
  font-weight:900;
  letter-spacing:.01em;
}

.serverBuilderRolePermissionsCloseBtn{
  width:38px;
  height:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#b5bac1;
  font-size:36px;
  line-height:1;
  font-weight:200;
  cursor:pointer;
}

.serverBuilderRolePermissionsCloseBtn:hover{
  color:#f2f3f5;
  background:rgba(255,255,255,.06);
}

.serverBuilderRolePermissionsBody{
  min-height:0;
  display:grid;
  grid-template-columns:320px minmax(0, 1fr);
  overflow:hidden;
}

.serverBuilderRolePermissionsLeft{
  min-height:0;
  overflow:auto;
  padding:14px 14px 14px 18px;
  background:#242529;
  border-right:1px solid rgba(255,255,255,.075);
}

.serverBuilderRolePermissionsRight{
  min-height:0;
  overflow:auto;
  padding:0 22px 24px 12px;
  background:#242529;
}

.serverBuilderRolePermissionsRoleBtn{
  width:100%;
  min-height:44px;
  display:grid;
  grid-template-columns:22px minmax(0, 1fr);
  align-items:center;
  gap:10px;
  padding:0 11px;
  border:0;
  border-radius:8px;
  background:transparent;
  color:#dbdee1;
  cursor:pointer;
  text-align:left;
  font-size:14px;
  font-weight:650;
}

.serverBuilderRolePermissionsRoleBtn:hover{
  background:rgba(255,255,255,.055);
}

.serverBuilderRolePermissionsRoleBtn.active{
  background:#3a3c43;
  color:#fff;
}

.serverBuilderRolePermissionsRoleDot{
  width:13px;
  height:13px;
  border-radius:999px;
  background:#b5bac1;
  border:1px solid rgba(255,255,255,.16);
}

.serverBuilderRolePermissionsRoleBtn span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionPanel{
  border:0;
  border-radius:0;
  background:transparent;
}

.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionPanelHead{
  min-height:46px;
  padding:0 14px;
  background:transparent;
  border-bottom:1px solid rgba(255,255,255,.075);
  color:#f2f3f5;
  font-size:15px;
  letter-spacing:0;
  text-transform:none;
}

.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionRow{
  min-height:44px;
  grid-template-columns:36px minmax(0, 1fr);
  padding:0 0 0 14px;
  border-bottom:1px solid rgba(255,255,255,.075);
}

.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionName{
  font-size:14px;
  font-weight:600;
}

.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionStatus{
  width:32px;
  height:32px;
  flex-basis:32px;
  border-radius:3px;
  font-size:0;
  color:transparent;
  background:#202126;
  border-color:rgba(78,80,88,.92);
}

.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionStatus.allow,
.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionStatus.deny,
.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionStatus.neutral{
  font-size:0;
  color:transparent;
}

.serverBuilderRolePermissionsRight .serverBuilderPreviewPermissionStatus.neutral{
  font-size:26px;
}

@media (max-width: 900px){
  .serverBuilderRolePermissionsCard{
    width:min(1180px, calc(100vw - 10px));
    height:min(1040px, calc(100vh - 8px));
  }

  .serverBuilderRolePermissionsBody{
    grid-template-columns:1fr;
    grid-template-rows:minmax(145px, 30vh) minmax(0, 1fr);
  }

  .serverBuilderRolePermissionsLeft{
    padding:10px;
    border-right:0;
    border-bottom:1px solid rgba(255,255,255,.075);
  }

  .serverBuilderRolePermissionsRight{
    padding:0 10px 16px;
  }

  .serverBuilderRolePermissionsHead{
    padding:0 10px;
  }

  .serverBuilderRolePermissionsTitle{
    font-size:15px;
  }
}

.serverBuilderBlueprintPreviewRoleDot{
  width:10px;
  height:10px;
  min-width:10px;
  border-radius:999px;
  background:#8b949e;
  border:1px solid rgba(255,255,255,.16);
}

.serverBuilderBlueprintPreviewRoleBtn span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.serverBuilderBlueprintPreviewRoleDetail{
  min-height:150px;
  padding:10px;
  border-top:1px solid rgba(255,255,255,.055);
  background:rgba(0,0,0,.10);
  color:rgba(231,234,242,.72);
  font-size:12px;
  overflow:auto;
}

.serverBuilderBlueprintPreviewRoleName{
  color:#f2f3f5;
  font-size:15px;
  font-weight:900;
  margin-bottom:5px;
  overflow-wrap:anywhere;
}

.serverBuilderBlueprintPreviewRoleMeta{
  color:rgba(231,234,242,.58);
  font-size:11px;
  line-height:1.45;
  margin-bottom:10px;
}

.serverBuilderBlueprintPreviewEmpty{
  padding:10px;
  border-radius:11px;
  border:1px dashed rgba(255,255,255,.12);
  background:rgba(0,0,0,.12);
  color:rgba(231,234,242,.58);
  font-size:12px;
  line-height:1.35;
}

.serverBuilderBlueprintPreviewFooter{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  padding:10px 18px 14px;
  background:#1e1f22;
  border-top:1px solid rgba(255,255,255,.08);
}

.serverBuilderBlueprintPreviewFooter .serverBuilderPreviewInfoRow{
  min-width:220px;
  flex:0 1 auto;
  background:rgba(255,255,255,.04);
}

@media (max-width: 1060px){
  .serverBuilderBlueprintPreviewCard{
    height:auto;
    max-height:calc(100vh - 24px);
  }

  .serverBuilderBlueprintPreviewShell{
    grid-template-columns:1fr;
    overflow:auto;
  }

  .serverBuilderBlueprintPreviewDetailBody{
    display:block;
    overflow:visible;
  }

  .serverBuilderBlueprintPreviewChannels,
  .serverBuilderBlueprintPreviewDetails,
  .serverBuilderBlueprintPreviewRoles{
    min-height:280px;
    border-left:0;
    border-right:0;
    border-bottom:1px solid rgba(0,0,0,.28);
  }

  .serverBuilderBlueprintPreviewInfoGrid{
    grid-template-columns:1fr;
  }
}

@media (max-width: 680px){
  .serverBuilderBlueprintPreviewHead{
    grid-template-columns:auto minmax(0, 1fr);
  }

  .serverBuilderBlueprintPreviewHeadActions{
    grid-column:1 / -1;
    width:100%;
  }

  .serverBuilderBlueprintPreviewRolesOpenBtn,
  .serverBuilderBlueprintPreviewCloseBtn{
    flex:1 1 0;
  }

  .serverBuilderBlueprintPreviewFooter{
    flex-direction:column;
  }

  .serverBuilderBlueprintPreviewFooter .serverBuilderPreviewInfoRow{
    min-width:0;
    width:100%;
  }
}

.serverBuilderExtensionInfoShell{
  position:relative;
  z-index:1;
  width:min(1480px, calc(100vw - 32px));
  max-height:none;
  display:grid;
  grid-template-columns:minmax(500px, 610px) minmax(0, 780px);
  gap:18px;
  align-items:start;
}

.serverBuilderExtensionInfoCard{
  width:100%;
  max-height:none;
  overflow:visible;
  display:grid;
  gap:12px;
}

.serverBuilderExtensionInfoCard h3{
  margin:0;
  font-size:24px;
  line-height:1.1;
}

.serverBuilderExtensionBrowserField{
  min-width:0;
  display:grid;
  gap:7px;
  position:relative;
  z-index:5;
}

.serverBuilderExtensionBrowserLabel{
  color:var(--muted);
  font-size:12px;
  font-weight:800;
}

.serverBuilderExtensionDropdown{
  position:relative;
  width:100%;
}

.serverBuilderExtensionDropdownBtn{
  width:100%;
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:#0d1120;
  color:var(--text);
  cursor:pointer;
  text-align:left;
}

.serverBuilderExtensionDropdownBtn:hover{
  border-color:rgba(var(--accent-rgb), .32);
  background:rgba(255,255,255,.045);
}

.serverBuilderExtensionDropdownBtnText{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  font-weight:800;
}

.serverBuilderExtensionDropdownCaret{
  color:rgba(231,234,242,.64);
  transition:transform .18s ease;
}

.serverBuilderExtensionDropdown.open .serverBuilderExtensionDropdownCaret{
  transform:rotate(180deg);
}

.serverBuilderExtensionDropdownPanel{
  position:absolute;
  left:0;
  right:0;
  top:calc(100% + 8px);
  display:none;
  padding:8px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background:#0d1120;
  box-shadow:0 22px 70px rgba(0,0,0,.48);
  z-index:40;
}

.serverBuilderExtensionDropdown.open .serverBuilderExtensionDropdownPanel{
  display:grid;
  gap:8px;
}

.serverBuilderExtensionDropdownSearch{
  width:100%;
  min-height:38px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.22);
  color:var(--text);
  padding:9px 10px;
}

.serverBuilderExtensionDropdownSearch:focus{
  border-color:rgba(var(--accent-rgb), .48);
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .14);
}

.serverBuilderExtensionDropdownList{
  max-height:260px;
  overflow:auto;
  display:grid;
  gap:4px;
}

.serverBuilderExtensionDropdownOption{
  width:100%;
  min-height:36px;
  display:flex;
  align-items:center;
  padding:8px 10px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:rgba(231,234,242,.84);
  cursor:pointer;
  text-align:left;
  font-size:13px;
  font-weight:800;
}

.serverBuilderExtensionDropdownOption:hover{
  background:rgba(255,255,255,.06);
  color:#fff;
}

.serverBuilderExtensionDropdownOption.active{
  background:rgba(var(--accent-rgb), .16);
  color:#fff;
}

.serverBuilderExtensionDropdownEmpty{
  padding:10px;
  color:rgba(231,234,242,.62);
  font-size:13px;
}

.serverBuilderExtensionSelectedBox{
  display:grid;
  gap:8px;
  padding:12px;
  border-radius:14px;
  border:1px solid rgba(var(--accent-rgb), .22);
  background:rgba(var(--accent-rgb), .07);
}

.serverBuilderExtensionSelectedTitle{
  font-size:15px;
  font-weight:900;
  color:rgba(231,234,242,.96);
}

.serverBuilderExtensionUrl{
  display:block;
  width:100%;
  padding:10px 12px;
  border-radius:10px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.22);
  color:rgba(231,234,242,.92);
  font-size:13px;
  overflow:auto;
}

.serverBuilderExtensionNote{
  color:rgba(231,234,242,.82);
  font-size:13px;
  line-height:1.4;
}

.serverBuilderExtensionSteps{
  display:grid;
  gap:7px;
  max-height:none;
  overflow:visible;
  padding-right:0;
}

.serverBuilderExtensionStep{
  padding:10px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
  color:rgba(231,234,242,.9);
  font-size:13px;
  line-height:1.35;
}

.serverBuilderExtensionHint{
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(var(--accent-rgb), .24);
  background:rgba(var(--accent-rgb), .07);
  color:rgba(231,234,242,.9);
  font-size:13px;
  line-height:1.4;
}

.serverBuilderVencordInfoCard{
  width:100%;
  max-height:none;
  overflow:visible;
  display:grid;
  gap:12px;
}

.serverBuilderVencordInfoCard h3{
  margin:0;
  font-size:22px;
  line-height:1.1;
}

.serverBuilderVencordHint{
  padding:12px;
  border-radius:12px;
  border:1px solid rgba(var(--accent-rgb), .24);
  background:rgba(var(--accent-rgb), .07);
  color:rgba(231,234,242,.9);
  font-size:13px;
  line-height:1.4;
}

.serverBuilderVencordSection{
  display:grid;
  gap:8px;
  padding:10px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.09);
  background:rgba(255,255,255,.035);
}

.serverBuilderVencordSectionTitle{
  color:rgba(231,234,242,.96);
  font-size:14px;
  font-weight:900;
  line-height:1.2;
}

.serverBuilderVencordPluginList{
  display:grid;
  gap:8px;
}

.serverBuilderVencordPluginRow{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:10px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(0,0,0,.16);
}

.serverBuilderVencordPluginIcon{
  width:22px;
  height:22px;
  min-width:22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(43,213,118,.16);
  border:1px solid rgba(43,213,118,.34);
  color:#9ff0bd;
  font-size:13px;
  font-weight:900;
  line-height:1;
}

.serverBuilderVencordPluginText{
  min-width:0;
  display:grid;
  gap:3px;
}

.serverBuilderVencordPluginText strong{
  color:rgba(231,234,242,.96);
  font-size:13px;
  line-height:1.15;
}

.serverBuilderVencordPluginText span{
  color:rgba(231,234,242,.66);
  font-size:12px;
  line-height:1.35;
}

.serverBuilderVencordImportSteps{
  display:grid;
  gap:7px;
}

.serverBuilderVencordImportStep{
  padding:7px 9px;
  border-radius:10px;
  background:rgba(0,0,0,.14);
  border:1px solid rgba(255,255,255,.065);
  color:rgba(231,234,242,.84);
  font-size:12px;
  line-height:1.25;
}

.serverBuilderVencordAfterImport{
  padding:10px 11px;
  border-radius:12px;
  border:1px solid rgba(246,194,68,.24);
  background:rgba(246,194,68,.075);
  color:rgba(255,232,170,.92);
  font-size:12.5px;
  font-weight:800;
  line-height:1.35;
}

.serverBuilderVencordActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:nowrap;
}

.serverBuilderVencordActions .btn{
  width:auto;
  min-height:34px;
  padding:7px 10px;
  border-radius:11px;
  font-size:12px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}

.serverBuilderVencordActions .btn:first-child{
  background:linear-gradient(180deg, rgba(88,101,242,.94), rgba(71,82,196,.94));
  color:#ffffff;
  border-color:rgba(88,101,242,.48);
}

.serverBuilderVencordActions .btn:first-child:hover{
  filter:brightness(1.05) saturate(1.06);
}

.serverBuilderVencordActions .btn.primary{
  color:#16110a;
  border-color:rgba(255,210,74,.55);
}

.serverBuilderVencordSettingsDownloadBtn{
  max-width:240px;
}

.serverBuilderVencordSettingsDownloadBtn span:last-child{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.serverBuilderExtensionInfoActions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:nowrap;
}

.serverBuilderExtensionInfoActions .btn{
  min-height:36px;
  padding:8px 11px;
  border-radius:11px;
  font-size:12.5px;
  font-weight:900;
  line-height:1;
  white-space:nowrap;
}

.serverBuilderExtensionDownloadBtn{
  min-width:190px;
}

@media (max-width: 860px){
  .serverBuilderExtensionInfoShell{
    width:min(760px, calc(100vw - 32px));
    max-height:min(820px, calc(100vh - 32px));
    overflow:auto;
    grid-template-columns:1fr;
  }

  .serverBuilderVencordActions{
    flex-direction:column;
    align-items:stretch;
  }

  .serverBuilderVencordActions .btn,
  .serverBuilderVencordSettingsDownloadBtn{
    width:100%;
    max-width:none;
  }

  .serverBuilderExtensionInfoCard,
  .serverBuilderVencordInfoCard{
    width:100%;
    max-height:none;
    overflow:visible;
  }

  .serverBuilderExtensionDropdownPanel{
    position:static;
    margin-top:8px;
  }

  .serverBuilderExtensionInfoActions{
    justify-content:stretch;
    flex-wrap:wrap;
  }

  .serverBuilderExtensionInfoActions .btn{
    width:100%;
  }
}

.serverBuilderBlueprintActionModal{
  align-items:center !important;
  justify-content:center !important;
  padding:18px !important;
}

.serverBuilderBlueprintActionCard{
  width:min(460px, calc(100vw - 32px));
  display:grid;
  gap:14px;
}

.serverBuilderBlueprintActionHead{
  display:grid;
  gap:7px;
}

.serverBuilderBlueprintActionHead h3{
  margin:0;
  font-size:22px;
  line-height:1.12;
}

.serverBuilderBlueprintActionName{
  padding:11px 12px;
  border-radius:12px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.035);
  color:rgba(231,234,242,.94);
  font-size:13px;
  font-weight:900;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.serverBuilderBlueprintActionBody{
  display:grid;
  gap:10px;
}

.serverBuilderBlueprintActionField{
  min-width:0;
}

.serverBuilderBlueprintActionField input{
  width:100%;
}

.serverBuilderBlueprintActionButtons{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  flex-wrap:wrap;
}

@media (max-width: 560px){
  .serverBuilderBlueprintActionModal{
    align-items:center !important;
    padding:14px !important;
  }

  .serverBuilderBlueprintActionButtons{
    justify-content:stretch;
  }

  .serverBuilderBlueprintActionButtons .btn{
    width:100%;
  }
}

.serverBuilderDownloadBtn{
  font-weight:900;
}

.serverBuilderDownloadBtn span:first-child{
  font-size:14px;
  line-height:1;
  transform:translateY(-1px);
}

.serverBuilderDownloadBtn:hover{
  filter:brightness(1.04) saturate(1.06);
}

body.mode-config #configModulesGrid.configModulesGrid{
  --cfgCompactFieldH: 38px;
  --cfgCompactRadius: 11px;
  --cfgCompactGap: 10px;
  width:100%;
  max-width:min(1240px, 100%);
  margin:0 auto;
  overflow:visible;
}

body.mode-config #configCard.is-module-editor #configModulesGrid.configModulesGrid{
  max-width:100% !important;
}

body.mode-config #configModulesGrid.configModulesGrid > .subcard{
  padding:14px;
  border-radius:18px;
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .07), transparent 34%),
    linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
}

body.mode-config #configModulesGrid.configModulesGrid > .subcard > h3{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin:0 0 12px;
  padding:0 0 10px;
  border-bottom:1px solid rgba(255,255,255,.075);
  font-size:17px;
  line-height:1.15;
}

body.mode-config #configModulesGrid.configModulesGrid > .subcard > div{
  display:grid;
  grid-template-columns:repeat(3, minmax(210px, 1fr));
  gap:var(--cfgCompactGap) 12px;
  align-items:start;
}

body.mode-config #configModulesGrid.configModulesGrid .grid2{
  grid-template-columns:repeat(2, minmax(220px, 1fr));
  gap:var(--cfgCompactGap) 12px;
}

body.mode-config #configModulesGrid.configModulesGrid .field{
  min-width:0;
  gap:5px;
  align-content:start;
}

body.mode-config #configModulesGrid.configModulesGrid label{
  min-width:0;
  display:flex;
  align-items:center;
  gap:6px;
  min-height:18px;
  margin:0;
  color:rgba(231,234,242,.72);
  font-size:11.5px;
  font-weight:800;
  line-height:1.15;
}

body.mode-config #configModulesGrid.configModulesGrid label .helpIcon{
  margin-left:0;
  width:15px;
  height:15px;
  flex:0 0 auto;
}

body.mode-config #configModulesGrid.configModulesGrid label .helpIcon::before{
  font-size:10px;
}

body.mode-config #configModulesGrid.configModulesGrid input:not([type="checkbox"]):not([type="color"]):not([type="range"]):not([type="file"]),
body.mode-config #configModulesGrid.configModulesGrid select:not([multiple]){
  width:100%;
  height:var(--cfgCompactFieldH);
  min-height:var(--cfgCompactFieldH);
  border-radius:var(--cfgCompactRadius);
  padding:0 10px;
  font-size:13px;
  line-height:1;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 6px 16px rgba(0,0,0,.16);
}

body.mode-config #configModulesGrid.configModulesGrid select:not([multiple]){
  padding-right:34px;
  background-position:0 0, right 9px center;
  background-size:auto, 16px 16px;
}

body.mode-config #configModulesGrid.configModulesGrid select[multiple]{
  min-height:108px;
  border-radius:var(--cfgCompactRadius);
  padding:8px;
  font-size:13px;
}

body.mode-config #configModulesGrid.configModulesGrid textarea:not(#rawJson){
  min-height:108px;
  border-radius:var(--cfgCompactRadius);
  padding:9px 10px;
  font-size:13px;
  line-height:1.35;
  resize:vertical;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 6px 16px rgba(0,0,0,.16);
}

body.mode-config #configModulesGrid.configModulesGrid .field.fieldInline{
  min-height:42px;
  grid-template-columns:minmax(0, 1fr) auto;
  align-items:center;
  column-gap:10px;
  row-gap:0;
  padding:8px 10px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:12px;
  background:rgba(255,255,255,.025);
}

body.mode-config #configModulesGrid.configModulesGrid .field.fieldInline label{
  color:rgba(231,234,242,.88);
  font-size:12.5px;
  line-height:1.2;
}

body.mode-config #configModulesGrid.configModulesGrid .field.fieldInline .toggle{
  justify-self:end;
  gap:0;
}

body.mode-config #configModulesGrid.configModulesGrid .toggle{
  gap:7px;
}

body.mode-config #configModulesGrid.configModulesGrid .toggle input[type="checkbox"]{
  width:46px;
  height:24px;
  min-width:46px;
  margin:0;
}

body.mode-config #configModulesGrid.configModulesGrid .toggle input[type="checkbox"]::before{
  width:20px;
  height:20px;
  top:1px;
  left:1px;
}

body.mode-config #configModulesGrid.configModulesGrid .toggle input[type="checkbox"]:checked::before{
  transform:translateX(22px);
}

body.mode-config #configModulesGrid.configModulesGrid .ms{
  width:100%;
  min-width:0;
}

body.mode-config #configModulesGrid.configModulesGrid .msBtn{
  width:100%;
  min-height:var(--cfgCompactFieldH);
  height:var(--cfgCompactFieldH);
  flex-wrap:nowrap;
  overflow:hidden;
  gap:6px;
  padding:0 38px 0 10px;
  border-radius:var(--cfgCompactRadius);
  font-size:13px;
  line-height:1;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 6px 16px rgba(0,0,0,.16);
}

body.mode-config #configModulesGrid.configModulesGrid .msBtn::after{
  right:10px;
  width:16px;
  height:16px;
  background-size:16px 16px;
}

body.mode-config #configModulesGrid.configModulesGrid .msBtn.hasRoleDot,
body.mode-config #configModulesGrid.configModulesGrid .msBtn.hasChanPrefix{
  padding-left:34px;
}

body.mode-config #configModulesGrid.configModulesGrid .msBtn > *{
  min-width:0;
}

body.mode-config #configModulesGrid.configModulesGrid .msPlaceholder,
body.mode-config #configModulesGrid.configModulesGrid .msSingleText,
body.mode-config #configModulesGrid.configModulesGrid .msText{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-size:13px;
  line-height:1.1;
}

body.mode-config #configModulesGrid.configModulesGrid .msChip{
  max-width:170px;
  min-width:0;
  padding:3px 8px;
  gap:6px;
  font-size:11.5px;
  line-height:1.1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  flex:0 1 auto;
}

body.mode-config #configModulesGrid.configModulesGrid .msChipDot,
body.mode-config #configModulesGrid.configModulesGrid .msChipDotChan,
body.mode-config #configModulesGrid.configModulesGrid .msRoleDot,
body.mode-config #configModulesGrid.configModulesGrid .msChanDot{
  width:8px;
  height:8px;
  flex:0 0 auto;
}

body.mode-config #configModulesGrid.configModulesGrid .roleDot,
body.mode-config #configModulesGrid.configModulesGrid .chanPrefix{
  left:10px;
  width:9px;
  height:9px;
  font-size:10px;
}

body.mode-config #configModulesGrid.configModulesGrid .msClear{
  right:32px;
  width:18px;
  height:18px;
  font-size:12px;
}

body.mode-config #configModulesGrid.configModulesGrid .msPanel{
  top:calc(100% + 6px);
  max-height:min(260px, 48vh);
  padding:6px;
  border-radius:12px;
  box-shadow:0 18px 42px rgba(0,0,0,.48);
}

body.mode-config #configModulesGrid.configModulesGrid .msSearch{
  height:34px;
  min-height:34px;
  margin:0 0 6px;
  border-radius:10px;
  padding:0 10px;
  font-size:12.5px;
}

body.mode-config #configModulesGrid.configModulesGrid .msItem{
  min-height:34px;
  gap:8px;
  padding:7px 8px;
  border-radius:9px;
}

body.mode-config #configModulesGrid.configModulesGrid .msItem > input{
  width:16px;
  height:16px;
  min-width:16px;
}

body.mode-config #configModulesGrid.configModulesGrid .btn{
  min-height:36px;
  padding:8px 10px;
  border-radius:10px;
  font-size:12.5px;
}

body.mode-config #configModulesGrid.configModulesGrid .pill{
  padding:6px 9px;
  font-size:12px;
}

body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .row,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .toast,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .advanced,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > details,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .subcard,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .configModuleEmpty,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .ticketCategoryCard,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .ticketCategoryList,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .twitchCards,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .factionCards,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .sanktionParaList,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .customCommandsV2BlockCard,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .embedImageBox,
body.mode-config #configModulesGrid.configModulesGrid > .subcard > div > .embedImageCard,
body.mode-config #configModulesGrid.configModulesGrid .field:has(textarea),
body.mode-config #configModulesGrid.configModulesGrid .field:has(input[type="file"]),
body.mode-config #configModulesGrid.configModulesGrid .field:has(.embedImagePreview){
  grid-column:1 / -1;
}

@media (max-width:1180px){
  body.mode-config #configModulesGrid.configModulesGrid > .subcard > div{
    grid-template-columns:repeat(2, minmax(220px, 1fr));
  }
}

@media (max-width:860px){
  body.mode-config #configModulesGrid.configModulesGrid{
    max-width:100%;
  }

  body.mode-config #configModulesGrid.configModulesGrid > .subcard{
    padding:12px;
    border-radius:16px;
  }

  body.mode-config #configModulesGrid.configModulesGrid > .subcard > div,
  body.mode-config #configModulesGrid.configModulesGrid .grid2{
    grid-template-columns:1fr;
  }

  body.mode-config #configModulesGrid.configModulesGrid .field.fieldInline{
    grid-template-columns:minmax(0, 1fr) auto;
  }

  body.mode-config #configModulesGrid.configModulesGrid .msPanel{
    max-height:min(300px, 54vh);
  }
}

body.mode-config #configModulesGrid.configModulesGrid{
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  grid-template-columns:1fr !important;
}

body.mode-config #configModulesGrid.configModulesGrid > .subcard{
  width:100% !important;
  max-width:none !important;
  grid-column:1 / -1 !important;
}

body.mode-config #configModulesGrid.configModulesGrid > .subcard > div{
  grid-template-columns:repeat(2, minmax(310px, 1fr)) !important;
  gap:12px 14px !important;
}

body.mode-config #configCard.is-module-editor #aufstellungBox.aufstellungSettingsGrid{
  grid-template-columns:minmax(520px, 1.28fr) minmax(360px, .92fr) !important;
  gap:16px !important;
  width:100% !important;
}

body.mode-config #configModulesGrid.configModulesGrid .field.fieldInline{
  grid-column:1 / -1 !important;
  min-height:44px;
  grid-template-columns:minmax(0, 1fr) auto !important;
  padding:9px 12px;
}

body.mode-config #configModulesGrid.configModulesGrid .field.fieldInline label{
  min-width:0;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:12.5px;
}

body.mode-config #configModulesGrid.configModulesGrid .field.fieldInline .toggle{
  min-width:46px;
  flex:0 0 auto;
}

body.mode-config #configModulesGrid.configModulesGrid .avatarRow,
body.mode-config #configModulesGrid.configModulesGrid .jlBgRow{
  width:100%;
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:14px;
  align-items:stretch;
  padding:14px;
  border:1px solid rgba(255,255,255,.085);
  border-radius:16px;
  background:
    radial-gradient(circle at top left, rgba(var(--accent-rgb), .075), transparent 34%),
    rgba(255,255,255,.028);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.045),
    0 12px 28px rgba(0,0,0,.20);
}

body.mode-config #configModulesGrid.configModulesGrid .avatarLeft,
body.mode-config #configModulesGrid.configModulesGrid .avatarRight{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:10px;
}

body.mode-config #configModulesGrid.configModulesGrid .avatarRight{
  justify-content:flex-end;
  align-items:flex-end;
}

body.mode-config #configModulesGrid.configModulesGrid .jlBgPreview{
  width:100%;
  min-height:170px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.10);
  background-color:rgba(0,0,0,.22);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.05),
    0 10px 24px rgba(0,0,0,.24);
  overflow:hidden;
}

body.mode-config #configModulesGrid.configModulesGrid .previewOverlay{
  border-radius:inherit;
  background:linear-gradient(180deg, rgba(0,0,0,.10), rgba(0,0,0,.52));
  font-size:12px;
  font-weight:900;
}

body.mode-config #configModulesGrid.configModulesGrid .avatarBtn{
  width:max-content;
  min-width:150px;
}

@media (min-width:1500px){
  body.mode-config #configModulesGrid.configModulesGrid > .subcard > div{
    grid-template-columns:repeat(2, minmax(380px, 1fr)) !important;
  }
}

@media (max-width:860px){
  body.mode-config #configModulesGrid.configModulesGrid > .subcard > div{
    grid-template-columns:1fr !important;
  }

  body.mode-config #configCard.is-module-editor .configRail{
    display:none !important;
  }

  body.mode-config #configCard.is-module-editor .configMain{
    width:100% !important;
    max-width:100% !important;
  }

  body.mode-config #configModulesGrid.configModulesGrid .field.fieldInline label{
    white-space:normal;
    overflow:visible;
    text-overflow:clip;
  }

  body.mode-config #configModulesGrid.configModulesGrid .avatarRow,
  body.mode-config #configModulesGrid.configModulesGrid .jlBgRow{
    grid-template-columns:1fr;
  }

  body.mode-config #configModulesGrid.configModulesGrid .avatarRight{
    align-items:stretch;
  }

  body.mode-config #configModulesGrid.configModulesGrid .avatarBtn{
    width:100%;
  }
}

body.mode-config #saveBtn{
  min-height:40px;
  border-color:rgba(255,255,255,.105) !important;
  background:
    linear-gradient(180deg, rgba(255,255,255,.075), rgba(255,255,255,.035)),
    rgba(255,255,255,.045) !important;
  color:rgba(231,234,242,.92) !important;
  font-weight:900;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 10px 24px rgba(0,0,0,.18) !important;
}

body.mode-config #saveBtn:hover{
  border-color:rgba(43,213,118,.30) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(43,213,118,.10), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.04)),
    rgba(255,255,255,.055) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.065),
    0 0 0 2px rgba(43,213,118,.075),
    0 12px 28px rgba(0,0,0,.22) !important;
}

body.mode-config #saveBtn:disabled{
  opacity:.88;
  cursor:default;
}

body.mode-config #saveBtn[data-state="saving"]{
  border-color:rgba(var(--accent-rgb), .35) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(var(--accent-rgb), .16), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.085), rgba(255,255,255,.04)),
    rgba(255,255,255,.05) !important;
  color:rgba(231,234,242,.96) !important;
  animation:dashAnimSavePulse 1.15s ease-in-out infinite;
}

body.mode-config #saveBtn[data-state="idle"].justSaved{
  border-color:rgba(43,213,118,.65) !important;
  color:#c6f7da !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(43,213,118,.30), transparent 62%),
    linear-gradient(180deg, rgba(43,213,118,.22), rgba(43,213,118,.08)),
    rgba(255,255,255,.05) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    0 0 26px rgba(43,213,118,.32) !important;
  animation:dashAnimSaveSuccess 1.2s ease-out, dashAnimSavedPop .5s cubic-bezier(.22,1.4,.4,1);
}

body.mode-config #saveBtn[data-state="error"]{
  border-color:rgba(255,77,77,.45) !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(255,77,77,.16), transparent 58%),
    linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.035)),
    rgba(255,255,255,.045) !important;
  color:#ffb4b4 !important;
}

body.mode-config .configRail .railBox:first-child{
  background:
    radial-gradient(circle at top right, rgba(43,213,118,.06), transparent 38%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.018)),
    var(--card2);
}

body.mode-config .configRail .railBox,
body.mode-config .configRail .railBox:first-child,
body.mode-config .configRail .railBox:last-child{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  background:
    linear-gradient(180deg, rgba(255,255,255,.042), rgba(255,255,255,.018)),
    var(--card2) !important;
  border-color:rgba(255,255,255,.08) !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.04),
    0 12px 32px rgba(0,0,0,.24) !important;
}

body.mode-config .configRail .railBox::before,
body.mode-config .configRail .railBox::after{
  content:none !important;
  display:none !important;
}

body.mode-config .configRail .railTitle{
  position:relative;
  z-index:1;
  background:transparent !important;
  box-shadow:none !important;
}

body.mode-config .configRail .railTitle::before,
body.mode-config .configRail .railTitle::after{
  content:none !important;
  display:none !important;
}

body.mode-config .configRail #saveBtn,
body.mode-config .configRail #reloadBtn,
body.mode-config .configRail #logsBtnRail{
  position:relative;
  z-index:1;
}

@media (min-width: 961px){
  body.mode-config #configCard .configMain{
    min-height:0 !important;
    height:auto !important;
    width:calc(100% - 312px) !important;
    max-width:calc(100% - 312px) !important;
    overflow:visible !important;
    padding:16px !important;
    margin-right:0 !important;
    background:linear-gradient(180deg, rgba(15,19,32,.82), rgba(11,13,18,.64)) !important;
    border:1px solid rgba(255,255,255,.06) !important;
    border-radius:16px !important;
    box-shadow:none !important;
  }

  body.mode-config #configCard .configRail{
    z-index:80 !important;
  }
}

body.mode-config #configCard .configModuleEditorTop{
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
  border-radius:0 !important;
  padding:0 0 12px !important;
  margin-bottom:12px !important;
}

body.mode-config #configCard .configModuleEditorTop::before,
body.mode-config #configCard .configModuleEditorTop::after{
  content:none !important;
  display:none !important;
}

body.mode-config #configCard .configModuleEditorTitleWrap{
  padding:0 !important;
  background:transparent !important;
  border:0 !important;
  box-shadow:none !important;
}

body.mode-config #configCard .configModuleEditorTitleWrap::before,
body.mode-config #configCard .configModuleEditorTitleWrap::after{
  content:none !important;
  display:none !important;
}

body.mode-config #configCard #configModulesGrid{
  max-width:100% !important;
  overflow:visible !important;
}

body.mode-config #configCard #configModulesGrid > .subcard{
  max-width:100% !important;
}

@media (min-width: 961px){
  body.mode-config #configCard.is-module-editor .configRail{
    display:grid !important;
  }
}

.discordComponentSelect{
  width:min(400px,100%);
  min-height:40px;
  position:relative;
  border-radius:8px;
  color:#dbdee1;
  font-size:14px;
}

.discordComponentSelectTop{
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 12px;
  border:1px solid rgba(78,80,88,.95);
  border-radius:8px;
  background:#2b2d31;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}

.discordComponentSelectPlaceholder{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#b5bac1;
}

.discordComponentSelectCaret{
  flex:0 0 auto;
  color:#b5bac1;
  font-size:18px;
  line-height:1;
  transform:translateY(-1px);
}

.discordComponentSelectMenuPreview{
  margin-top:4px;
  border:1px solid rgba(78,80,88,.95);
  border-radius:8px;
  background:#2b2d31;
  overflow:hidden;
}

.discordComponentSelectOption{
  min-height:42px;
  display:flex;
  align-items:center;
  gap:10px;
  padding:8px 10px;
  background:#2b2d31;
}

.discordComponentSelectOptionText{
  min-width:0;
  display:flex;
  flex-direction:column;
  gap:2px;
  color:#f2f3f5;
  font-weight:600;
  line-height:1.18;
}

.discordComponentSelectOptionText small{
  color:#b5bac1;
  font-size:12px;
  font-weight:500;
}

.customCommandsSelectOptionsSection{
  border-color:rgba(var(--accent-rgb),.18);
  background:rgba(var(--accent-rgb),.045);
}

.customCommandsSelectOptionCards{
  gap:10px;
}

.customCommandsSelectOptionCard{
  border-color:rgba(255,255,255,.09);
  background:rgba(0,0,0,.16);
}

.customCommandsSelectOptionsSection{
  border-color:rgba(var(--accent-rgb),.18);
  background:rgba(var(--accent-rgb),.045);
}

.customCommandsSelectOptionCards{
  gap:10px;
}

.customCommandsSelectOptionCard{
  border-color:rgba(255,255,255,.09);
  background:rgba(0,0,0,.16);
}

.discordComponentSelect{
  width:min(400px,100%);
  min-height:40px;
  position:relative;
  border-radius:8px;
  color:#dbdee1;
  font-size:14px;
}

.discordComponentSelectTop{
  min-height:40px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:0 12px;
  border:1px solid rgba(78,80,88,.95);
  border-radius:8px;
  background:#2b2d31;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.025);
}

.discordComponentSelectPlaceholder{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#b5bac1;
}

.discordComponentSelectCaret{
  flex:0 0 auto;
  color:#b5bac1;
  font-size:18px;
  line-height:1;
  transform:translateY(-1px);
}

.botDmsListMore{
  padding:10px 14px;
  text-align:center;
  font-size:12px;
  opacity:.6;
}

.serverSelectHead{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin:-6px 0 12px;
}
.serverSelectHead h2{
  margin:0;
}
.serverSelectSearchTop{
  flex:0 1 360px;
  min-width:240px;
}
.serverSelectSearchTop .logsSearchRow{
  width:100%;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:nowrap;
  min-width:0;
}
.serverSelectSearchTop .logsSearchField{
  display:flex;
  align-items:center;
  gap:8px;
  width:100%;
  flex:1 1 auto;
  min-width:0;
  min-height:44px;
  padding:0 8px 0 12px;
  border-radius:16px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.03);
}
.serverSelectSearchTop .logsSearchField:focus-within{
  border-color:rgba(var(--accent-rgb), .22) !important;
  box-shadow:0 0 0 3px rgba(var(--accent-rgb), .08) !important;
}
.serverSelectSearchTop .logsSearchIcon{
  flex:0 0 auto;
  color:rgba(255,255,255,.62);
}
.serverSelectSearchTop #serverSelectSearch{
  appearance:none;
  -webkit-appearance:none;
  flex:1 1 auto;
  min-width:0;
  height:40px;
  border:0 !important;
  background:transparent !important;
  padding:0 !important;
  border-radius:0 !important;
  outline:none !important;
  box-shadow:none !important;
  color:#fff;
  font-size:.96rem;
}
.serverSelectSearchTop #serverSelectSearch::placeholder{
  color:rgba(255,255,255,.55);
}
.serverSelectSearchTop .logsSearchClearBtn{
  flex:0 0 auto;
  align-self:center;
  margin-left:0;
}
#serverSelectSearch::-webkit-search-decoration,
#serverSelectSearch::-webkit-search-cancel-button,
#serverSelectSearch::-webkit-search-results-button,
#serverSelectSearch::-webkit-search-results-decoration{
  -webkit-appearance:none;
  appearance:none;
  display:none;
}
.serverSelectFooterRow{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}
.serverSelectStats{
  text-align:right;
  white-space:nowrap;
}

.botInviteModalCard{
  width:min(640px, calc(100vw - 28px));
  max-height:calc(100vh - 52px);
  display:flex;
  flex-direction:column;
  padding:22px;
  border:1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .10), transparent 44%),
    #10131c;
  box-shadow:
    0 30px 90px rgba(0,0,0,.55),
    inset 0 1px 0 rgba(255,255,255,.04);
}
.botInviteHead{
  display:grid;
  gap:4px;
  padding-right:42px;
}

.botInviteCloseBtn{
  position:absolute;
  top:14px;
  right:14px;
  width:34px;
  height:34px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:11px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.04);
  color:rgba(231,234,242,.70);
  font-size:15px;
  line-height:1;
  cursor:pointer;
  transition:background .18s ease, border-color .18s ease, color .18s ease, transform .18s ease;
}

.botInviteCloseBtn:hover{
  background:rgba(255,255,255,.08);
  border-color:rgba(120,160,255,.45);
  color:#eaf0ff;
  transform:translateY(-1px);
}
.botInviteBody{
  min-height:0;
  overflow:auto;
  display:grid;
  gap:12px;
  padding:14px 4px 4px 4px;
  transition:height .42s cubic-bezier(.22,1,.36,1);
}
.botInviteList{
  display:grid;
  gap:10px;
}
.botInviteItem{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .08), transparent 46%),
    #161a25;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  opacity:0;
  transform:translateY(8px);
  animation:botInviteItemIn .42s cubic-bezier(.22,1,.36,1) forwards;
  animation-delay:var(--botInviteDelay, 0ms);
  transition:background .18s ease, border-color .18s ease, box-shadow .18s ease;
}

@keyframes botInviteItemIn{
  to{
    opacity:1;
    transform:translateY(0);
  }
}

@media (prefers-reduced-motion:reduce){
  .botInviteItem{
    opacity:1;
    transform:none;
    animation:none;
  }
}

.botInviteItem:hover{
  border-color:rgba(var(--accent-rgb), .26);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .12), transparent 46%),
    #1b2131;
  box-shadow:
    0 12px 28px rgba(0,0,0,.30),
    inset 0 1px 0 rgba(255,255,255,.05);
}
.botInviteIcon{
  flex:0 0 auto;
  width:40px;
  height:40px;
  border-radius:12px;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.06);
  font-weight:900;
  font-size:14px;
  color:rgba(231,234,242,.86);
}
.botInviteIcon img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.botInviteText{
  flex:1 1 auto;
  min-width:0;
  display:grid;
  gap:2px;
}

.botInviteName{
  font-weight:800;
  font-size:14px;
  color:rgba(231,234,242,.96);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.botInviteMeta{
  font-size:12px;
  color:rgba(231,234,242,.58);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}

.botInviteItem.isJoined{
  border-color:rgba(120,210,150,.45);
  background:linear-gradient(180deg, rgba(80,200,130,.12), rgba(80,200,130,.05));
}

.botInviteItem.isJoined:hover{
  box-shadow:inset 3px 0 0 rgba(120,210,150,.65);
}
.botInviteAddBtn{
  flex:0 0 auto;
}
.botInviteEmpty{
  padding:14px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.08);
  color:rgba(231,234,242,.68);
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .08), transparent 46%),
    #161a25;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.04);
  font-size:13px;
}
@media (max-width:560px){
  .botInviteItem{
    flex-wrap:wrap;
  }
  .botInviteName{
    white-space:normal;
  }
  .botInviteAddBtn{
    width:100%;
  }
}

.serverSyncFull{
  grid-column:1 / -1;
}

.serverSyncSectionHead{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
}

.serverSyncSectionHead strong{
  display:block;
  font-weight:900;
}

.serverSyncSectionHead span{
  display:block;
  margin-top:4px;
  color:var(--muted);
  font-size:12px;
  line-height:1.45;
}

.serverSyncCards{
  margin-top:12px;
}

.serverSyncCard .serverSyncGrid{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.serverSyncEnabledField{
  width:auto;
  min-width:120px;
  margin:0;
}

.serverSyncEnabledField label{
  font-size:12px;
}

.serverSyncRunField{
  align-content:end;
}

.serverSyncRunField .btn{
  min-height:42px;
}

.serverSyncEmpty{
  padding:10px 2px;
}

.serverSyncFull,
.serverSyncCards,
.serverSyncCard{
  position:relative;
  overflow:visible;
}

.serverSyncFull:has(.ms.open){
  z-index:5000;
}

.serverSyncCard:has(.ms.open){
  z-index:5100;
}

.serverSyncCard .selectWrap:has(.ms.open),
.serverSyncCard .ms.open{
  z-index:5200;
}

.serverSyncCard .ms.open .msPanel{
  z-index:5300;
}

.serverSyncSectionHead,
.serverSyncCard .factionHead{
  position:relative;
  z-index:1;
}

@media (max-width: 760px){
  .serverSyncSectionHead{
    flex-direction:column;
  }

  .serverSyncSectionHead .btn{
    width:100%;
  }

  .serverSyncCard .serverSyncGrid{
    grid-template-columns:1fr;
  }

  .serverSyncEnabledField{
    width:100%;
  }
}

.giveawayClaimCard{
  grid-column:1 / -1;
  display:grid;
  gap:14px;
  padding:14px;
  border:1px solid rgba(var(--accent-rgb), .18);
  border-radius:14px;
  background:
    linear-gradient(180deg, rgba(var(--accent-rgb), .055), rgba(255,255,255,.025)),
    rgba(0,0,0,.14);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.035);
}

.giveawayClaimCard.isDisabled{
  border-color:rgba(255,255,255,.08);
  background:rgba(255,255,255,.025);
}

.giveawayClaimToggle{
  min-width:0;
  padding-bottom:12px;
  border-bottom:1px solid rgba(255,255,255,.08);
}

.giveawayClaimProfiles{
  display:grid;
  grid-template-columns:repeat(auto-fit, minmax(min(100%, 520px), 1fr));
  gap:12px;
  align-items:start;
}

.giveawayClaimEmpty{
  grid-column:1 / -1;
  padding:12px;
  border:1px dashed rgba(255,255,255,.12);
  border-radius:12px;
  background:rgba(255,255,255,.025);
}

.giveawayClaimProfileCard{
  position:relative;
  display:grid;
  gap:12px;
  padding:13px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:14px;
  background:
    radial-gradient(circle at top right, rgba(var(--accent-rgb), .075), transparent 42%),
    rgba(255,255,255,.035);
}

.giveawayClaimProfileCard.isDisabled{
  opacity:.62;
}

.giveawayClaimProfileHead{
  display:grid;
  grid-template-columns:minmax(150px, 260px) auto;
  gap:10px;
  align-items:end;
  padding-right:92px;
}

.giveawayClaimProfileName{
  min-width:0;
  max-width:260px;
}

.giveawayClaimProfileEnabled{
  min-width:0;
  width:max-content;
  align-self:end;
  padding-bottom:2px;
}

.giveawayClaimProfileEnabled label{
  min-height:42px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  white-space:nowrap;
  width:max-content;
}

.giveawayClaimProfileEnabled input{
  flex:0 0 auto;
}

.giveawayClaimDeleteBtn{
  position:absolute;
  top:12px;
  right:12px;
  min-height:34px;
  padding:7px 10px;
  font-size:12px;
  white-space:nowrap;
  justify-self:end;
}

.giveawayClaimActions{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:10px;
  max-width:none;
}

.giveawayClaimActionRow{
  display:grid;
  grid-template-columns:minmax(0, 1fr) auto;
  gap:10px;
  align-items:end;
  min-width:0;
  padding:10px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:12px;
  background:rgba(0,0,0,.14);
}

.giveawayClaimActionRow > .field{
  min-width:0;
  width:100%;
}

.giveawayClaimActionRow select{
  width:100%;
}

.giveawayClaimActionBtn{
  min-height:40px;
  width:auto;
  min-width:148px;
  max-width:190px;
  padding:9px 12px;
  white-space:nowrap;
  justify-self:end;
}

.giveawayClaimAddBtn{
  justify-self:start;
  width:auto;
  min-height:40px;
  padding:9px 13px;
}

@media (max-width: 1180px){
  .giveawayClaimActions{
    grid-template-columns:1fr;
  }
}

@media (max-width: 720px){
  .giveawayClaimProfiles{
    grid-template-columns:1fr;
  }

  .giveawayClaimProfileHead{
    grid-template-columns:1fr;
    padding-right:0;
    padding-top:34px;
  }

  .giveawayClaimProfileName{
    grid-column:auto;
    max-width:none;
  }

  .giveawayClaimProfileEnabled{
    width:100%;
  }

  .giveawayClaimProfileEnabled label{
    width:max-content;
  }

  .giveawayClaimDeleteBtn{
    width:auto;
    max-width:none;
    justify-self:end;
  }

  .giveawayClaimActionRow{
    grid-template-columns:1fr;
  }

  .giveawayClaimActionBtn,
  .giveawayClaimDeleteBtn,
  .giveawayClaimAddBtn{
    width:100%;
    max-width:none;
    justify-self:stretch;
  }
}