Files
DiscordClone/discord-html-copy/css/901301eeddfe8f4b.css

14298 lines
277 KiB
CSS

.lineClamp__0b48b {
display: -webkit-box;
-webkit-box-orient: vertical;
overflow: hidden
}
.ragingDemon_ac6454 {
color: var(--white);
display: none;
height: 100vh;
margin-top: -40px;
position: relative;
width: 100vw
}
.ragingDemon_ac6454.visible_ac6454 {
display: block
}
.symbol_ac6454 {
align-items: center;
display: flex;
inset: 0;
justify-content: center;
position: absolute
}
.symbol_ac6454 img {
height: auto;
max-height: 60vh;
max-width: 80vw;
-o-object-fit: contain;
object-fit: contain;
opacity: 0;
position: relative;
width: 80%
}
.full-motion .symbol_ac6454 img {
animation: symbolFadeIn_ac6454 3s ease-out forwards
}
.reduce-motion .symbol_ac6454 img {
opacity: 1;
transition: opacity 1s ease-in
}
.symbolBackground_ac6454 {
inset: 0;
opacity: 0;
position: absolute
}
.symbolBackground_ac6454:after,.symbolBackground_ac6454:before {
background: linear-gradient(90deg,transparent 50%,#fff 0,#fff),linear-gradient(82deg,transparent 50%,#ddd 0,#ddd),linear-gradient(67deg,transparent 50%,#fff 0,#fff),linear-gradient(52deg,transparent 50%,#ddd 0,#ddd),linear-gradient(37deg,transparent 50%,#fff 0,#fff),linear-gradient(22deg,transparent 50%,#ddd 0,#ddd),linear-gradient(7deg,transparent 50%,#fff 0,#fff),linear-gradient(-8deg,transparent 50%,#ddd 0,#ddd),linear-gradient(-23deg,transparent 50%,#fff 0,#fff),linear-gradient(-38deg,transparent 50%,#ddd 0,#ddd),linear-gradient(-53deg,transparent 50%,#fff 0,#fff),linear-gradient(-68deg,transparent 50%,#ddd 0,#ddd),linear-gradient(-83deg,transparent 50%,#fff 0,#fff),linear-gradient(-90deg,transparent 50%,#ddd 0,#ddd);
background-position: 0 0;
background-size: 200% 100%;
content: "";
height: 100%;
position: absolute;
width: 50%
}
.symbolBackground_ac6454:before {
inset-inline-start: 50%;
transform: rotate(180deg)
}
.full-motion .symbolBackground_ac6454 {
animation: symbolBgFadeInOut_ac6454 3s ease-in-out forwards
}
.container_ac6454 {
position: absolute;
transform: translateZ(0)
}
.explosion_ac6454 {
position: absolute;
transform: translateZ(0);
transform-origin: 50%
}
.explosion_ac6454 img {
position: absolute;
transform-origin: 50%
}
.full-motion .animate_ac6454 .circleInner_ac6454 {
animation: explCircleInner_ac6454 calc(var(--custom-raging-demon-duration)*2) var(--custom-raging-demon-duration) ease-out 1 forwards;
opacity: 0
}
.full-motion .animate_ac6454 .circleOuter_ac6454 {
animation: explCircleOuter_ac6454 calc(var(--custom-raging-demon-duration)*3) ease-out 1 forwards;
opacity: 0
}
.full-motion .animate_ac6454 .linesSecondary_ac6454 {
animation: explLinesSecondary_ac6454 calc(var(--custom-raging-demon-duration)*2.5) calc(var(--custom-raging-demon-duration)*1.5) ease-out 1 forwards;
opacity: 0
}
.full-motion .animate_ac6454 .linesMain_ac6454 {
animation: explLinesMain_ac6454 calc(var(--custom-raging-demon-duration)*2) var(--custom-raging-demon-duration) ease-out 1 forwards;
opacity: 0
}
.primaryExplosion_ac6454 {
height: 175px;
margin-inline-start:-77px;margin-top: -102px;
width: 178px
}
.primaryExplosion_ac6454 .circleInner_ac6454 {
inset-inline-start: 43px;
top: 69px
}
.primaryExplosion_ac6454 .circleOuter_ac6454 {
inset-inline-start: 30px;
top: 56px
}
.primaryExplosion_ac6454 .linesSecondary_ac6454 {
inset-inline-start: 0;
top: 59px;
transform-origin: 77px 43px
}
.primaryExplosion_ac6454 .linesMain_ac6454 {
inset-inline-start: 71px;
top: 0;
transform-origin: 3px 110px
}
.secondaryExplosion_ac6454 {
height: 300px;
margin-inline-start:-88px;margin-top: -156px;
width: 170px
}
.secondaryExplosion_ac6454 .circleInner_ac6454 {
inset-inline-start: 58px;
top: 130px;
transform-origin: 30.5px 27.5px
}
.secondaryExplosion_ac6454 .circleOuter_ac6454 {
inset-inline-start: 46px;
top: 115px
}
.secondaryExplosion_ac6454 .linesSecondary_ac6454 {
inset-inline-start: 19px;
top: 68px;
transform-origin: 70px 91px
}
.secondaryExplosion_ac6454 .linesMain_ac6454 {
inset-inline-start: 5px;
top: 6px;
transform-origin: 87px 150px
}
@keyframes symbolFadeIn_ac6454 {
0% {
opacity: 0;
transform: scale(.8)
}
5% {
transform: scale(1.05)
}
15% {
opacity: 1;
transform: scale(1)
}
to {
opacity: 1;
transform: scale(1)
}
}
@keyframes symbolBgFadeInOut_ac6454 {
0% {
opacity: 0
}
5% {
opacity: .2
}
15% {
opacity: .2
}
60% {
opacity: 0
}
to {
opacity: 0
}
}
@keyframes explCircleInner_ac6454 {
0% {
opacity: 0;
transform: scale(.2) translateZ(0)
}
8% {
opacity: 1
}
70% {
opacity: 1
}
to {
opacity: 0;
transform: scale(.8) translateZ(0)
}
}
@keyframes explCircleOuter_ac6454 {
0% {
opacity: 0;
transform: scale(.2) translateZ(0)
}
8% {
opacity: 1
}
70% {
opacity: 1
}
to {
opacity: 0;
transform: scale(.9) translateZ(0)
}
}
@keyframes explLinesSecondary_ac6454 {
0% {
opacity: 0;
transform: scale(0) translateZ(0)
}
20% {
opacity: 1
}
50% {
opacity: 1
}
to {
opacity: 0;
transform: scale(1) translateZ(0)
}
}
@keyframes explLinesMain_ac6454 {
0% {
opacity: 0;
transform: scale(0) translateZ(0)
}
30% {
opacity: 1
}
50% {
opacity: 1
}
to {
opacity: 0;
transform: scale(1) translateZ(0)
}
}
.keyboardShortcutsModal_f061f6 {
background-color: var(--background-base-lower);
border-radius: 4px;
display: flex;
flex-direction: column;
max-height: 80vh;
max-width: 950px;
min-width: 800px;
overflow: hidden;
position: relative;
width: 80vw
}
.noBackground_f061f6 {
background: none!important
}
.noBackground_f061f6.noShadow_f061f6 {
box-shadow: none
}
.backdrop_f061f6 {
background-color: rgba(0,0,0,.5);
pointer-events: none;
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0;
opacity: 0;
transition: opacity 1s ease-in-out
}
.backdrop_f061f6.show_f061f6 {
opacity: 1
}
.modalTitle_f061f6 {
align-items: center;
color: var(--text-strong);
display: flex;
flex: 0 0;
font-size: 26px;
line-height: 34px;
margin: 0 0 5px;
overflow: hidden;
padding: 20px 40px 0
}
.modalTitle_f061f6 .content_f061f6 {
margin-inline-end:20px}
.modalSubtitle_f061f6 {
border-bottom: 1px solid var(--opacity-black-8);
color: var(--text-default);
flex: 0 0;
font-size: 16px;
line-height: 20px;
padding: 0 40px 20px
}
.ddrArrows_f061f6 {
display: flex;
inset-inline-end: 40px;
overflow: hidden;
position: absolute;
top: 22px
}
.ddrArrows_f061f6 .arrow_f061f6 {
float: inline-start;
height: 50px;
margin: 4px;
overflow: hidden;
text-indent: -9999em;
width: 50px
}
.ddrArrows_f061f6 .arrow_f061f6.active_f061f6 {
animation: arrow_f061f6 .2s steps(2) 1;
background-position: 0 -100px
}
.ddrArrows_f061f6 .arrow_f061f6.left_f061f6 {
background-image: url(/assets/574907598f87a615.svg)
}
.ddrArrows_f061f6 .arrow_f061f6.down_f061f6 {
background-image: url(/assets/0a9fe5975bf11d56.svg)
}
.ddrArrows_f061f6 .arrow_f061f6.up_f061f6 {
background-image: url(/assets/1930678cb18a10c6.svg)
}
.ddrArrows_f061f6 .arrow_f061f6.right_f061f6 {
background-image: url(/assets/600de8edafaf94b2.svg)
}
.keybindGroupDescription_f061f6,.keybindGroupDivider_f061f6 {
margin: 8px 0
}
.keyboardShortcutList_f061f6 .keybindGroup_f061f6 {
box-sizing: border-box;
-moz-column-break-inside: avoid;
background-color: var(--background-mod-muted);
border-radius: 8px;
break-inside: avoid;
display: flex;
flex-direction: column;
gap: 8px;
padding: 12px
}
.keybindKey_f061f6 {
margin-bottom: 8px
}
.keyboardShortcutSection_f061f6 {
border-bottom: 1px solid var(--border-subtle);
margin-inline-start:16px;padding: 24px 8px
}
.keyboardShortcutSection_f061f6:last-child {
border-bottom: none
}
.keyboardShortcutListGroup_f061f6 {
display: grid;
gap: 24px;
grid-template-columns: repeat(auto-fill,minmax(180px,max-content));
margin-top: 8px;
padding: 8px 0
}
.firstGroup_f061f6 {
margin-top: 0;
padding-top: 0
}
@keyframes arrow_f061f6 {
0% {
background-position: 0 -50px
}
to {
background-position: 0 -150px
}
}
.tutorial__73f2a {
position: absolute;
top: -80px;
inset-inline: -60px;
opacity: 0;
transition: opacity .2s ease-in-out
}
.tutorial__73f2a.shown__73f2a {
opacity: 1
}
.arrowGroup__73f2a {
inset-inline-start: 0;
position: absolute;
top: 0;
transform-origin: 0 0
}
.arrowGroup__73f2a.right__73f2a {
inset-inline: auto 0;
transform: scaleX(-1)
}
.arrowContainer__73f2a {
inset-inline-start: 0;
opacity: 1;
position: absolute;
top: 0;
transform-origin: 0 0
}
.full-motion .arrowContainer__73f2a {
transition: transform .2s ease-in-out,opacity .2s ease-in-out
}
.horizontal__73f2a {
top: 118px;
transition: none
}
.diag1__73f2a {
transform: translate3d(10px,24px,0) rotate(40deg)
}
.diag2__73f2a {
transform: translate3d(85px,0,0) rotate(70deg)
}
.full-motion .arrowIcon__73f2a {
animation: arrow-pulse__73f2a .82s ease-in-out infinite
}
.tutorialMessages__73f2a {
color: var(--white);
font-size: 18px;
font-weight: var(--font-weight-medium);
height: 60px;
line-height: 24px;
overflow: hidden;
padding-top: 30px;
position: relative;
text-align: center;
top: 10px
}
.message__73f2a {
position: absolute;
width: 100%
}
.full-motion .message__73f2a {
transition: opacity .15s ease-in-out,transform .15s ease-in-out
}
.searchMessage__73f2a {
opacity: 1;
transform: translateZ(0)
}
.selectMessage__73f2a {
opacity: 0;
transform: translate3d(0,100%,0)
}
.hasQuery__73f2a .diag1__73f2a,.hasQuery__73f2a .diag2__73f2a,.hasQuery__73f2a .horizontal__73f2a {
opacity: 0
}
.hasQuery__73f2a .diag1__73f2a {
transform: translate3d(0,12px,0) rotate(40deg)
}
.hasQuery__73f2a .diag2__73f2a {
transform: translate3d(85px,-10px,0) rotate(70deg)
}
.hasQuery__73f2a .searchMessage__73f2a {
opacity: 0;
transform: translate3d(0,-100%,0)
}
.hasQuery__73f2a .selectMessage__73f2a {
opacity: 1;
transform: translateZ(0)
}
@keyframes arrow-pulse__73f2a {
0%,to {
transform: translateZ(0)
}
50% {
transform: translate3d(3px,0,0)
}
}
.quickswitcher_ac6cb0 {
align-items: stretch;
border-radius: 8px;
color: var(--text-default);
display: flex;
flex-direction: column;
padding: 12px 20px 0;
position: relative
}
.quickswitcher_ac6cb0,.quickswitcher_ac6cb0 * {
box-sizing: border-box
}
.input_ac6cb0 {
background-color: var(--input-background-default);
border: 1px solid var(--input-border-default);
border-radius: var(--radius-sm);
color: var(--text-default);
display: block;
flex: 0 0 auto;
font-size: 22px;
height: 70px;
line-height: 70px;
padding: 0 12px;
position: relative;
z-index: 1
}
.input_ac6cb0::-moz-placeholder {
color: var(--input-placeholder-text-default)
}
.input_ac6cb0::placeholder {
color: var(--input-placeholder-text-default)
}
.autocompleteQuerySymbol_ac6cb0 {
background-color: var(--background-base-lowest);
border-radius: 4px;
font-family: var(--font-code);
padding: 2px
}
.scroller_ac6cb0 {
height: 236px;
margin-inline-end:-17px;margin-top: 16px;
max-height: 236px;
z-index: 0
}
.scroller_ac6cb0::-webkit-scrollbar-track {
background-color: var(--background-mod-normal)!important
}
.protip_ac6cb0 {
padding: 10px 0 0
}
.protip_ac6cb0.hasContent_ac6cb0 {
border-top: 1px solid var(--border-subtle)
}
.resultsArea_ac6cb0 {
height: 262px
}
.emptyState_ac6cb0 {
background: no-repeat 50% 20px;
font-weight: var(--font-weight-medium);
padding-bottom: 20px;
padding-top: 150px;
text-align: center
}
.emptyStateNote_ac6cb0 {
color: var(--text-muted);
font-size: 16px;
line-height: 20px
}
.emptyStateCTA_ac6cb0 {
font-size: 14px;
line-height: 16px;
opacity: 1
}
.emptyStateCTA_ac6cb0:hover {
opacity: 1
}
.miscContainer_ac6cb0 {
font-size: 14px;
font-weight: var(--font-weight-medium);
opacity: .6;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.enable-forced-colors .input_ac6cb0 {
border: 1px solid ButtonText
}
.enable-forced-colors .input_ac6cb0:focus {
border-color: Highlight
}
.enable-forced-colors .miscContainer_ac6cb0 {
opacity: 1
}
.images-light .emptyState_ac6cb0 {
background-image: url(/assets/4df87e6155cbedff.svg)
}
.images-dark .emptyState_ac6cb0 {
background-image: url(/assets/05207174d5432737.svg)
}
.listItem__650eb {
display: flex;
justify-content: center;
margin: 0;
position: relative;
width: var(--custom-guild-list-width)
}
.unavailableBadge__650eb {
background-color: var(--white);
color: var(--red-400)!important
}
.iconBadge__650eb {
background-color: var(--icon-overlay-dark)
}
.iconBadge__650eb.isCurrentUserConnected__650eb {
background-color: var(--status-positive)
}
.tutorialContainer__650eb {
position: relative
}
.hideEmoji__650eb {
opacity: 0
}
.serverEmoji__650eb {
height: 16px;
width: 16px
}
.navigationIcon__90d72 {
display: block;
height: 48px;
width: 48px
}
.badgeIcon__90d72 {
height: 12px;
width: 12px
}
.guildSeparator__90d72 {
background-color: var(--border-subtle);
border-radius: 1px;
height: 2px;
width: 32px
}
.guildsError__90d72 {
align-items: center;
background-color: var(--background-base-low);
border-color: var(--border-feedback-critical);
border-radius: 50%;
border-style: solid;
border-width: 2px;
box-sizing: border-box;
color: var(--text-default);
display: flex;
font-size: 20px;
height: 48px;
justify-content: center;
padding: 0;
transition: background-color .15s ease-out;
width: 48px
}
.errorInner__90d72 {
font-weight: var(--font-weight-bold)
}
.guildsError__90d72:hover {
background-color: var(--background-feedback-critical);
border-color: var(--border-feedback-critical);
color: var(--white);
text-decoration: none
}
.circleButtonBase__90d72 {
align-items: center;
box-sizing: border-box;
cursor: pointer;
display: flex;
height: 48px;
justify-content: center;
transition: color .15s ease-out,background-color .15s ease-out;
width: 48px
}
.circleIconButton__90d72 {
background-color: var(--background-base-low);
color: var(--green-360)
}
.circleIconButton__90d72.selected__90d72 {
background-color: var(--green-360);
color: var(--white)
}
.nitroUpsell__90d72 {
background: linear-gradient(135deg,var(--premium-tier-2-purple) 0,var(--premium-tier-2-pink) 100%);
color: var(--white)
}
.nitroUpsellIcon__90d72 {
stroke: #000 2px
}
.circleIcon__90d72 {
height: 24px;
width: 24px
}
.plus__90d72 {
font-size: 40px;
font-weight: var(--font-weight-normal);
line-height: 40px;
position: relative;
top: -1px
}
.createJoinContainer__90d72 {
position: relative;
width: 50px
}
.pill__90d72 {
inset-inline-start: 0;
position: absolute;
top: 0
}
.listItem__90d72 {
display: flex;
justify-content: center;
margin: 0 0 8px;
position: relative;
width: var(--custom-guild-list-width)
}
.listItemWrapper__90d72:active {
transform: translateY(1px) translateZ(0)
}
.listItemTooltip__90d72 {
font-size: 16px;
font-weight: var(--font-weight-semibold);
line-height: 20px;
max-width: 196px;
word-wrap: break-word
}
.placeholderMask__90d72 {
display: block
}
.dragInner__90d72 {
height: 48px;
width: 48px
}
.iconBadge__90d72 {
background-color: var(--background-mod-strong)
}
.iconBadge__90d72.participating__90d72 {
background-color: var(--green-360)
}
.unavailableBadge__90d72 {
background-color: var(--white);
color: var(--red-400)!important
}
.dragInner__90d72 {
background-color: var(--background-base-low)
}
.tutorialContainer__90d72 {
position: relative
}
.upsellTooltip__90d72 {
display: flex
}
.upsellIcon__90d72 {
flex: 0 0 auto;
margin-inline:-6px 8px}
.upsellText__90d72 {
flex: 1 1 auto;
line-height: 22px
}
.listItemTooltip__90d72 {
color: var(--text-default)
}
.listItemTooltipContent__90d72 {
padding: 8px
}
.row_b1f768 {
align-items: center;
display: flex
}
.row_b1f768+.row_b1f768 {
margin-top: 8px
}
.rowGuildName_b1f768 {
align-items: flex-start
}
.rowIcon_b1f768 {
flex-shrink: 0;
margin-inline-end:8px}
.rowIconV2_b1f768 {
margin-top: 2px
}
.activityIcon_b1f768 {
color: var(--interactive-text-default);
height: var(--custom-guild-tooltip-icon-size);
width: var(--custom-guild-tooltip-icon-size)
}
.stageListenerPill_b1f768 {
align-items: center;
background-color: var(--background-base-lowest);
border-radius: 12px;
display: flex;
flex-direction: row;
height: 24px;
margin-inline-start:8px;padding: 0 8px
}
.stageListenerCount_b1f768 {
margin-inline-start:4px}
.guildNameText_b1f768 {
word-wrap: break-word;
color: var(--text-default);
min-width: 0
}
.viewAsRolesWarning_b1f768 {
margin: 8px 0 4px
}
.guildNameTextLimitedSize_b1f768 {
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden
}
.muteText_b1f768 {
font-weight: var(--font-weight-medium)
}
.muteTextWithActivity_b1f768 {
margin-top: 8px
}
.invitesDisabledTooltip_b1f768 {
margin-top: 2px
}
.guildTooltipWrapper_b1f768 {
font-size: 16px;
font-weight: var(--font-weight-semibold);
line-height: 20px;
max-width: 196px;
word-wrap: break-word;
color: var(--text-default);
pointer-events: none
}
.pill_c9fddf {
inset-inline-start: 0;
position: absolute;
top: 0
}
.favoriteIcon_c9fddf {
display: block
}
.ring_c9fddf {
align-items: center;
border-color: var(--status-positive-background);
border-radius: var(--radius-round);
border-style: solid;
box-sizing: border-box;
display: flex;
height: 100%;
justify-content: center;
width: 100%
}
.ringActive_c9fddf {
border-width: 2px
}
.hoverCard_fdda30 {
cursor: pointer;
transition: box-shadow,transform .2s ease
}
.hoverCard_fdda30:focus-within,.hoverCard_fdda30:hover {
box-shadow: var(--shadow-high);
transform: translateY(-4px)
}
.notice__29487 {
align-items: center;
background: linear-gradient(90deg,var(--color-scoped-expressive-background-nitro-1-start,rgba(179,38,156,.7)) 0,var(--color-scoped-expressive-background-nitro-1-end,rgba(20,20,203,.7)) 100%),var(--background-base-lowest);
display: flex;
height: 54px;
position: relative;
z-index: 101
}
@supports not ((grid-template-columns: subgrid) and (white-space-collapse:collapse)) {
.notice__29487 {
border-start-start-radius:0
}
}
@supports (grid-template-columns: subgrid) and (white-space-collapse:collapse) {
.notice__29487 {
grid-area:notice
}
}
.noticeContent__29487 {
align-items: center;
display: flex;
flex: 1;
gap: var(--space-16);
justify-content: center
}
.noticeText__29487 strong {
font-weight: var(--font-weight-semibold)
}
.closeButton__29487 {
margin-inline:auto var(--space-12)}
.premiumIcon_b68a35 {
height: 24px;
margin-inline-end:8px;position: relative;
top: 6px;
width: 24px
}
.platformIcon_b68a35 {
display: inline-block;
height: 28px;
margin-top: -4px;
margin-inline-end:10px;position: relative;
vertical-align: middle;
width: 28px
}
.platformIcon_b68a35+.platformIcon_b68a35 {
margin-inline-start:-10px}
.giftIcon_b68a35 {
margin-inline-end:4px;vertical-align: text-bottom
}
.icon_b68a35 {
display: inline-block;
height: 20px;
margin-inline-start:10px;margin-top: -3px;
position: relative;
vertical-align: middle;
width: 20px
}
.icon_b68a35+.icon_b68a35 {
margin-inline-start:6px}
.iconWindows_b68a35 {
-webkit-mask-image: url(/assets/20dd0e244b9a7065.svg);
mask-image: url(/assets/20dd0e244b9a7065.svg)
}
.iconApple_b68a35,.iconWindows_b68a35 {
background-color: currentColor
}
.iconApple_b68a35 {
-webkit-mask-image: url(/assets/d11dc1928431aa27.svg);
mask-image: url(/assets/d11dc1928431aa27.svg)
}
.iconAndroid_b68a35 {
background-color: currentColor;
-webkit-mask-image: url(/assets/f625814fc53c325e.svg);
mask-image: url(/assets/f625814fc53c325e.svg)
}
.iconUSFlag_b68a35 {
background-image: url(/assets/423c2b95bd0fdafb.png);
background-position: top;
background-repeat: no-repeat;
background-size: 85%;
margin-inline-end:7px;margin-top: 0
}
.icon_b68a35+.btn_b68a35 {
margin-inline-start:20px}
.textLink_b68a35 {
color: var(--white);
padding-inline-start:10px;text-decoration: underline;
-webkit-app-region: no-drag
}
.textLinkSmall_b68a35 {
font-size: 12px
}
.testModeSKUSelector_b68a35 {
height: 24px;
margin-inline-start:16px}
.premiumLogo_b68a35 {
background-image: url(/assets/a3541a1173e706be.svg);
background-repeat: no-repeat;
background-size: 100%;
display: inline-block;
height: 13px;
margin-inline-end:20px;position: relative;
top: 2px;
width: 51px
}
.premiumText_b68a35 {
font-weight: var(--font-weight-medium)
}
.premiumAction_b68a35 {
margin-inline-start:20px}
.ellipsis_b68a35 {
margin-inline-start:7px}
.quarantineLearnMoreLink_b68a35 {
margin-inline-start:10px;text-decoration: underline
}
.errorCodeNoticeText_b68a35 {
margin-inline-start:var(--space-8)}
.errorCodeNoticeClickable_b68a35 {
cursor: pointer
}
.text__7b750 {
display: inline-block
}
.text__7b750,.text__7b750 a {
color: currentColor
}
.text__7b750 a {
text-decoration: underline
}
.premiumIcon__7b750 {
height: 24px;
margin-inline-end:8px;position: relative;
top: 6px;
width: 24px
}
.notice__36c3e {
align-items: center;
display: flex;
flex-direction: row;
justify-content: center
}
.guildIcon__36c3e {
margin-inline-end:8px}
.guildName__36c3e {
color: inherit
}
.guildName__36c3e:hover {
text-decoration: underline
}
.actionButton__36c3e {
margin-inline-start:12px;top: 0
}
.actionButtonInner__36c3e {
align-items: center;
display: flex;
gap: 4px
}
.notice__30f28 {
align-items: center;
background-color: var(--brand-600);
box-shadow: none;
color: var(--white);
display: flex;
height: 40px;
justify-content: center;
padding: 0 8px
}
.notice__30f28.error__30f28 {
background-color: var(--background-feedback-critical)
}
.button__30f28 {
align-items: center;
font-weight: var(--font-weight-semibold);
height: -moz-fit-content;
height: fit-content;
padding: 4px 8px
}
.button__30f28:hover {
background-color: var(--brand-530)
}
.error__30f28>.button__30f28:hover {
background-color: var(--red-430)
}
.header__30f28 {
color: var(--white);
display: inline;
margin-inline-end:16px}
.backButtonInner__84419 {
display: flex;
gap: 8px;
padding: 2px 0
}
.backButton__84419:hover {
background-color: var(--brand-530)
}
.backNotice__84419 {
background-color: var(--brand-600);
border-radius: 0;
padding: 8px
}
.closeButton__84419 {
height: 100%
}
.notice_c5cd6a {
background-color: var(--brand-600);
color: var(--white);
display: flex;
height: 40px;
justify-content: center;
padding: 0 8px
}
.button_c5cd6a,.notice_c5cd6a {
align-items: center
}
.button_c5cd6a {
font-weight: var(--font-weight-semibold);
height: -moz-fit-content;
height: fit-content;
padding: 4px 8px
}
.button_c5cd6a:hover {
background-color: var(--brand-530)
}
.back_c5cd6a {
bottom: 0;
height: 24px;
inset-inline-start: 8px;
margin: auto;
position: absolute;
top: 0
}
.iconButton_c5cd6a {
align-items: center;
display: flex
}
.arrow_c5cd6a {
margin-inline-end:8px}
.header_c5cd6a {
color: var(--white);
display: inline;
margin-inline-end:16px}
.container__477aa {
align-items: center;
display: flex;
flex-direction: row;
gap: var(--space-12);
justify-content: center
}
.buttonGroup__477aa {
margin: var(--space-4) 0;
width: unset
}
.blocked__477aa {
align-items: center;
display: flex
}
.blockedIcon__477aa {
margin-inline:var(--space-12) var(--space-4)}
.blockedText__477aa {
font-size: 12px;
font-weight: var(--font-weight-normal)
}
.noIcon__477aa {
margin-inline-start:var(--space-12)}
.container_a54d1d {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
margin: 16px;
padding-bottom: 80px;
padding-top: 80px
}
.image_a54d1d {
margin-bottom: 16px;
max-width: 400px;
-o-object-fit: contain;
object-fit: contain
}
.title_a54d1d {
color: var(--text-strong);
font-family: var(--font-display);
font-size: 18px;
font-weight: var(--font-weight-extra-bold);
line-height: 24px;
margin-bottom: 8px;
text-transform: none
}
.body_a54d1d {
color: var(--text-default);
font-family: var(--font-primary);
font-size: 16px;
font-weight: var(--font-weight-medium);
line-height: 20px
}
.container_db811b {
align-self: flex-start;
display: grid;
grid-template-columns: auto auto;
grid-template-rows: auto auto;
margin-inline-end:16px}
.mask_db811b {
grid-column: 1/span 2;
grid-row: 1/span 2
}
.image_db811b {
height: 100%;
width: 100%
}
.imageContainer_db811b {
height: 100%;
width: 100%
}
.imageContainer_db811b,.maskBackground_db811b {
align-items: center;
display: flex;
justify-content: center
}
.maskBackground_db811b {
border-radius: 50%;
grid-column: 2/2;
grid-row: 2/2;
height: 20px;
width: 20px
}
.maskIcon_db811b {
height: 12px;
width: 12px
}
.row__6fddf {
cursor: pointer;
display: flex;
flex-direction: row;
gap: 16px;
padding: var(--space-xs) var(--space-sm);
position: relative
}
.row__6fddf:hover {
background-color: var(--background-mod-subtle)
}
.rowContent__6fddf {
display: flex;
flex: 1;
flex-direction: row;
justify-content: space-between
}
.body__6fddf {
flex: 1;
margin-top: 2px
}
.messagePreviewContainer__6fddf {
background-color: var(--background-base-low);
border-radius: 8px;
display: flex;
margin-bottom: 2px;
margin-top: 4px;
padding: 8px;
pointer-events: none
}
.messagePreviewText__6fddf {
flex: 1;
margin: auto;
padding-inline-start:8px;width: 0
}
.calloutContainer__6fddf {
background-color: var(--background-base-low);
border-radius: 8px;
margin-bottom: 2px;
margin-top: 4px;
padding: 8px 16px
}
.unread__6fddf {
background-color: var(--interactive-text-active);
border-radius: 50%;
height: 8px;
inset-inline-start: -4px;
position: absolute;
top: 28px;
width: 8px
}
.friendRequestContainer__6fddf {
display: flex;
margin-top: 4px
}
.button__6fddf {
cursor: pointer;
padding: 7px 16px
}
.acceptButton__6fddf,.ignoreButton__6fddf {
}
.acceptButton__6fddf {
margin-inline-end:12px}
.lifecycleContainer__6fddf {
align-items: center;
display: flex;
margin-bottom: 1px
}
.lifecycleText__6fddf {
padding-inline-start:4px}
.checkbox__6fddf {
height: 16px;
width: 16px
}
.emoji__6fddf {
margin-inline-start:4px}
.container__0f711 {
background-color: var(--background-surface-high)
}
.spinner__0f711 {
margin-bottom: 32px;
margin-top: 32px
}
.loadingPlaceholder__0f711 {
margin-top: 100px
}
.gatedContent__7184c {
height: 100%
}
.title__7184c {
max-width: 640px;
text-align: center
}
.description__7184c {
max-width: 440px;
text-align: center
}
.divider__7641b {
background-color: var(--border-subtle)!important;
height: 1px;
margin: 16px 16px 0
}
.private__7641b {
align-items: center;
display: flex;
padding: 16px 16px 8px;
text-transform: uppercase
}
.instructions__7641b {
padding: 0 16px
}
.container__7641b.emptyState__7641b {
box-sizing: border-box;
flex-direction: column;
justify-content: flex-start;
padding: 16px;
text-align: center
}
.emptyStateHeader__7641b {
text-align: start;
text-transform: uppercase
}
.emptyStateIcon__7641b {
background-color: var(--background-base-lowest);
border-radius: 100%;
color: var(--interactive-text-default);
height: 56px;
width: 56px
}
.emptyStateIcon__7641b,.emptyStateIconContainer__7641b {
align-items: center;
display: flex;
justify-content: center
}
.emptyStateIconContainer__7641b {
margin: 32px 0;
position: relative
}
.emptyStateStars__7641b {
margin: 0 auto;
position: absolute;
top: -13px
}
.emptyStateSubtext__7641b {
margin-top: 8px
}
.container__7641b {
background-color: var(--background-base-lower);
border-inline-start:1px solid var(--border-subtle)}
.refresh-fast-follow-distinct-borders .container__7641b {
border-inline-start-color: var(--app-frame-border)
}
.jumpButton_ed0c8c {
align-items: center;
-webkit-backdrop-filter: blur(8px);
backdrop-filter: blur(8px);
background-color: var(--background-surface-high);
border: 1px solid var(--border-subtle);
border-radius: var(--radius-xs);
box-shadow: var(--shadow-medium);
box-sizing: border-box;
color: var(--control-secondary-text-default);
cursor: pointer;
font-weight: var(--font-weight-semibold);
height: auto;
inset-inline-end: var(--space-8);
padding: var(--space-4) var(--space-8);
position: absolute;
text-align: center;
top: var(--space-8);
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
z-index: 1
}
.jumpButton_ed0c8c .text_ed0c8c {
color: var(--text-default)
}
.jumpButton_ed0c8c:hover .text_ed0c8c {
color: var(--interactive-text-hover)
}
.jumpButton_ed0c8c:active .text_ed0c8c {
color: var(--interactive-text-active)
}
.jumpButton_ed0c8c:hover {
background-color: var(--background-surface-higher)
}
.channelHeader__35a7e {
align-items: center;
background-color: var(--background-surface-high);
box-sizing: border-box;
display: flex;
height: 64px;
padding-bottom: 12px;
padding-top: 12px;
padding-inline-start:18px;position: sticky;
top: 0;
z-index: 10
}
.channelHeader__35a7e.showCollapseButton__35a7e {
padding-inline-start:0}
.collapseButton__35a7e {
color: var(--interactive-text-default);
cursor: pointer;
height: 16px;
padding: 4px;
width: 16px
}
.collapseButton__35a7e.collapsed__35a7e {
transform: rotate(-90deg)
}
.dmIcon__35a7e {
border-radius: 12px;
height: 40px;
width: 40px
}
.dmIcon__35a7e,.guildIcon__35a7e {
cursor: pointer;
flex-shrink: 0;
margin-inline-end:16px}
.guildIcon__35a7e {
background-color: var(--background-mod-normal)
}
.channelNameSection__35a7e {
display: flex;
flex-direction: column;
flex-grow: 1;
margin-inline-end:16px;overflow: hidden
}
.badge__35a7e {
margin-inline-start:8px}
.channelName__35a7e,.subtext__35a7e {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-all
}
.channelName__35a7e,.guildName__35a7e {
cursor: pointer;
display: inline-block;
min-width: 0;
width: 100%
}
.channelName__35a7e:hover .channelNameSpan__35a7e,.guildName__35a7e:hover .channelNameSpan__35a7e {
text-decoration: underline
}
.channelName__35a7e {
align-items: center;
display: flex
}
.forumIcon__35a7e {
margin-inline-end:4px}
.channelNameHeader__35a7e {
height: 20px
}
.subtext__35a7e,.subtextContainer__35a7e {
max-height: 16px;
min-width: 0;
width: 100%
}
.container_d404a3 {
align-items: center;
display: flex;
flex: 1;
flex-direction: column;
justify-content: center;
min-height: 400px;
padding: 0 16px;
text-align: center
}
.iconContainer_d404a3 {
margin-bottom: 16px;
position: relative
}
.icon_d404a3 {
background-color: var(--background-base-low);
border-radius: 80px;
color: var(--text-muted);
padding: 22px
}
.stars_d404a3 {
inset-inline-start: -10px;
position: absolute
}
.header_d404a3 {
margin-bottom: 8px
}
.protip_d404a3 {
text-transform: uppercase
}
.recentMentionsPopout__95796 {
max-height: 70vh;
max-width: 600px;
min-width: 480px;
width: 35vw
}
.widerInbox__95796 {
max-width: 750px;
width: 560px
}
.scroller__95796 {
padding: 0
}
.container__95796 {
margin-bottom: 16px;
padding-inline-end:8px}
.closeButton__95796 {
flex-shrink: 0;
margin-inline-start:12px}
.messageContainer__95796 {
background-color: var(--background-surface-higher);
border: 1px solid var(--border-subtle);
border-radius: var(--radius-sm);
margin-inline-start:16px;padding: 16px;
padding-inline-start:0;position: relative
}
.jumpMessageButton__95796 {
inset-inline-end: 16px;
opacity: 0;
top: 19px
}
.messageContainer__95796:focus-within .jumpMessageButton__95796,.messageContainer__95796:hover .jumpMessageButton__95796 {
opacity: 1
}
.message__95796 {
overflow: hidden;
padding-inline-end:0}
.messageContainer__95796 .message__95796:first-of-type {
margin-top: 0
}
.enable-forced-colors .messageContainer__95796 {
border: 2px solid CanvasText
}
.checkbox__95796 {
flex-grow: 0
}
.friendRequestsButton__523aa {
align-items: center;
background-color: var(--control-secondary-background-default);
border: 1px solid var(--control-secondary-border-default);
border-radius: 8px;
color: var(--control-secondary-text-default);
cursor: pointer;
display: flex;
gap: 8px;
height: 32px;
padding: 0 8px
}
.friendRequestsButton__523aa:hover {
background-color: var(--control-secondary-background-hover);
color: var(--interactive-text-active)
}
.obscuredIcon__43090 {
height: 32px;
width: 32px
}
.author_d3eee8 {
flex-shrink: 0
}
.author_d3eee8 a {
color: var(--text-muted)
}
.author_d3eee8.hasUnreads_d3eee8 a {
color: var(--text-strong)
}
.container_faa96b {
align-items: start;
border: 1px solid transparent;
box-sizing: border-box;
cursor: pointer;
display: flex;
flex-direction: row;
overflow: hidden;
padding: var(--space-12) calc(var(--space-8) + 2px);
position: relative
}
.full-motion .container_faa96b {
transition: box-shadow .2s ease-out,transform .2s ease-out,background .2s ease-out,border .2s ease-out
}
.container_faa96b:hover {
background-color: var(--background-surface-high);
border-color: var(--border-strong);
box-shadow: var(--shadow-low);
transform: none
}
.container_faa96b:hover .dots_faa96b {
border-color: var(--background-base-low)
}
.container_faa96b:active {
background-color: var(--interactive-background-active);
box-shadow: var(--shadow-border),var(--shadow-high);
transform: none
}
.container_faa96b:active .dots_faa96b {
border-color: var(--interactive-background-active)
}
.container_faa96b.isOpen_faa96b {
background-color: var(--background-surface-higher);
border-color: var(--border-strong);
box-shadow: var(--shadow-low);
transform: none
}
.container_faa96b.isOpen_faa96b .dots_faa96b {
border-color: var(--interactive-background-selected)
}
.focusTarget_faa96b {
height: 0;
pointer-events: none;
width: 0
}
.left_faa96b {
flex: 1 1 auto;
min-width: 0
}
.body_faa96b {
display: flex;
flex: 1;
flex-direction: column
}
.body_faa96b,.messageFocusBlock_faa96b {
min-width: 0
}
.message_faa96b {
align-items: center;
display: flex;
max-height: 18px;
overflow: hidden
}
.messageContent_faa96b {
color: unset;
font-size: 14px!important;
font-weight: var(--font-weight-medium);
height: 18px;
line-height: 18px!important;
margin-inline-start:4px;overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
word-break: break-word
}
.messageContent_faa96b .emoji {
height: 18px
}
.messageContentTrailingIcon_faa96b {
flex: 0 0 auto;
margin-inline-start:4px}
.messageContentLeadingIcon_faa96b {
flex: 0 0 auto;
margin-inline-end:4px}
.bodyMedia_faa96b {
align-items: center;
border-radius: var(--radius-sm);
box-sizing: border-box;
flex-shrink: 0;
height: 100%;
margin-inline-start:12px;min-height: 72px;
overflow: hidden;
position: relative;
width: 72px
}
.obscuredTag_faa96b {
color: var(--opacity-black-60);
inset-inline-start: 50%;
position: absolute;
top: 50%;
transform: translate(-50%,-50%)
}
.thumbnailContainer_faa96b {
align-items: center;
display: flex;
justify-content: center;
--__post-thumbnail-size: 72px
}
.thumbnailContainer_faa96b,.thumbnailOverride_faa96b {
height: var(--__post-thumbnail-size);
max-height: var(--__post-thumbnail-size);
max-width: var(--__post-thumbnail-size);
min-height: var(--__post-thumbnail-size);
min-width: var(--__post-thumbnail-size);
width: var(--__post-thumbnail-size)
}
.thumbnailOverride_faa96b {
-o-object-fit: cover;
object-fit: cover
}
.obscured_faa96b {
filter: blur(var(--custom-forum-post-obscured-blur-radius));
pointer-events: none
}
.obscuredThumbnailPlaceholder_faa96b {
background-color: var(--background-mod-strong)
}
.body_faa96b {
padding-bottom: 8px
}
.header_faa96b {
display: flex;
padding-bottom: 6px
}
.footer_faa96b {
align-items: center;
display: flex;
gap: 8px;
height: 20px;
position: relative
}
.bullet_faa96b {
color: var(--border-subtle)
}
.headerText_faa96b {
align-items: center;
display: flex;
flex-grow: 1;
flex-wrap: wrap;
margin-inline-end:8px;max-height: 48px;
overflow: hidden
}
.headerText_faa96b .emoji {
height: 20px;
width: 20px
}
.postTitleText_faa96b {
line-height: 24px
}
.newBadgeWrapper_faa96b {
display: inline;
padding-inline-start:8px}
.newBadge_faa96b {
border-radius: var(--radius-md);
color: var(--brand-560);
display: inline;
padding: 2px 8px;
position: relative;
top: -2px
}
.newBadge_faa96b.inTagsRow_faa96b {
height: 20px;
position: inherit
}
.typing_faa96b {
flex-direction: row
}
.dots_faa96b,.typing_faa96b {
align-items: center;
display: flex
}
.dots_faa96b {
background-color: var(--background-base-lowest);
border: 3px solid var(--background-base-low);
border-radius: var(--radius-md);
height: 16px;
justify-content: center;
margin-inline-start:4px;width: 24px
}
.typingUsers_faa96b {
position: static
}
.messageCountBox_faa96b {
align-items: center;
display: flex;
height: 18px;
padding-top: 1px
}
.messageCountIcon_faa96b {
align-items: center;
color: var(--text-default);
display: flex;
height: 24px;
margin-inline-end:4px;margin-top: 1px
}
.hasRead_faa96b .messageCountIcon_faa96b {
color: var(--icon-muted)
}
.hasRead_faa96b .messageCountText_faa96b {
color: var(--interactive-text-default)
}
.messageCountText_faa96b {
color: var(--text-default);
font-size: 14px;
font-weight: var(--font-weight-medium)
}
.newMessageCount_faa96b {
margin-inline-start:4px}
.addReactButton_faa96b {
align-items: center;
color: var(--interactive-text-default);
display: flex;
font-size: 14px;
font-weight: var(--font-weight-medium);
gap: 8px;
height: unset;
line-height: 18px;
margin: 0;
visibility: visible;
width: unset
}
.addReactButton_faa96b:hover {
color: var(--interactive-text-active)
}
.reactions_faa96b {
margin: 0;
padding: 0
}
.updateReactionButton_faa96b {
margin-inline-end:4px;margin-bottom: 0
}
.updateReactionButton_faa96b>div {
padding-bottom: 1px;
padding-top: 1px
}
.timestampTooltip_faa96b {
max-width: none;
white-space: nowrap
}
.blockedMessage_faa96b {
font-style: italic
}
.withNewBadgeOverflow_faa96b .headerText_faa96b {
align-items: flex-start;
display: flex;
flex-direction: row
}
.withNewBadgeOverflow_faa96b .postTitleText_faa96b {
flex: 1
}
.withNewBadgeOverflow_faa96b .newBadge_faa96b {
height: 20px;
top: 2px
}
.tags__08166 {
font-family: var(--font-primary);
font-weight: var(--font-weight-medium);
gap: 8px;
height: 24px;
margin-bottom: 8px
}
.pinIcon__08166,.tags__08166 {
align-items: center;
display: inline-flex
}
.pinIcon__08166 {
background-color: var(--brand-500);
border-radius: 9999px;
flex-shrink: 0;
height: 22px;
justify-content: center;
width: 22px
}
.tagFiltered__08166 {
background-color: var(--background-base-lowest)
}
.forumPost__7d15e {
background-color: var(--background-base-low);
border-radius: 8px;
margin: 0 0 16px
}
.forumPost__7d15e:hover {
box-shadow: none;
transform: none
}
.container__7d15e .forumPost__7d15e:last-of-type {
margin-bottom: 0
}
.messages__1ccd1 {
background-color: var(--background-surface-higher);
border: 1px solid var(--border-subtle);
border-radius: 8px;
padding: 16px;
padding-inline-start:0}
.messageContainer__1ccd1 {
position: relative
}
.jumpButton__1ccd1 {
opacity: 0
}
.jumpButton__1ccd1:focus-within,.jumpButton__1ccd1:hover {
opacity: 1
}
.messageContainer__1ccd1:focus-visible .jumpButton__1ccd1,.messageContainer__1ccd1:hover .jumpButton__1ccd1 {
opacity: 1
}
.message__1ccd1 {
overflow: hidden;
padding-inline-end:0}
.message__1ccd1 .mention {
pointer-events: none
}
.messages__1ccd1 .messageContainer__1ccd1:first-of-type .message__1ccd1 {
margin-top: 0
}
.divider__1ccd1 {
margin-bottom: 16px;
margin-top: 16px;
margin-inline-start:16px}
.showAllButtonContainer__1ccd1 {
padding-block-end:var(--space-8);padding-block-start: var(--space-8);
padding-inline-start:var(--space-16)}
.channel__427f0 {
padding-bottom: 16px
}
.buttonGroup__427f0,.collapseButton__427f0,.markReadButton__427f0 {
flex-shrink: 0
}
.markReadButton__427f0 {
margin-inline-start:12px}
.divider__27703 {
margin-bottom: 32px;
margin-top: 48px
}
.dividerContent__27703 {
background: transparent
}
.container__2692d {
background-color: var(--background-surface-high);
border-radius: 8px;
box-shadow: var(--shadow-border),var(--shadow-high);
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
z-index: 0
}
.widerInbox__2692d {
}
.spinner__2692d {
margin-bottom: 32px;
margin-top: 32px
}
.tutorial__2692d {
background-color: var(--background-base-lowest);
border-radius: 8px;
display: flex;
margin: 16px 0;
padding: 16px
}
.tutorialIcon__2692d {
align-items: center;
background-color: var(--background-base-low);
border-radius: 40px;
color: var(--interactive-text-default);
display: flex;
flex-shrink: 0;
height: 40px;
justify-content: center;
margin-inline-end:16px;width: 40px
}
.tutorialButton__2692d {
margin-top: 8px
}
.scroller__2692d {
padding: 0 16px
}
.expandedMarkAllReadContainer__2692d {
background-color: var(--background-base-low);
padding: 16px
}
.enable-forced-colors .container__2692d {
border: 2px solid CanvasText
}
.header_ab6641 {
box-shadow: none;
box-sizing: border-box;
padding: var(--space-md) var(--space-md) 0
}
.headerTitle_ab6641 {
align-items: center;
display: flex
}
.headerTabs_ab6641 {
margin: 0 -16px
}
.tabBar_ab6641 {
margin-top: 16px
}
.tab_ab6641 {
align-items: center;
display: flex;
justify-content: center;
margin-bottom: -2px;
padding: 0 16px 16px
}
.inboxIcon_ab6641 {
color: var(--icon-strong);
height: 20px;
margin-inline-end:8px;width: 20px
}
.inboxTitle_ab6641 {
flex: 1
}
.controls_ab6641 {
align-items: center;
display: flex;
gap: 8px;
justify-content: center;
margin-inline-start:auto}
.iconBadge_ab6641 {
margin-inline-start:8px}
.closeButton_f6bd5f {
flex-shrink: 0;
margin-inline-start:var(--space-12)}
.messageContainer_f6bd5f {
background-color: var(--background-base-low);
border: 1px solid transparent;
border-radius: var(--radius-sm);
display: flex;
flex-direction: column;
justify-content: center;
margin: 0 var(--space-16) var(--space-8);
padding-block:var(--space-16) var(--space-16);padding-inline: 0 var(--space-16)
}
.messageSpinner_f6bd5f {
flex: 1 0 0
}
.channelMessageAndButtons_f6bd5f {
align-items: center;
display: flex
}
.messageContainer_f6bd5f.messageSendScheduled_f6bd5f {
border-color: var(--green-430)
}
.messageContainer_f6bd5f.messageSendError_f6bd5f {
border-color: var(--border-feedback-critical)
}
.messageState_f6bd5f {
color: var(--text-muted);
padding-block:0 var(--space-8);padding-inline: var(--space-16) 0
}
.message_f6bd5f {
flex: 1 0 0;
max-width: calc(100% - var(--space-80) - var(--space-24));
overflow: hidden;
padding-inline-end:0}
.messageContainer_f6bd5f .message_f6bd5f:first-of-type {
margin-top: 0
}
.enable-forced-colors .messageContainer_f6bd5f {
border: 2px solid CanvasText
}
.checkbox_f6bd5f {
flex-grow: 0
}
.container_f6bd5f {
background-color: var(--background-surface-high);
border-radius: 0 0 var(--radius-sm) var(--radius-sm);
box-shadow: var(--shadow-border),var(--shadow-high);
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
z-index: 0
}
.widerInbox_f6bd5f {
}
.channelRow_f6bd5f {
border-bottom: 1px solid var(--border-subtle)
}
.cannotSendMessage_f6bd5f {
color: var(--text-muted);
margin: var(--space-16)
}
.sendMessageToCurrentChannel_f6bd5f {
display: flex;
margin: var(--space-16)
}
.sendMessageToCurrentChannelInput_f6bd5f {
flex: 1 0 0
}
.loadingPlaceholder_f6bd5f {
margin-top: 100px
}
.container_fc561d {
background-color: var(--background-surface-high);
border-radius: 8px;
box-shadow: var(--shadow-border),var(--shadow-high);
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
z-index: 0
}
.widerInbox_fc561d {
}
.enable-forced-colors .container_fc561d {
border: 2px solid CanvasText
}
.pill__4f4b6 {
inset-inline-start: 0;
position: absolute;
top: 0
}
.notificationsIcon__4f4b6 {
display: block
}
.full-motion .badgeTransition__4f4b6 {
transition: all .2s cubic-bezier(0,0,.2,1.1)
}
.grayBadge__4f4b6 {
background-color: var(--background-mod-strong)!important;
color: var(--white);
font-size: 10px
}
.grayBadge__4f4b6.selected__4f4b6 {
background-color: var(--interactive-text-active)!important;
color: var(--background-base-lowest)
}
.headerButton_c485a2 {
align-items: center;
border-radius: var(--radius-xs);
cursor: pointer;
display: flex;
height: 32px;
justify-content: center;
width: 32px
}
.headerButton_c485a2.enabled_c485a2,.headerButton_c485a2:hover {
background-color: var(--control-secondary-background-hover);
color: var(--text-strong)
}
.container_f37cb1 {
position: relative;
transition: color 1s linear;
--custom-guild-banner-height: 130px
}
.clickable_f37cb1 {
cursor: pointer
}
.animatedBannerHoverLayer_f37cb1 {
cursor: default;
inset-inline-start: 0;
position: absolute;
top: var(--custom-channel-header-height);
width: 100%;
z-index: 100
}
.animatedContainer_f37cb1 {
background-color: var(--interactive-background-active);
box-shadow: var(--shadow-low);
overflow: hidden;
width: 100%
}
.animatedContainer_f37cb1,.bannerImage_f37cb1 {
height: var(--custom-guild-banner-height);
inset-inline-start: 0;
position: absolute;
top: 0
}
.bannerImage_f37cb1,.bannerImg_f37cb1 {
width: 240px
}
.bannerImg_f37cb1 {
-o-object-fit: cover;
object-fit: cover
}
.bannerImage_f37cb1,.bannerImg_f37cb1 {
height: var(--custom-guild-banner-height)
}
.bannerImage_f37cb1,.bannerImg_f37cb1 {
aspect-ratio: 21/9;
width: calc(var(--custom-guild-sidebar-width) - var(--custom-guild-list-width))
}
.bannerImgFullWidth_f37cb1 {
width: 100%
}
.bannerImage_f37cb1:before {
background: linear-gradient(to bottom,var(--background-mod-strong),transparent 100%);
content: "";
display: none;
height: 58px;
inset-inline-start: 0;
position: absolute;
top: 0;
width: 100%
}
.header_f37cb1 {
border-bottom: 1px solid var(--border-subtle);
box-shadow: none;
box-sizing: border-box;
font-family: var(--font-display);
font-weight: var(--font-weight-medium);
height: var(--custom-channel-header-height);
padding: var(--space-xs);
position: relative;
transition: background-color .1s linear;
z-index: 1
}
.header_f37cb1,.headerContent_f37cb1 {
align-items: center;
display: flex
}
.headerContent_f37cb1 {
color: var(--text-strong);
gap: var(--space-xxs);
justify-content: space-between;
width: 100%
}
.refresh-fast-follow-avatars .header_f37cb1 {
padding-inline-start:min(var(--space-md),18px)}
.primaryInfo_f37cb1 {
height: unset;
justify-content: space-between
}
.headerButton_f37cb1 {
inset: 0;
pointer-events: none;
position: absolute
}
.headerChildren_f37cb1 {
position: relative;
z-index: 4
}
.communityInfoContainer_f37cb1 {
align-items: flex-end;
display: flex;
overflow: hidden;
position: absolute
}
.communityInfoContainer_f37cb1.hasSubheader_f37cb1 {
margin-bottom: -12px;
position: relative
}
.communityInfoVisible_f37cb1 .communityInfoContainer_f37cb1 {
height: 20px;
margin-top: 4px
}
.communityInfoVisible_f37cb1 .communityInfo_f37cb1 {
color: var(--white)
}
.communityInfoPill_f37cb1 {
align-items: center;
background: var(--background-mod-subtle);
border-radius: 10px;
display: flex;
padding: 2px 6px
}
.communityIcon_f37cb1,.communityInfoPill_f37cb1 {
margin-inline-end:4px}
.bannerVisible_f37cb1 .headerContent_f37cb1 {
filter: drop-shadow(0 1px 3px var(--opacity-black-60))
}
.communityInfoVisible_f37cb1 .header_f37cb1,.communityInfoVisible_f37cb1 .header_f37cb1:hover,.hasBanner_f37cb1 .header_f37cb1,.hasBanner_f37cb1 .header_f37cb1:hover {
border-bottom: none;
box-shadow: none
}
.bannerVisible_f37cb1 .dropdown_f37cb1 {
opacity: 1
}
.name_f37cb1 {
margin-inline-end:auto;z-index: 1
}
.favoritesIcon_f37cb1 {
margin-inline-end:8px;margin-bottom: 2px
}
.guildDropdown_f37cb1 {
align-items: center;
border-radius: 8px;
cursor: pointer;
display: flex;
gap: 2px;
height: 32px;
min-width: 0;
padding-block:0;padding-inline:var(--space-xs)}
.guildDropdown_f37cb1: hover {
background-color:var(--background-mod-subtle)
}
.guildBadgeAndName_f37cb1 {
align-items: center;
display: flex;
flex: 1 1 auto;
gap: var(--space-xs);
min-width: 0
}
.inviteButton_f37cb1 {
align-items: center;
border-radius: var(--radius-sm);
cursor: pointer;
display: flex;
flex: 0 0 auto;
height: 32px;
justify-content: center;
width: 32px
}
.inviteButton_f37cb1:hover {
background-color: var(--background-mod-subtle)
}
.refresh-fast-follow-distinct-borders .header_f37cb1 {
border-bottom-color: var(--app-frame-border)
}
.enable-forced-colors .container_f37cb1 {
border-bottom: 2px solid CanvasText
}
.enable-forced-colors .clickable_f37cb1 .header_f37cb1 {
background-color: ButtonFace;
color: ButtonText;
forced-color-adjust: none
}
.enable-forced-colors .clickable_f37cb1 .header_f37cb1 .headerContent_f37cb1,.enable-forced-colors .clickable_f37cb1 .header_f37cb1 .name_f37cb1 {
color: ButtonText
}
.enable-forced-colors .selected_f37cb1 .header_f37cb1 {
background-color: HighlightText;
color: Highlight
}
.enable-forced-colors .selected_f37cb1 .header_f37cb1 .headerContent_f37cb1,.enable-forced-colors .selected_f37cb1 .header_f37cb1 .name_f37cb1 {
color: Highlight
}
.theme-dark .themedHeaderMobile_f37cb1 {
background: var(--background-gradient-high,var(--__header-bar-background))
}
.theme-light .themedHeaderMobile_f37cb1 {
background: var(--background-gradient-low,var(--__header-bar-background))
}
.bannerVisible_f37cb1 .headerContent_f37cb1,.bannerVisible_f37cb1 .name_f37cb1 {
color: var(--white)
}
.bannerVisible_f37cb1 .headerEllipseForeground_f37cb1 {
background: var(--opacity-black-52);
border-radius: 50%;
filter: blur(10px);
height: calc(var(--custom-channel-header-height)*2);
position: absolute;
top: calc((var(--custom-channel-header-height) - var(--space-xs)/2)*-1);
inset-inline: calc((var(--custom-guild-sidebar-width) - var(--custom-guild-list-width))*-1/4);
mix-blend-mode: multiply
}
.bannerVisible_f37cb1 .headerEllipseBackdrop_f37cb1 {
-webkit-backdrop-filter: blur(2px);
backdrop-filter: blur(2px);
height: var(--custom-channel-header-height);
position: absolute;
top: 0;
inset-inline: 1px
}
.bannerVisible_f37cb1 .headerGlass_f37cb1 {
-webkit-backdrop-filter: blur(30px);
backdrop-filter: blur(30px);
border-bottom: 1px solid var(--border-subtle);
box-sizing: border-box;
height: calc(1px + var(--custom-channel-header-height));
inset-inline-start: 1px;
opacity: 1;
position: absolute;
top: 0;
width: calc(100% - 1px)
}
.bannerVisible_f37cb1:hover .headerGlass_f37cb1 {
opacity: 1!important;
transition: opacity .15s ease-in-out
}
.bannerVisible_f37cb1 .header_f37cb1 {
border-bottom: none;
border-start-start-radius: 12px;
border-top: 1px solid var(--app-frame-border)
}
.settingsButton_f37cb1:hover .settingsButtonIcon_f37cb1 {
color: var(--interactive-text-hover)
}
.settingsButtonIcon_f37cb1 {
--chat-input-icon-size: 18px
}
.skeleton__9897f {
padding-inline-end:8px}
.skeletonItem__9897f {
align-items: flex-start;
display: flex;
gap: 12px;
padding: 4px
}
.lineContainer__9897f {
display: flex;
flex-direction: column;
gap: 4px;
width: 100%
}
.avatar__9897f {
background-color: var(--background-mod-muted);
border-radius: 50%;
flex-shrink: 0;
height: 32px;
width: 32px
}
.wrapper__9897f {
position: relative;
z-index: 0
}
.loadingAnimation__9897f {
background: var(--background-mod-muted);
-webkit-mask: linear-gradient(#000 0 0);
mask: linear-gradient(#000 0 0)
}
.loadingAnimation__9897f:before {
animation: shimmer__9897f 2s cubic-bezier(.4,0,.2,1) infinite;
background: linear-gradient(-65deg,transparent 45%,var(--background-mod-muted) 50%,transparent 55%) 100%/300% 100%;
content: "";
inset: 0;
position: absolute;
z-index: -1
}
.noAnimation__9897f .loadingAnimation__9897f:before {
display: none
}
.line__9897f {
background-color: var(--background-mod-muted);
border-radius: 8px;
height: 16px
}
.lineShort__9897f {
width: 35%
}
.lineMedium__9897f {
width: 60%
}
.lineLong__9897f {
width: 95%
}
@keyframes shimmer__9897f {
to {
background-position: 0
}
}
.channelName_cb862a {
color: var(--text-muted);
line-height: 20px;
max-width: -moz-min-content;
max-width: min-content
}
.channelName_cb862a.unread_cb862a {
color: var(--text-strong)
}
.inlineIcon_cb862a {
flex-shrink: 0
}
.clanTag_cb862a {
margin-inline-start:4px}
.messageContainer_cb862a {
box-sizing: border-box;
display: flex;
flex-direction: row;
gap: 12px;
margin-bottom: 2px;
padding: 4px 8px
}
.messageClickableContainer_cb862a {
border-radius: 8px;
cursor: pointer;
flex-direction: column;
position: relative
}
.messageClickableContainer_cb862a:hover .channelName_cb862a,.messageClickableContainer_cb862a:hover .message_cb862a {
color: var(--text-strong)
}
.messageClickableContainer_cb862a.actionMenuOpen_cb862a .timestamp_cb862a,.messageClickableContainer_cb862a:focus .timestamp_cb862a,.messageClickableContainer_cb862a:focus-within .timestamp_cb862a,.messageClickableContainer_cb862a:hover .timestamp_cb862a {
display: none
}
.messageClickableContainer_cb862a.actionMenuOpen_cb862a .mentionBadge_cb862a,.messageClickableContainer_cb862a:focus .mentionBadge_cb862a,.messageClickableContainer_cb862a:focus-within .mentionBadge_cb862a,.messageClickableContainer_cb862a:hover .mentionBadge_cb862a {
display: none
}
.messageClickableContainer_cb862a.actionMenuOpen_cb862a .actions_cb862a,.messageClickableContainer_cb862a:focus .actions_cb862a,.messageClickableContainer_cb862a:focus-within .actions_cb862a,.messageClickableContainer_cb862a:hover .actions_cb862a {
display: flex
}
.channelName_cb862a.selected_cb862a,.message_cb862a.selected_cb862a {
color: var(--text-strong)
}
.messageClickableContainer_cb862a.actionMenuOpen_cb862a,.messageClickableContainer_cb862a:focus-within,.messageClickableContainer_cb862a:hover {
background: var(--interactive-background-hover)
}
.messageClickableContainer_cb862a.selected_cb862a {
background: var(--interactive-background-selected)
}
.messageClickableContainer_cb862a.selected_cb862a .mentionBadge_cb862a,.messageClickableContainer_cb862a.selected_cb862a .timestamp_cb862a {
display: none
}
.messageClickableContainer_cb862a.selected_cb862a .actions_cb862a {
display: flex
}
.message_cb862a {
color: var(--text-muted);
display: inline;
font-size: 14px;
font-weight: 400;
line-height: 20px;
max-height: 20px;
padding-inline-end:2px;pointer-events: none;
text-overflow: ellipsis;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
white-space: nowrap;
width: -moz-min-content;
width: min-content
}
.message_cb862a .emoji {
height: 18px;
width: 18px
}
.message_cb862a .obscured {
background-color: var(--__spoiler-background-color--revealed);
margin-inline-end:4px}
.message_cb862a em,.message_cb862a h1,.message_cb862a h2,.message_cb862a h3,.message_cb862a h4,.message_cb862a h5,.message_cb862a h6,.message_cb862a span,.message_cb862a strong {
background: revert;
color: revert;
display: inline;
font-style: normal;
font-weight: 400;
padding: 0;
text-overflow: ellipsis;
white-space: nowrap;
width: -moz-min-content;
width: min-content
}
.message_cb862a.unread_cb862a {
color: var(--text-strong)!important
}
.message_cb862a.descriptionMessage_cb862a {
font-style: italic
}
.username_cb862a {
color: var(--text-strong);
display: inline;
font-weight: 500;
line-height: 1.375rem
}
.username_cb862a,.usernameTagContainer_cb862a {
flex: 0 1 auto
}
.username_cb862a,.usernameOuterContainer_cb862a,.usernameTagContainer_cb862a {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.usernameOuterContainer_cb862a {
display: flex;
flex: 1 1 auto;
flex-direction: row;
gap: 4px;
justify-content: flex-start
}
.timestamp_cb862a {
align-items: baseline;
color: var(--text-muted);
flex-wrap: nowrap;
font-size: .75rem;
line-height: 1.5rem
}
.unreadDot_cb862a {
background-color: var(--interactive-text-active);
border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
height: 8px;
inset-inline-start: -8px;
position: absolute;
top: 20px;
width: 4px
}
.actionIcon_cb862a {
margin-inline:1px;transition: all .1s
}
.action_cb862a {
align-items: center;
display: flex;
height: 18px;
justify-content: center;
width: 18px
}
.action_cb862a:hover .actionIcon_cb862a {
margin-inline:0}
.actions_cb862a {
display: none;
width: -moz-fit-content;
width: fit-content
}
.groupedMessageUsername_cb862a {
flex-grow: 0;
flex-shrink: 1;
font-weight: 500;
line-height: 1.375rem;
max-width: 40%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.groupedMessageContent_cb862a {
flex: 1 0 60%;
overflow: hidden
}
.overflowText_cb862a {
color: var(--text-muted);
line-height: 20px;
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.messagesPopoutWrap__0aee3 {
box-sizing: border-box;
display: flex;
flex-direction: column;
overflow: hidden;
position: relative;
z-index: 0
}
.messagesPopoutWrap__0aee3 .mention {
pointer-events: none
}
.header__0aee3 {
border-bottom: 1px solid var(--border-subtle);
padding: 16px;
position: relative
}
.titleContainer__0aee3 {
gap: 8px
}
.loadMore__0aee3,.titleContainer__0aee3 {
align-items: center;
display: flex
}
.loadMore__0aee3 {
height: 16px;
justify-content: center;
opacity: 0
}
.loadMore__0aee3.showLoadMore__0aee3 {
opacity: 1
}
.messagesPopout__0aee3 {
padding-block:0;padding-inline:8px 0}
.scrollingFooterWrap__0aee3 {
position: relative
}
.emptyPlaceholder__0aee3 {
align-items: center;
display: flex;
flex: 0 0 auto;
flex-direction: column;
margin-bottom: 32px;
margin-top: 8px
}
.emptyPlaceholder__0aee3.bottom__0aee3 {
align-items: center;
margin-bottom: 0
}
.emptyPlaceholder__0aee3.bottom__0aee3 .image__0aee3 {
margin-top: 25px
}
.emptyPlaceholder__0aee3.loadingPlaceholder__0aee3 {
margin-top: 100px
}
.image__0aee3 {
background-position: 50%;
background-repeat: no-repeat;
background-size: 94px var(--custom-messages-popout-messages-popout-footer-height);
height: var(--custom-messages-popout-messages-popout-footer-height);
width: var(--custom-messages-popout-messages-popout-footer-height)
}
.body__0aee3 {
color: var(--text-default);
font-size: 16px;
font-weight: var(--font-weight-medium);
line-height: 20px;
margin-top: 20px;
text-align: center;
white-space: pre
}
.loadingPlaceholder__0aee3 {
margin-top: 240px
}
.enable-forced-colors .messagesPopoutWrap__0aee3 {
border: 2px solid CanvasText
}
.messagesGroupHeaderWrap__0aee3 {
align-items: center;
cursor: pointer;
height: 24px;
padding: 8px 8px 0
}
.messagesGroupHeaderWrap__0aee3:hover .messagesGroupHeader__0aee3 {
color: var(--text-strong)!important
}
.messagesGroupHeaderWrap__0aee3:nth-last-child(2) {
padding-bottom: 8px
}
.messagesGroupHeader__0aee3 {
display: flex
}
.chevron__0aee3 {
transition: transform .1s linear
}
.collapsed__0aee3 .chevron__0aee3 {
--custom-icon-collapse-rotate: -90deg;
transform: rotate(var(--custom-icon-collapse-rotate))
}
.emptyStateContainer__0aee3 {
align-items: center;
display: flex;
height: 100%;
width: 100%
}
.container_ea5470 {
align-items: stretch;
display: flex;
flex: 1 1 auto;
flex-direction: column;
justify-content: flex-start;
min-height: 0;
position: relative
}
.panelSpacing_ea5470 {
padding-bottom: var(--custom-app-panels-height)
}
.messageList_ea5470 {
border-radius: 0;
flex-grow: 1;
max-height: 100%;
width: 100%
}
.caughtUpContainer_ea5470 {
background-color: var(--background-feedback-positive);
display: flex;
flex-direction: row;
gap: 4px;
justify-content: center;
min-height: -moz-fit-content;
min-height: fit-content;
overflow: hidden;
padding-bottom: 8px;
padding-top: 8px;
position: relative
}
.caughtUpContainer_ea5470.hide_ea5470 {
display: none
}
.caughtUpContent_ea5470 {
display: flex;
flex-direction: row;
gap: 8px;
justify-content: center;
max-height: 26px;
overflow: hidden;
padding: 4px 12px;
width: -moz-fit-content;
width: fit-content
}
.full-motion .caughtUpContainer_ea5470 {
transition: opacity .3s ease
}
.full-motion .caughtUpContainer_ea5470.hide_ea5470 {
display: flex;
opacity: 0;
padding-bottom: 0;
padding-top: 0;
transition: padding .3s ease,opacity 2s ease-in
}
.full-motion .hide_ea5470 .caughtUpContent_ea5470 {
max-height: 0;
padding: 0;
transition: padding .3s ease,max-height .3s ease
}
.caughtUpText_ea5470 {
flex: 1 0 auto;
text-align: center
}
.full-motion .headerButton_ea5470 {
transition: all .3s ease
}
.headerButton_ea5470 {
align-items: center;
border-radius: var(--radius-xs);
display: flex;
justify-content: center;
padding: 4px
}
.headerButton_ea5470:hover {
background-color: var(--control-secondary-background-hover);
color: var(--text-strong)
}
.emptyStateContainer_ea5470 {
align-items: center;
display: flex;
height: 100%;
width: 100%
}
.filterHeaderWrap_ea5470 {
height: 24px;
padding: 8px 16px 6px
}
.container_fc71d3 {
border: 1px solid var(--background-base-low);
box-shadow: var(--shadow-high);
container-type: inline-size;
display: flex;
flex: 0 0 auto;
flex-direction: column;
height: calc(100vh - var(--custom-app-top-bar-height) - var(--custom-app-panels-height) - 1rem);
max-height: 640px;
min-height: 0;
min-width: 320px;
width: calc(var(--custom-guild-sidebar-width) - var(--custom-guild-list-width) + 10px)
}
.backgroundContainer_fc71d3,.container_fc71d3 {
border-radius: var(--radius-md);
overflow: hidden
}
.backgroundContainer_fc71d3 {
border: 1px solid var(--app-frame-border);
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0
}
.background_fc71d3 {
background: var(--background-gradient-highest,var(--background-base-low));
border-radius: var(--radius-md);
height: 100vh;
inset-inline-start: calc(var(--custom-guild-list-width)*-1);
position: absolute;
top: calc(var(--custom-app-top-bar-height)*-1);
width: 100vw
}
.container__3b95d {
height: 24px;
overflow: hidden;
padding: 8px;
pointer-events: none;
position: absolute;
z-index: 2
}
.bar__3b95d {
align-items: center;
border-radius: 12px;
box-shadow: 0 2px 6px var(--opacity-black-24);
color: var(--text-strong);
cursor: pointer;
display: flex;
font-family: var(--font-display);
font-size: 12px;
font-weight: var(--font-weight-semibold);
height: 24px;
justify-content: center;
line-height: 16px;
pointer-events: auto;
position: relative;
text-transform: uppercase;
-webkit-app-region: no-drag;
transition-delay: 0s;
transition-property: visibility
}
.bar__3b95d.hidden__3b95d {
pointer-events: none;
transition-delay: .2s;
visibility: hidden
}
.active__3b95d:active {
top: 1px
}
.unread__3b95d {
background-color: var(--background-surface-highest);
border: 1px solid var(--border-normal)
}
.mention__3b95d {
background-color: var(--background-feedback-notification);
border: 1px solid var(--border-subtle);
box-shadow: var(--shadow-medium);
box-sizing: border-box;
color: var(--text-overlay-light)
}
.mention__3b95d:active {
background-color: var(--red-430)
}
.icon__3b95d,.text__3b95d {
display: block
}
.icon__3b95d {
color: var(--icon-strong);
height: 12px;
margin-inline-start:2px;width: 12px
}
.enable-forced-colors .bar__3b95d {
background-color: Highlight;
border: 1px solid HighlightText;
color: HighlightText;
forced-color-adjust: none;
outline: 2px solid Canvas
}
.enable-forced-colors .mention__3b95d {
opacity: 1
}
.listItemWrapper__91816:active {
transform: translateY(1px) translateZ(0)
}
.listItemTooltip__91816,.listItemTooltipContent__91816 {
font-size: 16px;
font-weight: var(--font-weight-semibold);
line-height: 20px;
max-width: 196px;
word-wrap: break-word
}
.listItemTooltipContent__91816 {
color: var(--text-default)
}
.enable-forced-colors .listItemWrapper__91816 {
background-color: ButtonFace;
border: 1px solid CanvasText;
border-radius: 4px
}
.enable-forced-colors .listItemWrapper__91816:hover {
border-color: ButtonText
}
.enable-forced-colors .listItemWrapper__91816.selected__91816 {
background-color: HighlightText;
border-color: Highlight;
outline: 2px solid Highlight
}
.pill_ed9a5f {
inset-inline-start: 0;
position: absolute;
top: 0
}
.circleIconButton__5bc7e {
align-items: center;
background-color: var(--background-mod-subtle);
box-sizing: border-box;
color: var(--text-default);
cursor: pointer;
display: flex;
height: var(--guildbar-avatar-size);
justify-content: center;
transition: color .15s ease-out,background-color .15s ease-out;
width: var(--guildbar-avatar-size)
}
.circleIconButton__5bc7e.selected__5bc7e,.circleIconButton__5bc7e:hover:not(.disabled__5bc7e) {
background-color: var(--background-brand)
}
.circleIconButton__5bc7e.selected__5bc7e {
color: var(--white)
}
.circleIcon__5bc7e {
height: 20px;
width: 20px
}
.pill__5bc7e {
inset-inline-start: 0;
position: absolute;
top: 0
}
.custom-theme-background .circleIconButton__5bc7e {
background-color: var(--background-mod-strong)
}
.enable-forced-colors .circleIconButton__5bc7e,.enable-forced-colors .circleIconButton__5bc7e.selected__5bc7e {
background-color: ButtonFace;
color: ButtonText
}
.wrapper_d144f8 {
align-items: stretch;
bottom: -4px;
display: flex;
flex-direction: column;
position: absolute;
top: -16px;
inset-inline: 0;
pointer-events: none
}
.target_d144f8 {
flex: 1 0 50%
}
.target_d144f8.dragOver_d144f8:before {
background-color: var(--status-positive);
border-radius: 2px;
box-shadow: 0 0 3px var(--opacity-black-28);
content: "";
height: 4px;
position: absolute;
top: 10px;
inset-inline: 4px;
z-index: 1
}
.centerTarget_d144f8 {
flex: 1 0 50%
}
.centerTarget_d144f8.dragOver_d144f8:before {
background-color: var(--status-positive);
border-radius: 50%;
box-shadow: 0 0 3px var(--opacity-black-28);
content: "";
height: 16px;
inset-inline-start: 4px;
margin: auto;
position: absolute;
top: 28px;
width: 16px;
z-index: 1
}
.autoPointerEvents_d144f8 {
pointer-events: auto
}
.folderEndWrapper_d144f8 {
height: 0;
position: relative
}
.folderEndWrapper_d144f8.wrapperOver_d144f8 {
height: 24px
}
.folderTarget_d144f8 {
display: flex;
flex-direction: column;
height: 24px;
position: absolute;
top: -24px;
inset-inline: 0;
justify-content: space-between;
pointer-events: none
}
.folderTarget_d144f8 .dragOver_d144f8:before {
bottom: 0;
top: unset
}
.enable-forced-colors .centerTarget_d144f8.dragOver_d144f8:before,.enable-forced-colors .target_d144f8.dragOver_d144f8:before {
background-color: Highlight;
outline: 2px solid Canvas
}
.circleIconButton_a2be55 {
align-items: center;
box-sizing: border-box;
cursor: pointer;
display: flex;
height: 40px;
justify-content: center;
transition: color .15s ease-out,background-color .15s ease-out;
width: 40px
}
.geoRestrictedBadge_a2be55 {
background-color: var(--status-warning-background);
color: var(--status-warning-text)
}
.progressContainer__81ae5 {
height: 20px;
position: relative;
width: 20px
}
.downloadIcon__81ae5 {
color: var(--white);
height: 100%;
padding: 4px;
position: relative;
width: 100%
}
.pill__1f388 {
inset-inline-start: 0;
position: absolute;
top: 0
}
.downloadProgress__1f388 {
inset-inline-end: -2px;
position: relative;
top: -2px
}
.homeIcon__1f388 {
display: block;
height: 20px;
width: 28px
}
.tutorialContainer__1f388 {
position: relative
}
.guildSeparator__252b6 {
background-color: var(--app-frame-border);
border-radius: 1px;
height: 1px;
width: 32px
}
.fullWidth__252b6 {
width: 100%
}
.guildsError_e8d03f {
align-items: center;
background-color: var(--background-base-low);
border: 2px solid var(--background-feedback-critical);
border-radius: var(--radius-md);
box-sizing: border-box;
color: var(--interactive-text-active);
display: flex;
height: var(--guildbar-avatar-size);
justify-content: center;
transition: background-color .15s ease-out;
width: var(--guildbar-avatar-size)
}
.guildsError_e8d03f:hover {
background-color: var(--background-feedback-critical);
color: var(--text-feedback-critical)
}
.folderGroup__48112 {
--custom-folder-padding: calc((var(--guildbar-folder-size) - var(--guildbar-avatar-size))/2);
--custom-folder-preview-padding: var(--space-4);
--custom-folder-preview-gap: 2px;
--custom-folder-preview-guild-size: calc((var(--guildbar-folder-size) - var(--custom-folder-preview-padding)*2 - var(--custom-folder-preview-gap))/2);
position: relative;
width: var(--custom-guild-list-width)
}
.folderGroupBackground__48112 {
background-color: var(--background-mod-subtle);
border: 1px solid var(--border-muted);
border-radius: var(--radius-lg);
bottom: 0;
box-sizing: border-box;
inset-inline-start: calc(var(--custom-guild-list-padding) - (var(--guildbar-folder-size) - var(--guildbar-avatar-size))/2);
opacity: 0;
position: absolute;
top: 0;
transition: opacity var(--custom-folder-item-animation-duration) ease-out,background-color var(--custom-folder-item-animation-duration) ease-out;
width: var(--guildbar-folder-size)
}
.isExpanded__48112 .folderGroupBackground__48112 {
--custom-folder-background: color-mix(in srgb,var(--custom-folder-color),transparent 85%);
background-color: var(--custom-folder-background,var(--background-mod-subtle));
opacity: 1
}
.folderHeader__48112 {
box-sizing: border-box;
height: var(--guildbar-folder-size);
width: var(--guildbar-folder-size)
}
.folderGroup__48112[data-drop-hovering=true].isExpanded__48112 .folderGroupBackground__48112 {
background-color: var(--opacity-green-28);
border-color: var(--status-positive)
}
.folderGroup__48112[data-drop-hovering=true]:not(.isExpanded__48112) .folderHeader__48112 {
background-color: var(--opacity-green-28);
border-radius: 12px;
outline: 1px solid var(--status-positive)
}
.folderButton__48112,.folderButtonInner__48112 {
box-sizing: border-box;
cursor: pointer;
height: var(--guildbar-folder-size);
width: var(--guildbar-folder-size)
}
.folderButtonInner__48112 {
border-radius: var(--radius-md);
overflow: hidden;
position: relative
}
.folderButtonContent__48112 {
position: relative;
transform: translate3d(0,calc(var(--guildbar-folder-size)*-1),0)
}
.full-motion .folderButtonContent__48112 {
transition: transform var(--custom-folder-item-animation-duration) ease-out
}
.isExpanded__48112 .folderButtonContent__48112 {
transform: translateZ(0)
}
.folderDragPreview__48112 .folderIconWrapper__48112 {
display: none
}
.folderIconWrapper__48112 {
box-sizing: border-box;
padding: var(--custom-folder-padding)
}
.folderIcon__48112 {
align-items: center;
border-radius: var(--radius-md);
box-sizing: border-box;
color: var(--custom-folder-color,var(--background-brand));
display: flex;
height: var(--guildbar-avatar-size);
justify-content: center;
transition: background-color var(--custom-folder-item-animation-duration) ease-out;
width: var(--guildbar-avatar-size)
}
.folderIcon__48112:hover,.keyboard-mode .folderButton__48112:focus .folderIcon__48112 {
background-color: var(--background-mod-subtle)
}
.folderPreviewWrapper__48112 {
--custom-preview-background: color-mix(in srgb,var(--custom-folder-color),transparent 60%);
background-color: var(--custom-preview-background,var(--background-mod-subtle));
border-radius: var(--radius-lg);
box-sizing: border-box;
height: var(--guildbar-folder-size);
padding: var(--custom-folder-preview-padding);
width: var(--guildbar-folder-size)
}
.custom-theme-background .folderPreviewWrapper__48112 {
background-color: var(--custom-preview-background,var(--background-mod-strong))
}
.folderPreview__48112 {
box-sizing: border-box;
display: flex;
flex-wrap: wrap;
gap: 2px;
height: calc(var(--guildbar-folder-size) - var(--custom-folder-preview-padding)*2);
width: calc(var(--guildbar-folder-size) - var(--custom-folder-preview-padding)*2)
}
.folderPreviewGuildIcon__48112 {
box-sizing: border-box;
height: var(--custom-folder-preview-guild-size);
width: var(--custom-folder-preview-guild-size)
}
.folderPreviewGuildIcon__48112:first-child {
border-radius: 13px 4px 4px
}
.folderPreviewGuildIcon__48112:nth-child(2) {
border-radius: 4px 13px 4px 4px
}
.folderPreviewGuildIcon__48112:nth-child(3) {
border-radius: 4px 4px 4px 13px
}
.folderPreviewGuildIcon__48112:nth-child(4) {
border-radius: 4px 4px 13px
}
.folderPreviewGuildIconError__48112 {
align-items: center;
background: var(--background-feedback-critical);
color: var(--text-feedback-critical);
display: flex;
justify-content: center;
padding: 3px
}
.folderGuildsList__48112 {
overflow: hidden
}
.folderGuildsList__48112>:first-child {
margin-top: calc(var(--space-xs) - var(--custom-folder-padding))
}
.folderHeaderSmall__48112 {
--custom-folder-preview-padding: 3px;
--custom-folder-preview-guild-size: calc((var(--guildbar-avatar-size) - var(--custom-folder-preview-padding)*2 - var(--custom-folder-preview-gap))/2);
margin: calc((var(--guildbar-avatar-size) - var(--guildbar-folder-size))/2) 0
}
.isExpanded__48112 .folderHeaderSmall__48112 {
margin: 0
}
.refresh-fast-follow-avatars .folderButton__48112 {
padding: var(--custom-folder-padding)
}
.refresh-fast-follow-avatars .folderButtonInner__48112 {
height: var(--guildbar-avatar-size);
width: var(--guildbar-avatar-size)
}
.refresh-fast-follow-avatars .folderButtonContent__48112 {
transform: translate3d(0,calc(var(--guildbar-avatar-size)*-1),0)
}
.refresh-fast-follow-avatars .isExpanded__48112 .folderButtonContent__48112 {
transform: translateZ(0)
}
.refresh-fast-follow-avatars .folderIconWrapper__48112 {
padding: 0
}
.refresh-fast-follow-avatars .folderButton__48112:focus .folderIcon__48112,.refresh-fast-follow-avatars .folderIcon__48112:hover {
background-color: var(--opacity-white-12)
}
.refresh-fast-follow-avatars .folderPreviewWrapper__48112 {
border-radius: var(--radius-md);
height: var(--guildbar-avatar-size);
width: var(--guildbar-avatar-size)
}
.refresh-fast-follow-avatars .folderPreview__48112 {
height: calc(var(--guildbar-avatar-size) - var(--custom-folder-preview-padding)*2);
width: calc(var(--guildbar-avatar-size) - var(--custom-folder-preview-padding)*2)
}
.refresh-fast-follow-avatars .folderPreviewGuildIcon__48112:first-child {
border-radius: 10px 4px 4px
}
.refresh-fast-follow-avatars .folderPreviewGuildIcon__48112:nth-child(2) {
border-radius: 4px 10px 4px 4px
}
.refresh-fast-follow-avatars .folderPreviewGuildIcon__48112:nth-child(3) {
border-radius: 4px 4px 4px 10px
}
.refresh-fast-follow-avatars .folderPreviewGuildIcon__48112:nth-child(4) {
border-radius: 4px 4px 10px
}
.isHovering__48112 {
display: block
}
.dragInner__87847 {
background-color: var(--background-mod-normal);
border: 1px dashed var(--border-subtle);
border-radius: 12px;
box-sizing: border-box;
height: var(--guildbar-avatar-size);
width: var(--guildbar-avatar-size)
}
.placeholderMask__87847 {
align-items: center;
display: flex;
justify-content: center
}
.isFolder__87847 {
height: var(--guildbar-folder-size);
width: var(--guildbar-folder-size)
}
.refresh-fast-follow-avatars .isFolder__87847 {
height: var(--guildbar-avatar-size);
margin: calc((var(--guildbar-folder-size) - var(--guildbar-avatar-size))/2);
width: var(--guildbar-avatar-size)
}
.blobContainer_e5445c:active {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
position: relative;
transform: translateY(1px) translateZ(0)
}
.pill_e5445c {
inset-inline-start: 0;
position: absolute;
top: 0
}
.sorting_e5445c {
pointer-events: none
}
@keyframes wobble_e5445c {
0%,to {
transform: rotate(0)
}
25% {
transform: rotate(2deg)
}
75% {
transform: rotate(-2deg)
}
}
.full-motion .wobble_e5445c {
animation-duration: .2s;
animation-iteration-count: infinite;
animation-name: wobble_e5445c;
transform-origin: 50% 30%
}
.enable-forced-colors .blobContainer_e5445c {
background-color: ButtonFace;
border: 1px solid CanvasText;
border-radius: 4px;
margin-bottom: -2px
}
.enable-forced-colors .blobContainer_e5445c:hover {
border-color: ButtonText
}
.enable-forced-colors .blobContainer_e5445c.selected_e5445c {
background-color: HighlightText;
border-color: Highlight;
outline: 2px solid Highlight
}
.pauseBackground_d70e0d {
align-self: center;
background-color: var(--background-mod-strong);
border-radius: 50%;
display: flex;
height: 16px;
justify-content: center;
justify-self: center;
overflow: hidden;
width: 16px
}
.pause_d70e0d {
align-self: center;
color: var(--interactive-text-active)
}
@value popoutBackgroundColor var(--background-surface-highest);@value popoutWidth 256px;.pendingFolderButtonIcon__93fc9 {
align-items: center;
background-color: var(--background-mod-subtle);
border-radius: var(--radius-md);
box-sizing: border-box;
color: var(--text-default);
display: flex;
height: var(--guildbar-avatar-size);
justify-content: center;
transition: background-color .2s ease-out;
width: var(--guildbar-avatar-size)
}
.pendingFolderButtonIcon__93fc9:hover {
background-color: var(--background-mod-normal)
}
.container__93fc9 {
display: flex;
flex-direction: column
}
.popoutAnchor__93fc9 {
align-self: center;
width: 48px
}
.popoutContainer__93fc9 {
background: var(--background-surface-highest);
border-radius: var(--radius-md);
box-shadow: var(--shadow-border),var(--shadow-high);
display: flex;
flex-direction: column;
position: relative;
width: 256px
}
.popoutCaret__93fc9,.popoutCaretLeft__93fc9 {
border: 6px solid;
border-color: var(--background-surface-highest);
bottom: -6px;
height: 0;
inset-inline-start: 18px;
position: absolute;
transform: rotate(45deg);
width: 0;
z-index: 1
}
.popoutCaretLeft__93fc9 {
inset-inline-start: -6px;
top: 18px
}
.popoutContent__93fc9 {
box-sizing: border-box;
padding: 16px;
width: 256px;
z-index: 2
}
.coachmarkTextContainer__93fc9 {
display: flex;
flex-direction: column;
gap: 8px;
margin-bottom: 16px
}
.wrapper_ef3116 {
background-color: var(--background-base-lowest);
display: flex;
flex-direction: column;
flex-shrink: 0;
margin-bottom: calc(var(--custom-app-panels-height, 0) + var(--space-xs) - 16px);
-webkit-mask: linear-gradient(180deg,#000,transparent) bottom /100% 16px no-repeat,linear-gradient(#000,#000) top /100% calc(100% - 15px) no-repeat;
mask: linear-gradient(180deg,#000,transparent) bottom /100% 16px no-repeat,linear-gradient(#000,#000) top /100% calc(100% - 15px) no-repeat;
overflow: hidden;
position: relative;
width: var(--custom-guild-list-width)
}
.wrapper_ef3116.hidden_ef3116 {
visibility: hidden;
width: 0
}
.refresh-fast-follow-guild-bg .wrapper_ef3116 {
background-color: var(--app-frame-background)
}
@supports (grid-template-columns: subgrid) and (white-space-collapse:collapse) {
.wrapper_ef3116 {
grid-area:guildsList
}
}
.platform-osx .wrapper_ef3116 {
margin-top: 0
}
.tree_ef3116 {
position: relative
}
.itemsContainer_ef3116,.tree_ef3116 {
display: flex;
flex-direction: column;
height: 100%
}
.itemsContainer_ef3116 {
justify-content: space-between
}
.scroller_ef3116 {
flex: 0 1 auto;
padding: 12px 0 0;
padding-bottom: calc(var(--space-xs, 8px) + 16px);
padding-top: 0;
-webkit-user-select: none;
-moz-user-select: none;
user-select: none
}
.scroller_ef3116>[hidden] {
margin-top: calc(var(--space-xs)*-1);
visibility: hidden
}
.scroller_ef3116.scrolling_ef3116>* {
pointer-events: none
}
.platform-osx .scroller_ef3116,.platform-win .scroller_ef3116 {
padding-top: 4px
}
.platform-overlay .scroller_ef3116 {
padding-top: 12px
}
.unreadMentionsIndicatorBottom_ef3116,.unreadMentionsIndicatorTop_ef3116 {
box-sizing: border-box;
height: auto;
inset-inline: 0;
overflow: hidden;
padding: 8px;
pointer-events: none;
position: absolute;
width: var(--custom-guild-list-width);
z-index: 10
}
.unreadMentionsIndicatorTop_ef3116 {
padding-top: 8px
}
.unreadMentionsIndicatorBottom_ef3116 {
padding-bottom: calc(var(--space-xs, 8px) + 16px)
}
.unreadMentionsBar_ef3116:before {
position: absolute;
top: 0;
inset-inline: -8px;
bottom: 0;
content: ""
}
.unreadMentionsIndicatorTop_ef3116 {
top: 0
}
.unreadMentionsIndicatorTop_ef3116 .unreadMentionsBar_ef3116:before {
top: -8px
}
.unreadMentionsIndicatorBottom_ef3116 {
bottom: 0
}
.unreadMentionsIndicatorBottom_ef3116 .unreadMentionsBar_ef3116:before {
bottom: -8px
}
.unreadMentionsFixedFooter_ef3116 {
bottom: 0
}
.discoveryIcon_ef3116 {
color: var(--text-default)
}
.platform-osx .unreadMentionsIndicatorTop_ef3116 .unreadMentionsBar_ef3116 {
-webkit-app-region: unset
}
.custom-theme-background .itemsContainer_ef3116 {
background: var(--background-gradient-app-frame,var(--background-base-lowest))
}
.bottomRailNotifCenterButton_ef3116 {
padding-bottom: 12px;
padding-top: 8px
}
.bottomRailNotifCenterButton_ef3116:before {
background: linear-gradient(to bottom,transparent,var(--background-base-lowest) 75%,var(--background-base-lowest) 100%);
content: "";
height: 16px;
position: absolute;
translate: 0 -22px;
width: 100%
}
.custom-theme-background .bottomRailNotifCenterButton_ef3116 {
padding-top: 12px
}
.custom-theme-background .bottomRailNotifCenterButton_ef3116:before {
display: none
}
.unreadMentionsFixedFooterBottomNotifCenterEntrypoint_ef3116 {
bottom: 76px
}
.content__65844 {
align-items: center;
display: flex;
gap: var(--space-xs);
justify-content: center
}
.clickable_c69b6d {
cursor: pointer
}
.containerDefault_c69b6d,.containerDragAfter_c69b6d,.containerDragBefore_c69b6d,.containerUserOver_c69b6d {
position: relative;
transition: opacity .2s ease-in-out
}
.containerDragAfter_c69b6d:after,.containerDragBefore_c69b6d:before {
background-color: var(--green-360);
border-radius: 2px;
box-shadow: 0 0 3px var(--opacity-black-40);
content: "";
height: 4px;
inset-inline: 8px 0;
position: absolute;
z-index: 1
}
.containerDragBefore_c69b6d:before {
top: -2px
}
.containerDragAfter_c69b6d:after {
bottom: -2px
}
.containerUserOver_c69b6d:after {
background-color: hsl(var(--green-360-hsl)/.1);
border: 2px solid hsl(var(--green-360-hsl)/.5);
border-radius: 4px;
box-sizing: border-box;
content: "";
position: absolute;
top: 0;
inset-inline: 8px 0;
bottom: 0;
z-index: 1
}
.iconBase_c69b6d {
cursor: pointer;
line-height: 0;
position: relative
}
.iconItem_c69b6d {
display: none;
margin-inline-start:4px}
.iconItem_c69b6d.alwaysShown_c69b6d {
display: block
}
.containerDefault_c69b6d.selected_c69b6d .iconNoChannelInfo_c69b6d,.iconVisibility_c69b6d:focus .iconItem_c69b6d,.iconVisibility_c69b6d:focus-within .iconItem_c69b6d {
display: block
}
.containerDefault_c69b6d.selected_c69b6d .iconWithChannelInfo_c69b6d {
display: none
}
.iconItem_c69b6d:focus,.iconItem_c69b6d:focus-within {
display: block;
position: relative
}
.disableClick_c69b6d {
pointer-events: none
}
.disabled_c69b6d>div {
opacity: .3
}
.actionIcon_c69b6d {
display: block;
height: 16px;
width: 16px
}
.actionIcon_c69b6d:active {
transform: translateY(.5px)
}
.actionIcon_c69b6d,.actionIcon_c69b6d:hover {
color: var(--icon-muted)
}
.channelInfo_c69b6d {
display: block;
margin-inline-start:12px}
.iconVisibility_c69b6d:focus .channelInfo_c69b6d,.iconVisibility_c69b6d:focus-within .channelInfo_c69b6d {
display: none
}
.actionIcon_c69b6d {
color: var(--interactive-text-default)
}
.iconItem_c69b6d:hover .actionIcon_c69b6d {
color: var(--interactive-text-hover)
}
.actionIcon_c69b6d:active {
color: var(--interactive-text-active)
}
.iconLive_c69b6d {
color: var(--text-feedback-positive)!important
}
.summary_c69b6d {
margin-inline-start:40px}
.subtitleHasThreads_c69b6d {
color: var(--text-brand)
}
@media (hover: hover) {
.iconVisibility_c69b6d:hover .iconItem_c69b6d {
display:block
}
.iconVisibility_c69b6d:hover .channelInfo_c69b6d {
display: none
}
}
.selectedChannel_c69b6d .actionIcon_c69b6d,.selectedChannel_c69b6d .actionIcon_c69b6d:hover {
color: var(--icon-strong)
}
.voiceChannelHighlightContainer_c69b6d {
position: relative
}
.voiceChannelHighlightBorder_c69b6d {
background-color: var(--icon-feedback-positive);
bottom: 4px;
inset-inline-start: 0;
position: absolute;
top: 2px;
width: 2px
}
.voiceChannelHighlightGlow_c69b6d {
background: radial-gradient(ellipse 40px 50% at left center,rgba(0,158,66,.125) 0,rgba(0,158,66,0) 100%);
bottom: -10px;
inset-inline-start: 0;
position: absolute;
top: -12px;
width: 40px
}
.enable-forced-colors .actionIcon_c69b6d {
color: ButtonText
}
.enable-forced-colors .iconBase_c69b6d {
background-color: ButtonFace;
border: 1px solid ButtonFace;
border-radius: 4px;
color: ButtonText
}
.enable-forced-colors .iconBase_c69b6d:hover {
border-color: ButtonText
}
.enable-forced-colors .iconBase_c69b6d:hover .actionIcon_c69b6d {
color: ButtonText
}
.enable-forced-colors .containerDragAfter_c69b6d:after,.enable-forced-colors .containerDragBefore_c69b6d:before,.enable-forced-colors .containerUserOver_c69b6d:after {
background-color: Highlight;
outline: 1px solid Canvas
}
.background__6343b {
box-sizing: border-box;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: center;
object-position: center;
width: 100%
}
.gradientRoleColorsImage__6343b {
padding: 0 var(--space-16)
}
.secondaryButton__652ee {
min-width: 0;
width: auto
}
.buttonInner__652ee {
align-items: center;
display: flex;
justify-content: center
}
.buttonWrapper__652ee {
flex-grow: 1
}
.noGrow__652ee {
flex: 0 0 auto
}
.dot__652ee {
margin: 0 3px
}
.boostIcon__652ee {
margin-top: 1px;
margin-inline-end:-3px;vertical-align: top
}
.container__6f9f7 {
display: flex;
gap: var(--space-8)
}
.tooltipContainer__6f9f7 {
display: flex;
flex-direction: column;
text-align: center
}
.primaryButton__6f9f7 {
flex-grow: 1
}
.secondaryButton__6f9f7 {
min-width: 0;
width: auto
}
.dot__6f9f7 {
margin: 0 6px;
margin-inline-end:4px}
.boost__6f9f7 {
align-self: center;
justify-self: center
}
.confettiCanvas__8fcbd {
height: 100%;
position: absolute;
width: 100%
}
.close__8fcbd {
inset-inline-end: var(--space-16);
position: absolute;
top: var(--space-16)
}
.modal__8fcbd {
margin: 0;
overflow: hidden;
width: 440px
}
.modalContentContainer__8fcbd {
margin: 0;
overflow: hidden;
padding: 0!important
}
.container__8fcbd,.contentContainer__8fcbd {
display: flex;
flex-direction: column
}
.contentContainer__8fcbd {
align-items: center;
padding: var(--space-24) var(--space-48);
text-align: center
}
.description__8fcbd {
margin-top: var(--space-8)
}
.button__8fcbd {
margin-top: var(--space-16)
}
.image__8fcbd {
height: 228px
}
.imageContainer_a1bfef {
height: 100%;
overflow: hidden;
position: relative;
width: 100%
}
.image_a1bfef {
border-radius: var(--radius-sm);
box-sizing: border-box;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
width: 100%
}
.gameServerHostingImage_a1bfef {
transform: scale(2)
}
.levelImage_a1bfef {
-o-object-fit: cover;
object-fit: cover
}
.badge_bb93f2 {
background-color: var(--brand-500)
}
.container__877f0 {
position: relative
}
.lottieContainer__877f0 {
border-radius: var(--radius-sm);
inset: 0;
bottom: 1px;
overflow: hidden;
position: absolute;
top: 1px
}
.lottie__877f0 {
height: 34px
}
.textImportant__877f0 {
color: var(--text-strong)
}
.container__0d0f9 {
border-bottom: 1px solid var(--border-subtle);
cursor: pointer;
display: flex;
flex-direction: column;
margin-block:0;margin-inline:8px 0;padding: var(--space-xxs) var(--space-xxs) var(--space-sm);
position: relative
}
.container__0d0f9:hover .progressContainer__0d0f9 {
transform: scale(1.02,1.1)
}
.container__0d0f9:hover .progress__0d0f9 {
background: linear-gradient(270deg,rgba(255,115,250,.7),rgba(255,115,250,.25))
}
.container__0d0f9:hover .boostCountText__0d0f9 {
opacity: 1
}
.container__0d0f9:after {
display: none
}
.containerWithMargin__0d0f9 {
margin-bottom: var(--custom-guild-boosting-sidebar-display-conditional-bottom-margin)
}
.container__0d0f9:after {
border-bottom: 1px solid var(--border-subtle);
bottom: 0;
content: "";
inset-inline: 8px 0;
position: absolute
}
.contentContainer__0d0f9 {
position: relative
}
.progressContainer__0d0f9 {
background: var(--background-gradient-highest,var(--background-base-low));
border-radius: var(--radius-round);
display: flex;
height: 26px
}
.textContainer__0d0f9 {
align-items: center;
display: flex;
flex: 1;
flex-direction: row;
inset: 0 var(--space-8);
justify-content: space-between;
position: absolute;
z-index: 1
}
.textContentContainer__0d0f9 {
align-items: center;
display: flex;
flex-direction: row;
gap: 2px
}
.text__0d0f9 {
color: var(--text-default)
}
.boostCountText__0d0f9 {
opacity: .7
}
.progress__0d0f9 {
background: linear-gradient(270deg,rgba(255,115,250,.4),rgba(255,115,250,.1));
border-radius: var(--radius-round);
box-shadow: 0 1px 4px 0 rgba(0,0,0,.14),inset 0 0 4.6px 0 rgba(255,115,250,.2);
inset: 2px;
position: absolute
}
.progressLow__0d0f9 {
border-end-end-radius: 0;
border-start-end-radius: 0
}
.enable-forced-colors .container__0d0f9 {
background-color: Canvas;
border: 1px solid ButtonText;
border-radius: 4px
}
.full-motion .progressContainer__0d0f9 {
transition: transform .2s ease
}
.full-motion .boostCountText__0d0f9 {
transition: color .2s ease
}
.containerDefault__29444,.containerDragAfter__29444,.containerDragBefore__29444,.containerUserOver__29444 {
padding-top: var(--custom-category-channel-space-before-category);
position: relative
}
.containerDefault__29444:active,.containerDragAfter__29444:active,.containerDragBefore__29444:active,.containerUserOver__29444:active {
transform: translateZ(0)
}
.containerDragAfter__29444:before,.containerDragBefore__29444:before {
background-color: var(--green-360);
border-radius: 2px;
box-shadow: 0 0 3px var(--opacity-black-40);
content: "";
height: 4px;
inset-inline: 8px 0;
position: absolute;
z-index: 1
}
.containerDragBefore__29444:before {
top: -2px
}
.containerDragAfter__29444:before {
bottom: -2px
}
.containerUserOver__29444:after {
background-color: hsl(var(--green-360-hsl)/.1);
border: 2px solid hsl(var(--green-360-hsl)/.5);
border-radius: 4px;
box-sizing: border-box;
content: "";
position: absolute;
top: 0;
inset-inline: 8px 0;
bottom: 0;
z-index: 1
}
.disableClick__29444 {
pointer-events: none
}
.addButton__29444 {
display: none;
height: 16px;
width: 16px
}
.addButton__29444.forceVisible__29444,.iconVisibility__29444:hover .addButton__29444 {
display: block
}
.addButton__29444:focus,.addButton__29444:focus-within {
display: block;
position: relative
}
.addButtonIcon__29444:hover {
color: var(--interactive-text-hover)
}
.addButtonIcon__29444:active {
color: var(--interactive-text-active);
transform: translateY(.5px)
}
.wrapperCommon__29444 {
box-sizing: border-box;
color: var(--channels-default);
cursor: default;
height: 24px;
justify-content: space-between;
padding-inline:var(--space-md) calc(var(--space-md) - var(--space-xs));position: relative
}
.wrapperCommon__29444,.wrapperCommon__29444 .mainContent__29444 {
align-items: center;
display: flex;
flex-direction: row
}
.wrapperCommon__29444 .mainContent__29444 {
gap: 4px;
height: 100%
}
.wrapperCommon__29444 .mainContent__29444:before {
display: none
}
.wrapperCommon__29444 .mainContent__29444 .name__29444 {
flex: unset;
min-width: 0
}
.wrapperCommon__29444 .icon__29444 {
flex-shrink: 0;
inset-inline-start: unset;
position: relative;
top: unset
}
.wrapper__29444,.wrapperStatic__29444 {
}
.clickable__29444 {
cursor: pointer
}
.children__29444 {
align-items: center;
display: flex;
flex: 0 0 auto;
justify-content: center
}
.children__29444:empty {
display: none
}
.mainContent__29444 {
flex: 1 1 auto;
overflow: hidden
}
.mainContent__29444:before {
content: "";
display: block;
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0
}
.icon__29444 {
height: 12px;
inset-inline-start: 2px;
position: absolute;
top: 6px;
transition: transform .1s linear;
width: 12px
}
.collapsed__29444 .icon__29444 {
--custom-icon-collapse-rotate: -90deg;
transform: rotate(var(--custom-icon-collapse-rotate))
}
.wrapper__29444.muted__29444,.wrapper__29444.muted__29444 .name__29444 {
color: var(--text-muted)
}
.wrapper__29444.muted__29444 .icon__29444,.wrapper__29444.muted__29444 .name__29444 {
opacity: .5
}
.wrapper__29444.muted__29444:hover .icon__29444,.wrapper__29444.muted__29444:hover .name__29444,.wrapper__29444:hover .icon__29444,.wrapper__29444:hover .name__29444 {
color: var(--interactive-text-hover)
}
.dismissWrapper__29444 {
z-index: 2
}
.dismissButton__29444 {
cursor: pointer;
opacity: .8;
z-index: 2
}
.dismissButton__29444:hover {
opacity: 1
}
.dismiss__29444 {
height: 16px;
width: 16px
}
.voiceChannelsButton__29444 {
align-items: center;
border: 2px solid var(--border-subtle);
border-radius: 8px;
color: var(--interactive-text-active);
cursor: pointer;
display: flex;
flex-direction: row;
justify-content: center;
margin-top: 8px;
margin-inline:16px 8px;padding: 7px 8px
}
.voiceChannelsButton__29444:hover {
background: var(--background-mod-normal)
}
.voiceChannelsToggleIcon__29444 {
margin-inline-end:8px}
.refreshVoiceChannelsButton__29444 {
margin-inline-start:var(--space-md);margin-bottom: var(--space-xxs);
margin-top: var(--space-xxs);
width: calc(100% - var(--space-md) - var(--space-8))
}
.refreshVoiceChannelsButtonInner__29444 {
align-items: center;
display: flex;
justify-content: center
}
.enable-forced-colors .icon__29444,.enable-forced-colors .name__29444 {
color: ButtonText!important;
forced-color-adjust: none
}
.enable-forced-colors .addButtonIcon__29444 {
background-color: ButtonFace;
border: 1px solid ButtonFace
}
.enable-forced-colors .addButtonIcon__29444:hover {
border-color: ButtonText
}
.enable-forced-colors .wrapper__29444 {
background-color: ButtonFace;
border-bottom: 1px solid ButtonFace
}
.enable-forced-colors .wrapper__29444:hover {
border-color: ButtonText
}
.enable-forced-colors .wrapper__29444.muted__29444 {
opacity: .4
}
.enable-forced-colors .wrapper__29444.muted__29444:focus,.enable-forced-colors .wrapper__29444.muted__29444:hover {
opacity: 1
}
.enable-forced-colors .containerDragAfter__29444:before,.enable-forced-colors .containerDragBefore__29444:before,.enable-forced-colors .containerUserOver__29444:after {
background-color: Highlight;
outline: 1px solid Canvas
}
.scroller__629e4 {
margin-bottom: var(--space-4);
margin-inline-end:1px;padding-inline-end:8px;padding-bottom: 16px;
z-index: 1
}
.scroller__629e4::-webkit-scrollbar-track {
margin-bottom: 16px
}
.unread__629e4 {
inset-inline: 0
}
.unreadBar__629e4:before {
content: "";
position: absolute;
top: 0;
inset-inline: -8px;
bottom: 0
}
.unreadBottom__629e4 {
bottom: calc(var(--custom-app-panels-height, 0) + var(--space-8))
}
.unreadBottom__629e4 .unreadBar__629e4:before {
bottom: -8px
}
.positionedContainer__629e4 {
position: relative
}
.unreadTop__629e4 {
top: 0
}
.unreadTop__629e4 .unreadBar__629e4:before {
top: -8px
}
.voiceUserSummary__629e4 {
align-items: center;
box-sizing: border-box;
display: flex;
height: 34px;
padding-inline-start:16px}
.sectionDivider__629e4 {
background-color: var(--border-subtle);
height: 1px;
margin-top: calc(var(--space-sm) - 1px);
margin-inline-start:var(--space-md);width: calc(100% - var(--space-md) - var(--space-md) + 9px)
}
.sectionDividerWithBottom__629e4 {
margin-bottom: 8px
}
.refresh-fast-follow-distinct-borders .sectionDivider__629e4 {
background-color: var(--app-frame-border)
}
.dynamicGraphicContainer__47887 {
border-radius: var(--radius-sm);
height: 100%
}
.dynamicGraphicForegroundImage__47887 {
height: 100%
}
.multiLineTitleHack__53030 {
white-space: pre-line
}
.wrapper_fce7ca {
isolation: isolate
}
.withGradient_fce7ca,.wrapper_fce7ca {
overflow: hidden;
position: relative
}
.withGradient_fce7ca:after {
background-image: linear-gradient(90deg,#394aff,#e901d9);
border-radius: inherit;
bottom: 1px;
content: "";
inset-inline: 0;
opacity: .16;
position: absolute;
top: 1px;
transition: opacity .125s;
z-index: 0
}
.withGradient_fce7ca:hover:after {
opacity: .2
}
.text_fce7ca {
color: var(--text-strong)!important
}
.icon_fce7ca {
color: var(--icon-subtle)!important
}
.shine_fce7ca {
background-image: linear-gradient(90deg,hsla(0,0%,100%,0) 25%,hsla(0,0%,100%,.7) 50%,hsla(0,0%,100%,0) 75%);
height: var(--custom-shine-dimensions);
inset-inline-end: calc(100% + var(--custom-shine-rotated-dimensions-delta));
opacity: .2;
pointer-events: none;
position: absolute;
top: 50%;
transform-origin: 50%;
width: var(--custom-shine-dimensions);
z-index: 3
}
.progressBarContainer_baf530 {
cursor: pointer;
display: flex;
flex-direction: column;
gap: 4px;
margin-block:-8px 0;margin-inline:8px 0;padding: 8px
}
.progressBarText_baf530 {
align-items: center;
display: flex;
justify-content: space-between
}
.progressBar_baf530 {
height: 4px;
margin-top: 4px
}
.rightContainer_baf530,.rightText_baf530 {
align-items: center;
display: flex
}
.rightText_baf530 {
gap: 2px
}
.arrow_baf530 {
color: var(--text-default);
flex-shrink: 0
}
.divider_baf530 {
background-color: var(--border-subtle);
height: 1px;
margin: 4px 0;
width: 100%
}
.previewChannelRow_d59199.selected_d59199:focus-within .closeButton_d59199,.previewChannelRow_d59199.selected_d59199:hover .closeButton_d59199 {
display: block
}
.previewChannelRow_d59199.selected_d59199:focus-within .money_d59199,.previewChannelRow_d59199.selected_d59199:focus-within .newBadge_d59199,.previewChannelRow_d59199.selected_d59199:hover .money_d59199,.previewChannelRow_d59199.selected_d59199:hover .newBadge_d59199 {
display: none
}
.previewChannelRow_d59199.phantomPreview_d59199 {
margin-inline-start:7px;overflow: hidden
}
.phantomPreview_d59199.selected_d59199 .shopIcon_d59199,.phantomPreview_d59199.selected_d59199:hover .shopIcon_d59199 {
color: var(--interactive-text-active)
}
.theme-light .phantomPreview_d59199 .previewChannelRowContent_d59199 {
background: hsla(0,0%,96%,.4);
border: 1px solid var(--border-muted)
}
.theme-light .phantomPreview_d59199 .previewChannelRowContent_d59199:hover,.theme-light .phantomPreview_d59199 .selected_d59199 .previewChannelRowContent_d59199 {
background: var(--white);
border: 1px solid var(--interactive-text-active)
}
.theme-dark .phantomPreview_d59199 {
padding: 1px
}
.theme-dark .phantomPreview_d59199 .previewChannelRowContent_d59199 {
background: var(--custom-guild-shop-channel-row-gradient);
position: relative
}
.theme-dark .phantomPreview_d59199 .previewChannelRowContent_d59199:before {
background: var(--custom-guild-shop-channel-row-border-gradient);
border-radius: inherit;
content: "";
position: absolute;
top: -1px;
inset-inline: -1px;
bottom: -1px;
z-index: -1
}
.theme-dark .phantomPreview_d59199 .previewChannelRowContent_d59199:hover {
background: var(--custom-guild-shop-channel-row-gradient-hover);
box-shadow: var(--custom-guild-shop-channel-row-glow)
}
.gifSection_d59199 {
align-items: center;
display: flex;
gap: 6px;
margin-inline-start:auto}
.money_d59199 {
display: none;
inset-inline-end: 4px;
max-height: 48px;
position: absolute
}
.closeButton_d59199 {
align-items: center;
color: var(--interactive-text-default);
display: none;
margin-inline-start:auto}
.phantomPreview_d59199 .money_d59199,.phantomPreview_d59199 .newBadge_d59199 {
display: block
}
.newBadge_d59199 {
color: var(--brand-560);
display: none
}
.enable-forced-colors .closeButton_d59199 {
background-color: ButtonFace;
color: ButtonText
}
.wrapper__260e1 {
align-items: stretch;
background-color: var(--background-base-low);
border: 1px solid var(--border-normal);
border-radius: var(--radius-md);
box-sizing: border-box;
color: var(--text-subtle);
display: grid;
flex: 0 0 auto;
font-size: 12px;
font-weight: var(--font-weight-medium);
grid-template-columns: 1fr auto;
height: 20px;
justify-content: center;
line-height: 18px;
overflow: hidden
}
.total__260e1,.users__260e1 {
display: block;
text-align: center
}
.users__260e1 {
align-items: center;
background-color: var(--background-base-low);
box-sizing: border-box;
display: flex;
font-variant-numeric: tabular-nums;
padding: 0 var(--space-4);
width: 28px
}
.users__260e1.video__260e1 {
width: 48px
}
.users__260e1.video__260e1.extraLong__260e1 {
width: 56px
}
.users__260e1.extraLong__260e1 {
width: auto
}
.total__260e1 {
background-color: var(--background-mod-strong);
box-sizing: border-box;
font-variant-numeric: tabular-nums;
padding-block:0;padding-inline:2px 4px;position: relative;
width: 20px
}
.total__260e1.extraLong__260e1 {
width: auto
}
.total__260e1:after {
border-bottom: 0 solid transparent;
border-inline-end:6px solid transparent;border-inline-end-color:var(--background-mod-strong);border-top: 20px solid transparent;
content: "";
height: 0;
inset-inline-start: -6px;
position: absolute;
top: 0;
width: 0
}
.videoIcon__260e1 {
height: 16px;
margin-inline-end:4px;width: 16px
}
.popoutHeaderContainer__260e1 .users__260e1 {
background-color: var(--background-mod-strong)
}
.iconBase__933a1 {
cursor: pointer;
line-height: 0;
position: relative
}
.mentionsBadge__933a1 {
pointer-events: none
}
.popover__1bad5 {
max-width: unset;
padding: 0;
text-align: unset;
width: 260px
}
.inner__1bad5 {
align-items: start;
justify-content: space-between;
padding: var(--space-8);
position: relative
}
.inner__1bad5,.list__1bad5 {
flex-direction: column;
gap: 2px;
width: 100%
}
.inner__1bad5,.list__1bad5,.row__1bad5 {
box-sizing: border-box;
display: flex
}
.row__1bad5 {
align-items: center;
border-radius: var(--space-xs);
flex-direction: row;
gap: var(--space-xs);
height: 40px;
padding: var(--space-xs)
}
.row__1bad5.clickable__1bad5 {
cursor: pointer
}
.row__1bad5.clickable__1bad5:hover {
background-color: var(--background-mod-subtle)
}
.row__1bad5.clickable__1bad5:hover .userIconContainer__1bad5 {
color: var(--text-default)
}
.row__1bad5 :disabled {
cursor: not-allowed
}
.row__1bad5 .avatar__1bad5,.row__1bad5 .icon__1bad5 {
flex-shrink: 0
}
.row__1bad5 .leading__1bad5 {
align-items: center;
display: flex;
height: 24px;
justify-content: center;
width: 24px
}
.row__1bad5 .name__1bad5 {
flex-grow: 1
}
.row__1bad5 .dots__1bad5 {
align-items: center;
border-radius: 2px;
display: flex;
flex-direction: row;
height: 16px;
justify-content: center;
margin: 2px 0
}
.row__1bad5 .dots__1bad5,.row__1bad5 .status__1bad5 {
padding: 0 var(--space-xxs)
}
.row__1bad5 .dots__1bad5,.row__1bad5 .status__1bad5,.row__1bad5 .userIconContainer__1bad5 {
flex-shrink: 0
}
.row__1bad5 .userIconContainer__1bad5 {
align-items: center;
color: var(--icon-subtle);
display: flex;
height: 24px;
justify-content: center;
width: 24px
}
.animation_f2170c {
overflow: hidden
}
.clickable_f2170c:hover .icon_f2170c.userIcon_f2170c,.clickable_f2170c:hover .label_f2170c {
color: var(--interactive-text-hover)
}
.clickable_f2170c:active .content_f2170c {
background: var(--interactive-background-active)
}
.content_f2170c {
display: flex
}
.label_f2170c {
flex-grow: 1
}
.icon_f2170c,.label_f2170c {
color: var(--channels-default)
}
.close_f2170c,.icon_f2170c,.leading_f2170c {
flex-shrink: 0
}
.close_f2170c {
height: 16px;
width: 16px
}
.close_f2170c:hover .icon_f2170c {
color: var(--interactive-text-hover)
}
@property --custom-voice-invite-suggestions-timer-progress {
syntax: "<number>";
inherits: false;
initial-value: 0
}
.leading_f2170c {
display: grid;
grid-template-columns: 1fr;
grid-template-rows: 1fr;
height: calc(var(--custom-voice-invite-suggestions-timer-size)*1px);
width: calc(var(--custom-voice-invite-suggestions-timer-size)*1px)
}
.timer_f2170c,.userIcon_f2170c {
grid-column: 1;
grid-row: 1
}
.userIcon_f2170c {
align-self: center;
justify-self: center
}
.timer_f2170c {
--custom-voice-invite-suggestions-timer-stroke-width: 2;
height: 100%;
transform: rotate(-90deg);
width: 100%
}
.timer_f2170c .progress_f2170c,.timer_f2170c .ring_f2170c {
fill: transparent;
stroke-width: var(--custom-voice-invite-suggestions-timer-stroke-width);
r: calc(var(--custom-voice-invite-suggestions-timer-size)/2 - var(--custom-voice-invite-suggestions-timer-stroke-width)/2);
cx: calc(var(--custom-voice-invite-suggestions-timer-size)/2);
cy: calc(var(--custom-voice-invite-suggestions-timer-size)/2)
}
.timer_f2170c .ring_f2170c {
stroke: var(--border-normal)
}
.timer_f2170c .progress_f2170c {
stroke: var(--border-strong);
stroke-dasharray: calc(var(--custom-voice-invite-suggestions-timer-size)*pi);
stroke-dashoffset: calc(var(--custom-voice-invite-suggestions-timer-progress)*-1);
animation-duration: calc(var(--custom-voice-invite-suggestions-timer-duration)*1ms);
animation-fill-mode: forwards;
animation-name: custom-voice-invite-suggestions-timer_f2170c;
animation-timing-function: linear
}
.timer_f2170c.paused_f2170c .progress_f2170c {
animation-duration: auto;
animation-fill-mode: none
}
@keyframes custom-voice-invite-suggestions-timer_f2170c {
0% {
--custom-voice-invite-suggestions-timer-progress: 0
}
to {
--custom-voice-invite-suggestions-timer-progress: calc(var(--custom-voice-invite-suggestions-timer-size)*pi)
}
}
.container__394db {
align-items: center;
display: block;
flex: 1 1 auto;
overflow: hidden;
position: relative;
vertical-align: middle;
white-space: nowrap
}
.container__394db .chipletContainer__394db {
display: inline-block;
overflow: hidden
}
.container__394db .chipletParent__394db {
display: inline;
overflow: hidden;
padding-inline-start:4px;position: relative
}
.container__394db .usernameContainer__394db {
display: inline-block;
flex: 1;
margin-top: 2px;
max-width: 100%;
overflow: hidden;
white-space: nowrap
}
.container__394db.isOverlayContainer__394db {
align-content: center;
background: var(--background-base-low);
border-radius: 4px;
display: flex;
flex: none;
flex-direction: row;
height: 20px
}
.container__394db.isOverlayContainer__394db .usernameContainer__394db {
margin-top: 0
}
.container__394db.isOverlayContainer__394db .chipletContainer__394db,.container__394db.isOverlayContainer__394db .chipletParent__394db {
align-content: center;
align-items: center;
display: flex
}
.container__394db.isOverlayContainer__394db .chipletContainer__394db {
margin: 0;
padding: 1.5px
}
.container__394db.isOverlayContainer__394db .chipletContainer__394db.noPadding__394db {
padding: 0
}
.isOverlayTag__394db {
margin: 0
}
.avatarWrapper_d8a370 {
align-items: center;
display: inline-flex;
flex: 0 0 auto;
justify-content: center;
position: relative
}
.ring_d8a370 {
border-radius: 50%;
inset: -3px;
-webkit-mask: radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));
mask: radial-gradient(farthest-side,transparent calc(100% - 2px),#000 calc(100% - 1px));
pointer-events: none;
position: absolute;
transform: rotate(-90deg)
}
.container__7116a {
border-radius: var(--radius-md);
flex-direction: column;
width: 264px
}
.inputGroup__7116a {
padding: 8px 8px 0
}
.group__7116a {
flex-direction: column;
gap: 2px;
justify-content: stretch;
padding: 8px
}
.scroller__7116a {
max-height: 400px
}
.separator__7116a {
border-bottom-color: var(--border-subtle);
border-bottom: 1px solid var(--border-subtle);
box-sizing: border-box;
margin: 8px;
width: 100%
}
.icon__7116a {
height: 20px;
width: 20px
}
.removeStatus__7116a {
color: var(--text-feedback-critical)
}
.input__7116a {
flex-grow: 0;
width: 100%
}
.inputRow__7116a {
align-items: center;
display: flex;
flex-direction: row;
gap: 8px;
--control-input-height-md: 40px
}
.inputHint__7116a {
cursor: default;
margin-inline-start:8px;margin-top: 4px;
text-transform: none
}
.subtitle__7116a {
align-items: center;
align-self: start;
display: flex;
gap: 4px;
padding: 6px 10px 8px
}
.container__8c6be {
border-radius: 8px;
gap: 10px;
justify-content: unset;
padding: 8px 9px;
width: 100%
}
.container__8c6be:hover {
background-color: var(--background-mod-subtle);
color: var(--text-strong)
}
.container__8c6be:active {
background-color: var(--background-mod-normal)
}
.itemText__8c6be {
flex-grow: 1;
overflow: hidden;
text-overflow: ellipsis;
text-transform: none;
white-space: nowrap
}
.closeIcon__8c6be {
flex-shrink: 0;
height: 16px;
width: 16px
}
.favoriteIcon__8c6be {
color: var(--icon-subtle)
}
.favoriteIcon__8c6be:hover {
color: var(--icon-strong)
}
.centerAlign__8c6be {
align-items: center;
display: flex
}
.icon__912a0 {
border-radius: 0;
height: 20px;
width: 20px
}
.separator__912a0 {
border-bottom-color: var(--border-subtle);
border-bottom: 1px solid var(--border-subtle);
box-sizing: border-box;
margin: 8px;
width: 100%
}
.container__7ccfa {
align-items: center;
display: flex;
flex-direction: unset;
gap: 8px;
justify-content: space-between;
max-width: unset;
width: 100%
}
.icon__7ccfa {
flex-shrink: 0;
height: 32px;
width: 32px
}
.statusText__7ccfa {
flex-grow: 1;
overflow: hidden;
text-align: start;
text-overflow: ellipsis;
white-space: nowrap
}
.container_a46475 {
align-items: center;
display: flex;
flex-direction: unset;
gap: 8px;
justify-content: space-between;
max-width: unset;
width: 355px
}
.icon_a46475 {
height: 32px;
width: 32px
}
.statusText_a46475 {
flex-grow: 1;
overflow: hidden;
text-align: start;
text-overflow: ellipsis;
white-space: nowrap
}
.root__92958 {
background: var(--background-surface-high);
border: 1px solid var(--border-subtle);
border-radius: var(--radius-md);
display: flex;
flex-direction: column;
min-width: 240px
}
.activityList__92958 {
padding: 0 var(--space-16)
}
.activityRow__92958 {
align-items: stretch;
border-bottom: 1px solid var(--border-subtle);
display: flex;
flex-direction: column;
gap: var(--space-8);
padding: var(--space-12) 0
}
.activityRowContent__92958 {
align-items: center;
display: flex;
gap: var(--space-12)
}
.activityRow__92958:last-child {
border-bottom: none
}
.disabledReason__92958 {
text-align: center
}
.flexColumn__16b66,.flexRow__16b66 {
display: flex
}
.flexColumn__16b66 {
flex-direction: column
}
.headerContainer__16b66 {
display: flex;
justify-content: space-between;
margin-bottom: var(--space-xs);
min-width: 0;
width: 100%
}
.assetsLargeImage__16b66 {
display: block;
height: 64px;
margin-inline-end:8px;-o-object-fit: cover;
object-fit: cover;
width: 64px
}
.assetsLargeImageCompact__16b66 {
border-radius: var(--radius-sm);
height: 32px;
-o-object-fit: cover;
object-fit: cover;
width: 32px
}
.applicationLargeImage__16b66 {
border-radius: var(--radius-sm)
}
.applicationLargeImage__16b66,.spotifyLargeImage__16b66 {
}
.headerTextSize__16b66 {
font-size: 14px;
line-height: 18px
}
.bodyTextSize__16b66 {
font-size: 12px;
line-height: 16px
}
.textRow__16b66 {
display: block
}
.ellipsisRow__16b66 {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.colorHeaderPrimary__16b66 {
color: var(--text-strong)
}
.header__16b66 {
margin-bottom: 2px
}
.colorHeaderSecondary__16b66 {
color: var(--text-default)
}
.colorMuted__16b66 {
color: var(--text-muted)
}
.link__16b66:hover {
text-decoration: underline
}
.clickable__16b66 {
cursor: pointer
}
.headerLink__16b66 {
color: var(--text-strong)
}
.headerLink__16b66:hover {
text-decoration: underline
}
.bodyLink__16b66 {
color: var(--text-strong)
}
.bodyLink__16b66,.bodyLinkMuted__16b66 {
}
.bodyLinkMuted__16b66 {
color: var(--text-muted)
}
.usersSummary__16b66 {
margin-top: 4px
}
.timeBar__16b66 {
margin-top: 8px
}
.detailsAndAvatarsContainer__16b66 {
flex: 1;
min-width: 0;
padding-inline-start:var(--space-xs)}
.avatar__16b66 {
border-radius: 50%;
height: 24px;
width: 24px
}
.activity__7ba6e+.activity__7ba6e {
border-top: 1px solid var(--border-subtle)
}
.partyMembers__7ba6e {
display: flex;
flex: 1;
justify-content: flex-end
}
.partyAvatar__7ba6e {
cursor: default
}
.morePartyMembers__7ba6e {
border-radius: 8px;
box-sizing: border-box;
font-size: 8px;
height: 16px;
line-height: 16px;
min-width: 16px;
padding: 0 6px;
text-align: center;
z-index: 2
}
.button__7ba6e {
border-color: var(--border-muted);
border-radius: 4px;
color: var(--interactive-text-active)
}
.button__7ba6e:not([disabled]):hover {
border-color: var(--interactive-text-active)
}
.channelActivityContainer__7ba6e {
padding-top: 12px
}
.activityActionsContainer__7ba6e {
padding-bottom: 16px
}
.container__218f7 {
background-color: var(--background-surface-high);
border-radius: 5px;
box-shadow: var(--shadow-border),var(--shadow-high);
margin-inline-start:16px;max-height: 90vh;
padding: 0 16px;
width: 280px
}
.headerDivider__218f7 {
background-color: var(--border-subtle);
height: 1px;
width: 100%
}
.voiceChannelGiftingBreadcrumb__218f7 {
margin-bottom: 16px
}
.hangStatusActivity__218f7 {
padding: var(--space-sm) 0
}
.hangStatusContent__218f7 {
align-items: center;
display: flex;
gap: var(--space-xs);
justify-content: space-between
}
.hangStatusIcon__218f7 {
flex-shrink: 0;
height: 32px;
width: 32px
}
.hangStatusText__218f7 {
flex-grow: 1;
overflow: hidden;
text-align: start;
text-overflow: ellipsis;
white-space: nowrap
}
.draggable__55bab {
height: 32px;
position: relative
}
.draggable__55bab:active {
transform: translateZ(0)
}
.moreContainer__55bab {
background-color: var(--background-base-lowest);
border: 4px solid var(--background-base-lower);
border-color: var(--background-base-lowest);
border-radius: 16px;
margin-inline-start:-8px;padding: 3px 8px;
z-index: 1
}
.audienceContainer__55bab {
align-items: center;
display: flex;
flex-direction: row;
height: 24px;
margin-top: 4px
}
.audienceContainerCollapsed__55bab {
background-color: var(--background-base-lowest);
border: 4px solid var(--background-base-lower);
border-radius: 16px;
margin-top: 0;
margin-inline-start:-8px;padding-inline-end:8px;z-index: 1
}
.audienceContainerCollapsed__55bab .audienceIconContainer__55bab {
background: none;
margin: 4px 0 0
}
.audienceIconContainer__55bab {
background-color: var(--background-base-lowest);
border-radius: 50%;
margin-top: 4px;
margin-inline:6px}
.audienceIcon__55bab {
color: var(--interactive-text-default);
height: 16px;
margin: 4px 6px;
width: 16px
}
.userAvatar__55bab {
margin: 0
}
.list_c3cd7d {
padding-bottom: var(--space-xs);
padding-inline-start:calc(28px + var(--space-xs) + var(--space-xs) - var(--space-xs))}
.list_c3cd7d.isThread_c3cd7d {
padding-bottom: 0
}
.list_c3cd7d.withGuildIcon_c3cd7d {
padding-bottom: 8px;
padding-inline-start:48px}
.collapsed_c3cd7d {
padding-inline:48px 8px}
.disableInteraction_c3cd7d {
pointer-events: none
}
.collapsed_c3cd7d.list_c3cd7d {
padding-inline-start:64px}
.container__5b40b {
position: relative
}
.spine__5b40b {
color: var(--spine-default);
top: 8px
}
.spine__5b40b,.spineBorder__5b40b {
inset-inline-start: 22px;
position: absolute
}
.spineBorder__5b40b {
background: var(--spine-default);
border-radius: 2px;
bottom: 24px;
top: 10px;
width: 2px
}
.spineWithGuildIcon__5b40b {
inset-inline-start: 32px
}
.spineBorderWithGuildIcon__5b40b {
inset-inline-start: 32px
}
.spine__5b40b,.spineBorder__5b40b {
inset-inline-start: var(--channels-spine-offset-left);
top: 0
}
.invertedSpine__5b40b {
top: var(--channels-spine-inverted-offset-top)
}
.container__349bd {
align-items: flex-start;
background-color: var(--background-surface-high);
border-radius: 8px;
box-shadow: var(--elevation-high),var(--elevation-stroke);
display: flex;
padding: 16px
}
.content__349bd {
margin-inline-start:24px;max-width: 320px
}
.buttonContainer__349bd {
align-items: center;
display: flex;
margin-top: 16px
}
.primaryButton__349bd {
margin-inline-end:24px}
.image__349bd {
height: 64px;
width: 64px
}
.premiumChannelIcon__15e7f {
display: block
}
.icon20px__69362 {
border: 1px solid var(--border-subtle);
border-radius: 8px;
height: 20px;
width: 20px
}
.icon20px__69362:not(:last-child) {
margin-inline-end:4px}
.container__69362 {
align-items: center;
display: flex;
height: 16px;
justify-content: end;
overflow: visible
}
.overflow__69362 {
background-color: var(--background-base-lowest);
border-radius: 4px;
height: 20px;
line-height: 20px;
padding: 0 4px;
text-align: center;
vertical-align: middle
}
.modeMuted__69362 {
opacity: .3
}
.liveIndicator__46869 {
background-color: var(--green-360);
border-radius: 8px;
color: var(--white);
font-weight: var(--font-weight-semibold);
margin-inline-start:10px;padding-inline:4px;text-transform: uppercase
}
.iconLive__46869 {
color: var(--green-360)!important
}
.popout__76f04 {
background-color: var(--background-surface-high);
border-radius: var(--radius-sm);
box-shadow: var(--shadow-medium);
box-sizing: border-box;
margin-inline-start:16px;max-width: 400px;
min-width: 272px;
padding: 0 12px
}
.more__76f04,.row__76f04,.title__76f04 {
padding: 12px 4px
}
.title__76f04 {
font-weight: var(--font-weight-semibold);
margin-top: 2px;
padding-bottom: 8px;
text-transform: none
}
.row__76f04,.title__76f04 {
align-items: center;
display: flex
}
.row__76f04 {
border-radius: 4px;
color: var(--text-default);
margin: 0 -4px;
padding: 8px
}
.row__76f04:hover {
background-color: var(--background-mod-normal);
cursor: pointer
}
.row__76f04:hover,.row__76f04:hover .timestamp__76f04 {
color: var(--text-strong)
}
.avatar__76f04 {
flex-shrink: 0;
height: 16px;
margin-inline-end:8px;width: 16px
}
.bullet__76f04 {
margin: 0 8px
}
.timestamp__76f04 {
color: var(--text-muted);
flex-shrink: 0
}
.name__76f04,.timestamp__76f04 {
white-space: nowrap
}
.name__76f04 {
overflow: hidden;
text-overflow: ellipsis
}
.more__76f04 {
align-items: center;
border-top-color: var(--border-subtle);
border-top: 1px solid var(--border-subtle);
color: var(--text-link);
cursor: pointer;
display: flex;
font-weight: var(--font-weight-semibold);
margin-top: 8px;
padding-bottom: 10px;
padding-top: 8px
}
.more__76f04:hover {
text-decoration: underline
}
.custom-theme-background .popout__76f04 {
border: 1px solid var(--border-strong)
}
.popoutHeader__628e6 {
display: flex;
flex: 1
}
.channelIcon__628e6 {
color: var(--text-muted);
display: block;
flex: 0 0 auto;
height: 20px;
margin-inline-end:4px;width: 20px
}
.channelName__628e6 {
text-overflow: ellipsis
}
.container__4e30a {
background-color: var(--background-surface-high);
border-radius: 5px;
box-shadow: var(--shadow-border),var(--shadow-high);
margin-inline-start:16px;max-height: 420px;
padding: 0 16px;
width: 280px
}
.popoutHeaderContainer__4e30a {
display: flex;
padding: 12px 0
}
.headerDivider__4e30a {
background-color: var(--border-subtle);
height: 1px;
width: 100%
}
.settingNudgeText__4e30a {
padding: 16px 0
}
.voiceChannelGiftingBreadcrumb__4e30a {
margin-bottom: 16px
}
.container__7aaec {
background: none;
display: flex;
justify-content: center;
overflow: hidden;
pointer-events: none;
position: absolute;
width: 100%;
z-index: 2
}
.containerPadding__7aaec {
margin: 0 -8px -8px;
padding: 0 8px 8px;
pointer-events: auto
}
.bottom__7aaec {
bottom: calc(var(--custom-app-panels-height, 0) + var(--space-xs));
padding-top: 16px
}
.top__7aaec {
padding-bottom: 36px;
top: var(--space-8)
}
.bar__7aaec {
align-items: center;
background-color: var(--background-surface-highest);
border: 1px solid var(--border-normal);
border-radius: 20px;
box-shadow: var(--shadow-high);
cursor: pointer;
display: flex;
margin-bottom: var(--space-xs);
margin-top: 0;
padding: 4px 8px;
position: relative
}
.bar__7aaec,.bar__7aaec:hover {
opacity: 1
}
.emptyBar__7aaec {
height: 16px;
width: 80px
}
.mentionsBar__7aaec {
background-color: var(--background-feedback-notification)
}
.unreadIcon__7aaec {
color: var(--interactive-text-default);
margin-inline-end:4px}
.voiceChannelsIcon__7aaec {
color: var(--notice-text-positive);
margin-inline-end:4px}
.barText__7aaec {
color: var(--text-strong);
text-transform: uppercase
}
.voiceBar__7aaec {
background-color: var(--notice-background-positive)
}
.voiceBar__7aaec,.voiceBar__7aaec .barText__7aaec {
color: var(--notice-text-positive)
}
.voiceChannelsUsers__7aaec {
margin-inline-start:4px;margin-bottom: -2px;
margin-top: 2px
}
.container_b1bfd4 {
align-items: center;
background: var(--background-base-lowest);
border-radius: 10px;
display: flex;
height: 20px;
justify-content: center;
padding: 0 8px
}
.peopleIcon_b1bfd4 {
color: var(--text-default);
margin-inline-end:4px}
.userCountText_b1bfd4 {
line-height: 18px
}
.statusDiv__5cda9 {
align-items: center;
display: flex
}
.statusDiv__5cda9.hoverable__5cda9:hover .pencilIcon__5cda9,.statusDiv__5cda9.hoverable__5cda9:hover .statusText__5cda9 {
color: var(--interactive-text-hover)
}
.statusDiv__5cda9 .statusText__5cda9 {
font-size: 12px;
line-height: 16px
}
.statusText__5cda9 {
overflow: hidden;
text-overflow: ellipsis
}
.pencilIcon__5cda9,.statusText__5cda9 {
color: var(--channels-default)
}
.pencilIcon__5cda9 {
margin-inline-start:4px}
.educationFeatureArt__5cda9 {
align-self: center;
background-image: url(/assets/5bbf9ffe2fe5208f.svg);
height: 112px;
width: 206px
}
.enable-forced-colors .statusDiv__5cda9 {
background-color: ButtonFace;
color: ButtonText;
forced-color-adjust: none;
text-decoration: underline
}
.enable-forced-colors .statusDiv__5cda9 .pencilIcon__5cda9,.enable-forced-colors .statusDiv__5cda9 .statusText__5cda9 {
color: inherit
}
.enable-forced-colors .statusDiv__5cda9:hover .pencilIcon__5cda9,.enable-forced-colors .statusDiv__5cda9:hover .statusText__5cda9 {
color: inherit
}
@keyframes pulse__3b43f {
0% {
opacity: .7
}
to {
opacity: 1
}
}
.container__3b43f {
animation: pulse__3b43f 5s ease-in-out infinite alternate;
height: 100%;
overflow: hidden;
padding: 16px 8px
}
.bannerPadding__3b43f {
padding-top: 104px
}
.category__3b43f {
background-color: var(--background-mod-strong);
border-radius: 4px;
height: 16px;
margin-bottom: 18px;
width: 77px
}
.spacer__3b43f {
height: 1px;
margin: 16px 0;
width: 100px
}
.channel__3b43f {
align-items: center;
display: flex;
justify-content: flex-start;
margin-bottom: 18px
}
.channelIcon__3b43f {
border-radius: 16px;
margin: 0 8px;
width: 16px
}
.channelIcon__3b43f,.channelName__3b43f {
background-color: var(--background-mod-strong);
height: 16px
}
.channelName__3b43f {
border-radius: 8px
}
.facepile_aaa08b {
display: flex
}
.facepileItemContainer_aaa08b>foreignObject {
background-color: var(--background-surface-high);
padding: 2.5px
}
.facepileItemContainer_aaa08b:not(:first-child) {
margin-inline-start:-4px}
.facepileItemContainer_aaa08b:not(:last-child) {
margin-inline-end:-4px}
.textItem_aaa08b {
align-items: center;
display: flex;
height: 100%;
justify-content: center;
width: 100%
}
.guildIconList_aaa08b {
flex-direction: column
}
.guildIconItem_aaa08b,.guildIconList_aaa08b {
display: flex;
gap: 8px
}
.guildIconItemText_aaa08b {
padding-top: 2px
}
.chevronButton__5ae61 {
cursor: pointer;
padding: 0;
width: 100%
}
.chevronButton__5ae61,.chevronButtonContent__5ae61 {
align-items: center;
display: flex;
justify-content: space-between
}
.chevronButtonContent__5ae61 {
flex: 1;
height: 20px
}
.customizeLink__5ae61 {
cursor: pointer
}
.wrapper_fa8995 {
background-color: var(--modal-background);
border-radius: 8px;
box-shadow: var(--shadow-high);
box-sizing: border-box;
padding: 16px;
position: relative;
width: 240px
}
.gradient_fa8995 {
border-radius: 8px;
height: 100%;
inset-inline-start: 0;
position: absolute;
top: 0;
width: 100%
}
.theme-dark .gradient_fa8995 {
background: radial-gradient(75% 75% at 0 0,rgba(62,22,137,.8) 0,transparent 100%),radial-gradient(70% 50% at 100% 0,rgba(160,86,242,.4) 0,transparent 100%)
}
.theme-light .gradient_fa8995 {
background: radial-gradient(75% 75% at 0 0,rgba(159,86,242,.4) 0,transparent 100%),radial-gradient(70% 50% at 100% 0,rgba(222,194,252,.5) 0,transparent 100%)
}
.content_fa8995 {
align-items: center;
display: flex;
flex-direction: column;
position: relative
}
.closeButton_fa8995 {
inset-inline-end: 4px;
position: absolute;
top: 4px
}
.controllerImage_fa8995 {
height: 78px;
margin-top: 8px;
width: 140px
}
.nuxTitle_fa8995 {
margin-top: 12px;
text-align: center;
width: 180px
}
.nuxContent_fa8995 {
margin-top: 4px;
text-align: center
}
.controlTitle_fa8995 {
align-self: flex-start
}
.toggleContainerWrapper_fa8995 {
background-color: var(--background-base-lower);
border-radius: 8px;
box-sizing: border-box;
margin-top: 12px;
padding: 12px;
width: 100%
}
.toggleContainer_fa8995 {
align-items: center;
box-sizing: border-box;
color: var(--text-strong);
display: flex;
justify-content: space-between;
margin-bottom: 8px;
width: 100%
}
.toggleContainerOnlineRow_fa8995 {
align-items: center;
display: flex;
gap: 4px
}
.toggleContainerText_fa8995 {
display: flex;
flex-direction: column
}
.goOnlineButton_fa8995 {
margin-top: 20px;
width: 100%
}
.divider_fa8995 {
margin: 16px 0
}
.wrapper_a629d4 {
position: relative
}
.icon_a629d4,.wrapper_a629d4 {
height: 32px;
width: 32px
}
.icon_a629d4 {
border-radius: 4px;
color: var(--white);
display: block;
flex-shrink: 0;
font-weight: var(--font-weight-bold);
line-height: 34px;
text-align: center;
text-transform: uppercase
}
.badge_a629d4 {
bottom: -2px;
color: var(--text-strong);
height: 14px;
inset-inline-end: -1px;
position: absolute;
width: 14px
}
.text__87e56 {
color: var(--premium-nitro-pink-text)
}
.subtext__339d0 {
color: var(--text-subtle);
line-height: 13px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.title_b6c092 {
color: var(--text-strong);
line-height: 18px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
button.button__67645,span.button__67645 {
align-items: center;
border-radius: var(--radius-sm);
color: var(--icon-subtle);
display: flex;
height: 32px;
justify-content: center;
line-height: 0;
margin: 0;
position: relative;
transition: background-color .2s ease;
width: 32px
}
.high-contrast-mode button.button__67645,.high-contrast-mode span.button__67645 {
border: 1px solid transparent;
box-sizing: border-box
}
button.button__67645.redGlow__67645,span.button__67645.redGlow__67645 {
background-color: var(--opacity-red-12)
}
button.button__67645.redGlow__67645:hover,span.button__67645.redGlow__67645:hover {
background-color: var(--opacity-red-24)
}
.high-contrast-mode button.button__67645.redGlow__67645,.high-contrast-mode span.button__67645.redGlow__67645 {
border: 1px solid var(--opacity-red-52);
box-sizing: border-box
}
button.button__67645.enabled__67645:hover,span.button__67645.enabled__67645:hover {
background-color: var(--control-secondary-background-hover);
color: var(--interactive-text-hover)
}
button.button__67645.enabled__67645:hover.redGlow__67645,span.button__67645.enabled__67645:hover.redGlow__67645 {
background-color: var(--opacity-red-24)
}
button.button__67645.disabled__67645,span.button__67645.disabled__67645 {
opacity: .4
}
button.button__67645.enabled__67645.redGlow__67645:hover,span.button__67645.enabled__67645.redGlow__67645:hover {
background-color: var(--opacity-red-24)
}
.enable-forced-colors button.button__67645,.enable-forced-colors span.button__67645 {
color: ButtonText
}
.enable-forced-colors button.button__67645.enabled__67645:hover,.enable-forced-colors span.button__67645.enabled__67645:hover {
background-color: ButtonFace
}
.plated__67645 {
background-color: unset
}
.plated__67645:hover {
background-color: var(--custom-nameplate)!important
}
.plateMuted__67645,.plated__67645:hover {
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px)
}
.plateMuted__67645 {
background-color: var(--custom-nameplate-neutral)!important
}
.plateMuted__67645:hover {
background-color: var(--custom-nameplate-neutral-hovered)!important
}
.greenTooltip__67645 {
max-width: 280px
}
.greenTooltipContent__67645 {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.keybindHintKeys__384ad {
display: inline-block;
translate: 0 calc(var(--space-4)*-1)
}
.keybindShortcut__384ad {
height: 22px;
padding: 0 4px
}
.actions__4cd01 {
align-items: center;
display: flex;
flex-grow: 0;
gap: var(--space-4);
margin-inline-start:4px}
.panelButtonContainer__4cd01 {
text-align: center;
width: 32px
}
.badgedGuildIcon__4cd01 {
position: relative
}
.badge__4cd01 {
background-color: var(--brand-500);
border-radius: 50%;
height: 6px;
inset-inline-end: 0;
position: absolute;
top: 0;
width: 6px;
z-index: 1
}
.centeredTooltip__4cd01 {
text-align: center
}
.container__2ee44 {
align-items: center;
cursor: pointer;
display: flex
}
.container__2ee44:hover>.textContent__2ee44 {
text-decoration: underline
}
.iconEye__2ee44 {
margin-inline-end:4px}
.gameName__8c6c2 {
color: var(--text-default);
line-height: 16px
}
.clickableGameName__8c6c2:hover .gameName__8c6c2 {
color: var(--interactive-text-active);
cursor: pointer;
text-decoration: underline
}
.gameWrapper__8c6c2 {
align-items: center;
display: flex;
min-width: 0
}
.gameWrapper__8c6c2 .liveIndicator__8c6c2 {
padding: 0 4px
}
.gameIconWrapper__8c6c2 {
height: 32px;
position: relative
}
.gameIcon__8c6c2 {
border-radius: var(--radius-sm);
height: 32px;
width: 32px
}
.info__8c6c2 {
display: flex;
flex-direction: column;
margin-inline-start:8px;overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.liveBadge__8c6c2 {
background-color: var(--background-mod-normal);
border-radius: 50%;
bottom: -4px;
color: var(--text-strong);
height: 14px;
inset-inline-end: -4px;
padding: 2px;
position: absolute;
width: 14px
}
.panel__5dec7 {
background-color: var(--background-surface-high);
border-bottom: 1px solid var(--border-muted);
border-start-end-radius: var(--radius-sm);
border-start-start-radius: var(--radius-sm);
flex: 0 0 auto;
padding: var(--space-12)
}
.body__5dec7 {
align-items: center;
display: flex;
justify-content: space-between
}
.dropsBadgeWrapper__5dec7 {
display: inline-block;
padding-top: 4px
}
.dropsBadge__5dec7 {
font-size: 10px;
font-weight: var(--font-weight-semibold);
line-height: 12px;
overflow: hidden;
padding-top: 2px;
text-align: center;
text-overflow: ellipsis;
text-transform: none;
white-space: nowrap
}
.gameWrapper__5dec7 {
align-items: center;
display: flex;
min-width: 0
}
.gameWrapper__5dec7 .liveIndicator__5dec7 {
padding: 0 4px
}
.clickableGameWrapper__5dec7 {
cursor: pointer;
flex-grow: 1;
padding: var(--space-4)
}
.clickableGameWrapper__5dec7:hover {
background-color: var(--control-secondary-background-hover);
border-radius: var(--space-8)
}
.gameIcon__5dec7 {
height: 32px;
width: 32px
}
.info__5dec7 {
display: flex;
flex-direction: column;
margin-inline-start:8px;overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.sparkleContainer__5dec7 {
position: relative
}
.sparkles__5dec7 {
height: 26px;
inset-inline-start: 5px;
position: absolute;
top: -12px;
width: 26px
}
.infoWithDrops__5dec7 {
display: block
}
.channel__5dec7:hover,.underlineOnHover__5dec7:hover {
text-decoration: underline
}
.perksDemoContainer__5dec7 {
align-items: center;
display: flex;
flex-direction: row;
margin-top: 1px
}
.perksDemoText__5dec7 {
margin-inline-start:2px}
.frameApplicationNameTitleClickable__5dec7 {
cursor: pointer
}
.container_e45859 {
border-radius: 8px;
box-sizing: border-box;
display: block;
padding: 1px 0;
transition: none
}
.channel__972a0 {
margin-inline-start:8px;max-width: var(--custom-guild-sidebar-width);
position: relative
}
.channel__972a0.fullWidth__972a0 {
max-width: 100%
}
.unreadPill__972a0 {
background-color: var(--interactive-text-active);
border-radius: 0 var(--radius-xs) var(--radius-xs) 0;
height: 8px;
inset-inline-start: -8px;
margin-top: -4px;
position: absolute;
top: 50%;
width: 4px
}
.unreadPill__972a0.muted__972a0 {
opacity: .3
}
.interactive__972a0 {
align-items: stretch;
box-sizing: border-box;
color: var(--text-muted);
display: flex;
position: relative;
width: 100%;
z-index: 1
}
.overflowTooltip__972a0 {
max-width: 350px;
width: auto
}
.withDisplayNameStyles__972a0 {
margin: -2px -4px;
padding: 2px 4px;
text-overflow: unset
}
.clanTag__972a0 {
margin-inline-start:4px}
.clanTagMuted__972a0 {
opacity: .3
}
.interactiveSelected__972a0 {
color: var(--interactive-text-active)
}
.avatarWithText__972a0 {
flex-grow: 1
}
.link__972a0 {
align-items: center;
border-radius: inherit;
color: inherit;
display: flex;
flex: 1 1 auto;
gap: 8px;
min-width: 0;
overflow: hidden;
padding-block:0;padding-inline:var(--space-xs) 0;text-overflow: ellipsis;
white-space: nowrap;
width: 100%
}
.linkButton__972a0 {
padding-inline-end:0}
.linkButtonIcon__972a0 {
color: var(--icon-muted);
height: 24px;
width: 24px
}
.closeButton__972a0 {
align-items: center;
align-self: stretch;
display: none;
justify-content: center;
opacity: .7;
padding: 2px;
padding-inline-end:8px}
.closeButton__972a0.reducedClickTarget__972a0 {
align-self: center;
margin-inline-end:8px;padding: 0
}
.closeButton__972a0.closeButtonForceShow__972a0 {
display: flex
}
.closeButton__972a0.closeButtonPlated__972a0 {
opacity: unset
}
.closeButton__972a0 .innerCloseButtonPlated__972a0 {
align-items: center;
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
background-color: var(--custom-nameplate-neutral);
border-radius: 50%;
display: flex;
flex-grow: 0;
justify-content: center;
opacity: .9;
padding: 1px
}
.closeButton__972a0.closeButtonForceShow__972a0,.closeButton__972a0:focus,.closeButton__972a0:hover {
opacity: 1
}
.closeButton__972a0.closeButtonForceShow__972a0 .innerCloseButtonPlated__972a0,.closeButton__972a0:focus .innerCloseButtonPlated__972a0,.closeButton__972a0:hover .innerCloseButtonPlated__972a0 {
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background-color: var(--custom-nameplate-neutral-hovered)
}
.closeIconPlated__972a0 {
color: hsla(0,0%,100%,.9)
}
.theme-light .closeIconPlated__972a0 {
color: rgba(0,0,0,.9)
}
.iconsContainer__972a0 {
align-items: center;
box-sizing: border-box;
display: flex;
flex-direction: row;
flex-shrink: 0;
justify-content: flex-end;
padding-inline-start:var(--space-8);z-index: 1
}
.iconsContainer__972a0.nameplated__972a0 {
min-width: 32px
}
.closeIcon__972a0,.favoriteIcon__972a0 {
display: block;
height: 16px;
width: 16px
}
.closeButton__972a0,.favoriteIcon__972a0 {
margin: 0;
padding-inline-end:var(--space-xs)}
.subtext__972a0 {
font-size: 12px;
font-weight: var(--font-weight-medium);
line-height: 16px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.mutedIcon__972a0 {
opacity: .3
}
.activityStatusText__972a0 {
color: inherit
}
.decorator__972a0 {
margin-inline-start:4px}
@media (hover: hover) {
.channel__972a0:focus-within .favoriteIcon__972a0,.channel__972a0:hover .favoriteIcon__972a0 {
display:none
}
.channel__972a0:focus-within .closeButton__972a0,.channel__972a0:hover .closeButton__972a0 {
display: flex
}
}
.interactive__972a0:hover {
background: var(--interactive-background-hover)
}
.interactive__972a0:active,.interactiveSelected__972a0 {
background: var(--interactive-background-selected);
color: var(--text-default)
}
.interactive__972a0:active .linkButtonIcon__972a0,.interactiveSelected__972a0 .linkButtonIcon__972a0 {
color: var(--icon-strong)
}
.channel__972a0:not(.dm__972a0) {
height: auto
}
.channel__972a0:not(.dm__972a0) .link__972a0 {
padding-block:var(--space-8) var(--space-8);padding-inline: var(--space-xs) var(--space-16)
}
.channel__972a0:not(.dm__972a0) .avatarWithText__972a0 {
height: unset;
padding: 1px 0
}
.channel__972a0:not(.dm__972a0) svg {
height: 20px;
width: 20px
}
.enable-forced-colors .unreadPill__972a0 {
background-color: Highlight;
height: 10px;
margin-top: -5px;
outline: 1px solid Canvas;
width: 6px
}
.enable-forced-colors .closeButton__972a0 {
background-color: ButtonFace;
border: 1px solid ButtonFace;
color: ButtonText;
opacity: 1
}
.enable-forced-colors .closeButton__972a0:focus,.enable-forced-colors .closeButton__972a0:hover {
border-color: ButtonText
}
.enable-forced-colors .interactive__972a0,.enable-forced-colors .link__972a0 {
color: ButtonText;
forced-color-adjust: none;
position: relative;
z-index: 1
}
.enable-forced-colors .interactive__972a0 .linkButtonIcon__972a0,.enable-forced-colors .link__972a0 .linkButtonIcon__972a0 {
color: ButtonText
}
.enable-forced-colors .interactiveSelected__972a0,.enable-forced-colors .interactiveSelected__972a0 .link__972a0 {
background-color: Highlight;
color: HighlightText
}
.enable-forced-colors .interactiveSelected__972a0 .link__972a0 .linkButtonIcon__972a0,.enable-forced-colors .interactiveSelected__972a0 .linkButtonIcon__972a0 {
color: HighlightText
}
.empty__99e7c {
fill: var(--background-base-low);
padding: 16px
}
.headerText__99e7c {
flex: 1;
margin-inline-end:var(--space-xs);overflow: hidden;
text-overflow: ellipsis
}
.privateChannelsHeaderContainer__99e7c {
align-items: center;
display: flex;
height: var(--size-24);
justify-content: space-between;
padding-inline:var(--space-md) var(--space-xs);padding-bottom: var(--space-4);
padding-top: 0
}
.privateChannelsHeaderContainer__99e7c:hover {
color: var(--interactive-text-hover)
}
.privateChannelRecipientsInviteButtonIcon__99e7c {
flex: unset;
height: 16px;
margin-inline:0;width: 16px
}
.privateChannelRecipientsInviteButtonIcon__99e7c,.privateChannelRecipientsInviteButtonIconContainer__99e7c {
height: 16px;
width: 16px
}
.scroller__99e7c {
background: var(--background-gradient-high,var(--background-base-lowest));
margin-bottom: calc(var(--custom-app-panels-height, 0) + var(--space-xs) - 16px);
padding-bottom: 16px
}
.scroller__99e7c::-webkit-scrollbar-track {
margin-bottom: 16px
}
.enable-forced-colors .privateChannelsHeaderContainer__99e7c {
color: CanvasText;
forced-color-adjust: none
}
.enable-forced-colors .privateChannelRecipientsInviteButtonIcon__99e7c {
border: 1px solid ButtonFace
}
.enable-forced-colors .privateChannelRecipientsInviteButtonIcon__99e7c:hover {
border-color: ButtonText
}
.base_e42a84 {
background-position: 0;
display: block;
position: absolute
}
.sparkle_e42a84 {
animation: sparkle_e42a84 1.5s steps(17,start) infinite forwards;
background-position: -731px;
background-size: 774px 43px;
height: 43px;
width: 43px
}
.pop_e42a84 {
animation: pop_e42a84 2.91666666667s steps(34,start) infinite forwards;
background-position: -816px;
background-size: 840px 24px;
height: 24px;
width: 24px
}
.light_e42a84 {
animation: light_e42a84 2.58333333333s steps(30,start) infinite forwards;
background-size: 620px 20px;
height: 20px;
width: 20px
}
.cross_e42a84,.light_e42a84 {
background-position: -600px
}
.cross_e42a84 {
animation: cross_e42a84 2.083325s steps(23,start) infinite forwards;
background-size: 625px 25px;
height: 25px;
width: 25px
}
.sparkleBlurple_e42a84,.sparkleGrey_e42a84,.sparkleWhite_e42a84 {
}
.sparkleWhite_e42a84 {
background-image: url(/assets/fe36493b90ca212f.png)
}
.sparkleGrey_e42a84 {
background-image: url(/assets/d4d24bae3c0559b3.png)
}
.sparkleBlurple_e42a84 {
background-image: url(/assets/bf6de7bed70dd6d3.png)
}
.popBlurple_e42a84,.popGrey_e42a84,.popWhite_e42a84 {
}
.popWhite_e42a84 {
background-image: url(/assets/9e77accd9b306314.png)
}
.popGrey_e42a84 {
background-image: url(/assets/ec347b8de4777f9a.png)
}
.popBlurple_e42a84 {
background-image: url(/assets/889a2aa66cb786d7.png)
}
.lightBlurple_e42a84,.lightGrey_e42a84,.lightWhite_e42a84 {
}
.lightWhite_e42a84 {
background-image: url(/assets/d06f48f14653e6c8.png)
}
.lightGrey_e42a84 {
background-image: url(/assets/b70ad231203bf921.png)
}
.lightBlurple_e42a84 {
background-image: url(/assets/d2cc0071b8c9ceef.png)
}
.crossBlurple_e42a84,.crossGrey_e42a84,.crossWhite_e42a84 {
}
.crossWhite_e42a84 {
background-image: url(/assets/dd2ccc47416b2b19.png)
}
.crossGrey_e42a84 {
background-image: url(/assets/d085fdd3215d0dc0.png)
}
.crossBlurple_e42a84 {
background-image: url(/assets/18fc01aa48e3eedf.png)
}
@keyframes sparkle_e42a84 {
0% {
background-position: 0
}
40% {
background-position: -731px
}
to {
background-position: -731px
}
}
@keyframes pop_e42a84 {
0% {
background-position: 0
}
40% {
background-position: -816px
}
to {
background-position: -816px
}
}
@keyframes light_e42a84 {
0% {
background-position: 0
}
40% {
background-position: -600px
}
to {
background-position: -600px
}
}
@keyframes cross_e42a84 {
0% {
background-position: 0
}
40% {
background-position: -600px
}
to {
background-position: -600px
}
}
.resizeHandle__4b144 {
bottom: -2px;
cursor: ns-resize;
height: 4px;
position: absolute;
width: 100%
}
.unreadCount__23463 {
background: var(--interactive-text-default);
border-radius: 999px;
box-sizing: border-box;
color: var(--black);
flex-shrink: 0;
font-weight: var(--font-weight-semibold);
height: 16px;
margin-inline-start:-12px;min-width: 16px;
padding: 0 4px;
text-align: center;
width: auto
}
.mention__23463 {
background: var(--background-feedback-notification);
color: var(--white)
}
.circularButton__92e4b {
background: var(--background-gradient-lowest,var(--background-mod-normal));
border-radius: 20px;
height: 40px;
width: 40px
}
.wrapper__92e4b {
display: flex;
min-width: 32px;
position: relative;
width: auto
}
.wrapper__92e4b svg {
flex-shrink: 0
}
.badge__92e4b {
flex-grow: 0;
flex-shrink: 1;
inset-inline-end: -4px;
position: absolute;
top: -4px
}
.iframe__49094 {
height: 100%;
width: 100%
}
.wrapper__49094 {
background-color: #000;
display: flex;
flex: 0 0 auto;
flex-direction: column;
position: relative;
z-index: 2
}
.wrapper__49094.resizable__49094 {
height: 65%
}
.wrapper__49094.noChat__49094 {
height: 100%;
max-height: 100%
}
.activityPanelContainer__49094 {
display: flex;
flex: 1;
flex-direction: column
}
.header__49094 {
padding: 14px 8px
}
.footer__49094,.header__49094 {
align-items: center;
display: flex;
flex-direction: row
}
.footer__49094 {
justify-content: space-between;
padding: 12px 24px
}
.minimizeContainer__49094 {
flex: 0
}
.circularButton__49094 {
background: var(--background-mod-normal);
border-radius: 20px;
height: 40px;
width: 40px
}
.minimizeIcon__49094 {
height: 20px;
width: 20px
}
.headerTitle__49094 {
flex: 1;
text-align: center
}
.leaveButtonContainer__49094 {
margin: 0 16px
}
.activityContainer__49094 {
align-items: center;
flex: 1;
flex-direction: row;
justify-content: center;
margin: 24px
}
.activityContainerNoMargin__49094 {
margin: 0
}
.leaveActivityIcon__49094 {
height: 20px;
width: 20px
}
.leaveActivityButton__49094 {
height: 40px;
width: 40px
}
.footerButtons__49094 {
display: flex;
flex: 1;
flex-direction: row;
justify-content: center
}
.flex__49094 {
flex: 1
}
.avatar__49094 {
border-radius: 50%;
height: 32px;
width: 32px
}
.buttonSection__49094 {
align-items: center;
background: var(--plum-23);
border: 1px solid hsl(var(--plum-11-hsl)/.06);
border-radius: 12px;
display: flex;
gap: 8px;
justify-content: center;
padding: 4px
}
.contextlessHeader__49094 {
align-items: center;
display: flex;
justify-content: space-between;
padding: var(--space-12) var(--space-16)
}
.contextlessHeaderLeft__49094 {
align-items: center;
display: flex;
flex-direction: row;
gap: var(--space-8)
}
.contextlessInviteButtonIcon__49094 {
height: 16px;
width: 16px
}
.contextlessLeaveActivityButton__49094 {
border-radius: 8px;
padding: var(--space-4)
}
.contextlessLeaveActivityButtonIcon__49094 {
padding: var(--space-4) var(--space-8)
}
.fortniteUpsellModalButton__49094 {
background: var(--plum-23);
border: 1px solid hsl(var(--plum-11-hsl)/.06);
border-radius: 12px;
margin-inline-end:var(--space-24);padding: 4px
}
.container__6b38f {
align-items: center;
background-color: var(--background-base-lower);
border-radius: 12px;
box-sizing: border-box;
cursor: pointer;
display: flex;
flex-direction: row;
padding: 16px;
width: 400px
}
.container__6b38f:hover {
background-color: var(--background-base-low)
}
.textContainer__6b38f {
margin-inline-start:16px}
.caret__6b38f,.dismissButton__6b38f {
margin-inline-start:auto}
.dismissButton__6b38f {
align-items: center;
display: flex;
justify-content: center
}
.icon__6b38f {
border-radius: 50%;
display: flex;
padding: 6px
}
.dot__6b38f {
margin: 0 8px
}
.dot__6b38f,.inline__6b38f {
display: inline
}
.pulse__6b38f {
animation: pulse-animation__6b38f 2s 1s infinite;
box-shadow: 0 0 0 0 hsl(var(--green-360-hsl)/.5)
}
.container__6b38f:not(.pulse__6b38f) {
background-color: var(--opacity-black-52)
}
.container__6b38f:not(.pulse__6b38f):hover {
background-color: var(--opacity-black-64)
}
.container__6b38f:not(.pulse__6b38f):active {
background-color: var(--opacity-black-48)
}
@keyframes pulse-animation__6b38f {
70% {
box-shadow: 0 0 0 20px hsl(var(--green-360-hsl)/0)
}
to {
box-shadow: 0 0 0 0 hsl(var(--green-360-hsl)/0)
}
}
.enable-forced-colors .container__6b38f {
border: 1px solid ButtonText
}
.enable-forced-colors .caret__6b38f {
color: ButtonText
}
.eventPrompt_a5e25b {
margin-top: 8px
}
.popoutContainer__02e2b {
align-items: center;
background: var(--background-surface-high);
border-radius: var(--radius-lg);
box-shadow: var(--shadow-border),var(--shadow-high);
box-sizing: border-box;
display: flex;
filter: drop-shadow(0 0 12px #a944b0);
flex-direction: column;
opacity: 1;
overflow: hidden;
padding: 0;
text-align: center;
transform: translate3d(0,-24px,0);
width: 300px
}
.full-motion .popoutContainer__02e2b {
transition: all .25s
}
.image__02e2b {
background-color: #000
}
.image__02e2b,.infoContainerParent__02e2b {
width: 100%
}
.infoContainer__02e2b {
margin: var(--space-12)
}
.infoText__02e2b {
text-align: start
}
.closeButton__02e2b {
inset-inline-end: var(--space-12);
position: absolute;
top: var(--space-12)
}
.closeIcon__02e2b {
background-color: rgba(0,0,0,.44);
border-radius: var(--radius-round);
padding: var(--space-4)
}
.hidden__02e2b {
opacity: 0;
pointer-events: none;
transform: translate3d(0,-14px,0)
}
.poweredByNitroContainer__02e2b {
align-items: center;
display: flex;
flex-direction: row;
gap: var(--space-4);
margin-top: var(--space-8)
}
.activityItemButtonInnerClass__8a940 {
display: flex;
width: 100%
}
.activityItem__8a940 {
border-radius: 12px;
cursor: pointer;
display: inline-block;
overflow: hidden;
position: relative;
transition: scale .2s;
width: 100%
}
.activityItem_13_11__8a940 {
aspect-ratio: 13/11
}
.activityItem_16_9__8a940 {
aspect-ratio: 16/9
}
.activitySuggestionImage__8a940 {
height: 100%;
min-height: 100%;
min-width: 100%;
-o-object-fit: cover;
object-fit: cover;
width: 100%
}
.iconOuterContainer__8a940 {
align-items: center;
display: flex;
inset: 0;
justify-content: center;
pointer-events: none;
position: absolute
}
.iconInnerContainer__8a940 {
background-color: rgba(0,0,0,.8);
border-radius: 10px;
height: 20px;
pointer-events: none;
width: 20px
}
.nitroIconContainer__8a940 {
bottom: 4px;
inset-inline-end: 4px;
position: absolute
}
.nitroIcon__8a940 {
inset-inline-start: 1px;
position: absolute;
top: 2px
}
.lockBackground__8a940 {
background-color: rgba(0,0,0,.2)
}
.lockIconContainer__8a940 {
align-items: center;
border-radius: 50%;
display: flex;
justify-content: center;
position: absolute;
width: 20%
}
.lock__8a940,.lockIconContainer__8a940 {
aspect-ratio: 1;
height: auto
}
.lock__8a940 {
width: 75%
}
.activityAction__8a940 {
align-items: center;
background-color: rgba(0,0,0,.45);
display: flex;
inset: 0;
justify-content: center;
pointer-events: none;
position: absolute
}
.activityActionButton__8a940 {
background-color: var(--control-secondary-background-default);
border-radius: 12px;
padding: 4px 16px
}
.activityActionButtonDanger__8a940 {
background-color: var(--control-critical-primary-background-default)
}
.brokenImageIconWrapper__8a940 {
align-items: center;
background-color: #000;
display: flex;
justify-content: center
}
.overlayBadge__8a940 {
inset-inline-start: 0;
padding: 4px;
position: absolute;
top: 0
}
.badgeContainer__8a940 {
align-items: flex-start;
display: flex;
flex-direction: column;
gap: 3px
}
.container__9fa5a {
align-items: flex-start;
background-color: var(--background-surface-high);
border-radius: 16px;
box-shadow: var(--shadow-border),var(--shadow-high);
display: flex;
flex-direction: column;
min-width: 584px;
overflow: hidden;
padding: 12px
}
.titleContainer__9fa5a {
justify-content: space-between;
width: 100%
}
.titleContainer__9fa5a,.titleLeft__9fa5a {
align-items: center;
display: flex
}
.titleLeftIcon__9fa5a {
margin-inline-end:4px}
.titleRight__9fa5a {
align-items: center;
cursor: pointer;
display: flex
}
.titleRightIcon__9fa5a {
margin-inline-start:4px}
.activityContainer__9fa5a {
display: flex;
height: 88px;
margin-top: 16px;
position: relative;
width: 100%
}
.activityContainer__9fa5a>:not(:first-child) {
margin-inline-start:16px}
.activitySuggestion__9fa5a {
height: 88px
}
.poster__9fa5a {
border-radius: 12px;
height: auto;
margin: 16px 0;
width: 584px
}
.posterDivider__9fa5a {
background-color: var(--border-subtle);
height: 1px;
width: 100%
}
.clickableBanner__9fa5a {
cursor: pointer;
transform: scale(1)
}
.full-motion .clickableBanner__9fa5a {
transition: transform .25s
}
.full-motion .clickableBanner__9fa5a:focus,.full-motion .clickableBanner__9fa5a:hover {
transform: scale(1.025)
}
.dot__148e9 {
background-color: var(--interactive-text-active);
border-radius: 100%;
position: absolute;
transform: translateY(-5%)
}
.maskPopout__148e9 {
border: 2px solid var(--background-surface-high)
}
.maskPrimary__148e9 {
border: 2px solid var(--background-base-low)
}
.maskSecondary__148e9 {
border: 2px solid var(--background-base-lower)
}
.maskBlack__148e9 {
border: 2px solid var(--black)
}
.alert__148e9 {
background-color: var(--background-feedback-notification)
}
.blurpleTreatment__148e9 {
background-color: var(--blurple-50)
}
.buttonColor__7b3e8 {
background-color: var(--primary-630);
color: #fff
}
.buttonColor__7b3e8:hover {
background-color: var(--primary-700)
}
@media (max-width: 1000px) {
.textButton__7b3e8 {
display:none
}
}
@media (min-width: 1001px) {
.iconButton__7b3e8 {
display:none
}
}
.container_faf161 {
align-items: flex-start;
background-color: var(--background-surface-high);
border-radius: var(--radius-sm);
box-shadow: var(--shadow-border),var(--shadow-high);
display: flex;
flex-direction: column;
margin-top: 16px;
overflow: hidden;
padding: 16px
}
.title_faf161 {
text-transform: capitalize
}
.subtitle_faf161 {
margin-bottom: 16px
}
.wishlistItemsContainer_faf161 {
display: flex;
flex-direction: row;
gap: 16px;
justify-content: center;
width: 100%
}
.loading_faf161 {
height: 136px;
width: 716px
}
.contextContainer_faf161 {
background-color: var(--background-surface-high)
}
.container__1405b {
align-items: center;
display: flex;
flex-direction: column;
justify-content: center;
position: relative
}
.eventPromptsContainer__1405b {
bottom: 104px;
position: absolute
}
@media (max-width: 456px) {
.controlButton__1405b {
margin:0 4px
}
}
.wrapper__1405b {
align-items: center;
display: flex;
flex-direction: row;
gap: 12px
}
.buttonContainer__1405b {
position: relative
}
.buttonContainer__1405b,.buttonSection__1405b {
align-items: center;
display: flex;
justify-content: center
}
.buttonSection__1405b {
background: var(--background-surface-high);
border: 1px solid var(--border-muted);
border-radius: 12px;
gap: 8px;
padding: 4px
}
.root_c8dbe9 {
align-items: center;
display: flex;
height: 100%;
justify-content: center;
width: 100%
}
.root_c8dbe9 .sprite_c8dbe9 {
animation: none;
position: relative
}
.participant_c8dbe9 {
margin: 0 8px
}
.transition_c8dbe9 {
position: relative
}
.spriteWrapper_c8dbe9 {
inset: 0;
position: absolute
}
.column__535e0 {
display: flex;
flex-direction: column
}
.row__535e0 {
display: flex;
flex-direction: row
}
.row__535e0.gap__535e0 {
gap: 8px
}
.chatFlow__535e0 {
bottom: 0;
color: #fff;
display: flex;
flex-direction: column;
flex-shrink: 1;
gap: 8px;
inset-inline: 0;
margin: 0 auto;
max-height: 256px;
max-width: 980px;
min-width: 0;
opacity: 1;
overflow: hidden;
padding: 0 12px;
transition: all .3s ease;
width: 100%
}
.chatFlow__535e0.hidden__535e0 {
opacity: 0;
pointer-events: none
}
.chat__535e0 {
display: flex;
flex-direction: column;
max-height: 136px
}
.chat__535e0,.history__535e0 {
height: 100%;
position: relative;
transition: all .3s ease-in-out
}
.history__535e0 {
opacity: 1
}
.history__535e0.idle__535e0 {
opacity: 0
}
.message__535e0 {
align-items: flex-start;
background: transparent;
display: flex;
flex-direction: row;
font-size: 22px;
gap: 12px;
justify-content: flex-start;
overflow: visible;
padding: 6px 4px;
transition: all .3s ease-in-out
}
.message__535e0:hover {
background: var(--message-background-hover)
}
.message__535e0:not(.noAnimate__535e0) {
animation: messageIn__535e0 .3s ease-in-out forwards
}
.message__535e0.out__535e0 {
animation: messageIn__535e0 .3s ease-in-out reverse forwards
}
.author__535e0 {
flex-wrap: nowrap;
font-weight: bolder;
white-space: nowrap
}
.content__535e0 {
color: #fff;
font-weight: 400
}
.attachment__535e0 {
border-radius: 12px
}
.outerInput__535e0 {
-webkit-backdrop-filter: blur(10px);
backdrop-filter: blur(10px);
background: var(--border-faint,hsla(240,4%,61%,.04));
border: 1px solid var(--border-subtle,hsla(240,4%,61%,.04));
opacity: 1;
transition: all .2s ease!important
}
.outerInput__535e0.idle__535e0 {
opacity: 0
}
.input__535e0 {
background: rgba(0,0,0,.24)
}
@keyframes messageIn__535e0 {
0% {
height: 0;
margin-top: -12px;
opacity: 0;
transform: translateY(12px)
}
to {
height: 100%;
margin-top: 0;
opacity: 1;
transform: translate(0)
}
}
.block__8dcfb {
background: rgba(36,36,41,.5);
border: 1px solid var(--border-faint,hsla(240,4%,61%,.04));
border-radius: var(--radius-sm);
padding: var(--space-10)
}
.clickable__8dcfb {
cursor: pointer
}
.header__8dcfb {
margin-bottom: var(--space-12)
}
.controlPopout__8dcfb {
-webkit-backdrop-filter: blur(3px);
backdrop-filter: blur(3px);
background: rgba(26,26,30,.9);
border: 1px solid var(--border-subtle,hsla(240,4%,61%,.12));
border-radius: var(--radius-sm);
bottom: "auto";
display: flex;
flex-direction: column;
gap: var(--space-12);
padding: var(--space-12);
position: absolute;
transform: translateY(calc(-100% - 8px)) scaleX(1);
transform-origin: bottom center;
width: 320px
}
.full-motion .controlPopout__8dcfb {
transition: all .3s ease
}
.controlPopout__8dcfb.hidden__8dcfb {
opacity: 0;
pointer-events: none;
transform: translateY(calc(-100% + 4px)) scale3d(.95,.95,.95)
}
.row__8dcfb {
display: flex;
flex-direction: row
}
.songBlock__8dcfb {
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
background: var(--color-background-mod-subtle,hsla(240,4%,61%,.08));
background-clip: padding-box;
background-position: 50%;
background-repeat: no-repeat;
background-size: cover;
border: 2px solid var(--color-border-faint,hsla(240,4%,61%,0));
border-radius: 16px;
box-sizing: border-box;
height: 90px;
margin-bottom: var(--space-4);
margin-top: var(--space-4);
overflow: hidden;
position: relative;
transform: scale(1) translateZ(1);
transform-style: preserve-3d;
width: 90px
}
.full-motion .songBlock__8dcfb {
transition: all .3s ease
}
.songBlock__8dcfb:hover {
border: 2px solid var(--color-border-faint,hsla(240,4%,61%,.15))
}
.full-motion .songBlock__8dcfb:hover {
transform: scale(1.025)
}
.songBlock__8dcfb.selected__8dcfb {
border: 2px solid var(--color-border-faint,hsla(240,4%,61%,.4))
}
.songBlock__8dcfb.selected__8dcfb:hover {
border: 2px solid var(--color-border-faint,hsla(240,4%,61%,.45))
}
.visualizer__8dcfb {
align-items: center;
background: var(--control-overlay-secondary-background-active);
bottom: 0;
display: flex;
flex-direction: row;
gap: var(--space-4);
position: absolute;
top: 0;
inset-inline: 0;
justify-content: center;
opacity: 0
}
.full-motion .visualizer__8dcfb {
transition: all .3s ease
}
.visualizer__8dcfb:hover {
background: var(--control-overlay-secondary-background-active)
}
.visualizer__8dcfb.selected__8dcfb {
opacity: 1
}
.full-motion .visualizer__8dcfb.playing__8dcfb .dot__8dcfb {
animation: bounce__8dcfb .4s cubic-bezier(.175,.885,.32,1.275) infinite
}
.full-motion .visualizer__8dcfb.playing__8dcfb .dot__8dcfb:first-child,.full-motion .visualizer__8dcfb.playing__8dcfb .dot__8dcfb:nth-child(3) {
animation-delay: .15s;
animation-duration: .6s
}
.full-motion .visualizer__8dcfb.playing__8dcfb .dot__8dcfb:nth-child(2) {
animation-duration: .6s
}
.dot__8dcfb,.visualizer__8dcfb.paused__8dcfb .dot__8dcfb {
transform: scaleY(.45)
}
.dot__8dcfb {
background: var(--white);
border-radius: var(--space-8);
height: var(--space-24);
width: var(--space-8)
}
.full-motion .dot__8dcfb {
transition: all .5s ease
}
.muted__8dcfb * {
color: var(--icon-feedback-critical);
stroke: var(--icon-feedback-critical);
fill: var(--icon-feedback-critical)
}
@keyframes bounce__8dcfb {
0% {
transform: scaleY(.45)
}
50% {
transform: scale(1)
}
to {
transform: scaleY(.45)
}
}
.container__01290 {
-webkit-backdrop-filter: blur(4px);
backdrop-filter: blur(4px);
border-radius: var(--radius-sm);
display: flex;
flex-direction: column;
gap: var(--space-8);
inset-inline-start: 32px;
padding: var(--space-8);
position: absolute;
top: 64px
}
.participantItem__01290 {
align-items: center;
cursor: pointer;
display: flex;
flex-direction: row;
opacity: .4;
position: relative;
transition: opacity .1s ease-in-out
}
.speaking__01290 {
opacity: .9
}
.speaking__01290 .avatar__01290 {
outline: 1px solid var(--green-300);
outline-offset: 2px
}
.avatar__01290 {
flex-shrink: 0
}
.username__01290 {
align-items: center;
box-sizing: border-box;
display: flex;
flex-shrink: 1;
gap: 8px;
height: 24px;
justify-content: center;
margin-inline-start:var(--space-4);max-width: 100%;
opacity: .8;
overflow: hidden;
padding: var(--space-4) var(--space-8);
text-overflow: ellipsis;
white-space: nowrap
}
.gradientBackground__11664 {
background-color: var(--bg-animated-gradient-background-not-black);
contain: layout style size;
filter: blur(100px);
height: 100%;
inset-inline-start: 0;
position: absolute;
top: 0;
width: 100%
}
.sphere__11664 {
inset-inline-start: 50%;
position: absolute;
transform: translate3d(-50%,0,0)
}
.backgroundDark__11664 {
background: var(--bg-animated-gradient-background-indigo-1);
border-radius: 50%;
bottom: -920px;
filter: blur(200px);
height: 1570px;
opacity: .75;
width: 1260px
}
.backgroundLight__11664 {
background: var(--bg-animated-gradient-background-pink-1);
border-radius: 50%;
bottom: -600px;
height: 1050px;
opacity: .66;
transform: translate3d(-50%,0,0) scaleX(.5) scaleY(.65);
width: 1120px
}
.foregroundRing__11664 {
border: 15px solid var(--blurple-49);
border-radius: 50%;
bottom: -675px;
height: 1333px;
opacity: .75;
transform: translate3d(-50%,0,0) scale(1);
width: 1333px
}
.foregroundBase__11664 {
background: var(--blurple-49);
border-radius: 50%;
bottom: -637.5px;
height: 1125px;
opacity: .75;
transform: translate3d(-50%,0,0) scaleX(.64) scaleY(.56);
width: 1125px
}
.full-motion .backgroundDark__11664 {
animation: pulseBackgroundDark__11664 6s ease-in-out infinite;
animation-play-state: paused
}
.full-motion .backgroundLight__11664 {
animation: pulseBackgroundLight__11664 6s ease-in-out infinite;
animation-play-state: paused
}
.full-motion .foregroundRing__11664 {
animation: pulseForegroundRing__11664 4s ease-in-out infinite;
animation-play-state: paused
}
.full-motion .foregroundBase__11664 {
animation: pulseForeground__11664 4s ease-in-out infinite;
animation-play-state: paused
}
.full-motion.app-focused:not(.hardware-acceleration-disabled) .backgroundDark__11664 {
animation-play-state: running
}
.full-motion.app-focused:not(.hardware-acceleration-disabled) .backgroundLight__11664 {
animation-play-state: running
}
.full-motion.app-focused:not(.hardware-acceleration-disabled) .foregroundRing__11664 {
animation-play-state: running
}
.full-motion.app-focused:not(.hardware-acceleration-disabled) .foregroundBase__11664 {
animation-play-state: running
}
@keyframes pulseBackgroundDark__11664 {
0%,to {
opacity: .75
}
50% {
opacity: .5
}
}
@keyframes pulseBackgroundLight__11664 {
0%,to {
transform: translate3d(-50%,0,0) scaleX(.65) scaleY(.75)
}
50% {
transform: translate3d(-50%,0,0) scaleX(.5) scaleY(.65)
}
}
@keyframes pulseForegroundRing__11664 {
0%,to {
border-width: 15px;
transform: translate3d(-50%,0,0) scale(1)
}
50% {
border-width: 25px;
transform: translate3d(-50%,0,0) scale(.834)
}
}
@keyframes pulseForeground__11664 {
0%,to {
transform: translate3d(-50%,0,0) scaleX(.64) scaleY(.56)
}
50% {
transform: translate3d(-50%,0,0) scaleX(.81) scaleY(.81)
}
}
.pulseGradient__11664 {
height: 100%;
inset-inline-start: 0;
position: absolute;
top: 0;
width: 100%
}
.container__5aa3a {
border-radius: 0;
flex-direction: column;
height: 100%;
margin: 0;
overflow: hidden;
width: 100%
}
.container__5aa3a,.tiles__5aa3a {
align-items: center;
display: flex;
justify-content: center;
position: relative
}
.tiles__5aa3a {
flex-wrap: wrap;
margin-bottom: 20px;
z-index: 1
}
.tile__5aa3a {
height: 90px;
margin: 4px;
width: 160px
}
.participantsRow__5aa3a {
align-items: center;
display: flex;
flex-direction: row;
position: relative
}
.channelName__5aa3a {
margin: 8px 0;
max-width: 75%;
overflow: hidden;
position: relative;
text-overflow: ellipsis;
white-space: nowrap
}
.joinButton__5aa3a {
margin-top: 24px
}
.buttonContainer__5aa3a {
align-items: flex-end;
display: flex;
flex-direction: row;
gap: var(--space-8);
z-index: 1
}
.content__5aa3a {
align-items: center;
display: flex;
flex-direction: column;
gap: var(--space-24);
height: 100%;
justify-content: center;
position: relative;
width: 100%
}
.header__5aa3a,.subtext__5aa3a {
text-align: center
}
.root__6dcca {
align-items: center;
display: flex;
flex-direction: column;
height: calc(100% - 112px);
justify-content: center;
text-align: center;
width: 100%
}
.art__6dcca {
height: 50%;
margin-bottom: 8px;
max-height: 222px;
max-width: 362px;
width: 50%
}
.hidden__6dcca {
display: none
}
.header__6dcca {
margin-bottom: 8px
}
.row_d6271c {
justify-content: center
}
.row_d6271c,.tile_d6271c {
display: flex
}
.tile_d6271c {
align-items: center;
margin-inline-end:8px;margin-bottom: 8px
}
.tile_d6271c.noVerticalMargin_d6271c {
margin-bottom: 0
}
.tile_d6271c.noHorizontalMargin_d6271c {
margin-inline-end:0}
.tile_d6271c.padColumn_d6271c {
padding: 0 2px
}
.tileSizer_d6271c {
aspect-ratio: 16/9;
width: 100%
}
.root__4ad81 {
align-items: center;
background-color: var(--background-base-lower);
color: var(--white);
display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
padding: 16px
}
.art__4ad81 {
flex: 1;
margin-bottom: var(--space-24);
max-height: 210px;
min-height: 0
}
.heading__4ad81 {
flex: none;
margin-top: 16px;
padding: 0 16px;
text-align: center;
white-space: pre-line
}
.checkboxContainer__4ad81 {
display: grid;
flex: none;
grid-template-columns: auto auto;
grid-gap: 8px;
align-items: center;
cursor: pointer;
margin-top: 16px
}
.closeButton__4ad81 {
color: var(--interactive-text-default)
}
.closeButtonContainer__4ad81 {
cursor: pointer;
inset-inline-end: 8px;
position: absolute;
top: 8px
}
.closeButtonContainer__4ad81 :focus>.closeButton__4ad81,.closeButtonContainer__4ad81 :hover {
color: var(--interactive-text-hover)
}
.activitiesContainer__4ad81 {
display: grid;
flex: none;
grid-template-columns: 1fr 1fr 1fr;
margin-top: 16px;
grid-gap: 16px
}
.activitiesContainerSmol__4ad81 {
grid-gap: 8px
}
.activitySuggestion__4ad81 {
max-width: 250px
}
.clickableTile__4ad81 {
cursor: pointer;
display: flex;
flex: 1
}
.iconContainer__4ad81 {
align-items: center;
display: flex;
justify-content: center;
position: relative
}
.iconPlusSign__4ad81 {
bottom: 4px
}
.iconPlusSign__4ad81,.shelfButtonCloseButton__4ad81 {
inset-inline-end: 4px;
position: absolute
}
.shelfButtonCloseButton__4ad81 {
cursor: pointer;
top: 4px
}
.button__4ad81 {
border-radius: 100px
}
.closeButtonIcon__4ad81 {
color: var(--background-base-lower)
}
.closeButtonIcon__4ad81:hover {
color: var(--icon-muted)
}
.singleUserRoot__4ad81 {
align-items: center;
background: radial-gradient(110.79% 100% at 50% 100%,var(--background-base-lower) 60%,var(--transparent) 100%),linear-gradient(270deg,var(--background-tile-gradient-pink-end) 0,var(--background-tile-gradient-pink-start) 80%),linear-gradient(0deg,var(--background-base-lower),var(--background-base-lower)),var(--opacity-black-20);
display: flex;
gap: 16px;
justify-content: center
}
.root_f555ee {
align-items: center;
color: var(--white);
display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
padding: 16px
}
.text_f555ee {
font-weight: var(--font-weight-semibold);
margin-bottom: 16px;
text-align: center
}
.buttonText_f555ee {
padding: 0 8px
}
.art_f555ee {
margin-bottom: 16px
}
.tile_eaee1d {
height: 100%
}
.container__2aff1 {
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0;
pointer-events: none
}
.tileContainer__2aff1 {
display: flex
}
.tile__2aff1 {
aspect-ratio: 16/9;
border-radius: 8px;
margin-inline-end:8px;width: 100%
}
.tile__2aff1:last-child {
margin-inline-end:0}
.tile_ba65b0 {
height: 100%;
width: 100%
}
.tileSizer_ba65b0 {
height: 112px;
width: 195px
}
.tileSizer_ba65b0:not(:first-child) {
margin-inline-start:8px}
.root_ba65b0 {
box-sizing: border-box;
display: flex;
height: 112px;
justify-content: center;
width: 100%
}
.voiceCallWrapper_a21736 {
padding-bottom: 24px
}
.videoGridWrapper_a21736 {
align-self: stretch
}
.root_a21736 {
height: 100%;
position: relative;
width: 100%
}
.flexCenter_a21736 {
align-items: center;
display: flex;
justify-content: center
}
.videoFrame_a21736 {
flex: 1;
position: relative
}
.videoWrapper_a21736 {
flex: 1 1 100%;
margin: 0 auto;
position: relative
}
.videoWrapperAnimated_a21736 {
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0
}
.videoGrid_a21736 {
height: 100%;
min-width: 100px
}
.hiddenParticipants_a21736 p {
margin: 0
}
.videoSizer_a21736 {
position: relative;
width: 100%
}
.focusedVideo_a21736 {
height: 100%
}
.participantsButton_a21736 {
inset-inline-end: 8px;
position: absolute;
top: 50%;
transform: translateY(-50%);
transition: opacity .2s ease-in-out;
z-index: 1
}
.participantsButton_a21736.idle_a21736 {
opacity: 0
}
.root__6981d {
height: 100%
}
.root__6981d,.tileWrapper__6981d {
position: relative;
width: 100%
}
.videoFrame__6981d {
display: flex;
flex: 1;
justify-content: center;
position: relative
}
.videoWrapper__6981d {
z-index: 1
}
.actionRow__6981d {
bottom: -8px;
display: flex;
inset-inline-start: 50%;
position: absolute;
transform: translateX(-50%) translateY(100%);
transition: opacity .2s ease-in-out;
z-index: 10
}
.actionRow__6981d.idle__6981d {
opacity: 0
}
.viewAllButton__6981d {
background: var(--primary-630);
border-radius: 48px;
box-shadow: var(--shadow-border),var(--shadow-high);
margin-inline-start:8px;padding: 4px 8px
}
.viewAllButton__6981d:hover {
background: var(--primary-700)
}
.viewAllButtonInner__6981d {
align-items: center;
display: flex;
white-space: nowrap
}
.buttonIcon__6981d {
color: var(--white);
margin-inline-end:4px}
.participantsWrapperAnimated__6981d {
align-items: center;
display: flex;
flex-shrink: 0;
inset-inline: 8px;
bottom: 0;
overflow: hidden;
position: absolute
}
.gradientBackground__41626 {
background-color: var(--bg-animated-gradient-background-not-black);
filter: blur(200px);
height: 100%;
inset-inline-start: 0;
position: absolute;
top: 0;
width: 100%
}
.gradientBackground__41626>div {
border-radius: 50%;
position: absolute;
transform-origin: center center
}
.leftDarkEllipse__41626 {
background: var(--bg-animated-gradient-background-indigo-2);
height: 88.5%;
inset-inline-start: -49.5%;
opacity: 1;
top: -44.2%;
transform: scaleX(1) scaleY(1.25);
width: 99%
}
@keyframes leftDarkEllipse__41626 {
0%,to {
opacity: 1;
transform: scaleX(1) scaleY(1.25)
}
55% {
opacity: .75;
transform: scale(.82)
}
}
.leftLightEllipse__41626 {
background: var(--blurple-49);
height: 23.5%;
inset-inline-start: -22.5%;
opacity: 1;
top: -11.8%;
transform: scaleX(1) scaleY(1.25);
width: 45%
}
@keyframes leftLightEllipse__41626 {
0%,to {
opacity: .6;
transform: scaleX(1) scaleY(1.25)
}
55% {
opacity: .45;
transform: scale(.82)
}
}
.rightDarkEllipse__41626 {
background: var(--bg-animated-gradient-background-indigo-2);
height: 88.5%;
inset-inline-end: -50%;
opacity: .75;
top: -44.2%;
transform: scale(.82);
width: 99%
}
@keyframes rightDarkEllipse__41626 {
0%,to {
opacity: .75;
transform: scale(.82)
}
55% {
opacity: .7;
transform: scaleX(1) scaleY(1.25)
}
}
.rightLightEllipse__41626 {
background: var(--blurple-49);
height: 23.5%;
inset-inline-end: -22.5%;
opacity: .45;
top: -11.7%;
transform: scale(.82);
width: 45%
}
@keyframes rightLightEllipse__41626 {
0%,to {
opacity: .45;
transform: scale(.82)
}
55% {
opacity: .7;
transform: scaleX(1) scaleY(1.25)
}
}
.centerEllipse__41626 {
background: var(--blurple-49);
height: 100%;
opacity: .45;
top: -50%;
transform: translate(50%) scale(.36);
width: 100%
}
@keyframes centerEllipse__41626 {
0%,to {
opacity: .45;
transform: scale(.36)
}
55% {
opacity: .6;
transform: scaleX(.7) scaleY(.3)
}
}
.full-motion .leftDarkEllipse__41626 {
animation: leftDarkEllipse__41626 4.5s ease-in-out infinite
}
.full-motion .leftLightEllipse__41626 {
animation: leftLightEllipse__41626 4.5s ease-in-out infinite
}
.full-motion .rightDarkEllipse__41626 {
animation: rightDarkEllipse__41626 4.5s ease-in-out infinite
}
.full-motion .rightLightEllipse__41626 {
animation: rightLightEllipse__41626 4.5s ease-in-out infinite
}
.full-motion .centerEllipse__41626 {
animation: centerEllipse__41626 4.5s ease-in-out infinite
}
.toastWrapper_d3c698 {
display: flex;
inset-inline-end: 0;
justify-content: flex-end;
pointer-events: all;
position: absolute;
width: 100%
}
.toast_d3c698 {
cursor: pointer;
display: flex;
flex-direction: row;
overflow: hidden
}
.header_d3c698 {
align-items: center;
display: flex
}
.avatar_d3c698 {
border-radius: 100%;
height: 32px;
margin-inline-start:8px;width: 32px
}
.avatar_d3c698,.messageContentWrapper_d3c698 {
box-shadow: var(--legacy-elevation-high)
}
.messageContentWrapper_d3c698 {
align-items: center;
background: var(--background-base-lowest);
border-radius: 16px;
box-sizing: border-box;
color: var(--text-default);
display: flex;
min-height: 32px;
overflow: hidden;
padding: 4px 12px;
position: relative
}
.toast_d3c698:hover .messageContentWrapper_d3c698 {
background: var(--background-base-lower)
}
.messageContentWrapper_d3c698.mentioned_d3c698:before {
background: hsl(var(--yellow-300-hsl)/.15);
border-radius: 16px;
box-shadow: inset 0 0 0 2px hsl(var(--yellow-300-hsl)/.3);
content: "";
height: 100%;
inset-inline-start: 0;
position: absolute;
width: 100%
}
.messageContentWrapper_d3c698 .sticker_d3c698,.messageContentWrapper_d3c698 .emoji.jumboable {
padding: 4px 0
}
.messageContent_d3c698 {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.messageContentTrailingIcon_d3c698 {
flex-shrink: 0;
margin-inline-start:4px}
.messageContentLeadingIcon_d3c698 {
flex-shrink: 0;
margin-inline-end:4px}
.root_bfe55a {
align-items: center;
background: var(--black);
color: var(--white);
display: flex;
height: 100%;
justify-content: center;
position: relative;
width: 100%
}
html.keyboard-mode .root_bfe55a.idle_bfe55a:not(:focus-within),html:not(.keyboard-mode) .root_bfe55a.idle_bfe55a {
cursor: none
}
html.keyboard-mode .root_bfe55a.idle_bfe55a:not(:focus-within) .gradientContainer_bfe55a,html:not(.keyboard-mode) .root_bfe55a.idle_bfe55a .gradientContainer_bfe55a {
opacity: 0
}
html.keyboard-mode .root_bfe55a.idle_bfe55a:not(:focus-within) .topControls_bfe55a,html:not(.keyboard-mode) .root_bfe55a.idle_bfe55a .topControls_bfe55a {
opacity: 0;
transform: translate3d(0,-8px,0)
}
html.keyboard-mode .root_bfe55a.idle_bfe55a:not(:focus-within) .bottomControls_bfe55a,html:not(.keyboard-mode) .root_bfe55a.idle_bfe55a .bottomControls_bfe55a {
opacity: 0;
transform: translate3d(0,8px,0)
}
.videoControls_bfe55a {
pointer-events: none;
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0;
display: flex;
flex-direction: column;
justify-content: space-between;
padding: 0 var(--space-md) var(--space-md);
z-index: 1001
}
.gradientContainer_bfe55a {
background-image: linear-gradient(#000,rgba(0,0,0,.738) 19%,rgba(0,0,0,.541) 34%,rgba(0,0,0,.382) 47%,rgba(0,0,0,.278) 56.5%,rgba(0,0,0,.194) 65%,rgba(0,0,0,.126) 73%,rgba(0,0,0,.075) 80.2%,rgba(0,0,0,.042) 86.1%,rgba(0,0,0,.021) 91%,rgba(0,0,0,.008) 95.2%,rgba(0,0,0,.002) 98.2%,transparent);
height: 160px;
pointer-events: none;
transition: opacity .2s ease-in-out
}
.gradientTop_bfe55a {
top: 0
}
.gradientBottom_bfe55a,.gradientTop_bfe55a {
inset-inline: 0;
position: absolute
}
.gradientBottom_bfe55a {
bottom: 0;
transform: scaleY(-1)
}
.controlSection_bfe55a {
pointer-events: all
}
.full-motion .controlSection_bfe55a {
transition: transform .2s ease-in-out,opacity .2s ease-in-out
}
.bottomControls_bfe55a,.topControls_bfe55a {
flex: 0 1 auto;
transform: translateZ(0);
width: 100%
}
.bottomControls_bfe55a {
align-items: center;
display: flex;
justify-content: space-between;
line-height: 0
}
.bottomControls_bfe55a .edgeControls_bfe55a:first-child:not(:empty) {
margin-inline-end:var(--space-lg)}
.bottomControls_bfe55a .edgeControls_bfe55a: last-child:not(:empty) {
margin-inline-start:var(--space-lg)
}
.edgeControls_bfe55a {
gap: var(--space-lg);
width: 100%
}
.screenMessage_bfe55a {
background-color: var(--opacity-black-60);
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0
}
.title_bfe55a {
font-size: 24px
}
.supportingText_bfe55a,.title_bfe55a {
font-weight: var(--font-weight-medium);
line-height: 1.25;
text-align: center
}
.supportingText_bfe55a {
font-size: 16px
}
.title_bfe55a {
color: var(--white)
}
.supportingText_bfe55a {
color: var(--primary-300)
}
.full-motion .arrow__6c50b {
transition: transform .2s ease-in-out
}
.up__6c50b {
transform: rotate(180deg)
}
.container_f0df50 {
inset-inline-start: 48px;
position: absolute
}
.emoji_f0df50 {
opacity: 0;
position: absolute
}
.full-motion .emoji1_f0df50 {
animation: floating-animation-1_f0df50 1.4s cubic-bezier(.25,.25,.75,.75)
}
.full-motion .emoji2_f0df50 {
animation: floating-animation-2_f0df50 1.4s cubic-bezier(.25,.25,.75,.75)
}
.full-motion .emoji3_f0df50 {
animation: floating-animation-3_f0df50 1.4s cubic-bezier(.25,.25,.75,.75)
}
.full-motion .emoji4_f0df50 {
animation: floating-animation-4_f0df50 1.4s cubic-bezier(.25,.25,.75,.75)
}
@keyframes floating-animation-1_f0df50 {
0% {
bottom: 0;
inset-inline-start: 0;
opacity: .6;
transform: scale(1)
}
33% {
bottom: 100px;
inset-inline-start: -10px;
opacity: .8;
transform: scale(1.75)
}
66% {
bottom: 200px;
inset-inline-start: -20px;
opacity: .8;
transform: scale(1.75)
}
to {
bottom: 300px;
inset-inline-start: -20px;
opacity: 0;
transform: scale(1.25)
}
}
@keyframes floating-animation-2_f0df50 {
0% {
bottom: 25px;
inset-inline-start: 0;
opacity: 0;
transform: scale(1.4)
}
25% {
bottom: 100px;
inset-inline-start: 15px;
opacity: .6;
transform: scale(2)
}
50% {
bottom: 175px;
inset-inline-start: 10px;
opacity: .8;
transform: scale(1.75)
}
75% {
bottom: 250px;
inset-inline-start: 15px;
opacity: .8;
transform: scale(1.5)
}
to {
bottom: 325px;
inset-inline-start: 20px;
opacity: 0;
transform: scale(1)
}
}
@keyframes floating-animation-3_f0df50 {
0% {
bottom: -20px;
inset-inline-start: 0;
opacity: 0;
transform: scale(1)
}
33% {
bottom: 80px;
inset-inline-start: 5px;
opacity: .8;
transform: scale(1.6)
}
66% {
bottom: 190px;
inset-inline-start: 10px;
opacity: .8;
transform: scale(1.3)
}
to {
bottom: 290px;
inset-inline-start: 15px;
opacity: 0;
transform: scale(1)
}
}
@keyframes floating-animation-4_f0df50 {
0% {
bottom: 60px;
inset-inline-start: 0;
opacity: .4;
transform: scale(1)
}
33% {
bottom: 160px;
inset-inline-start: -5px;
opacity: .8;
transform: scale(1.75)
}
66% {
bottom: 260px;
inset-inline-start: -10px;
opacity: .8;
transform: scale(1.25)
}
to {
bottom: 360px;
inset-inline-start: -15px;
opacity: 0;
transform: scale(1)
}
}
.chat_f75fb0 {
background: var(--background-gradient-chat,var(--background-base-lowest));
display: flex;
flex-direction: column;
min-height: 0;
min-width: 0;
overflow: hidden;
position: relative
}
.chat_f75fb0[data-has-border=true] {
border-top: 1px solid var(--app-frame-border)
}
[data-collapsed=true]>.chat_f75fb0 {
border-inline-start:1px solid var(--border-subtle);border-start-start-radius: var(--radius-md)
}
.refresh-fast-follow-distinct-borders .chat_f75fb0.threadSidebarOpen_f75fb0 {
border-inline-end-color:var(--app-frame-border)}
.chat_f75fb0 {
flex: 1 1 auto
}
.chat_f75fb0 .uploadArea_f75fb0 {
position: fixed
}
.chat_f75fb0.threadSidebarOpen_f75fb0 {
border-inline-end:1px solid var(--border-subtle);border-radius: 0 8px 8px 0
}
.chat_f75fb0.threadSidebarOpen_f75fb0 .uploadArea_f75fb0 {
border-radius: 0 8px 8px 0;
margin-inline-end:8px;width: auto
}
.chat_f75fb0.threadSidebarOpen_f75fb0.threadSidebarFloating_f75fb0 .uploadArea_f75fb0 {
border-radius: 0;
margin-inline-end:0}
.typing_f75fb0 {
display: flex
}
.form_f75fb0 {
flex-shrink: 0;
margin-top: -16px;
position: relative
}
.form_f75fb0,.formWithLoadedChatInput_f75fb0 {
padding-inline:var(--space-xs)}
.formWithLoadedChatInput_f75fb0: before {
content:"";
height: .5rem;
position: absolute
}
.formWithLoadedChatInput_f75fb0 :before {
top: 0;
inset-inline: 0
}
.formWithLoadedChatInput_f75fb0:before {
background: linear-gradient(to bottom,transparent,var(--background-base-low) 100%)
}
.custom-theme-background .formWithLoadedChatInput_f75fb0:before {
content: unset
}
.chatContent_f75fb0 {
background: var(--background-gradient-chat,var(--background-base-lower));
display: flex;
flex: 1 1 auto;
flex-direction: column;
min-height: 0;
min-width: 0;
position: relative
}
.cursorPointer_f75fb0 {
cursor: pointer
}
.content_f75fb0 {
align-items: stretch;
display: flex;
flex: 1 1 auto;
flex-direction: row;
justify-content: stretch;
min-height: 0;
min-width: 0;
position: relative
}
.content_f75fb0.noChat_f75fb0 {
overflow: hidden
}
.content_f75fb0:before {
box-shadow: var(--shadow-ledge);
content: "";
display: none;
height: 1px;
position: absolute;
top: -1px;
inset-inline: 0;
pointer-events: none;
z-index: 1
}
.channelBottomBarArea_f75fb0 {
display: flex;
flex-direction: row
}
.channelTextArea_f75fb0 {
background: var(--background-gradient-highest,var(--chat-background-default));
margin-bottom: var(--custom-chat-input-margin-bottom)
}
.refresh-fast-follow-avatars .form_f75fb0 {
padding-inline:min(var(--space-xs),var(--space-8))}
.titleWrapper_f75fb0 {
align-items: center;
display: flex;
flex: 1 1 auto;
overflow: hidden
}
.editPartyIcon_f75fb0 {
cursor: pointer;
margin-inline-end:4px;opacity: .6;
transition: opacity .2s ease
}
.editPartyIcon_f75fb0:hover {
opacity: 1
}
.channelName_f75fb0 {
margin: 0 8px
}
.avatar_f75fb0 {
margin-inline-end:var(--space-8)}
.parentChannelName_f75fb0 {
color: var(--text-default)
}
.parentChannelName_f75fb0:hover {
color: var(--text-strong)
}
.title_f75fb0 {
flex: 0 0 auto;
padding-inline-end:var(--space-xs);padding-top: var(--space-8);
position: relative;
z-index: 100
}
.gdm_f75fb0 {
padding-inline-start:calc(var(--custom-message-margin-horizontal)/2)}
.followButton_f75fb0 {
margin-inline-end: 8px;
padding: 4px 8px
}
.status_f75fb0 {
align-items: center;
display: flex;
flex: 0 0 auto;
margin-inline-end:8px}
.stop-animations .title_f75fb0 {
-webkit-app-region: no-drag
}
.theme-light.custom-client-theme .title_f75fb0 {
--background-gradient-lowest: var(--background-gradient-chat)
}
.guildBreadcrumbContainer_f75fb0 {
align-items: center;
cursor: pointer;
display: flex;
flex-shrink: 0
}
.guildSidebar_f75fb0 {
flex-shrink: 0
}
.guildBreadcrumbIcon_f75fb0 {
margin-inline-end:var(--space-4)}
.loader_f75fb0 {
align-items: center;
display: flex;
justify-content: center;
width: 100%
}
.enable-forced-colors .cursorPointer_f75fb0 {
background-color: ButtonFace;
color: ButtonText;
forced-color-adjust: none;
text-decoration: underline
}
.forumPostTitle_f75fb0 {
margin-inline-start:8px}
.forumPostSidebarTitle_f75fb0 {
margin-inline-start:0}
.subtitleContainer_f75fb0 {
display: flex;
flex-direction: column;
position: relative
}
.secureFramesIcon_f75fb0 {
margin-inline-start:4px}
.shaker_f75fb0 {
flex: 1;
width: 100%
}
.linkedLobbyTooltip_f75fb0 {
margin-inline-end:8px}
.linkedLobby_f75fb0,.linkedLobbyTooltip_f75fb0 {
align-items: center;
display: flex
}
.linkedLobbyApplicationIcon_f75fb0 {
border-radius: var(--radius-sm);
height: 14px;
margin-inline:8px 4px;width: 14px
}
.linkedLobbyEducationTooltipWrapper_f75fb0 {
max-width: 288px;
pointer-events: all
}
.linkedLobbyEducationTooltip_f75fb0 {
align-items: center;
display: flex;
flex-direction: column;
gap: 4px;
padding: 8px 4px;
text-align: center
}
.linkedLobbyEducationTooltip_f75fb0 p {
margin: 0
}
.linkedLobbyEducationTooltipCloseClickContainer_f75fb0 {
cursor: pointer;
inset-inline-end: 8px;
position: absolute;
top: 8px
}
.linkedLobbyEducationTooltipCloseClickContainer_f75fb0:hover .linkedLobbyEducationTooltipCloseIcon_f75fb0 {
color: var(--interactive-text-active)
}
.linkedLobbyEducationTooltipCloseIcon_f75fb0 {
color: var(--icon-muted);
height: 24px;
width: 24px
}
.container__01ae2 {
background: var(--background-gradient-app-frame,var(--background-base-lowest));
border-inline-end:1px solid var(--app-frame-border);border-inline-start: 1px solid var(--app-frame-border);
border-radius: 8px 0 0 8px;
border-top: 1px solid var(--app-frame-border);
box-sizing: border-box;
display: flex;
flex: 0 0 auto;
flex-direction: column;
overflow: hidden;
position: relative;
width: 400px
}
.floating__01ae2 {
border-inline-end:1px solid var(--background-base-lower);border-inline-start: 1px solid var(--background-base-lower);
border-top: 1px solid var(--background-base-lower);
bottom: 0;
filter: drop-shadow(0 8px 40px var(--opacity-black-32));
inset-inline-end: 0;
position: absolute;
top: 0;
width: 400px;
z-index: 100
}
.notFloating__01ae2 {
display: none
}
.resizeHandle__01ae2 {
background: var(--background-gradient-app-frame,var(--background-base-lowest));
cursor: ew-resize;
flex-shrink: 0;
height: 100%;
width: var(--chat-resize-handle-width)
}
.chatTarget__01ae2 {
background-color: var(--background-base-lowest)
}
.chatLayerWrapper__01ae2 {
display: flex;
height: 100%;
inset-inline-end: 0;
justify-content: flex-end;
pointer-events: auto;
position: absolute;
top: 0
}
.hidden__01ae2 {
display: none
}
.enable-forced-colors .resizeHandle__01ae2 {
background-color: ButtonText;
width: 4px
}
.chat_ee72fa {
align-items: stretch;
display: flex;
flex: 1 1 auto;
flex-direction: column;
justify-content: stretch;
min-height: 0;
min-width: 0;
position: relative
}
.chat_ee72fa:before {
box-shadow: var(--elevation-low);
content: "";
display: block;
height: 1px;
position: absolute;
top: -1px;
inset-inline: 0;
pointer-events: none;
z-index: 1
}
.divider_cfc051 {
margin-inline-end:16px}
.eventSchedule_cfc051 {
flex: 1
}
.eventName_cfc051 {
margin: auto 8px;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.akaBadge__488b1 {
background-color: var(--background-base-lower);
margin-inline-start:8px}
.akaBadge__488b1,.nicknames__488b1 {
color: var(--text-default)
}
.nicknames__488b1 {
flex: 1 1 auto;
font-size: 14px;
font-weight: var(--font-weight-medium);
line-height: 18px;
margin-block:0;margin-inline:8px 0;min-width: 0;
width: 100%
}
.nicknames__488b1 span {
cursor: pointer
}
.avatars__488b1 {
margin-inline-start:8px}
.avatar__488b1 {
border-radius: 50%;
cursor: pointer;
display: block;
height: 16px;
width: 16px
}
.tooltip__488b1 {
display: inline
}
.spacer__488b1 {
flex: 1 1 auto
}
.divider__488b1 {
margin-inline-start:8px}
.moreAvatars__488b1 {
box-sizing: border-box;
color: var(--interactive-text-default);
cursor: pointer;
height: 16px;
overflow: hidden;
width: 16px
}
.moreAvatars__488b1:hover {
color: var(--interactive-text-hover)
}
.plusIcon__488b1 {
display: block;
height: 18px;
margin-top: -1px;
margin-inline-start:-1px;width: 18px
}
.hoverableContainer__754bd {
align-items: center;
align-self: stretch;
border-radius: 8px;
cursor: pointer;
display: flex;
flex-direction: row;
gap: calc(var(--custom-message-margin-horizontal)/2);
height: 32px;
padding-inline:calc(var(--custom-message-margin-horizontal)/2);white-space: nowrap
}
.hoverableContainer__754bd .editIcon__754bd {
display: none
}
.hoverableContainer__754bd .gdmIcon__754bd {
margin-inline-end:4px}
.hoverableContainer__754bd:hover {
background-color: var(--background-mod-subtle)
}
.hoverableContainer__754bd:hover .editIcon__754bd {
display: block
}
.heading-sm\/normal__6ec1a {
font-family: var(--font-display);
font-size: 14px;
font-weight: 400;
line-height: 1.2857142857142858
}
.heading-sm\/normal__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.heading-sm\/medium__6ec1a {
font-family: var(--font-display);
font-size: 14px;
font-weight: 500;
line-height: 1.2857142857142858
}
.heading-sm\/medium__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.heading-sm\/semibold__6ec1a {
font-family: var(--font-display);
font-size: 14px;
font-weight: 600;
line-height: 1.2857142857142858
}
.heading-sm\/semibold__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.heading-sm\/bold__6ec1a {
font-family: var(--font-display);
font-size: 14px;
font-weight: 700;
line-height: 1.2857142857142858
}
.heading-sm\/bold__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.heading-sm\/extrabold__6ec1a {
font-family: var(--font-display);
font-size: 14px;
font-weight: 800;
line-height: 1.2857142857142858
}
.heading-sm\/extrabold__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.heading-md\/normal__6ec1a {
font-family: var(--font-display);
font-size: 16px;
font-weight: 400;
line-height: 1.25
}
.heading-md\/normal__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.heading-md\/medium__6ec1a {
font-family: var(--font-display);
font-size: 16px;
font-weight: 500;
line-height: 1.25
}
.heading-md\/medium__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.heading-md\/semibold__6ec1a {
font-family: var(--font-display);
font-size: 16px;
font-weight: 600;
line-height: 1.25
}
.heading-md\/semibold__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.heading-md\/bold__6ec1a {
font-family: var(--font-display);
font-size: 16px;
font-weight: 700;
line-height: 1.25
}
.heading-md\/bold__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.heading-md\/extrabold__6ec1a {
font-family: var(--font-display);
font-size: 16px;
font-weight: 800;
line-height: 1.25
}
.heading-md\/extrabold__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.heading-lg\/normal__6ec1a {
font-family: var(--font-display);
font-size: 20px;
font-weight: 400;
line-height: 1.2
}
.heading-lg\/normal__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.heading-lg\/medium__6ec1a {
font-family: var(--font-display);
font-size: 20px;
font-weight: 500;
line-height: 1.2
}
.heading-lg\/medium__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.heading-lg\/semibold__6ec1a {
font-family: var(--font-display);
font-size: 20px;
font-weight: 600;
line-height: 1.2
}
.heading-lg\/semibold__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.heading-lg\/bold__6ec1a {
font-family: var(--font-display);
font-size: 20px;
font-weight: 700;
line-height: 1.2
}
.heading-lg\/bold__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.heading-lg\/extrabold__6ec1a {
font-family: var(--font-display);
font-size: 20px;
font-weight: 800;
line-height: 1.2
}
.heading-lg\/extrabold__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.heading-xl\/normal__6ec1a {
font-family: var(--font-display);
font-size: 24px;
font-weight: 400;
line-height: 1.25
}
.heading-xl\/normal__6ec1a.fontScaling__6ec1a {
font-size: 1.5rem
}
.heading-xl\/medium__6ec1a {
font-family: var(--font-display);
font-size: 24px;
font-weight: 500;
line-height: 1.25
}
.heading-xl\/medium__6ec1a.fontScaling__6ec1a {
font-size: 1.5rem
}
.heading-xl\/semibold__6ec1a {
font-family: var(--font-display);
font-size: 24px;
font-weight: 600;
line-height: 1.25
}
.heading-xl\/semibold__6ec1a.fontScaling__6ec1a {
font-size: 1.5rem
}
.heading-xl\/bold__6ec1a {
font-family: var(--font-display);
font-size: 24px;
font-weight: 700;
line-height: 1.25
}
.heading-xl\/bold__6ec1a.fontScaling__6ec1a {
font-size: 1.5rem
}
.heading-xl\/extrabold__6ec1a {
font-family: var(--font-display);
font-size: 24px;
font-weight: 800;
line-height: 1.25
}
.heading-xl\/extrabold__6ec1a.fontScaling__6ec1a {
font-size: 1.5rem
}
.heading-xxl\/normal__6ec1a {
font-family: var(--font-display);
font-size: 32px;
font-weight: 400;
line-height: 1.25
}
.heading-xxl\/normal__6ec1a.fontScaling__6ec1a {
font-size: 2rem
}
.heading-xxl\/medium__6ec1a {
font-family: var(--font-display);
font-size: 32px;
font-weight: 500;
line-height: 1.25
}
.heading-xxl\/medium__6ec1a.fontScaling__6ec1a {
font-size: 2rem
}
.heading-xxl\/semibold__6ec1a {
font-family: var(--font-display);
font-size: 32px;
font-weight: 600;
line-height: 1.25
}
.heading-xxl\/semibold__6ec1a.fontScaling__6ec1a {
font-size: 2rem
}
.heading-xxl\/bold__6ec1a {
font-family: var(--font-display);
font-size: 32px;
font-weight: 700;
line-height: 1.25
}
.heading-xxl\/bold__6ec1a.fontScaling__6ec1a {
font-size: 2rem
}
.heading-xxl\/extrabold__6ec1a {
font-family: var(--font-display);
font-size: 32px;
font-weight: 800;
line-height: 1.25
}
.heading-xxl\/extrabold__6ec1a.fontScaling__6ec1a {
font-size: 2rem
}
.eyebrow__6ec1a {
font-family: var(--font-display);
font-size: 12px;
font-weight: 700;
letter-spacing: .02em;
line-height: 1.3333333333333333;
text-transform: uppercase
}
.eyebrow__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.heading-deprecated-12\/normal__6ec1a {
font-family: var(--font-display);
font-size: 12px;
font-weight: 400;
line-height: 1.3333333333333333
}
.heading-deprecated-12\/normal__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.heading-deprecated-12\/medium__6ec1a {
font-family: var(--font-display);
font-size: 12px;
font-weight: 500;
line-height: 1.3333333333333333
}
.heading-deprecated-12\/medium__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.heading-deprecated-12\/semibold__6ec1a {
font-family: var(--font-display);
font-size: 12px;
font-weight: 600;
line-height: 1.3333333333333333
}
.heading-deprecated-12\/semibold__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.heading-deprecated-12\/bold__6ec1a {
font-family: var(--font-display);
font-size: 12px;
font-weight: 700;
line-height: 1.3333333333333333
}
.heading-deprecated-12\/bold__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.heading-deprecated-12\/extrabold__6ec1a {
font-family: var(--font-display);
font-size: 12px;
font-weight: 800;
line-height: 1.3333333333333333
}
.heading-deprecated-12\/extrabold__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.redesign\/heading-18\/bold__6ec1a {
font-family: var(--font-display);
font-size: 18px;
font-weight: 700;
line-height: 1.3333333333333333
}
.redesign\/heading-18\/bold__6ec1a.fontScaling__6ec1a {
font-size: 1.125rem
}
.text-xxs\/normal__6ec1a {
font-family: var(--font-primary);
font-size: 10px;
font-weight: 400;
line-height: 1.2
}
.text-xxs\/normal__6ec1a.fontScaling__6ec1a {
font-size: .625rem
}
.text-xxs\/medium__6ec1a {
font-family: var(--font-primary);
font-size: 10px;
font-weight: 500;
line-height: 1.2
}
.text-xxs\/medium__6ec1a.fontScaling__6ec1a {
font-size: .625rem
}
.text-xxs\/semibold__6ec1a {
font-family: var(--font-primary);
font-size: 10px;
font-weight: 600;
line-height: 1.2
}
.text-xxs\/semibold__6ec1a.fontScaling__6ec1a {
font-size: .625rem
}
.text-xxs\/bold__6ec1a {
font-family: var(--font-primary);
font-size: 10px;
font-weight: 700;
line-height: 1.2
}
.text-xxs\/bold__6ec1a.fontScaling__6ec1a {
font-size: .625rem
}
.text-xs\/normal__6ec1a {
font-family: var(--font-primary);
font-size: 12px;
font-weight: 400;
line-height: 1.3333333333333333
}
.text-xs\/normal__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.text-xs\/medium__6ec1a {
font-family: var(--font-primary);
font-size: 12px;
font-weight: 500;
line-height: 1.3333333333333333
}
.text-xs\/medium__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.text-xs\/semibold__6ec1a {
font-family: var(--font-primary);
font-size: 12px;
font-weight: 600;
line-height: 1.3333333333333333
}
.text-xs\/semibold__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.text-xs\/bold__6ec1a {
font-family: var(--font-primary);
font-size: 12px;
font-weight: 700;
line-height: 1.3333333333333333
}
.text-xs\/bold__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.text-sm\/normal__6ec1a {
font-family: var(--font-primary);
font-size: 14px;
font-weight: 400;
line-height: 1.2857142857142858
}
.text-sm\/normal__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.text-sm\/medium__6ec1a {
font-family: var(--font-primary);
font-size: 14px;
font-weight: 500;
line-height: 1.2857142857142858
}
.text-sm\/medium__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.text-sm\/semibold__6ec1a {
font-family: var(--font-primary);
font-size: 14px;
font-weight: 600;
line-height: 1.2857142857142858
}
.text-sm\/semibold__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.text-sm\/bold__6ec1a {
font-family: var(--font-primary);
font-size: 14px;
font-weight: 700;
line-height: 1.2857142857142858
}
.text-sm\/bold__6ec1a.fontScaling__6ec1a {
font-size: .875rem
}
.text-md\/normal__6ec1a {
font-family: var(--font-primary);
font-size: 16px;
font-weight: 400;
line-height: 1.25
}
.text-md\/normal__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.text-md\/medium__6ec1a {
font-family: var(--font-primary);
font-size: 16px;
font-weight: 500;
line-height: 1.25
}
.text-md\/medium__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.text-md\/semibold__6ec1a {
font-family: var(--font-primary);
font-size: 16px;
font-weight: 600;
line-height: 1.25
}
.text-md\/semibold__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.text-md\/bold__6ec1a {
font-family: var(--font-primary);
font-size: 16px;
font-weight: 700;
line-height: 1.25
}
.text-md\/bold__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.text-lg\/normal__6ec1a {
font-family: var(--font-primary);
font-size: 20px;
font-weight: 400;
line-height: 1.2
}
.text-lg\/normal__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.text-lg\/medium__6ec1a {
font-family: var(--font-primary);
font-size: 20px;
font-weight: 500;
line-height: 1.2
}
.text-lg\/medium__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.text-lg\/semibold__6ec1a {
font-family: var(--font-primary);
font-size: 20px;
font-weight: 600;
line-height: 1.2
}
.text-lg\/semibold__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.text-lg\/bold__6ec1a {
font-family: var(--font-primary);
font-size: 20px;
font-weight: 700;
line-height: 1.2
}
.text-lg\/bold__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.redesign\/message-preview\/normal__6ec1a {
font-family: var(--font-primary);
font-size: 15px;
font-weight: 400;
line-height: 1.3333333333333333
}
.redesign\/message-preview\/normal__6ec1a.fontScaling__6ec1a {
font-size: .9375rem
}
.redesign\/message-preview\/medium__6ec1a {
font-family: var(--font-primary);
font-size: 15px;
font-weight: 500;
line-height: 1.3333333333333333
}
.redesign\/message-preview\/medium__6ec1a.fontScaling__6ec1a {
font-size: .9375rem
}
.redesign\/message-preview\/semibold__6ec1a {
font-family: var(--font-primary);
font-size: 15px;
font-weight: 600;
line-height: 1.3333333333333333
}
.redesign\/message-preview\/semibold__6ec1a.fontScaling__6ec1a {
font-size: .9375rem
}
.redesign\/message-preview\/bold__6ec1a {
font-family: var(--font-primary);
font-size: 15px;
font-weight: 700;
line-height: 1.3333333333333333
}
.redesign\/message-preview\/bold__6ec1a.fontScaling__6ec1a {
font-size: .9375rem
}
.redesign\/channel-title\/normal__6ec1a {
font-family: var(--font-primary);
font-size: 16px;
font-weight: 400;
line-height: 1.375
}
.redesign\/channel-title\/normal__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.redesign\/channel-title\/medium__6ec1a {
font-family: var(--font-primary);
font-size: 16px;
font-weight: 500;
line-height: 1.375
}
.redesign\/channel-title\/medium__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.redesign\/channel-title\/semibold__6ec1a {
font-family: var(--font-primary);
font-size: 16px;
font-weight: 600;
line-height: 1.375
}
.redesign\/channel-title\/semibold__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.redesign\/channel-title\/bold__6ec1a {
font-family: var(--font-primary);
font-size: 16px;
font-weight: 700;
line-height: 1.375
}
.redesign\/channel-title\/bold__6ec1a.fontScaling__6ec1a {
font-size: 1rem
}
.display-sm__6ec1a {
font-family: var(--font-headline);
font-size: 20px;
font-weight: 800;
line-height: 1
}
.display-sm__6ec1a.fontScaling__6ec1a {
font-size: 1.25rem
}
.display-md__6ec1a {
font-family: var(--font-headline);
font-size: 34px;
font-weight: 800;
line-height: 1.0588235294117647
}
.display-md__6ec1a.fontScaling__6ec1a {
font-size: 2.125rem
}
.display-lg__6ec1a {
font-family: var(--font-headline);
font-size: 44px;
font-weight: 800;
line-height: .9545454545454546
}
.display-lg__6ec1a.fontScaling__6ec1a {
font-size: 2.75rem
}
.code__6ec1a {
font-family: var(--font-code);
font-size: 12px;
font-weight: 700;
line-height: 1.3333333333333333
}
.code__6ec1a.fontScaling__6ec1a {
font-size: .75rem
}
.topic__6ec1a {
flex: 1 1 auto;
font-size: 14px;
font-weight: var(--font-weight-medium);
line-height: 18px;
margin-block:0;margin-inline:8px 0;min-width: 0;
overflow: hidden;
overflow-wrap: normal;
position: relative;
text-overflow: ellipsis;
white-space: nowrap;
color: var(--text-muted)
}
.topic__6ec1a a {
color: var(--text-link)
}
.topic__6ec1a a:hover {
text-decoration: underline
}
.topicClickTarget__6ec1a {
bottom: 0;
pointer-events: none;
position: absolute;
top: 0;
inset-inline: 0
}
@media (-webkit-max-device-pixel-ratio: 1) {
.theme-light .topic__6ec1a {
font-weight:var(--font-weight-normal)
}
}
.topic__6ec1a.expandable__6ec1a {
cursor: pointer
}
.desktopTooltip__7b565 {
display: flex;
padding: 4px 0;
width: 100%
}
.infoIcon__7b565 {
color: var(--white);
margin-inline-end:4px}
.wrapper_ef0e9b {
width: 100%
}
.percentCompleteWrapper_ef0e9b {
display: flex
}
.percentCompleteLabel_ef0e9b {
flex: 1 1 auto;
text-align: end
}
.progressBar_ef0e9b {
height: 4px;
position: relative
}
.progressBar_ef0e9b:after {
content: "";
opacity: .2;
width: 100%
}
.progressBar_ef0e9b:after,.progressBarFill_ef0e9b {
background-color: currentColor;
border-radius: 4px;
height: 100%;
inset-inline-start: 0;
position: absolute;
top: 0
}
.progressBarFill_ef0e9b:after {
box-shadow: 0 0 8px currentColor;
content: "";
height: 100%;
inset-inline-start: 0;
opacity: .7;
position: absolute;
top: 0;
width: 100%
}
.percentCompleteLabelOffset_ef0e9b,.progressBarFill_ef0e9b {
transition: width .3s ease-in-out
}
.wrapper_f7a803 {
align-items: center;
background-color: var(--background-base-lower);
border-radius: 8px;
color: var(--text-default);
display: flex;
gap: 8px;
margin-bottom: 8px;
padding: 8px;
position: relative
}
.copy_f7a803 {
margin-bottom: 0
}
.rewardTile_f7a803 {
border-radius: 4px;
flex: 0 0 auto;
height: 58px;
width: 58px
}
.wrapper__19b5e {
align-items: center;
background-color: var(--background-base-lowest);
border-radius: 8px;
box-shadow: var(--shadow-border),var(--shadow-high);
box-sizing: border-box;
display: flex;
gap: 8px;
inset-inline-start: 0;
margin-inline-start:16px;padding: 8px;
position: absolute;
top: 100%;
width: 385px
}
.wrapperAccepted__19b5e {
width: 305px
}
.rewardTileWrapper__19b5e {
flex: 0 0 auto;
height: 76px;
position: relative;
width: 76px
}
.rewardTile__19b5e {
border-radius: 4px;
display: block
}
.rewardTile__19b5e.rewardTile__19b5e {
height: 100%;
width: 100%
}
.heading__19b5e .rewardTile__19b5e {
flex: 0 0 auto;
height: 38px;
width: 38px
}
.promotedTag__19b5e {
box-sizing: border-box;
inset-inline-start: 4px;
position: absolute;
text-align: center;
width: calc(100% - 8px);
word-break: break-word;
z-index: 1
}
.content__19b5e {
flex: 1 1 auto
}
.heading__19b5e {
align-items: center;
display: flex;
gap: 8px;
margin-bottom: 6px
}
.headingWithSubmenu__19b5e {
display: flex;
gap: 4px;
margin-bottom: 2px
}
.questTitle__19b5e {
flex: 1 1 auto;
margin-inline-end:24px}
.gameTile__19b5e {
border-radius: 4px;
flex: 0 0 auto;
height: 38px;
width: 38px
}
.ctas__19b5e {
display: flex;
gap: 8px
}
.submenuWrapper__19b5e {
cursor: pointer;
inset-inline-end: 8px;
position: absolute;
top: 8px
}
.submenuIcon__19b5e {
color: var(--interactive-text-default);
height: 24px;
width: 24px
}
.submenuIcon__19b5e:focus,.submenuIcon__19b5e:hover {
color: var(--interactive-text-hover)
}
.submenuIcon__19b5e:active {
color: var(--interactive-text-active)
}
.clipsEnabledIndicator__8c88a {
display: flex;
margin: 0 8px
}
.clipBadgeText__8c88a {
}
.clipBadgeIcon__8c88a {
padding-inline-start:4px;width: var(--custom-clips-enabled-indicator-badge-icon-dimension-override)
}
@media (max-width: 920px) {
.clipBadgeText__8c88a {
display:none
}
.clipBadgeIcon__8c88a {
border-radius: var(--radius-sm);
height: var(--custom-clips-enabled-indicator-badge-icon-dimension-override);
padding: 2px
}
}
.chatIcon__233f8 {
align-items: center;
display: flex;
justify-content: center;
position: relative
}
.chatIcon__233f8 svg {
flex-shrink: 0
}
.chatIcon__233f8:hover .unreadCount__233f8 {
background: var(--white)
}
.chatIcon__233f8:hover .unreadCount__233f8.mention__233f8 {
background: var(--red-360)
}
.upArrow__233f8 {
transform: rotate(180deg)
}
.downArrow__233f8 {
transform: rotate(0deg)
}
.badge__233f8 {
margin-top: 14px
}
.root_d529e9 {
background-color: var(--background-surface-high);
border-radius: 4px;
display: flex;
flex-direction: column;
max-height: 260px;
width: 240px
}
.root_d529e9 .voiceUsers_d529e9 {
padding: 0
}
.header_d529e9 {
color: var(--interactive-text-default);
padding: var(--custom-channel-call-participants-popout-padding-value);
padding-bottom: 9px;
text-transform: uppercase
}
.scroller_d529e9 {
padding: var(--custom-channel-call-participants-popout-padding-value);
padding-inline-start:8px;padding-top: 0
}
.button__9db96 {
margin-inline-start:0}
.divider__9db96 {
background: var(--border-strong);
margin-inline-end:16px}
.speakers__9db96 {
display: flex;
flex-direction: row
}
.lastButton__9db96 {
margin-inline-end:8px}
.avatar__49508 {
flex-shrink: 0
}
.divider__49508 {
background: var(--primary-700)
}
.channelStatusClickable__49508 {
align-items: center;
color: var(--channel-icon);
display: flex;
margin-inline-start:28px;max-width: 50%;
width: -moz-fit-content;
width: fit-content
}
.channelStatusClickable__49508 .channelStatus__49508 {
font-size: 12px;
line-height: 16px
}
.hoverable__49508:hover {
color: var(--interactive-text-hover);
cursor: pointer
}
.channelStatus__49508 {
color: var(--channel-icon);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.subtitleContainer__49508 {
display: flex;
flex-direction: column;
position: relative
}
.pencilIcon__49508,.secureFramesIcon__49508 {
margin-inline-start:4px}
.pencilIcon__49508 {
min-width: 16px
}
.playingText__49508 {
align-items: center;
color: var(--primary-300);
display: flex;
text-overflow: ellipsis
}
.eventStatusText__49508,.playingText__49508 {
overflow: hidden;
white-space: nowrap
}
.eventStatusText__49508 {
font-weight: var(--font-weight-semibold);
margin-inline-end:16px}
.container__49508 {
align-items: center;
display: flex;
flex-direction: row;
gap: var(--space-xs);
justify-content: center
}
.activityIcon__49508 {
border-radius: var(--radius-xs);
height: 24px;
margin-inline-end:10px;width: 24px
}
.headerBar__49508 {
justify-content: flex-start;
padding-inline-end:var(--space-md)}
.headerBarChildren__49508 {
gap: var(--space-xs)
}
.title__49508 {
margin: 0;
padding: 0
}
.toolbar__49508 {
gap: var(--space-md);
padding-inline-start:0}
.iconWrapper__49508 {
height: 28px;
width: 28px
}
.actionBarButton__18c2e {
border-radius: 8px;
height: 24px;
margin-inline-end:20px;padding: 0;
width: 24px
}
.voiceEffectsActionBar__68198 {
display: flex
}
.divider__68198 {
background-color: var(--primary-700);
border-radius: 0;
height: 24px;
margin-inline-end:20px;width: 1px
}
.wrapper_cb9592 {
background-color: var(--background-base-lowest);
display: flex;
flex: 0 0 auto;
position: relative;
z-index: 2
}
.wrapper_cb9592.animated_cb9592 {
transition: height .35s ease
}
.wrapper_cb9592.normal_cb9592 {
height: 50%
}
.wrapper_cb9592.haven_cb9592 {
height: 100%
}
.wrapper_cb9592.minimum_cb9592 {
background-color: var(--background-surface-high);
height: 240px
}
.wrapper_cb9592.minimum_cb9592.video_cb9592 {
height: 284px
}
.wrapper_cb9592.fullScreen_cb9592,.wrapper_cb9592.noChat_cb9592,.wrapper_cb9592.sidebarOpen_cb9592 {
height: 100%
}
.wrapper_cb9592.fullScreen_cb9592 {
width: 100%
}
.wrapper_cb9592.popout_cb9592 {
height: 100%;
width: 100%
}
.wrapper_cb9592.poppedOut_cb9592 {
height: 154px
}
.callContainer_cb9592 {
background: var(--black);
flex: 1 1 auto;
overflow: hidden
}
.high-contrast-mode:not([data-popout-root]) .callContainer_cb9592,.theme-midnight:not([data-popout-root]) .callContainer_cb9592 {
border-top: 1px solid var(--app-frame-border)
}
.high-contrast-mode:not([data-popout-root]) .wrapper_cb9592.sidebarOpen_cb9592 .callContainer_cb9592,.theme-midnight:not([data-popout-root]) .wrapper_cb9592.sidebarOpen_cb9592 .callContainer_cb9592 {
border-inline-end:1px solid var(--app-frame-border)}
.centerControls_cb9592 {
display: flex;
flex: 1 1 auto;
justify-content: center;
pointer-events: all
}
.leftTrayIcon_cb9592 {
margin-inline-end:16px}
@media (max-width: 456px) {
.leftTrayIcon_cb9592 {
margin-inline-end:8px
}
.rightTrayIcon_cb9592 {
margin-inline-start:8px}
.settingsButton_cb9592,.viewersButton_cb9592 {
display: none
}
}
.iconWrapper_cb9592 {
margin-inline-end:0;position: relative
}
.volumeSlider_cb9592 {
margin-top: -16px
}
.badge_cb9592 {
inset-inline-end: 0;
pointer-events: none;
position: absolute;
top: -8px
}
.headerWrapper_cb9592 {
margin: 0 -16px
}
.wrapper_cb9592.sidebarOpen_cb9592 .callContainer_cb9592,.wrapper_cb9592.sidebarOpen_cb9592 .callContent_cb9592 {
border-radius: 0 8px 8px 0
}
.wrapper_cb9592.sidebarOpen_cb9592 .callContent_cb9592 {
border-radius: 0 7px 7px 0
}
.wrapper_cb9592.minimum_cb9592 .callContainer_cb9592 {
background: none
}
.voiceChannelEffectsLayerContainer_cb9592 {
overflow-x: clip;
position: relative
}
.channelChatWrapper_cb9592 {
background-color: var(--background-base-lowest);
display: flex
}
.chatToasts_cb9592 {
height: 50%;
inset-inline-end: 12px;
overflow: hidden;
position: absolute;
top: 48px;
width: 304px
}
.enable-forced-colors .resizeHandle_cb9592 {
background-color: ButtonText
}
.channelChatWrapper_cb9592,.wrapper_cb9592 {
background: var(--background-gradient-app-frame,var(--background-base-lowest))
}
.emptyWrapper_f12222 {
align-items: center;
display: flex;
flex-direction: column;
margin: auto;
max-width: 340px
}
.emptyImage_f12222 {
filter: saturate(var(--saturation-factor,1));
width: 200px
}
.emptyTitle_f12222 {
margin: 16px 0 8px;
text-align: center
}
.emptySubtitle_f12222 {
margin-bottom: 16px;
text-align: center
}
.emptyCTA_f12222 {
padding: 12px 16px
}
.card__0c0bf {
border: 1px solid var(--border-subtle);
border-radius: 8px;
display: flex;
flex: 1;
flex-direction: column;
height: var(--custom-guild-directory-entry-card-card-height);
overflow: hidden;
position: relative
}
.addEntryCard__0c0bf,.card__0c0bf {
background-color: var(--background-base-low)
}
.addEntryCard__0c0bf {
align-items: center;
border: 2px dashed var(--text-muted);
border-radius: 4px;
box-sizing: border-box;
cursor: pointer;
justify-content: center
}
.addEntryCard__0c0bf:hover {
background-color: var(--interactive-background-hover)
}
.addEntryCard__0c0bf:active {
background-color: var(--interactive-background-active)
}
.addServerText__0c0bf {
margin-top: 8px
}
.cardHeader__0c0bf {
display: block;
height: 40px;
margin-bottom: 36px;
overflow: visible;
position: relative
}
.splash__0c0bf {
background-color: var(--background-mod-normal);
display: block;
inset-inline-start: 0;
position: absolute;
top: 0
}
.splash__0c0bf,.splashImage__0c0bf {
height: 100%;
width: 100%
}
.splashImage__0c0bf {
-o-object-fit: cover;
object-fit: cover
}
.guildIcon__0c0bf {
inset-inline-start: 12px;
position: absolute;
top: 20px
}
.icon__0c0bf {
background-color: var(--background-base-low)
}
.actionButtonsContainer__0c0bf {
align-items: center;
display: none;
inset-inline-end: 16px;
justify-content: center;
position: absolute;
top: 24px
}
.forceButtonsShow__0c0bf {
display: flex
}
.card__0c0bf:focus-within .actionButtonsContainer__0c0bf,.card__0c0bf:hover .actionButtonsContainer__0c0bf {
display: flex
}
.overflowIcon__0c0bf {
display: block;
height: 20px;
-o-object-fit: contain;
object-fit: contain;
width: 20px
}
.iconMask__0c0bf {
background-color: var(--background-base-lower);
padding: 4px
}
.avatar__0c0bf {
height: 100%;
width: 100%
}
.guildInfo__0c0bf {
align-content: stretch;
display: flex;
flex: 1 1 auto;
flex-direction: column;
overflow: hidden;
padding: 0 16px 16px;
position: relative
}
.title__0c0bf {
align-items: center;
display: flex;
width: 100%
}
.guildBadge__0c0bf {
flex: 0 0 16px;
height: 16px;
margin-inline:-2px 4px;width: 16px
}
.guildName__0c0bf {
white-space: nowrap
}
.description__0c0bf,.guildName__0c0bf {
overflow: hidden;
text-overflow: ellipsis
}
.description__0c0bf {
display: -webkit-box;
flex: 1 1 auto;
margin: 4px 0 16px;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical
}
.memberInfo__0c0bf {
flex: 0 0 auto
}
.memberCount__0c0bf,.memberInfo__0c0bf {
align-items: center;
display: flex
}
.memberCount__0c0bf {
font-size: 12px;
line-height: 16px;
margin-inline-end:16px}
.memberCount__0c0bf:last-child {
margin-inline-end:0}
.statusDot__0c0bf {
border-radius: 50%;
flex-shrink: 0;
height: 8px;
margin-inline-end:4px;width: 8px
}
.dotOnline__0c0bf {
background-color: var(--green-360)
}
.dotOffline__0c0bf {
background-color: var(--primary-300)
}
.joinButton__0c0bf {
margin-top: 16px
}
.pageContainer__09fde {
background: var(--background-gradient-chat,var(--background-base-lower));
display: flex;
flex: 1 1 auto;
flex-direction: column;
margin: 0 auto;
max-width: var(--custom-guild-directory-max-page-width);
min-width: minPageWidth;
overflow: hidden;
width: 100%
}
.scroller__09fde {
padding: 32px
}
.cardsContainer__09fde {
display: grid;
min-width: var(--custom-guild-directory-min-content-width);
padding: 24px 0;
grid-gap: var(--custom-guild-directory-gutter-size);
grid-template-columns: repeat(auto-fill,minmax(var(--custom-guild-directory-min-card-width),1fr))
}
.spinner__09fde {
margin-top: 56px
}
.header_a7218d {
overflow: hidden;
position: relative;
text-align: center
}
.header_a7218d,.headerImage_a7218d {
border-radius: 8px;
min-height: var(--custom-guild-directory-landing-min-header-height);
min-width: var(--custom-guild-directory-min-content-width)
}
.headerImage_a7218d {
display: inherit;
filter: saturate(var(--saturation-factor,1));
-o-object-fit: cover;
object-fit: cover;
width: 100%
}
.headerImageSimple_a7218d {
margin-bottom: 24px;
max-height: var(--custom-guild-directory-landing-min-header-height)
}
.headerImageBG_a7218d,.headerImageSimple_a7218d {
inset-inline-start: 0;
position: absolute;
top: 0
}
.headerImageBG_a7218d {
background: linear-gradient(180deg,hsl(var(--primary-800-hsl)/.2) 0,hsl(var(--primary-800-hsl)/1) 100%);
height: 100%;
width: 100%
}
.searchSubtitle_a7218d,.searchTitle_a7218d {
color: var(--white)
}
.searchSubtitle_a7218d {
margin: 8px 0
}
.headerContentWrapper_a7218d {
align-items: center;
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0;
display: flex;
justify-content: center
}
.headerContent_a7218d {
margin: 0 60px;
max-width: 700px;
width: 100%
}
.headerContentSmall_a7218d {
margin: 0 36px
}
.tabBar_a7218d {
border-bottom: 2px solid var(--border-subtle);
margin-bottom: -2px;
margin-top: 20px
}
.tabBarItem_a7218d {
margin-inline-end:32px;margin-bottom: -2px;
padding-bottom: 16px
}
.sectionHeader_a7218d {
margin-top: 20px
}
.searchContainer_a7218d {
background-color: var(--background-base-low);
border-radius: var(--radius-sm)
}
.searchHeader__83bd4 {
align-items: flex-start;
display: flex;
flex-direction: column;
gap: var(--space-8)
}
.searchHeader__83bd4 .searchPageBox__83bd4 {
border-radius: 8px;
box-sizing: border-box;
margin-top: 16px;
width: 100%
}
.searchPageBox__83bd4 .searchPageInput__83bd4 {
padding: 8px
}
.headerTitleWrapper__83bd4 {
align-items: center;
display: flex;
flex-direction: row
}
.arrow__83bd4 {
color: var(--interactive-text-default);
cursor: pointer
}
.arrow__83bd4:hover {
color: var(--interactive-text-hover)
}
.arrow__83bd4:focus {
color: var(--interactive-text-active)
}
.searchPageTitle__83bd4 {
color: var(--text-muted);
margin-inline-start:12px}
.searchPageTitle__83bd4 strong {
color: var(--text-strong)
}
.emptySearchWrapper__83bd4 {
align-items: center;
background-color: var(--background-base-lower);
border-radius: 8px;
display: flex;
flex: 1;
flex-direction: column;
justify-content: center;
margin: 24px 0;
padding: 92px 0
}
.emptySearchImage__83bd4 {
width: 120px
}
.emptySearchTitle__83bd4 {
margin-top: 28px
}
.emptySearchSubtitle__83bd4 {
margin-top: 8px
}
.chat_f02135 {
align-items: stretch;
display: flex;
flex: 1 1 auto;
flex-direction: column;
justify-content: stretch;
min-height: 0;
min-width: 0;
position: relative
}
.chat_f02135:before {
box-shadow: var(--elevation-low);
content: "";
display: none;
height: 1px;
position: absolute;
top: -1px;
inset-inline: 0;
pointer-events: none;
z-index: 1
}
.upsellPage_d204dc {
align-items: center;
display: flex;
flex: 1;
justify-content: center
}
.upsellContainer_d204dc {
background-color: var(--background-base-lower);
display: flex;
flex-direction: row;
gap: 24px;
padding: 24px
}
.upsellImage_d204dc {
height: 163px;
width: 201px
}
.upsellContent_d204dc {
display: flex;
flex-direction: column;
width: 357px
}
.bodyText_d204dc {
margin-bottom: auto;
margin-top: 8px
}
@keyframes horizontalBounce__3e795 {
0% {
transform: translateZ(0)
}
50% {
transform: translate3d(-8px,0,0)
}
to {
transform: translateZ(0)
}
}
.container__3e795 {
display: flex;
flex-direction: row;
inset-inline-end: 0;
margin-block:0 24px;margin-inline:auto 0;pointer-events: none;
position: absolute;
top: 40px;
z-index: 1
}
.full-motion .container__3e795 {
animation: horizontalBounce__3e795 3s ease-in-out .5s 4
}
.containerHide__3e795 {
opacity: 0;
transition: opacity .8s ease-out
}
.notice__3e795 {
border-radius: 4px;
box-shadow: var(--elevation-medium);
padding: 8px 16px;
position: relative
}
.notice__3e795,.noticeArrow__3e795 {
background-color: var(--orange-360)
}
.noticeArrow__3e795 {
align-self: center;
border-radius: 1px;
height: 8px;
transform: translateX(-4px) rotate(45deg);
transform-origin: center;
width: 8px;
z-index: 1
}
.carouselMaxWidth_b8429c {
align-self: stretch;
position: relative
}
.scroller_b8429c {
inset-inline: 0;
position: absolute
}
.tierPreviewsContainer_b8429c {
display: flex;
flex-direction: row;
min-width: 0
}
.tierPreviews_b8429c {
align-items: flex-start;
display: flex;
flex-grow: 1;
gap: 16px;
justify-content: center;
margin-bottom: 16px
}
@media (max-width: 485px) {
.tierPreviews_b8429c {
align-items:stretch;
flex-direction: column
}
.tierPreviewsContainer_b8429c {
padding-inline:16px}
}
.pageContainer__8893c {
align-items: center;
display: flex;
flex: 1 1 auto;
flex-direction: column;
padding-top: 32px;
position: relative;
width: 100%;
z-index: 1
}
.placeholdersContainer__8893c {
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0;
opacity: .3;
overflow: hidden;
z-index: 0
}
.guildIconContainer__8893c {
margin-bottom: 16px;
margin-top: 40px
}
.joinCtaTitle__8893c {
color: var(--text-default);
font-family: var(--font-display);
max-width: 640px;
text-align: center
}
.joinCtaTitle__8893c strong {
color: var(--text-strong)
}
.joinCtaSubtitle__8893c {
margin-bottom: 32px;
margin-top: 8px;
max-width: 640px
}
.tierPreviewsContainer__8893c {
overflow-x: scroll;
width: 100%
}
.tierPreviews__8893c {
display: flex;
flex-direction: row;
gap: 16px
}
.searchHeader_ae7890 {
align-items: center;
background: none;
border-bottom: 1px solid var(--border-subtle);
box-sizing: border-box;
display: flex;
flex-grow: 0;
flex-shrink: 0;
height: auto;
padding: var(--space-8) var(--space-16);
position: relative;
z-index: 2
}
.searchHeaderWithSubtitle_ae7890 {
min-height: 58px
}
.searchModeAndFiltersContainer_ae7890 {
align-items: center;
display: flex;
gap: 8px
}
.searchModeSelect_ae7890 {
background-color: var(--background-mod-muted);
border: 1px solid var(--border-subtle);
border-radius: var(--radius-sm);
box-shadow: var(--shadow-low);
min-height: 28px;
padding: 5px 10px
}
.searchHeaderTabList_ae7890 {
align-items: center;
display: grid;
gap: 8px;
grid-template-columns: repeat(3,min-content)
}
.searchHeaderTabList_ae7890 .searchHeaderTab_ae7890 {
margin-bottom: 0
}
.helpdeskLink_ae7890 {
color: var(--interactive-text-default)
}
.helpdeskLink_ae7890:hover {
color: var(--interactive-text-hover);
text-decoration: underline
}
.totalResultsWrapper_ae7890 {
display: flex
}
.totalResults_ae7890 {
display: flex;
flex-grow: 1;
font-weight: var(--font-weight-semibold);
padding-inline-end:1px}
.totalResultsWithSubtitle_ae7890 {
display: flex;
flex-direction: column;
padding: 2px 0
}
.spinnerWrapper_ae7890 {
align-items: center;
display: flex;
flex: 0;
height: 16px;
justify-content: center;
margin-inline-start:8px;stroke: var(--text-default);
width: 16px
}
.spinner_ae7890 {
height: 100%;
width: 100%
}
.spinnerPath_ae7890 {
stroke: var(--text-default)
}
.container_bd5bb4 {
align-items: center;
background-color: var(--background-base-lowest);
border-top: 1px solid var(--border-subtle);
display: flex;
gap: 8px;
padding: 12px 16px
}
.icons_bd5bb4 {
display: flex;
flex: 1;
gap: 16px;
justify-content: flex-end
}
.iconContainer_bd5bb4 {
cursor: pointer
}
.icon_bd5bb4 {
color: var(--interactive-text-default)
}
.icon_bd5bb4:hover {
color: var(--interactive-text-hover)
}
.searchResultsWrap_a98f3b {
background: var(--background-gradient-lowest,var(--background-base-lowest));
border-inline-start:1px solid var(--app-frame-border);display: flex;
flex: 0 0 auto;
flex-direction: column;
overflow: hidden;
position: relative;
width: 418px
}
.scroller_a98f3b {
padding: 16px 16px 0
}
.emptyResultsWrap_a98f3b {
align-items: center;
box-sizing: border-box;
color: var(--text-default);
display: flex;
flex: 1;
font-size: 16px;
font-weight: var(--font-weight-medium);
height: 100%;
justify-content: center;
line-height: 24px;
padding: 20px;
text-align: center
}
.emptyResultsContent_a98f3b {
margin: auto;
padding-bottom: 40px;
position: relative
}
.emptyResultsText_a98f3b {
font-size: 16px;
font-weight: var(--font-weight-medium);
margin: 40px auto 0
}
.stillIndexing_a98f3b {
width: 300px
}
.noResultsImage_a98f3b {
filter: saturate(var(--saturation-factor,1))
}
.errorImage_a98f3b,.noResultsImage_a98f3b {
height: 160px;
margin: 0 auto;
width: 160px
}
.errorMessage_a98f3b {
width: 300px
}
.noResults_a98f3b {
width: 280px
}
.noResults_a98f3b.alt_a98f3b {
width: 200px
}
.helpMessageContainer_a98f3b {
margin-bottom: 16px
}
.theme-dark .errorImage_a98f3b {
background-image: url(/assets/c451b132a4f69f5b.svg)
}
.theme-light .errorImage_a98f3b {
background: url(/assets/5153f8efac26047f.svg)
}
.images-light .noResultsImage_a98f3b {
background-image: url(/assets/1fa1021e7db304e1.svg)
}
.images-light .noResultsImage_a98f3b.alt_a98f3b {
background-image: url(/assets/e83b7cd64938e9cb.svg)
}
.images-dark .noResultsImage_a98f3b {
background-image: url(/assets/0dfcd735f1a5349c.svg)
}
.images-dark .noResultsImage_a98f3b.alt_a98f3b {
background-image: url(/assets/140c2a4c9ce5623d.svg)
}
.paginationLimitHeader_a98f3b {
margin-bottom: 16px
}
.container__05cdc {
display: flex
}
.sparkleIcon__05cdc {
height: 12px;
width: 12px
}
.sparkleTop__05cdc {
align-self: flex-start;
margin-inline-end:auto}
.sparkleBottom__05cdc {
align-self: flex-end;
margin-inline-start:auto}
.background__506d9 {
align-items: center;
background-color: var(--background-base-lowest);
border-radius: 50%;
display: flex;
justify-content: center;
margin-inline:4px;padding: 12px
}
.foreground__506d9 {
color: var(--interactive-text-default)
}
.container__664ff {
background-color: var(--background-base-low);
border-end-start-radius: 8px;
border-start-start-radius: 8px;
display: flex;
flex-direction: column;
flex-shrink: 0;
width: 320px
}
.container__664ff.chatOpen__664ff {
border-end-end-radius: 8px;
border-start-end-radius: 8px
}
.headerContainer__664ff {
border-start-start-radius: 8px;
box-shadow: var(--elevation-low)
}
.headerContainer__664ff.chatOpen__664ff {
border-start-end-radius: 8px
}
.headerTitle__664ff {
margin-inline-start:12px}
.headerClose__664ff {
color: var(--interactive-text-default);
cursor: pointer;
margin-inline-start:auto}
.headerClose__664ff:hover {
color: var(--interactive-text-hover)
}
.headerClose__664ff:active {
color: var(--interactive-text-active)
}
.contentContainer__664ff {
padding-inline:16px}
.selfSpeakerContainer__664ff {
align-items: center;
color: var(--interactive-text-default);
cursor: pointer;
display: flex;
flex-direction: row;
padding-top: 16px
}
.selfSpeakerContainer__664ff:hover {
color: var(--interactive-text-hover)
}
.selfSpeakerContainer__664ff:active {
color: var(--interactive-text-active)
}
.buttonContainer__664ff {
display: flex;
gap: 8px
}
.selfSpeakerButton__664ff {
background-color: var(--background-base-lowest)
}
.selfSpeakerText__664ff {
margin-inline-start:12px}
.listTitle__664ff {
padding-top: 24px;
text-transform: uppercase
}
.participantRowContainer__664ff {
align-items: center;
display: flex;
flex-direction: row;
height: 40px;
padding-top: 16px
}
.participantMemberContainer__664ff {
align-items: center;
cursor: pointer;
display: flex;
flex-direction: row;
flex-shrink: 1;
margin-inline-end:auto;overflow: hidden
}
.participantTextContainer__664ff {
display: flex;
flex-direction: column;
flex-shrink: 1;
margin-inline:16px 8px;min-width: 1px
}
.participantAvatar__664ff {
flex-shrink: 0
}
.participantName__664ff {
color: var(--text-strong);
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.emptyStateContainer__664ff {
align-items: center;
display: flex;
flex-direction: column;
padding-bottom: 24px;
padding-top: 32px;
text-align: center
}
.emptyStateTitle__664ff {
margin-top: 16px
}
.emptyStateBody__664ff {
margin-top: 8px
}
.toggle__664ff {
margin-bottom: 0;
padding-top: 20px
}
.enable-forced-colors .selfSpeakerContainer__664ff {
background-color: ButtonFace;
color: ButtonText;
text-decoration: underline
}
.enable-forced-colors .selfSpeakerContainer__664ff:hover {
color: ButtonText
}
.enable-forced-colors .selfSpeakerContainer__664ff:active {
background-color: HighlightText;
color: Highlight
}
.enable-forced-colors .buttonContainer__664ff {
background-color: transparent
}
.enable-forced-colors .participantName__664ff {
background-color: ButtonFace;
color: ButtonText;
text-decoration: underline
}
.raisedHandIcon__15cd2 {
color: var(--interactive-text-default);
margin-inline-start:-4px;min-width: 32px;
position: relative;
width: auto
}
.raisedHandIcon__15cd2 svg {
flex-shrink: 0
}
.raisedHandCount__15cd2,.raisedHandIcon__15cd2:hover {
color: var(--white)
}
.raisedHandCount__15cd2 {
background: var(--background-feedback-notification);
border-radius: 999px;
bottom: -3px;
box-sizing: border-box;
flex-shrink: 0;
height: 16px;
inset-inline-start: 50%;
min-width: 16px;
padding: 0 4px;
position: absolute;
width: auto
}
.participants__4783a {
color: var(--interactive-text-default);
padding-inline:0}
.icon__4783a {
color: var(--text-muted);
margin-inline-start:0}
.buttonIcon__4783a {
cursor: pointer
}
.channelName__4783a {
color: var(--text-strong)
}
.channelNameWrapper__4783a {
margin-inline-end:0}
.divider__4783a {
background: var(--primary-560);
margin-inline:16px}
.speakerCount__4783a {
margin-inline:4px 8px}
.button__4783a {
margin-inline:12px 4px}
.sidebarOpen__4783a {
margin-inline-end:-4px}
.boostUpsell__4783a {
align-items: center;
background-color: var(--background-base-lowest);
border-radius: 5px;
display: flex;
height: 52px;
padding: 8px 16px
}
.boostUpsell__4783a .text__4783a {
display: flex;
flex-direction: column;
flex-grow: 0;
margin-inline-start:10px}
.boostUpsell__4783a .buttons__4783a {
align-items: center;
display: flex;
flex-shrink: 0;
gap: 16px;
margin-inline-start:auto}
.tileBaseContainer__71eb2 {
border-radius: 8px;
display: inline-block;
height: 98px;
margin: auto;
width: 102px
}
.tileContainer__71eb2 {
background-color: var(--black);
cursor: pointer;
text-align: center
}
.tileContainer__71eb2:hover {
background-color: var(--background-base-lowest)
}
.textContainer__71eb2 {
align-items: center;
display: flex;
justify-content: center;
padding: 0 4px
}
.avatarContainer__71eb2 {
height: 56px;
margin: 8px auto;
position: relative;
width: 56px
}
.avatar__71eb2 {
background-color: var(--black);
border-radius: 28px;
height: 56px;
width: 56px
}
.avatar__71eb2.faded__71eb2 {
opacity: .5
}
.text__71eb2 {
display: inline-block;
max-width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.singleIcon__71eb2 .text__71eb2 {
max-width: calc(100% - 16px)
}
.doubleIcon__71eb2 .text__71eb2 {
max-width: calc(100% - 32px)
}
.boost__71eb2 {
display: inline-block;
height: 16px;
margin-inline-start:4px;vertical-align: text-top;
width: 10px
}
.blockedIcon__71eb2 {
margin-inline-end:2px}
.blockedIcon__71eb2,.icon__71eb2 {
height: 12px;
width: 12px
}
.icon__71eb2 {
background-clip: padding-box;
background-color: var(--text-strong);
border: 3px solid var(--black);
border-radius: 50%;
color: var(--black);
inset-inline-end: -3px;
padding: 2px;
position: absolute;
top: -3px
}
.icon__71eb2.invited__71eb2 {
background-color: var(--green-360);
color: var(--text-strong)
}
.enable-forced-colors .text__71eb2 {
background-color: ButtonFace;
color: ButtonText;
forced-color-adjust: none;
text-decoration: underline
}
.participants__9c309 {
background-color: var(--black);
display: flex;
height: 98px
}
.scrollerBase_c8b5c7 {
box-sizing: border-box;
flex: 1 1 auto;
min-height: 0;
position: relative
}
.auto_c8b5c7 {
}
.no-webkit-scrollbar .auto_c8b5c7 {
scrollbar-color: var(--black) var(--border-subtle);
scrollbar-width: auto
}
.no-webkit-scrollbar .auto_c8b5c7.fade_c8b5c7:hover {
scrollbar-color: var(--black) var(--border-subtle)
}
.auto_c8b5c7::-webkit-scrollbar {
height: 16px;
width: 16px
}
.auto_c8b5c7::-webkit-scrollbar-track {
background-color: var(--black)
}
.auto_c8b5c7::-webkit-scrollbar-thumb,.auto_c8b5c7::-webkit-scrollbar-track {
background-clip: padding-box;
border: 4px solid var(--black);
border-radius: 8px
}
.auto_c8b5c7::-webkit-scrollbar-thumb {
background-color: var(--background-mod-subtle);
min-height: 40px
}
.auto_c8b5c7::-webkit-scrollbar-corner {
background-color: var(--black)
}
.no-webkit-scrollbar .fade_c8b5c7 {
scrollbar-color: var(--black) var(--border-subtle)
}
.fade_c8b5c7::-webkit-scrollbar-thumb,.fade_c8b5c7::-webkit-scrollbar-track {
visibility: hidden
}
.fade_c8b5c7:hover::-webkit-scrollbar-thumb,.fade_c8b5c7:hover::-webkit-scrollbar-track {
visibility: visible
}
.spaceBetweenTiles_fa73d7 {
box-sizing: border-box;
padding-inline:4px}
.tileSizer_fa73d7 {
border-radius: 8px;
overflow: hidden;
position: relative;
width: 100%
}
.container_fdb9cf {
inset-inline-end: 8px;
position: absolute;
top: 8px
}
.tile_fdc206 {
cursor: pointer;
height: 100%
}
.rowContainer__8a920 {
align-items: center;
background-color: var(--black);
display: flex;
flex-direction: row;
justify-content: center;
margin-bottom: 8px;
width: 100%
}
.summary__3af26 {
margin-inline-end:8px}
.speakers__3af26 {
display: flex;
flex: 1;
justify-content: flex-end
}
.avatar__3af26 {
cursor: pointer
}
.container__9aed4 {
align-items: center;
border-bottom: 1px solid var(--border-subtle);
cursor: pointer;
display: flex;
flex-direction: row;
height: 48px
}
.micIcon__9aed4 {
margin-inline-end:16px}
.downIcon__9aed4,.micIcon__9aed4 {
color: var(--text-strong)
}
.downIcon__9aed4 {
margin-inline-start:auto}
.upIcon__9aed4 {
transform: rotate(180deg)
}
.text__9aed4 {
margin-inline-end:12px}
.scroller__56ccd {
background-color: var(--black);
padding-inline:16px}
.grid__56ccd,.scroller__56ccd {
height: 100%;
width: 100%
}
.grid__56ccd {
display: flex;
flex-direction: column;
margin-top: 88px
}
.spacer__56ccd {
padding-bottom: 88px
}
.divider__56ccd {
border-bottom: 1px solid var(--background-base-low);
margin-top: 23px;
width: 100%
}
.focusedRow__56ccd {
display: flex;
justify-content: center;
margin-top: 48px;
width: 100%
}
.focusedRow__56ccd,.header__56ccd {
margin-bottom: 12px
}
.containerColumn_fcb27c {
flex-direction: column
}
.container_fcb27c,.containerColumn_fcb27c {
align-items: center;
display: flex
}
.container_fcb27c {
flex-direction: row;
gap: var(--space-sm)
}
.requestToSpeakIcon_fcb27c {
grid-area: icon;
margin: auto
}
.slash_fcb27c {
color: var(--icon-feedback-critical)
}
.primaryButtonColor_fcb27c {
background: var(--primary-630);
color: #fff
}
.primaryButtonColor_fcb27c.active_fcb27c,.primaryButtonColor_fcb27c:hover {
background: var(--primary-700)
}
.raisedHandButtonIcon_fcb27c {
color: #fff
}
.raisedHandButtonIconActive_fcb27c {
color: var(--primary-600)
}
.speakerRaiseHandButtonContainer_fcb27c {
position: relative
}
.speakerRaiseHandButton_fcb27c {
position: static
}
.speakerRaiseHandBadge_fcb27c {
background-color: var(--background-feedback-notification);
border-radius: 8px;
box-sizing: border-box;
font-weight: var(--font-weight-semibold);
inset-inline-end: 0;
min-width: 16px;
padding: 0 4px;
position: absolute;
text-align: center;
top: 0
}
.eventPrompts_fcb27c {
bottom: 40px;
display: flex;
flex-direction: column;
margin-bottom: 40px;
position: absolute
}
.separator_fcb27c {
height: 8px
}
.avControls_fcb27c {
gap: 8px
}
.avControls_fcb27c,.wrapper_fcb27c {
display: flex;
flex-direction: row
}
.wrapper_fcb27c {
align-items: center;
gap: 12px
}
.buttonSection_fcb27c {
align-items: center;
background: var(--plum-23);
border: 1px solid hsl(var(--plum-11-hsl)/.06);
border-radius: 12px;
display: flex;
gap: 8px;
justify-content: center;
padding: 4px
}
.enable-forced-colors .speakerRaiseHandBadge_fcb27c {
background-color: HighlightText;
color: Highlight
}
.iconBackground__0b34e {
align-items: center;
background-color: var(--background-base-low);
border-radius: 50%;
display: flex;
height: 64px;
justify-content: center;
width: 64px
}
.icon__0b34e {
color: var(--interactive-text-active)
}
.headerContainer__0b34e {
margin-bottom: 24px;
margin-top: 24px;
text-align: center
}
.eventPrompt__0b34e,.subtitle__0b34e {
margin-top: 8px
}
.separator__0b34e {
background-color: var(--background-base-low);
border: none;
height: 1px;
margin-bottom: 24px;
margin-top: 24px
}
.continueIcon__0b34e {
color: var(--interactive-text-active)
}
.continueIconContainer__0b34e {
background-color: inherit
}
.audienceSummary__0b34e {
display: flex;
flex-direction: row;
justify-content: center;
margin-top: 24px;
max-width: 400px
}
.summaryItem__0b34e {
margin-inline-end:8px}
.container__0b34e {
align-items: center;
border-radius: 0;
display: flex;
flex-direction: column;
height: 100%;
justify-content: center;
margin: 0;
overflow: hidden;
width: 100%
}
.container__0b34e,.content__0b34e {
position: relative
}
.container__722ff {
background-color: var(--background-base-lowest);
display: flex;
flex: 0 0 auto;
flex-direction: row;
height: 100%;
width: 100%
}
.callContainer__722ff {
background-color: var(--black);
flex: 1 1 auto;
overflow: hidden
}
.sidebarVisible__722ff {
margin-inline-end:8px;overflow: hidden
}
.sidebarOrChatVisible__722ff {
border-end-end-radius: 8px;
border-start-end-radius: 8px
}
.volumeSlider__722ff {
margin-top: -16px
}
.chatToasts__722ff {
height: 50%;
inset-inline-end: 16px;
overflow: hidden;
position: absolute;
top: 48px;
width: 304px
}
.chatToasts__722ff.rtsSidebarOpen__722ff {
inset-inline-end: 336px
}
.channelChatWrapper__722ff {
display: flex
}
.notConnectedView__722ff {
align-items: center;
display: flex;
flex-direction: column;
width: 100%
}
.notConnectedChannelName__722ff {
font-weight: var(--font-weight-bold);
margin: 8px 0;
max-width: 75%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.notConnectedJoinButton__722ff {
border-radius: 999px;
margin-top: 24px
}
.customInviteButtonColors__722ff {
background-color: var(--primary-630);
color: #fff
}
.customInviteButtonColors__722ff:hover {
background-color: var(--primary-700)
}
.container_fb64c9 {
background: var(--background-gradient-lower,var(--background-base-lower))
}
.chat_fb64c9,.container_fb64c9 {
display: flex;
flex: 1 1 auto;
flex-direction: column;
min-height: 0
}
.chat_fb64c9 {
align-items: stretch;
justify-content: stretch;
min-width: 0;
position: relative
}
.chat_fb64c9:before {
box-shadow: var(--elevation-low);
content: "";
display: block;
height: 1px;
position: absolute;
top: -1px;
inset-inline: 0;
pointer-events: none;
z-index: 1
}
.messagesWrapper_fb64c9 {
display: flex;
flex: 1 1 auto;
min-height: 0;
min-width: 0;
position: relative;
z-index: 0
}
.scroller_fb64c9 {
align-items: stretch;
display: flex;
flex-direction: column;
justify-content: flex-end
}
.scrollerInner_fb64c9 {
min-height: 0
}
.formSection_fb64c9 {
margin-top: 16px
}
.checkbox_fb64c9 {
color: var(--interactive-text-default)
}
.checkbox_fb64c9:hover {
color: var(--interactive-text-hover)
}
.checkbox_fb64c9:active {
color: var(--interactive-text-active)
}
.privateThreadDescription_fb64c9 {
margin-top: 8px
}
.chat_fb64c9 .select_fb64c9 {
background-color: var(--background-base-lowest);
border: none;
display: inline-grid;
padding-block:0;padding-inline:4px 2px}
.chat_fb64c9 .select_fb64c9>svg {
background-color: var(--background-base-low);
border-radius: 4px;
height: 18px;
margin-inline-start:8px;width: 18px
}
.form_fb64c9 {
display: flex;
flex-direction: column;
min-height: 0;
position: relative;
width: 100%
}
.channelTextArea_fb64c9 {
margin: 0 var(--space-8) var(--space-8);
width: calc(100% - 32px)
}
.channelTextAreaInner_fb64c9>div>div {
min-height: auto!important
}
.channelTextAreaWithTypingIndicator_fb64c9 {
margin-block:0 var(--space-xs);margin-inline: var(--space-8) 0
}
.typingIndicator_fb64c9 {
inset-inline-end: var(--space-24)
}
.channelTextAreaInnerFocused_fb64c9 {
border-color: var(--text-link)
}
.channelTextAreaInnerError_fb64c9 {
border: 1px solid var(--red-400)
}
.starterMessageError_fb64c9 {
margin-inline-start:16px}
.privateThreadFormTitle_fb64c9 {
display: flex
}
.privateThreadFormTitleText_fb64c9 {
margin-inline-end:8px}
.privateThreadFeaturePill_fb64c9 {
background-color: var(--background-mod-normal);
border-radius: 16px;
padding: 1px 2px
}
.submitContainer_fb64c9 {
flex-shrink: 0
}
.messagePreview_fb64c9 {
padding-bottom: 24px!important
}
.threadNameInputWithAI_fb64c9 {
padding-inline-end:48px}
.iconWrapper_fb64c9 {
margin-bottom: var(--space-16)
}
.container__1b24f {
align-items: center;
box-sizing: border-box;
display: flex;
flex: 1;
flex-direction: column;
justify-content: center;
min-height: 400px;
padding: 32px;
text-align: center
}
.container__1b24f.compact__1b24f {
max-height: 140px;
min-height: 140px;
padding: 0
}
.iconContainer__1b24f {
margin-bottom: 16px;
position: relative
}
.icon__1b24f {
background-color: var(--background-base-low);
border-radius: 80px;
color: var(--interactive-text-default);
display: inline-block;
padding: 22px
}
.compact__1b24f .icon__1b24f {
padding: 10px
}
.stars__1b24f {
inset-inline-start: -10px;
position: absolute
}
.header__1b24f {
margin-bottom: 8px
}
.cta__1b24f {
margin-top: 24px
}
.container__6764b {
background-color: var(--background-surface-higher);
border: 1px solid var(--background-base-low);
border-color: var(--border-subtle);
border-radius: 8px;
box-sizing: border-box;
cursor: pointer;
display: flex;
height: 72px;
margin-bottom: 8px;
padding: 15px;
position: relative
}
.container__6764b:hover {
background-color: var(--background-surface-highest);
border-color: var(--border-normal)
}
.left__6764b {
display: flex;
flex-direction: column;
flex-grow: 1;
min-width: 0
}
.authorName__6764b,.messageContent__6764b,.parentName__6764b,.startedByName__6764b,.subtext__6764b,.threadName__6764b {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.threadNameLine__6764b {
align-items: center;
display: flex
}
.parentName__6764b {
color: var(--text-muted);
flex-shrink: 0;
font-size: 14px;
font-weight: var(--font-weight-medium);
margin-inline-start:8px}
.threadName__6764b {
color: var(--text-default)
}
.facepile__6764b {
flex-shrink: 0;
margin-inline-start:16px}
.subtext__6764b {
align-items: center;
display: flex
}
.avatar__6764b,.noAvatarIcon__6764b {
flex-shrink: 0;
margin-inline-end:8px}
.noAvatarIcon__6764b {
align-items: center;
background-color: var(--background-base-lowest);
border-radius: 16px;
display: flex;
height: 16px;
justify-content: center;
width: 16px
}
.authorName__6764b,.startedByName__6764b {
flex-shrink: 0;
font-weight: var(--font-weight-semibold);
max-width: 150px
}
.startedByName__6764b {
margin-inline-start:4px}
.messageContent__6764b {
align-items: center;
color: var(--text-default);
display: flex;
flex-shrink: 1;
white-space: pre
}
.messageContent__6764b .inline {
white-space: pre!important
}
.messageContent__6764b .mention {
pointer-events: none
}
.messageContentTrailingIcon__6764b {
flex: 0 0 auto;
margin-inline-start:4px}
.messageContentLeadingIcon__6764b {
flex: 0 0 auto;
margin-inline-end:4px}
.bullet__6764b {
color: var(--background-mod-muted);
padding: 0 8px
}
.list_c441f0 {
padding: 0 16px
}
.activeThreadsList_c441f0 {
padding-bottom: 8px;
padding-top: 16px
}
.sectionHeader_c441f0 {
align-items: center;
box-sizing: border-box;
display: flex;
height: 24px;
margin: 8px 0;
text-transform: uppercase
}
.controls_c441f0 {
display: flex;
height: 64px;
justify-content: space-between
}
.tabBar_c441f0 {
height: 64px
}
.tabBar_c441f0,.tabBar_c441f0 .tab_c441f0 {
align-items: center;
box-sizing: border-box
}
.tabBar_c441f0 .tab_c441f0 {
display: flex;
height: 24px;
justify-content: center;
margin-inline-start:0;margin-top: 0;
text-align: center
}
.theme-dark .list_c441f0 .tabBar_c441f0 .tab_c441f0.active_c441f0 {
background-color: var(--interactive-background-selected)
}
.moderatorView_c441f0 {
align-items: center;
display: flex
}
.checkbox_c441f0 {
margin-inline-end:4px}
.infoIcon_c441f0 {
margin-inline-start:4px;position: relative;
top: 2px
}
.spinner_c441f0 {
margin: 64px 0
}
.container_d9c882 {
background-color: var(--background-base-lower);
border-radius: 8px;
box-sizing: border-box;
cursor: default;
display: flex;
flex-direction: column
}
.header_d9c882 {
align-items: center;
background-color: var(--background-base-lowest);
border-bottom: 1px solid var(--border-subtle);
display: flex;
height: 48px;
min-height: 48px;
padding: 0 16px
}
.closeIcon_d9c882,.divider_d9c882,.tabBar_d9c882,.threadIcon_d9c882,.title_d9c882 {
flex-shrink: 0
}
.threadIcon_d9c882 {
margin-inline-end:8px}
.divider_d9c882,.tabBar_d9c882 .tab_d9c882,.title_d9c882 {
margin-inline-end:16px}
.closeIcon_d9c882,.threadIcon_d9c882 {
color: var(--interactive-text-default)
}
.closeIcon_d9c882 {
margin-inline-start:var(--space-8)}
.divider_d9c882 {
background-color: var(--border-subtle);
height: 24px;
width: 1px
}
.container_d9c882,.header_d9c882 {
background-color: var(--background-surface-high)
}
.tabBar_d9c882 .tab_d9c882 {
align-items: center;
box-sizing: border-box;
display: flex;
height: 24px;
justify-content: center;
margin-inline-start:0;text-align: center
}
.spacer_d9c882 {
flex-grow: 1
}
.createButton_d9c882 {
margin-inline-start:var(--space-8)}
.theme-dark .header_d9c882 .tabBar_d9c882 .tab_d9c882.active_d9c882 {
background-color: var(--interactive-background-selected)
}
.searchIcon_d9c882 {
color: var(--text-default);
cursor: pointer;
margin-inline-end:16px;margin-top: 2px
}
.searchIcon_d9c882:hover {
color: var(--interactive-text-hover)
}
.searchBox_d9c882 {
background-color: var(--background-base-lower);
margin-inline-end:16px}
.icon_d98031 {
align-items: center;
display: flex
}
.count_d98031 {
margin-inline-start:4px}
.icon_d98031:hover .count_d98031 {
color: var(--interactive-text-hover)
}
.browser_d98031 {
box-shadow: var(--shadow-border),var(--shadow-high);
max-height: 80vh;
max-width: 600px;
min-height: 400px;
min-width: 480px;
overflow: hidden;
width: 35vw
}
.enable-forced-colors .browser_d98031 {
border: 2px solid CanvasText
}
.memberSinceWrapper_c4eb81 {
align-items: center;
display: flex;
gap: 8px
}
.memberSince_c4eb81 {
align-items: center;
display: flex;
gap: 4px
}
.guildIcon_c4eb81 {
border-radius: var(--radius-xs)
}
.discordIcon_c4eb81 {
color: var(--interactive-text-default);
height: 16px;
width: 16px
}
.divider_c4eb81 {
background-color: var(--interactive-text-default);
border-radius: 50%;
height: 4px;
width: 4px
}
.header__7f9c0 {
margin-bottom: 8px;
min-height: calc(var(--custom-user-profile-banner-height) + 39px);
position: relative
}
.headerTag__7f9c0 {
border-radius: var(--radius-xs);
bottom: 8px;
inset-inline-end: 16px;
position: absolute
}
.footer__7f9c0 {
border-top: 1px solid var(--user-profile-border)
}
.footerButton__7f9c0 {
align-items: center;
cursor: pointer;
display: flex;
height: 44px;
justify-content: center;
width: 100%
}
.banner__7f9c0 {
border-radius: 0
}
.backdrop__7f9c0 {
background: var(--background-scrim);
position: absolute;
top: 0;
inset-inline: 0;
bottom: 0;
z-index: var(--custom-user-profile-hoist-z-index)
}
.toast__7f9c0 {
top: calc((var(--custom-user-profile-banner-height) - 56px)/2);
z-index: var(--custom-user-profile-toast-z-index)
}
.widgetPreviews__7f9c0,.wishlistBreadcrumb__7f9c0 {
margin: 12px 16px 0
}
.body_b32ca4 {
margin: 0 16px
}
.body_b32ca4,.overlay_b32ca4 {
display: flex;
flex-direction: column;
gap: 12px
}
.overlay_b32ca4 {
padding: 12px
}
.note_b32ca4 {
margin: -4px
}
.note_b32ca4 textarea {
border-radius: 3px;
font-size: 14px;
line-height: 18px;
padding: 4px
}
.note_b32ca4 textarea:focus {
background: var(--user-profile-note-background-focus)
}
.note_b32ca4 textarea:focus::-moz-placeholder {
color: transparent
}
.note_b32ca4 textarea:focus::placeholder {
color: transparent
}
.container_a419e0 {
width: 340px
}
.headerContainer_a419e0 {
align-items: center;
display: flex;
flex-direction: column;
gap: var(--space-8);
justify-content: center
}
.preview_a419e0 {
filter: blur(5px);
-o-object-fit: contain;
object-fit: contain;
-o-object-position: top;
object-position: top;
opacity: .3;
width: 100%
}
.container_a419e0,.preview_a419e0 {
height: 100%;
position: relative
}
.body_a419e0 {
align-items: center;
display: flex;
flex-direction: column;
gap: var(--space-16);
inset-inline-start: 50%;
justify-content: center;
position: absolute;
text-align: center;
top: 50%;
transform: translate(-50%,-50%);
width: 80%
}
.row__89036 {
align-items: center;
border-radius: 4px;
color: var(--text-default);
cursor: pointer;
display: flex;
font-weight: var(--font-weight-medium);
line-height: 30px;
margin-block:1px;margin-inline:12px 0;padding: 4px
}
.row__89036:hover {
background-color: var(--user-profile-background-hover)
}
.avatar__89036 {
flex-shrink: 0;
margin-inline-end:10px}
.details__89036 {
display: flex;
flex-direction: column
}
.details__89036,.tag__89036 {
overflow: hidden
}
.tag__89036 {
font-size: 16px;
line-height: 20px;
text-overflow: ellipsis;
white-space: nowrap
}
.discriminator__89036 {
font-size: 12px;
opacity: .6
}
.row__0a95c {
align-items: center;
border-radius: 4px;
color: var(--text-default);
cursor: pointer;
display: flex;
font-weight: var(--font-weight-medium);
line-height: 30px;
margin-block:1px;margin-inline:12px 0;padding: 4px
}
.row__0a95c:hover {
background-color: var(--user-profile-background-hover)
}
.icon__0a95c,.noIcon__0a95c {
flex-shrink: 0;
margin-inline-end:10px}
.noIcon__0a95c {
background-color: var(--brand-500);
color: var(--white)
}
.details__0a95c {
flex: 1 1 auto
}
.details__0a95c,.name__0a95c {
overflow: hidden
}
.name__0a95c {
font-size: 16px;
line-height: 20px;
text-overflow: ellipsis;
white-space: nowrap
}
.avatar__0a95c {
flex: 0 0 auto;
margin-inline-end:4px}
.nick__0a95c {
align-items: center;
display: flex;
justify-content: flex-start;
overflow: hidden
}
.section__1f6ca {
display: flex;
flex-direction: column;
gap: 12px;
padding: 12px
}
.header__1f6ca {
align-items: center;
display: flex;
flex-direction: row;
justify-content: space-between
}
.header__1f6ca.clickable__1f6ca {
cursor: pointer
}
.list__1f6ca {
display: flex;
flex-direction: column;
gap: 8px
}
.list__1f6ca[hidden] {
display: none
}
.overlay__3b260 {
margin: 12px 16px
}
.divider__3b260 {
margin: 0 12px
}
.list__3b260 {
gap: 0;
margin-inline-start:-8px}
.loadingMutualFriend__3b260 {
align-items: center;
display: flex;
gap: 10px;
margin-block:1px;margin-inline:8px 0;padding: 4px
}
.loadingMutualFriend__3b260>:first-child {
border-radius: var(--radius-round);
height: 40px;
margin: 0
}
.card__6d190 {
background: var(--scoped-control-background-secondary-default,hsla(240,4%,61%,.08));
border: 1px solid var(--border-subtle);
border-radius: var(--radius-sm);
box-shadow: 0 0 8px 0 rgba(0,0,0,.04);
box-sizing: border-box;
cursor: pointer;
flex-shrink: 0;
height: 87px;
overflow: hidden;
position: relative;
width: 65px
}
.card__6d190:focus-visible,.card__6d190:hover {
background: var(--scoped-control-background-secondary-hover,hsla(240,4%,61%,.16))
}
.cardSmall__6d190 {
height: 73px;
width: 55px
}
.cardSingle__6d190 {
height: 80px;
width: 60px
}
.cardPreview__6d190,.cardPreviewNoScale__6d190 {
align-items: center;
display: flex;
height: 100%;
justify-content: center;
width: 100%
}
.cardPreview__6d190>div {
height: 136px;
transform: scale(.613);
width: 106px
}
.cardPreview__6d190>.bundlePreview__6d190 {
margin-inline-start:-19px;transform: scale(.42)
}
.cardPreviewNoScale__6d190>div {
height: 100%;
width: 100%
}
.moreOverlay__6d190 {
align-items: center;
background: rgba(0,0,0,.5);
display: flex;
inset: 0;
justify-content: center;
position: absolute;
z-index: 1
}
.card__6d190:focus-visible .moreOverlay__6d190,.moreOverlay__6d190 .card__6d190:hover {
background: rgba(0,0,0,.6)
}
.card__46c9e {
border-radius: none;
display: flex;
height: 100%;
width: 100%
}
.cardBackgroundImage__46c9e {
background-position: 50%;
background-repeat: no-repeat;
background-size: cover;
overflow: hidden;
top: 0;
transform: scale(105%)
}
.cardBackgroundImage__46c9e,.cardImage__46c9e {
inset-inline: 0;
bottom: 0;
height: 100%;
position: absolute;
width: 100%
}
.cardImage__46c9e {
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
top: 4px
}
.singleItemContainer__4af00 {
align-items: center;
display: flex;
gap: 8px
}
.singleItemInfo__4af00 {
display: flex;
flex: 1;
flex-direction: column;
min-width: 0
}
.singleItemName__4af00 {
cursor: pointer;
width: -moz-fit-content;
width: fit-content
}
.singleItemName__4af00:focus-visible,.singleItemName__4af00:hover {
text-decoration: underline;
text-decoration-color: var(--text-default)
}
.overlay__18000 {
align-items: center;
display: flex;
height: 100%;
inset-inline-start: 0;
justify-content: center;
position: absolute;
top: 0;
width: 100%;
z-index: 2
}
.full-motion .checkmark__18000 {
transition: opacity .3s ease
}
.checkmarkHover__18000 {
opacity: 0
}
.cardStateIcon__18000 {
color: var(--status-positive);
filter: drop-shadow(0 0 4px rgba(0,0,0,.3));
height: 38px;
transition: opacity .3s ease;
width: 38px
}
.seeMoreOverlay__18000 {
background: rgba(0,0,0,.5);
pointer-events: none
}
.singleItemInfo__08054 {
display: flex;
flex: 1;
flex-direction: column;
min-width: 0
}
.singleItemName__08054 {
cursor: pointer;
width: -moz-fit-content;
width: fit-content
}
.singleItemName__08054:focus-visible,.singleItemName__08054:hover {
text-decoration: underline;
text-decoration-color: var(--text-default)
}
.container__73abe {
align-items: center;
color: var(--white);
flex-direction: row;
gap: 8px;
justify-content: center
}
.cardContainer__73abe,.container__73abe {
box-sizing: border-box;
display: flex;
position: relative
}
.cardContainer__73abe {
border-radius: var(--radius-md);
box-shadow: 0 0 8px 0 rgba(0,0,0,.04);
flex-shrink: 0;
height: 87px;
width: 65px
}
.card__73abe.wishlistCard__73abe {
align-items: center;
background-color: var(--scoped-control-background-secondary-default,hsla(240,4%,61%,.08));
border: 1px solid var(--border-subtle);
border-radius: var(--radius-md);
display: flex;
height: 100%;
justify-content: center;
width: 100%
}
.custom-user-profile-theme .card__73abe.wishlistCard__73abe {
background-color: var(--scoped-control-background-secondary-default,hsla(240,4%,61%,.08))
}
.card__73abe.wishlistCard__73abe:focus-visible,.card__73abe.wishlistCard__73abe:hover {
background-color: var(--scoped-control-background-secondary-hover,hsla(0,4%,61%,.16))
}
.cardSingle__73abe {
height: 80px;
width: 60px
}
.cardPreview__73abe {
align-items: center;
display: flex;
justify-content: center
}
.scaledSkuPreview__73abe {
transform: scale(.613);
transform-origin: center
}
.scaledSkuPreview__73abe.avatarDecorationPreview__73abe {
height: auto;
width: auto
}
.collectiblesSkuPreview__73abe>div {
height: 136px;
width: 106px
}
.container__06b03 {
-webkit-backdrop-filter: blur(16px);
backdrop-filter: blur(16px);
display: flex;
flex-direction: column;
gap: 8px;
padding: 12px
}
.header__06b03 {
align-items: center;
display: flex;
justify-content: space-between
}
.cardsContainer__06b03 {
display: flex;
gap: 8px
}
.scroller_f35c3c {
background-color: var(--background-base-lower);
flex: 1 1 auto;
height: auto;
min-height: 1px;
min-width: 1px
}
.wrapper_f35c3c {
flex: 1 0 auto;
height: 100%;
margin: auto;
width: 100%
}
.container_a154bf {
flex-direction: column
}
.container_a154bf,.content_a154bf {
display: flex;
width: 100%
}
.content_a154bf {
align-items: center;
background-color: var(--background-base-low);
flex: 1 0 auto;
flex-direction: column;
justify-content: center
}
.splashImage_a154bf {
margin-bottom: 24px;
width: 400px
}
.splashHeader_a154bf {
color: var(--text-strong);
margin-bottom: 8px
}
.splashHeader_a154bf,.splashText_a154bf {
text-align: center;
width: 580px
}
.noChannel__01d5c {
flex: 1 1 auto;
position: relative
}
.container_e131a9 {
background: unset;
border-bottom-color: var(--border-subtle);
border-bottom: 1px solid var(--border-muted);
border-radius: var(--radius-sm) var(--radius-sm) 0 0;
color: var(--text-strong);
display: flex;
flex-direction: column;
flex-shrink: 0;
font-size: 14px;
font-weight: var(--font-weight-medium);
gap: 12px;
margin: 0;
padding: calc(var(--custom-guild-list-padding) - var(--custom-panels-spacing) + 4px)
}
.inner_e131a9 {
flex: 1;
height: 32px;
min-width: 0
}
.channel_e131a9:hover {
text-decoration: underline
}
.customStatusContainer_e131a9 {
position: relative
}
.noiseCancellationPopout_e131a9 {
background: var(--background-surface-high);
border-radius: var(--radius-xs);
box-shadow: var(--shadow-border),var(--shadow-high);
display: flex;
flex-direction: column;
gap: var(--space-8);
padding: var(--space-16);
width: 244px
}
.krispLogo_e131a9 {
background-position: 50%;
background-repeat: no-repeat;
background-size: contain;
height: 20px;
width: 44px
}
.krispLink_e131a9 {
font-size: 14px
}
.connection_e131a9 {
height: 32px;
padding-bottom: 0
}
.voiceUsers_e131a9 {
padding-bottom: 4px;
padding-top: 2px
}
.actionButtons_e131a9 {
display: grid;
grid-template-columns: repeat(auto-fit,minmax(0,1fr));
justify-content: space-between;
padding-top: 0;
grid-gap: var(--space-xs)
}
.button_e131a9 {
border-radius: var(--radius-sm);
height: var(--space-32);
min-height: var(--space-32);
min-width: auto;
transition: background-color .1s ease-in-out,color .1s ease-in-out;
width: 100%
}
.button_e131a9 .buttonColor_e131a9,.button_e131a9.buttonColor_e131a9 {
background-color: var(--background-base-low);
color: var(--interactive-text-active)
}
.button_e131a9 .buttonColor_e131a9:hover,.button_e131a9.buttonColor_e131a9:hover {
background-color: var(--background-base-lower)
}
.button_e131a9 .buttonColor_e131a9.greyButtonActive_e131a9,.button_e131a9.buttonColor_e131a9.greyButtonActive_e131a9 {
background-color: var(--background-mod-strong);
color: var(--interactive-text-active)
}
.button_e131a9 .buttonColor_e131a9.fauxDisabled_e131a9,.button_e131a9 .buttonColor_e131a9:disabled,.button_e131a9.buttonColor_e131a9.fauxDisabled_e131a9,.button_e131a9.buttonColor_e131a9:disabled {
background-color: var(--background-base-low);
color: var(--interactive-text-active);
opacity: .3
}
.button_e131a9 .buttonColor_e131a9,.button_e131a9.buttonColor_e131a9 {
background-color: var(--control-secondary-background-default);
border-color: var(--border-muted);
color: var(--control-secondary-text-default)
}
.button_e131a9 .buttonColor_e131a9:hover,.button_e131a9.buttonColor_e131a9:hover {
background-color: var(--control-secondary-background-hover)
}
.button_e131a9 .buttonColor_e131a9.fauxDisabled_e131a9,.button_e131a9 .buttonColor_e131a9:disabled,.button_e131a9.buttonColor_e131a9.fauxDisabled_e131a9,.button_e131a9.buttonColor_e131a9:disabled {
background-color: var(--control-secondary-background-default)
}
.button_e131a9.buttonActive_e131a9 {
background-color: var(--green-360);
color: var(--white)
}
.button_e131a9.buttonActive_e131a9:hover {
background-color: var(--green-330)
}
.density-compact .button_e131a9 {
height: 28px;
min-height: 28px
}
.button_e131a9 .buttonColor_e131a9.buttonActive_e131a9,.button_e131a9.buttonColor_e131a9.buttonActive_e131a9 {
background-color: var(--opacity-green-12);
border: 1px solid var(--opacity-green-12);
color: var(--green-new-30)
}
.button_e131a9 .buttonColor_e131a9.buttonActive_e131a9:hover,.button_e131a9.buttonColor_e131a9.buttonActive_e131a9:hover {
background-color: var(--opacity-green-24)
}
.button_e131a9 .buttonColor_e131a9.buttonActive_e131a9:active,.button_e131a9.buttonColor_e131a9.buttonActive_e131a9:active {
background-color: var(--opacity-green-36)
}
.high-contrast-mode .button_e131a9 .buttonColor_e131a9.buttonActive_e131a9,.high-contrast-mode .button_e131a9.buttonColor_e131a9.buttonActive_e131a9 {
background-color: var(--background-feedback-positive);
border-color: var(--text-feedback-positive);
color: var(--text-feedback-positive)
}
.custom-theme-background .container_e131a9 {
background: unset
}
.custom-theme-background .button_e131a9 .buttonColor_e131a9,.custom-theme-background .button_e131a9.buttonColor_e131a9 {
background: var(--background-gradient-low,var(--background-mod-subtle))
}
.custom-theme-background .button_e131a9 .buttonColor_e131a9:hover,.custom-theme-background .button_e131a9.buttonColor_e131a9:hover {
background: var(--background-gradient-high,var(--background-mod-strong))
}
.buttonContents_e131a9 {
align-items: center;
display: flex
}
.buttonIcon_e131a9 {
height: 20px!important;
width: 20px!important
}
.buttonIcon_e131a9.withText_e131a9 {
flex-shrink: 0;
margin-inline-end:8px}
.voicePanelIntroductionHeader_e131a9,.voicePanelIntroductionText_e131a9 {
text-align: center
}
.voicePanelIntroductionHeader_e131a9 {
color: var(--text-strong)
}
.voicePanelIntroductionText_e131a9 {
color: var(--text-default);
margin-bottom: 16px;
margin-top: 4px
}
.voicePanelIntroductionWrapper_e131a9 {
background-color: var(--white);
border-radius: 4px;
box-shadow: var(--shadow-border),var(--shadow-high);
max-width: 280px;
padding: 16px
}
.voicePanelIntroductionWrapper_e131a9:after {
border-block-color:var(--white) transparent;border-inline-color: transparent;
border-style: solid;
border-width: 8px;
content: " ";
inset-inline-start: 50%;
margin-inline-start:-8px;position: absolute;
top: 100%
}
.wrapper_e131a9 {
margin-inline-start:-1px;overflow: visible;
position: relative
}
.viewAsRolesWarning_e131a9 {
align-items: center;
background-color: var(--background-surface-high);
border-radius: 4px;
bottom: 96px;
display: flex;
flex-direction: column;
inset-inline-start: 6px;
justify-content: center;
max-width: 196px;
padding: 16px;
position: absolute;
text-align: center;
z-index: 1000
}
.viewAsRolesWarning_e131a9 .viewAsRolesWarningText_e131a9 {
margin-bottom: 16px
}
.enable-forced-colors .button_e131a9.disabled_e131a9,.enable-forced-colors .button_e131a9.fauxDisabled_e131a9,.enable-forced-colors .button_e131a9:disabled {
opacity: 1
}
.images-light .krispLogo_e131a9 {
background-image: url(/assets/415036ce2536a149.svg)
}
.images-dark .krispLogo_e131a9 {
background-image: url(/assets/b46488e4f6a1d7ef.svg)
}
.voiceButtonsContainer_e131a9 {
gap: var(--space-4)
}
/*# sourceMappingURL=901301eeddfe8f4b.css.map*/