API tools faq
paste
biodude100

Andre's BDD Theme LUL

biodude100
Sep 15th, 2020
96
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 92.19 KB | None | 0 0
raw download clone embed print report
  1. @import url("https://discord-custom-covers.github.io/usrbg/snippets/userPopouts.css");
  2. @import "https://fontlibrary.org/face/horta"; /* 'HortaRegular' */
  3. @import "https://monstrousdev.github.io/themes/addons/user-tags.css";
  4. /* @import "https://monstrousdev.github.io/themes/addons/filter.css"; */
  5. @import "https://www.themonster.xyz/styles/google-fonts.css";
  6.  
  7. /*
  8.                                                                                                      
  9. Andre's Theme LUL
  10.  
  11.  
  12. */
  13.  
  14.  
  15. /* *•̩̩͙⊱••••••••••••✩ VARIABLES ✩••••̩̩͙⊰•••••••••** */
  16. :root {
  17.     --theme-name: "Andre's Theme LUL";
  18.   --theme-version: "1.5";
  19.   --blurple: rgb(113, 136, 217);
  20.   --greyple: rgb(151, 168, 180);
  21.   --blurple-sheer: rgba(114, 137, 218, 0.267);
  22.   --greyple-sheer: rgba(151, 168, 180, 0.267);
  23.   --black-hole: url(https://www.solidbackgrounds.com/images/1920x1080/1920x1080-black-solid-color-background.jpg);
  24.   --stars: url(https://www.solidbackgrounds.com/images/1920x1080/1920x1080-black-solid-color-background.jpg);
  25.   --roundness: 50px;
  26.   --uno: rgb(255, 25, 27);
  27.   /* primary background color */
  28.   --dos: rgb(30, 30, 33);
  29.   /* secondary background color */
  30.   --tres: rgb(35, 35, 39);
  31.   /* tertiary background color */
  32.   --quatro: rgb(16, 16, 17);
  33.   /* quaternary background color */
  34.   --sheer: rgba(0,0,0,0.6);
  35.   --veil: rgba(100, 100, 100, 0.2);
  36.  
  37.  
  38.   --online: rgb(67, 181, 129);
  39.   --online-sheer: rgba(67, 181, 129, 0.267);
  40.   /* color for online status */
  41.   --idle: rgb(250, 166, 26);
  42.   --idle-sheer: #faa61a44;
  43.   /* color for idle status */
  44.   --dnd: rgb(240, 71, 71);
  45.   --dnd-sheer: rgba(240, 71, 71, 0.267);
  46.   /* color for dnd status */
  47.   --offline: rgb(99, 107, 117);
  48.   --offline-sheer: rgba(99, 107, 117, 0.267);
  49.   /* color for offline status */
  50.   --invisi: rgb(116, 127, 141);
  51.   --invisi-sheer: rgba(116, 127, 141, 0.267);
  52.   /* color for invisible status - Note this will only show for your own invisibility */
  53.   --streaming: rgb(100, 61, 167);
  54.   --streaming-sheer: rgba(100, 61, 167, 0.267);
  55.   /* color for streaming status */
  56.  
  57. }
  58.  
  59. /* ==== TABLE OF CONTENTS ====
  60. *  ========== STATIC ==========
  61. *  I. App Window
  62. *  II. Title Bar
  63. *  III. Channel Area
  64. *     A. Channels Header
  65. *     B. Channel Groups and Individual Channels
  66. *     C. User Settings and Voice Connection
  67. *     D. Private Channels
  68. *    
  69. *  IV. Guilds Area
  70. *     A. Guilds Header
  71. *     B. Guild Styles
  72. *     C. Guild Folders
  73. *
  74. *  V. Pages
  75. *     A. Main Areas
  76. *       1. Embeds, Code Blocks, and Invites
  77. *       2. Login Page
  78. *       3. Download Discord
  79. *     B. Members List
  80. *     C. Top Bar & Typing Status
  81. *     D. Cards and Tiles
  82. *     E. Buttons, Switches, and Bars
  83. *     F. Change SVGs
  84. *
  85. *  VI. Top Layers
  86. *  VII. ScrollBars
  87. *
  88. *
  89. *
  90. *
  91. *  ========== MODALS AND POPOUTS ==========
  92. *  VIII. Menus
  93. *     A. Server Menu
  94. *     B. User Status
  95. *     C. Context Menu
  96. *     D. Dropdown Menus
  97. *  IX. Popouts
  98. *     A. User Popout
  99. *     B. Message Popout
  100. *     C. Search Popout & Results
  101. *     D. Attach Popout, Add Game popout
  102. *     E. Tooltips & Notices
  103. *     F. Autocomplete & Everyone Popout
  104. *     G. Gift Nitro and Gif Picker
  105. *     H. Emoji Picker
  106. *     I. Game Preview
  107. *     J. Add Roles Popout & Roles Overflow
  108. *     K. RTC Connection
  109. *     L. Stream Popout
  110. *     M. Follow Channel
  111. *    
  112. *  X. Modals
  113. *     A. User Modal
  114. *     B. Upload Modal
  115. *     C. Join Guild Modal
  116. *     D. Messages Modal, Games Download Modal, Screenshare
  117. *     E. Incoming Call & Phone Verification
  118. *     F. Reactions Modal & Server Invite Modal
  119. *     G. Gift Modal
  120. *  XI. Keyframes
  121. *  XII. Custom CSS
  122. *  XIII. Plugin Optimization
  123. *     A. Ghost Ping
  124. *     B. Permissions Viewer
  125. *  XIV. Addon Optimization
  126. *     A. Custom Background Popouts
  127. */
  128.  
  129.  
  130. /* I. App Window */
  131. #app-mount,
  132. .container-16j22k,
  133. .perksModalContentWrapper-2HU6uL {
  134.   background: linear-gradient(var(--sheer), var(--sheer)),var(--black-hole) center/30% fixed;
  135. }
  136.  
  137. #app-mount .app-2rEoOp,
  138. #app-mount .layers-3iHuyZ,
  139. .privateChannels-1nO12o,
  140. .container-2lgZY8,
  141. #app-mount .layer-3QrUeG,
  142. .bg-h5JY_x {
  143.   background-color: transparent;
  144. }
  145.  
  146.  
  147. /* II. Title Bar */
  148. .wordmark-2iDDfm svg {
  149.   display: none;
  150. }
  151.  
  152. .titleBar-AC4pGV:not(.typeMacOS-3EmCyP)::after {
  153.   content: "𐌁𐌋𐌀𐌂𐌊 𐋏𐍈𐌋𐌄";
  154.   position: absolute;
  155.   top: 5px;
  156.   left: 10px;
  157.   color: rgb(170, 170, 170);
  158.   display: block;
  159.   height: 16px;
  160.   width: fit-content;
  161.   pointer-events: none;
  162.   font-size: 14px;
  163. }
  164.  
  165. .winButtonMinMax-PBQ2gm:hover {
  166.   background-color: var(--blurple);
  167. }
  168.  
  169. .titleBar-AC4pGV {
  170.   background-color: transparent;
  171. }
  172.  
  173.  
  174.  
  175. /* III. Channel Area */
  176.   /* A. Channels Header */
  177. #app-mount .channelNotice-1-XFjC {
  178.   background-color: var(--blurple-sheer);
  179. }
  180.  
  181. .attachButton-1UjEWA {
  182.   height: 100%;
  183. }
  184.  
  185. #app-mount .channelNotices-41mJbj .channelNotice-1-XFjC .message-3SOT5P .btn-11C5_u {
  186.   background-color: var(--blurple-sheer);
  187.   border-color: transparent;
  188.   transition: all .2s ease-in-out;
  189. }
  190.  
  191. #app-mount .channelNotices-41mJbj .channelNotice-1-XFjC .message-3SOT5P .btn-11C5_u:hover {
  192.   background-color: var(--blurple);
  193. }
  194.  
  195. .container-PNkimc,
  196. .animatedContainer-1pJv5C,
  197. .sidebar-2K8pFh,
  198. .scrollableContainer-38zsVD,
  199. .channels-Ie2l6A {
  200.   background-color: transparent;
  201. }
  202.  
  203. .attachWrapper-1_D-pj {
  204.   border-right: none;
  205. }
  206.  
  207. #app-mount .bannerImage-1jOskm {
  208.   -webkit-mask: linear-gradient(rgb(0, 0, 0), transparent);
  209.   mask: linear-gradient(rgb(0, 0, 0), transparent);
  210.   border-radius: 10px 10px 0 0;
  211. }
  212.  
  213.   /* B. Channel Groups and Individual Channels */
  214. .containerDefault-3GGEv_,
  215. .containerDragAfter-3TEhpe,
  216. .containerDragBefore-3Dzc5x,
  217. .containerUserOver-1Tcb7l {
  218.   padding-top: 20px;
  219. }
  220.  
  221. .contentSelectedText-3wUhMi,
  222. .contentSelectedVoice-1WDIBM,
  223. .contentConnectedVoice-qL-YrL,
  224. .wrapper-2NJDcI,
  225. #app-mount .wrapper-1ucjTd.modeSelected-1zApJ_ .content-3at_AU,
  226. #app-mount .wrapper-1ucjTd.modeSelected-1zApJ_:hover .content-3at_AU {
  227.   background: var(--veil) var(--stars) top left;
  228.   background-attachment: fixed;
  229.   color: var(--blurple)
  230. }
  231.  
  232. .contentConnectedVoice-qL-YrL:active,
  233. .contentHoveredText-2D9B-x,
  234. .contentHoveredVoice-3p_NEO:active,
  235. .contentSelectedVoice-1WDIBM:active,
  236. #app-mount .listeningAlong-2UPsxf,
  237. #app-mount .wrapper-1ucjTd:hover .content-3at_AU {
  238.   background-color: transparent;
  239. }
  240.  
  241. .contentSelectedText-3wUhMi .icon-sxakjD,
  242. .contentSelectedVoice-1WDIBM .icon-sxakjD {
  243.   opacity: 1;
  244.   filter: brightness(100%);
  245. }
  246.  
  247. .colorHoveredText-OZnAgu,
  248. .colorHoveredVoice-1kucsK,
  249. #app-mount .wrapper-1ucjTd:not(.modeSelected-1zApJ_):hover .name-3_Dsmg,
  250. #app-mount .wrapper-1ucjTd:not(.modeSelected-1zApJ_):hover svg {
  251.   color: var(--blurple);
  252.   opacity: 1;
  253. }
  254.  
  255. .nameConnectedText-3CzNQn,
  256. .nameConnectedVoice-MHUX5F,
  257. .nameSelectedText-sp_EUw,
  258. .nameSelectedVoice-1qSph5,
  259. .colorConnectedText-1c_uzY,
  260. .colorConnectedVoice-3kyvUN,
  261. .colorSelectedText-1y4Wvs,
  262. .colorSelectedVoice-Xcb_9R {
  263.   color: currentColor;
  264. }
  265.  
  266. .unread-1xRYoj {
  267.   background-color: var(--blurple-sheer);  
  268.   transition: background-color .2s ease-in-out;
  269. }
  270.  
  271. .unread-1xRYoj:hover {
  272.   background-color: var(--blurple);
  273. }
  274.  
  275. .mention-1f5kbO {
  276.   background-color: var(--dnd-sheer);
  277.   transition: background-color .2s ease-in-out;
  278. }
  279.  
  280. .mention-1f5kbO:hover {
  281.   background-color: var(--dnd);
  282. }
  283.  
  284.   /* C. User Settings and Voice Connection */
  285. .info-1VyQPT::before {
  286.   content: var(--theme-name)" v."var(--theme-version);
  287.   font-size: 12px;
  288.   line-height: 16px;
  289.   font-weight: 500;
  290.   color: var(--blurple);
  291. }
  292.  
  293. .panels-j1Uci_ .container-3baos1 {
  294.   border-top: 1px solid var(--tres);
  295. }
  296.  
  297. .container-1giJp5,
  298. .container-3baos1,
  299. .container-1UB9sr,
  300. .payment-xT17Mq,
  301. .expandedInfo-3kfShd,
  302. .panels-j1Uci_ {
  303.   background-color: transparent !important;
  304. }
  305.  
  306. .container-1giJp5,
  307. .container-3baos1 {
  308.   border: none;
  309. }
  310.  
  311. .hoverablePayment-Yc6mK7:hover,
  312. .button-14-BFJ.enabled-2cQ-u7:hover {
  313.   background: var(--quatro)  var(--stars) top left !important;
  314.   background-attachment: fixed;
  315. }
  316.  
  317. .notches-1sAcEM {
  318.   background: var(--quatro)  var(--stars) top left !important;
  319.   background-attachment: fixed;
  320.   -webkit-mask-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20width='8'%20height='20'%20fill='%2336393f'><path%20fill-rule='evenodd'%20d='M0%200h8v20H0V0zm4%202a2%202%200%200%200-2%202v12a2%202%200%201%200%204%200V4a2%202%200%200%200-2-2z'/></svg>");
  321.   -webkit-mask-repeat: repeat-x;
  322. }
  323.  
  324. .progress-1IcQ3A {
  325.   background: var(--dos) !important;
  326. }
  327.  
  328. .authedApp-mj2Hmd,
  329. .paginator-166-09 {
  330.   background: var(--sheer) !important;
  331. }
  332.  
  333. .defaultIndicator-G3c16x,
  334. .paymentPane-3bwJ6A,
  335. #app-mount .defaultIndicator-2X8Auf,
  336. #app-mount .gemIndicatorContainer-2jdECl {
  337.   background-color: var(--sheer) !important;
  338. }
  339.  
  340. .lookFilled-1Gx00P.colorPrimary-3b3xI6 {
  341.   background-color: var(--uno) !important;
  342. }
  343.  
  344. .users-i_3-kL {
  345.   background-color: var(--blurple-sheer);
  346.   color: white;
  347. }
  348.  
  349. .total-3tKGEB {
  350.   background-color: var(--blurple);
  351.   color: white;
  352. }
  353.  
  354. .total-3tKGEB::after {
  355.   border-right-color: var(--blurple);
  356. }
  357.  
  358.   /* D. Private Channels */
  359. .searchBar-6Kv8R2 {
  360.   -webkit-box-shadow: none;
  361.   box-shadow: none;
  362. }
  363.  
  364. .scroller-1JbKMe {
  365.   background: transparent;
  366. }
  367.  
  368. .searchBar-2_Yu-C {
  369.   background-color: transparent;
  370.   border-color: var(--tres);
  371. }
  372.  
  373. .privateChannels-1nO12o .searchBar-2_Yu-C .searchBarInner-1_Tg2R,
  374. a.selected-aXhQR6 .layout-2DM8Md, a.channel-2QD9_O:hover,
  375. .searchBar-6Kv8R2 .searchBarComponent-32dTOx {
  376.   background: var(--veil) var(--stars) top left;
  377.   background-attachment: fixed;
  378. }
  379.  
  380.  
  381.  
  382. /* IV. Guilds Area */
  383.   /* A. Guilds Header */
  384. #app-mount .wrapper-1Rf91z {
  385.   background-color: transparent;
  386.   overflow: visible;
  387. }
  388.  
  389. #app-mount .platform-osx .wrapper-1Rf91z {
  390.   margin-top: 60px;
  391. }
  392.  
  393. .wrapper-1Rf91z .scroller-2TZvBN::-webkit-scrollbar {
  394.   display: none;
  395. }
  396.  
  397. .container-2td-dC .wrapper-2lTRaf,
  398. .scroller-2TZvBN {
  399.   background-color: transparent !important;
  400. }
  401.  
  402. .scrollerWrap-1IAIlv {
  403.   height: 90%;
  404. }
  405.  
  406. #app-mount .wrapper-1Rf91z .scrollerWrap-1IAIlv .scroller-2TZvBN>.listItem-2P_4kh:first-child .wrapper-25eVIn .svg-1X37T1 {
  407.   height: 100% !important;
  408.   width: 100% !important;
  409. }
  410.  
  411. .scrollerWrap-1IAIlv .scroller-2TZvBN {
  412.   padding: 0px;
  413. }
  414.  
  415. .wrapper-1Rf91z .scrollerWrap-1IAIlv .scroller-2TZvBN>.listItem-2P_4kh:first-child {
  416.   position: sticky;
  417.   top: 0px;
  418.   left: 0px;
  419.   height: 44px;
  420.   width: 70px;
  421.   display: flex;
  422.   justify-content: center;
  423.   background: linear-gradient(var(--sheer), var(--sheer)),var(--black-hole) center/30% fixed;
  424.   z-index: 1;
  425. }
  426.  
  427. .wrapper-1Rf91z .scrollerWrap-1IAIlv .scroller-2TZvBN>.listItem-2P_4kh:first-child .pill-2uzAFe,
  428. .homeIcon-tEMBK1 path {
  429.   display: none;
  430. }
  431.  
  432. .pill-31IEus .item-2hkk8m {
  433.   background-color: var(--blurple);
  434. }
  435.  
  436. #app-mount .button-OhfaWu {
  437.   background-color: transparent;
  438. }
  439.  
  440. .wrapper-1BJsBx[aria-label="Home"] .childWrapper-anI2G9 {
  441.   background-color: transparent;
  442. }
  443.  
  444. .homeIcon-tEMBK1 {
  445.   background-color: white;
  446.   -webkit-mask: url(https://ellexidecodes.github.io/Discord-Themes/assets/home.svg);
  447.   -webkit-mask-size: 45px;
  448.   -webkit-mask-repeat: no-repeat;
  449.   -webkit-mask-position: center;
  450.   transform: scale(0.5);
  451.   transition: background-color .2s ease-in-out;
  452.   -webkit-mask-position: center;
  453.   margin-left: 0px;
  454.   height: 100% !important;
  455.   width: 100% !important;
  456. }
  457.  
  458. .wrapper-1BJsBx[aria-label="Home"].selected-bZ3Lue .homeIcon-tEMBK1 {
  459.   background-color: var(--blurple) !important;
  460. }
  461.  
  462. #app-mount .downloadProgressCircle-yTgLNF {
  463.   top: 0px;
  464. }
  465.  
  466. .circleBackground-OqqxHM {
  467.   fill: var(--blurple-sheer);
  468.   stroke: var(--greyple-sheer);
  469. }
  470.  
  471. .guildIconContainer-E1JUVt {
  472.   margin-top: 14px;
  473.   transform: translateY(-50%);
  474. }
  475.  
  476.   /* B. Guild Styles */
  477. #app-mount .wrapper-2lTRaf {
  478.     background: transparent;
  479.   }
  480.  
  481. #app-mount .dragPlaceholder-D9-haY,
  482. #app-mount .acronym-2mOFsV,
  483. #app-mount .placeholderMask-3K9THS .dragInner-_SHftW {
  484.   background-color: var(--blurple-sheer);
  485.   height: 100%;
  486.   width: 100%;
  487.   box-sizing: border-box;
  488.   transition: all 200ms ease-in-out;
  489. }
  490.  
  491. #app-mount .acronym-2mOFsV:hover {
  492.   background-color: var(--blurple);
  493. }
  494.  
  495. #app-mount .iconBadge-2wi9r4 {
  496.   background-color: var(--blurple) !important;
  497.   transition: all .2s ease-in-out;
  498. }
  499.  
  500. .unread-2OHH1w:before {
  501.   box-shadow: 2px 0px 10px var(--blurple);
  502. }
  503.  
  504. .unread-2OHH1w.selected-nT-gM3::before {
  505.   box-shadow: none;
  506. }
  507.  
  508. .createJoinContainer-2Av064 {
  509.   margin-bottom: 10px;
  510. }
  511.  
  512. #app-mount .guildsError-b7zR5H {
  513.   background: var(--dnd-sheer);
  514.   border-color: transparent;
  515. }
  516.  
  517. #app-mount .guildsError-b7zR5H:hover {
  518.   background: var(--dnd);
  519. }
  520.  
  521.   /* C. Guild Folders */
  522. #app-mount .expandedFolderBackground-2sPsd-,
  523. #app-mount .folder-21wGz3 {
  524.   background-color: transparent;
  525. }
  526.  
  527. #app-mount .expandedFolderBackground-2sPsd-::before {
  528.   content: "";
  529.   position: absolute;
  530.   top: 0;
  531.   left: 0;
  532.   height: calc(100% + 6px);
  533.   width: 100%;
  534.   opacity: 0.4;
  535.   background-color: var(--blurple-sheer);
  536.   border-radius: calc(var(--roundness)/5);
  537. }
  538.  
  539. #app-mount .folder-21wGz3 [style*="rgba(114, 137, 218, 0.4)"] {
  540.   background-color: transparent !important;
  541. }
  542.  
  543. #app-mount svg[name="Folder"][style*="color: rgb(114, 137, 218)"] {
  544.   color: var(--blurple) !important;
  545. }
  546.  
  547. /* V. Pages */
  548.   /* A. Main Areas */
  549. .chat-3bRxxu,
  550. #app-mount .activityFeed-28jde9,
  551. #app-mount .activityFeed-1C0EmJ,
  552. #app-mount .gameLibrary-TTDw4Y,
  553. #app-mount .container-3gCOGc,
  554. #app-mount .applicationStore-1pNvnv,
  555. #app-mount .pageWrapper-1PgVDX,
  556. #app-mount .root-1BQpZw,
  557. #app-mount .container-1D34oG {
  558.   background-color: transparent !important;
  559.   margin-bottom: 10px;
  560.   margin-right: 10px;
  561.   border-radius: 10px;
  562. }
  563.  
  564. .tabBody-3YRQ8W {
  565.   margin-bottom: 55px;
  566.   overflow: visible;
  567.   background: var(--quatro)  var(--stars) top left fixed !important;
  568. }
  569.  
  570. .tabBody-3YRQ8W:before {
  571.   top: unset;
  572.   bottom: -55px;
  573.   height: 55px;
  574.   background: var(--veil) var(--stars) top left fixed !important;
  575. }
  576.  
  577. .platform-linux .chat-3bRxxu,
  578. .platform-linux #app-mount .activityFeed-28jde9,
  579. .platform-linux #app-mount .activityFeed-1C0EmJ,
  580. .platform-linux #app-mount .gameLibrary-TTDw4Y,
  581. .platform-linux #app-mount .container-3gCOGc,
  582. .platform-linux #app-mount .applicationStore-1pNvnv,
  583. .platform-linux #app-mount .pageWrapper-1PgVDX,
  584. .platform-linux #app-mount .root-1BQpZw {
  585.   margin-top: 10px;
  586. }
  587.  
  588. .table-1tDS6w:only-child {
  589.   padding-top: 50px;
  590. }
  591.  
  592. #app-mount .messages-3amgkR,
  593. .sidebarRegionScroller-3MXcoP,
  594. .contentRegionScroller-26nc1e,
  595. .scroller-1IIF0A,
  596. .scroller-5bBood,
  597. .scroller-9moviB,
  598. .scroller-305q3I,
  599. [class*="scroller-"],
  600. .scrollableContainer-2NUZem,
  601. .nowPlayingColumn-2sl4cE {
  602.   background-color: transparent;
  603. }
  604.  
  605. #app-mount .noChannel-Z1DQK7 {
  606.   margin-bottom: 10px;
  607.   margin-right: 10px;
  608.   border-radius: 10px;
  609. }
  610.  
  611. .searchHelpText-19imBp {
  612.   margin-bottom: -20px;
  613. }
  614.  
  615. .bg-AYqtMd {
  616.   -webkit-mask: linear-gradient(rgb(0, 0, 0) 50%, transparent);
  617.   mask: linear-gradient(rgb(0, 0, 0) 50%, transparent);
  618. }
  619.  
  620. #app-mount .searchBox-3Y2Vi7 {
  621.       background: var(--veil);
  622. }
  623.  
  624. .videoControls-3glNbo {
  625.   padding-left: 0px;
  626.   padding-right: 0px;
  627. }
  628.  
  629. .bottomControls-UTyHwG,
  630. .topControls-Jnxmi6 .headerBar-qN9GBP {
  631.   padding: 0 16px;
  632. }
  633.  
  634. #app-mount .title-3qD0b-,
  635. #app-mount .titleCall-_b9o8P,
  636. #app-mount .headerBar-UHpsPw,
  637. #app-mount .container-1r6BKw,
  638. #app-mount .header-39GIC8,
  639. #app-mount .chat-3bRxxu .channelTextArea-rNsIhG,
  640. #app-mount .friendsTable-133bsv .friendsRow-2yicud:hover,
  641. #app-mount .video-1FfuMD {
  642.   background: var(--veil) var(--stars) top left !important;
  643.   background-attachment: fixed;
  644. }
  645.  
  646. .wrapper-2qzCYF.minimum-28Z35l,
  647. .wrapper-2qzCYF,
  648. .wrapper-2qzCYF {
  649.   background: var(--sheer) var(--stars) top left !important;
  650.   background-attachment: fixed;
  651. }
  652.  
  653. .scrollableContainer-2NUZem .inner-MADQqc{
  654.   margin-bottom: 0px;
  655. }
  656.  
  657. .chat-3bRxxu .textArea-12jD-V {
  658.   background-color: transparent !important;
  659.   line-height: 1.25rem !important;
  660.   margin-top: 8px;
  661. }
  662.  
  663. .chat-3bRxxu .attachButton-1UjEWA,
  664. .attachButton-2WznTc {
  665.   margin: 5px;
  666. }
  667.  
  668. .friendsTable-133bsv .friendsTableBody-1ZhKif {
  669.   background: transparent;
  670. }
  671.  
  672. .channelTextAreaDisabled-rZtG8r {
  673.   opacity: 1;
  674. }
  675.  
  676. #app-mount .children-19S4PO:after {
  677.   display: none;
  678. }
  679.  
  680. #app-mount .gameUpdates-2GPqBU {
  681.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--veil) var(--stars) top left fixed;
  682. }
  683.  
  684.  
  685. #app-mount .friendsTable-133bsv .friendsRow-2yicud .friendsColumnActions-1LT3_M .friendsAction-__WNE9:not(:last-child) {
  686.   background-color: var(--online-sheer)
  687. }
  688.  
  689. .friendsTable-133bsv .friendsRow-2yicud .friendsColumnActions-1LT3_M .friendsAction-__WNE9:not(:last-child):hover {
  690.   background-color: var(--online)
  691. }
  692.  
  693.  
  694. .friendsTable-133bsv .friendsRow-2yicud .friendsColumnActions-1LT3_M .friendsAction-__WNE9:last-child {
  695.   background-color: var(--dnd-sheer);
  696. }
  697.  
  698.  
  699. .friendsTable-133bsv .friendsRow-2yicud .friendsColumnActions-1LT3_M .friendsAction-__WNE9:last-child:hover {
  700.   background-color: var(--dnd);
  701. }
  702.  
  703. .gameLibrary-TTDw4Y>.libraryHeader-3g95kE+div+.scrollerWrap-2lJEkd>.scroller-2FKFPG {
  704.   margin-top: 47px;
  705. }
  706.  
  707. .stickyHeader-1pqx0j+.stickyHeader-1pqx0j {
  708.   margin-top: -47px;
  709. }
  710.  
  711. #app-mount .content-yTz4x3,
  712. #app-mount .chat-3bRxxu form .inner-zqa7da,
  713. #app-mount .chat-3bRxxu form,
  714. #app-mount .itemBackground-2vEldQ,
  715. #app-mount .wrapper-29NfPK {
  716.   background-color: transparent;
  717. }
  718.  
  719. #app-mount .contentCozy-3XX413 .inner-zqa7da {
  720.   background-color: var(--veil);
  721.   border-radius: 3px;
  722. }
  723.  
  724. #app-mount .divider-JfaTT5 {
  725.   border: none;
  726.   margin-bottom: 10px;
  727. }
  728.  
  729. #app-mount .divider-JfaTT5 span {
  730.   color: var(--greyple-sheer);
  731. }
  732.  
  733. #app-mount .isUnread-3Ef-o9 .divider-JfaTT5 span {
  734.   color: var(--dnd-sheer);
  735. }
  736.  
  737. #app-mount .divider-3gKybi:not(.isUnread-3Ef-o9) .divider-JfaTT5 span:after {
  738.   border-image: linear-gradient(to right, var(--greyple-sheer) 50%, transparent);
  739.   border-image-slice: 1;
  740. }
  741.  
  742. #app-mount .divider-JfaTT5.isUnread-3Ef-o9 .unreadPillCap-3_K2q2 {
  743.   display: none;
  744. }
  745.  
  746. #app-mount .divider-JfaTT5 span {
  747.   left: 0;
  748.   right: unset;
  749.   background: transparent;
  750.   display: flex;
  751.   flex-flow: row wrap;
  752.   color: var(--blurple);
  753. }
  754.  
  755. #app-mount .divider-JfaTT5.isUnread-3Ef-o9.hasContent-1cNJDh .content-1o0f9g {
  756.   margin-left: 30px;
  757. }
  758.  
  759. #app-mount .divider-JfaTT5.isUnread-3Ef-o9.hasContent-1cNJDh .content-1o0f9g::before {
  760.   content: " | ";
  761.   margin-right: 10px;
  762. }
  763.  
  764. #app-mount .divider-JfaTT5.isUnread-3Ef-o9 span {
  765.   color: var(--dnd);
  766. }
  767.  
  768. #app-mount .divider-JfaTT5:after {
  769.   content: "";
  770.   position: relative;
  771.   flex: 1 0 auto;
  772.   margin-left: 5px;
  773.   height: 1px;
  774.   border: 1px;
  775.   background: linear-gradient(to right, var(--blurple-sheer) 50%, transparent);
  776. }
  777.  
  778. #app-mount .divider-JfaTT5.isUnread-3Ef-o9:after {
  779.   margin-left: 30px;
  780.   background: linear-gradient(to right, var(--dnd-sheer) 50%, transparent);
  781. }
  782.  
  783. #app-mount .divider-JfaTT5.isUnread-3Ef-o9.hasContent-1cNJDh:after {
  784.   margin-left: 5px;
  785. }
  786.  
  787. #app-mount .content-yTz4x3 {
  788.   border: 1px solid var(--quatro);
  789. }
  790.  
  791. #app-mount .messagesWrapper-3lZDfY {
  792.   background-color: transparent;
  793. }
  794.  
  795.  
  796. #app-mount .content-yTz4x3,
  797. #app-mount .activityFeed-28jde9m,
  798. .gameLibrary-TTDw4Y .scrollerWrap-2lJEkd,
  799. .friendsTable-133bsv,
  800. .applicationStore-1pNvnv .scrollerWrap-2lJEkd,
  801. .activityFeed-1C0EmJ .scrollerWrap-2lJEkd,
  802. .root-1BQpZw .scrollerWrap-2lJEkd,
  803. #app-mount .noChannel-Z1DQK7,
  804. .submenu-2-ysNh {
  805.   background: var(--quatro)  var(--stars) top left !important;
  806.   background-attachment: fixed;
  807. }
  808.  
  809. .codeRedemption-2CtsK6,
  810. #app-mount .emptyStateHeader-1ADtcL,
  811. #app-mount .header-2HrZI4 {
  812.   padding: 0 20px;
  813. }
  814.  
  815. .chat-3bRxxu>.content-yTz4x3 .messages-3amgkR .containerCozy-jafyvG:last-child,
  816. .containerCompactBounded-cYR5cW:last-child {
  817.   padding-bottom: 30px;
  818. }
  819.  
  820. .chat-3bRxxu .channelTextArea-rNsIhG {
  821.   margin: 0px 0 0 0px;
  822.   padding: 0;
  823.   border: none;
  824. }
  825.  
  826. .chat-3bRxxu .innerNoAutocomplete-1WpcVO {
  827.   border-radius: 0px;
  828. }
  829.  
  830.  
  831. .chat-3bRxxu .textArea-2Spzkt {
  832.   background-color: transparent !important;
  833.   line-height: 1.25rem !important;
  834.   margin-top: 8px;
  835. }
  836.  
  837. .buttons-205you {
  838.   align-self: center;
  839. }
  840.  
  841. .chat-3bRxxu form,
  842. .chat-3bRxxu .channelTextArea-rNsIhG,
  843. .innerNoAutocomplete-1WpcVO,
  844. .innerAutocomplete-1PN280 {
  845.   margin: 0;
  846.   min-height: 55px;
  847.   padding: 0;
  848.   border-radius: 0;
  849. }
  850.  
  851. .sansAttachButton-td2irx:not(.innerDisabled-1YTFPN) {
  852.   padding-left: 0px
  853. }
  854.  
  855. .sansAttachButton-td2irx > .textArea-12jD-V {
  856.   margin-left: 16px;
  857. }
  858.  
  859. .form-2fGMdU:before {
  860.   display: none;
  861. }
  862.  
  863. .gatedContent-3-B7qB::after {
  864.   content: '';
  865.   position: absolute;
  866.   bottom: 0;
  867.   height: 55px;
  868.   width: 101.5%;
  869.   background: var(--veil) var(--stars) top left;
  870.   background-attachment: fixed;
  871. }
  872.  
  873. .applicationStore-1pNvnv .gatedContent-3-B7qB::after {
  874.   display: none;
  875. }
  876.  
  877.     /* 1. Embeds, Code Blocks, and Invites */
  878. #app-mount  .markup-2BOw-j pre,
  879. #app-mount .wrapper-35wsBm,
  880. #app-mount .embedInner-1-fpTo,
  881. #app-mount .messageGroupBlocked-3wrQQX .messageGroupBlockedBtn-1PBBh-,
  882. .embedFull-2tM8-- {
  883.   background: var(--uno) var(--stars) top left;
  884.   background-attachment: fixed;
  885.   border-color: var(--tres)
  886. }
  887.  
  888. #app-mount .messageGroupBlocked-3wrQQX.revealed-1_RKsf {
  889.   background: linear-gradient(var(--dnd-sheer), transparent 80%),var(--uno) var(--stars) top left fixed;
  890.   border-color: var(--tres)
  891. }
  892.  
  893. #app-mount .markup-2BOw-j code,
  894. #app-mount .markup-2BOw-j code.inline,
  895. #app-mount .messageGroupBlocked-3wrQQX.revealed-1_RKsf .messageGroupBlockedBtn-1PBBh-,
  896. #app-mount .bodySection-jqkkIP {
  897.   background: transparent;
  898. }
  899.  
  900. .aka-1mqp34,
  901. #app-mount .akaBadge-1M-1Gw,
  902. #app-mount .spoilerText-3p6IlD.hidden-HHr2R9,
  903. .wrapper-2aW0bm {
  904.   background: var(--blurple-sheer);
  905. }
  906.  
  907. #app-mount .spoilerText-3p6IlD {
  908.   background: var(--sheer);
  909.   padding: 0 5px;
  910. }
  911.  
  912. #app-mount .partyMemberOverflow-Nei5T6,
  913. #app-mount .guildIconEmptyBackground-14tfYf,
  914. #app-mount .overflow-3zpvTV {
  915.   background-color: var(--blurple-sheer);
  916. }
  917.  
  918. #app-mount .guildIconEmptyIcon-rSyLPf,
  919. #app-mount .partyMemberOverflow-Nei5T6,
  920. #app-mount .overflow-3zpvTV {
  921.   color: white;
  922. }
  923.  
  924.  
  925. .smallCarousel-2e0IQc {
  926.   background: var(--sheer);
  927.   border-radius: 5px;
  928. }
  929.  
  930. #app-mount .jumpToPresentBar-9P20AM button:first-of-type {
  931.   display: none;
  932. }
  933.  
  934. #app-mount .chat-3bRxxu .jumpToPresentBar-9P20AM {
  935.   background-color: var(--blurple);
  936.   bottom: 15px;
  937.   border-radius: 20px;
  938.   right: 50px !important;
  939.   width: auto !important;
  940.   box-shadow: 0 2px 20px rgba(0, 0, 0, .1);
  941.   left: auto !important;
  942.   animation: slide-up .7s cubic-bezier(.4, 0, 0, 1), opacity .7s ease;
  943.   padding: 3px 0;
  944. }
  945.  
  946. #app-mount .chat-3bRxxu .jumpToPresentBar-9P20AM:before {
  947.   content: "";
  948.   width: 20px;
  949.   background: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMiIgaGVpZ2h0PSIxMiI+CiAgPGcgZmlsbD0ibm9uZSIgZmlsbC1ydWxlPSJldmVub2RkIj4KICAgIDxwYXRoIGQ9Ik0wIDEyVjBoMTJ2MTIiLz4KICAgIDxwYXRoIGZpbGw9IiNGRkYiIGQ9Ik01LjI0ODI5MTAyIDJ2NS4yMTg2ODg5NkwzIDUgMiA2bDQgNCA0LTQtMS0xLTIuMjg0MTE4NjUgMi4yMTg2ODg5NlYyIi8+CiAgPC9nPgo8L3N2Zz4=) 50% no-repeat;
  950.   margin-right: -15px;
  951.   padding-left: 10px;
  952.   transition: all .2s ease-in-out;
  953. }
  954.  
  955. #app-mount .chat-3bRxxu .jumpToPresentBar-9P20AM button:last-child {
  956.   text-align: center;
  957.   font-family: Montserrat;
  958.   font-size: 11px;
  959. }
  960.  
  961. #app-mount  .chat-3bRxxu .jumpToPresentBar-9P20AM .spinner-2enMB9 {
  962.   margin-left: 20px !important;
  963.   margin-top: 10px;
  964.   padding-right: 15px;
  965.   margin-bottom: 10px;
  966.   -ms-transform: scale(1.3);
  967.   transform: scale(1.3)
  968. }
  969.  
  970. #app-mount .chat-3bRxxu .newMessagesBar-mujexs {
  971.   background-color: var(--blurple);
  972. }
  973.  
  974. #app-mount .chat-3bRxxu .newMessagesBar-mujexs:hover {
  975.   background-color: var(--blurple);
  976. }
  977.  
  978. #app-mount .chat-3bRxxu .hasMore-3e72_v {
  979.   background: var(--quatro) var(--stars) top left;
  980.   background-attachment: fixed;
  981.   border: 1px solid var(--quatro);
  982.   color: var(--blurple);
  983. }
  984.  
  985.   /* 2. Login Page */
  986. .rightSplit-2US0xy img,
  987. .canvas-3XuBXe {
  988.   display: none;
  989. }
  990.  
  991. .rightSplit-2US0xy {
  992.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left fixed;
  993.   -webkit-mask: url(https://ellexidecodes.github.io/Discord-Themes/assets/bubbleMask.png) top/100% no-repeat;
  994.   animation: slide-in 1.5s cubic-bezier(.4, 0, 0, 1.3) forwards;
  995. }
  996.  
  997. @keyframes slide-in {
  998.   from {
  999.     transform: translateX(-50%);
  1000.   }
  1001.   to {
  1002.     transform: translateX(-5%);
  1003.   }
  1004. }
  1005.  
  1006. .wrapper-3Q5DdO {
  1007.   background: linear-gradient(transparent, var(--blurple-sheer) 80%)
  1008. }
  1009.  
  1010. .authBox-hW6HRx {
  1011.   background: linear-gradient(var(--greyple-sheer), transparent 80%), var(--uno) var(--stars) top left fixed;
  1012. }
  1013.  
  1014.   /* 3. Download Discord */
  1015. #app-mount .backdrop-1wrmKB[style*="background-color: rgb(255, 255, 255)"] {
  1016.   background: linear-gradient(transparent, var(--blurple-sheer) 80%), var(--quatro) var(--stars) top left fixed !important;
  1017. }
  1018.  
  1019.   /* 4. Light Theme Alert */
  1020. [class*="platform-"].theme-light::after {
  1021.   content: 'Light does not scatter in space. Please turn dark theme back on.';
  1022.   line-height: 30px;
  1023.   text-align: center;
  1024.   white-space: pre;
  1025.   position: fixed;
  1026.   top: 10%;
  1027.   left: 50%;
  1028.   transform: translate(-40%);
  1029.   height: fit-content;
  1030.   width: fit-content;
  1031.   padding: 5px 10px;
  1032.   box-sizing: border-box;
  1033.   color: rgb(255, 255, 255);
  1034.   font-weight: bold;
  1035.   text-shadow: 1px 2px 1px rgb(0, 0, 0);
  1036.   font-size: 15px;
  1037.   background: var(--dnd-sheer) var(--stars) top left fixed;
  1038.   z-index: 500;
  1039.   pointer-events: none;
  1040.   animation: lightTheme 1s cubic-bezier(.4, 0, 0, 1.3) forwards;
  1041.   border-radius: 5px;
  1042.   border: 2px solid var(--dnd);
  1043.   font-family: "Whitney";
  1044. }
  1045.  
  1046. @keyframes lightTheme {
  1047.   from {
  1048.     top: -50%;
  1049.   }
  1050. }
  1051.  
  1052. #app-mount .theme-light .itemSubMenu-1vN_Yn:nth-child(16) .theme-light.contextMenu-HLZMGh .item-1Yvehc:first-child,
  1053. #app-mount .theme-light .preview-2nSL_2+.marginTop40-i-78cZ .radioGroup-1GBvlr:nth-child(2) .cardPrimaryEditable-3KtE4g:nth-child(2) {
  1054.   color: white;
  1055.   background-color: var(--dnd-sheer);
  1056.   border-color: var(--dnd);
  1057.   box-shadow: 0 0 20px var(--dnd);
  1058. }
  1059.  
  1060.   /* B. Members List */
  1061. #app-mount .members-1998pB {
  1062.   background-color: transparent;
  1063.   margin-bottom: 55px;
  1064. }
  1065.  
  1066. .members-1998pB>div {
  1067.   background-color: transparent;
  1068. }
  1069.  
  1070. #app-mount .membersWrap-2h-GB4::after {
  1071.   content: '';
  1072.   position: absolute;
  1073.   bottom: 0;
  1074.   height: 55px;
  1075.   width: 100%;
  1076.   background: var(--veil) var(--stars) top left;
  1077.   background-attachment: fixed;
  1078. }
  1079.  
  1080. #app-mount .member-3W1lQa  {
  1081.   border-right: 2px solid transparent;
  1082. }
  1083.  
  1084. #app-mount .member-3W1lQa:hover {
  1085.   background: transparent;
  1086.   border-right-color: var(--blurple);
  1087. }
  1088.  
  1089. #app-mount .member-3W1lQa.popout-open,
  1090. #app-mount .member-3W1lQa.popout-open:hover,
  1091. #app-mount .codeRedemptionRedirect-1wVR4b,
  1092. #app-mount .elevationHigh-1PneE4 {
  1093.   background: var(--veil) var(--stars) top left;
  1094.   background-attachment: fixed;
  1095. }
  1096.  
  1097. #app-mount .elevationHigh-1PneE4[style*="background-color: rgba(32, 34, 37, 0.9)"] {
  1098.   background: linear-gradient(to right, var(--blurple-sheer), transparent 80%), var(--veil) var(--stars) top left fixed !important;
  1099. }
  1100.  
  1101. #app-mount .status-2s6iDp,
  1102. #app-mount .status-2kJpnA,
  1103. #app-mount .status-1ibiUI {
  1104.   border-color: transparent;
  1105.   right: -4px;
  1106. }
  1107.  
  1108.  
  1109.   /* C. Top Bar & Typing Status */
  1110. #app-mount .search-2oPWTC .searchBar-3dMhjb,
  1111. #app-mount .darkTheme-3uETC4.container-2XeR5Z,
  1112. #app-mount .container-cMG81i {
  1113.   background: transparent;
  1114. }
  1115.  
  1116. #app-mount .chat-3bRxxu form .typing-2GQL18 {
  1117.   background-color: var(--sheer);
  1118.   bottom: 100%;
  1119.   padding-left: 10px;
  1120.   z-index: 0;
  1121.   overflow: hidden;
  1122.   animation: opacity 300ms ease;
  1123.   -ms-transform-origin: bottom left;
  1124.   transform-origin: bottom left;
  1125.   -ms-transform: scale(1);
  1126.   transform: scale(1);
  1127.   width: fit-content;
  1128.   display: -webkit-box;
  1129.   padding-right: 20px;
  1130.   padding-top: 0px;
  1131.   border-radius: 5px 5px 0 0;
  1132.   box-shadow: 0 -3px 20px rgba(0, 0, 0, .1);
  1133.   opacity: 1;
  1134.   transition: all 200ms ease;
  1135.   text-overflow: ellipsis;
  1136.   z-index: 5;
  1137. }
  1138.  
  1139. .base-gE7OpD .cooldownWrapper-3joyFc {
  1140.   margin-left: initial;
  1141. }
  1142.  
  1143.   /* D. Cards and Tiles */
  1144. .article-3kb3qm,
  1145. #app-mount .body-SKIE6r,
  1146. #app-mount .news-2GDtLJ,
  1147. #app-mount .wrapper-2TxpI8,
  1148. #app-mount .embedContainer-26S24y,
  1149. #app-mount .carousel-2WxMes,
  1150. #app-mount .paginationItem-2lUq0s,
  1151. #app-mount .info-3NKfPL,
  1152. #app-mount .header-Qk7iwL,
  1153. #app-mount .tierHeaderLocked-1a2opw,
  1154. #app-mount .tierBody-x9kBBp,
  1155. #app-mount .guildHeader-3nh5RK,
  1156. .wrapper-3vR61M,
  1157. .wrapper-1F5TKx {
  1158.   background-color: transparent;
  1159. }
  1160.  
  1161.  
  1162. .attachment-2p5mHK,
  1163. .avatar-2daVqv,
  1164. .blob-2w7iIK {
  1165.   background-color: var(--blurple);
  1166. }
  1167.  
  1168. .mulitplePlaceholderUsername-pogq9I,
  1169. .placeholderAvatar-damqh6,
  1170. .placeholderUsername-2B_OA9 {
  1171.   background-color: var(--blurple-sheet);
  1172. }
  1173.  
  1174. .disableColor-MwOAZf,
  1175. .iconBackgroundTierNone-3MPhMJ,
  1176. .iconBackgroundTierOne-2LhaMB,
  1177. .iconBackgroundTierThree-3qw3JX,
  1178. .iconBackgroundTierTwo-3bCmdc {
  1179.   color: var(--veil);
  1180. }
  1181.  
  1182. #app-mount .paginationItem-2lUq0s:after,
  1183. #app-mount .guildSubscriptionSlots-JPXXvN,
  1184. .actionButton-uPB8Fs {
  1185.   background: var(--sheer);
  1186. }
  1187.  
  1188. .emptyChannelIcon-3IXV5M,
  1189. .card-1yV8cG {
  1190.   background-color: var(--sheer);
  1191. }
  1192.  
  1193. #app-mount .splashArt-3I5Qmp {
  1194.   -webkit-mask: linear-gradient(to right, transparent, rgb(0, 0, 0) 70%);
  1195.   transition: filter .2s ease-in-out;
  1196.   opacity: 1;
  1197. }
  1198.  
  1199. #app-mount .header-1RC2Wb,
  1200. #app-mount .bda-slist li,
  1201. #app-mount .notDetected-33MY4s,
  1202. #app-mount .container-2Zlzt0,
  1203. #app-mount .tier1Banner-1B_WXY,
  1204. #app-mount .emptyState-2-sT0o,
  1205. #app-mount .loading-17PYl_,
  1206. #app-mount .userHovered-2_fT4Z:active,
  1207. #app-mount .wrapperAudio-1jDe0Q,
  1208. #app-mount .guildGraphicContainer-39I_Pl,
  1209. .wrapper-3D2qGf,
  1210. .peopleListItem-2nzedh:hover,
  1211. #app-mount .bd-addon-list .bd-addon-card,
  1212. .emptyContainer-1_gwCl {
  1213.   background: var(--veil) var(--stars) top left;
  1214.   background-attachment: fixed;
  1215. }
  1216.  
  1217. #app-mount .inset-3sAvek,
  1218. .descriptionBox-1EKQKL,
  1219. .attachment-33OFj0,
  1220. .emojiContainer-1u-_sQ,
  1221. #app-mount .wrapperAudio-1jDe0Q,
  1222. #app-mount .card-3_CqkU,
  1223. #app-mount .iconMask-30Tvqs,
  1224. .welcomeChannel-1rFrIO,
  1225. .optionContainer-15srkc {
  1226.   background: var(--blurple-sheer);
  1227. }
  1228.  
  1229. #app-mount .userHovered-2_fT4Z:active {
  1230.   border-radius: 3px;
  1231. }
  1232.  
  1233. #app-mount .card-FDVird:before {
  1234.   background: linear-gradient(to right, var(--blurple-sheer), var(--veil));
  1235. }
  1236.  
  1237. #app-mount .entitledHeader-3LRNDT {
  1238.   border-radius: 5px;
  1239. }
  1240.  
  1241. #app-mount .card-rJBFl3,
  1242. #app-mount .card-7JP0BX,
  1243. #app-mount .audioControls-2HsaU6,
  1244. #app-mount .videoControls-2kcYic,
  1245. #app-mount .tile-2OwFgW,
  1246. #app-mount .wrapper-3UweLa,
  1247. #app-mount .multipleIconWrapper-1PjkRO,
  1248. #app-mount .section-2VKIPC,
  1249. #app-mount .card-3DjzTQ,
  1250. .upsellContainer-L9xv7w,
  1251. .upsellFooter-ZYsio_,
  1252. .analyticsCard-qckucw,
  1253. .developerPortalCtaWrapper-2XNafh,
  1254. .container-2w0lh0,
  1255. .header-2Y0-A-,
  1256. .previewContainer-1SS3uO,
  1257. .enableContainer-6E-puu {
  1258.   background: var(--sheer) var(--stars) top left;
  1259.   background-attachment: fixed;
  1260. }
  1261.  
  1262. #app-mount .splash-3N0nhD {
  1263.   -webkit-mask: linear-gradient(black, transparent);
  1264.   mask: linear-gradient(black, transparent);
  1265. }
  1266.  
  1267. #app-mount .itemBackground-2vEldQ:before {
  1268.   background: radial-gradient(ellipse at top,transparent,var(--sheer)),linear-gradient(90deg,var(--sheer) 0,transparent 40%,transparent 60%,var(--sheer)),linear-gradient(0deg,var(--sheer) 10%,transparent 70%);
  1269. }
  1270.  
  1271. #app-mount .carouselRightGradientEdge-2Z3H8D {
  1272.   background-image: linear-gradient(270deg,var(--sheer),transparent);
  1273. }
  1274.  
  1275. #app-mount .carouselLeftGradientEdge-3P4spl {
  1276.   background-image: linear-gradient(90deg,var(--sheer),transparent);
  1277. }
  1278.  
  1279. #app-mount .iconCircle-1dlYo0,
  1280. #app-mount .emojiAliasInput-1y-NBz .emojiInput-1aLNse,
  1281. #app-mount .mediaBarWrapper-3D7r67,
  1282. #app-mount .mediaBarWrapper-3D7r67:after,
  1283. #app-mount .mediaBarWrapper-3D7r67:before,
  1284. #app-mount .tierNoneContainer-3hhK3h,
  1285. #app-mount .tierBody-16Chc9,
  1286. .detailsBlock-FoDTGA,
  1287. .premiumSubscriptionAccountCredit-25i0tQ,
  1288. .descriptionInput-3b30C8 {
  1289.   background: var(--sheer);
  1290. }
  1291.  
  1292. #app-mount .buffer-26XPkd,
  1293. #app-mount .buffer-26XPkd:after,
  1294. #app-mount .buffer-26XPkd:before,
  1295. #app-mount .tierInProgress-3mBoXq,
  1296. #app-mount .barForeground-3KglC8 {
  1297.   background: var(--blurple)
  1298. }
  1299.  
  1300. #app-mount .tile-QA_yMc,
  1301. #app-mount .tileMedia-1q3guD,
  1302. #app-mount .popout-2xBvMR,
  1303. #app-mount .outer-2IVh5n,
  1304. #app-mount .popout-3G62UL,
  1305. #app-mount  .recentlyPlayedContainer-2F3MqS,
  1306. #app-mount .guildPopout-3CgKqR {
  1307.   background: var(--uno)  var(--stars) top left !important;
  1308.   background-attachment: fixed;
  1309. }
  1310.  
  1311. #app-mount .tile-QA_yMc:hover,
  1312. #app-mount .tileMedia-1q3guD:hover,
  1313. #app-mount .multipleIconWrapper-2TXVB4,
  1314. #app-mount .section-3TvauS {
  1315.   background: var(--sheer)  var(--stars) top left !important;
  1316.   background-attachment: fixed;
  1317. }
  1318.  
  1319. #app-mount .nowPlaying-284llR {
  1320.   background: var(--online-sheer) var(--stars) top left fixed;
  1321. }
  1322.  
  1323. #app-mount .dockItem-2kQDqg:hover,
  1324. #app-mount .entitledHeader-3LRNDT,
  1325. #app-mount .cardPrimary-1Hv-to,
  1326. #app-mount .cardPrimaryEditable-3KtE4g,
  1327. #app-mount .genreTag-3QLRUJ,
  1328. #app-mount  .content-35aVm0,
  1329. #app-mount .emptyCard-3CNsz2,
  1330. #app-mount .guildGraphicBackground-UDBjuF,
  1331. #app-mount .info-3UT5_W,
  1332. #app-mount .ctaBar-2UsjF2,
  1333. #app-mount .perk-2WeBWW,
  1334. .actionButton-uPB8Fs.highlight-Lf97TE {
  1335.   background: var(--blurple-sheer) var(--stars) top left fixed;
  1336. }
  1337.  
  1338. #app-mount .cardPrimary-1Hv-to,
  1339. #app-mount .cardPrimaryEditable-3KtE4g,
  1340. #app-mount .emptyApplications-3GTmw-,
  1341. #app-mount .emptyUsers--hiToV {
  1342.   border-color: var(--sheer);
  1343. }
  1344.  
  1345. #app-mount .wrapper-39oAo3 {
  1346.   background: var(--veil) var(--stars) top left fixed;
  1347.   margin-bottom: 0px;
  1348.   height: 23px;
  1349.   border-radius: 0;
  1350. }
  1351.  
  1352. #app-mount .nowPlaying-284llR .gameNameInput-385LoS:focus,
  1353. #app-mount .nowPlaying-284llR .gameNameInput-385LoS:hover,
  1354. #app-mount .tierHeaderLocked-1s2JJz,
  1355. #app-mount .guildGraphicBackground-wbfC17,
  1356. #app-mount .guildGraphicContainer-_IAetM,
  1357. #app-mount .subscriptionDuration-3WXA_o,
  1358. #app-mount .subscriptionDuration-UvxLGw,
  1359. #app-mount .tierPill-1yRO48,
  1360. #app-mount .emptyApplications-3GTmw-,
  1361. #app-mount .emptyUsers--hiToV {
  1362.   background-color: var(--sheer);
  1363. }
  1364.  
  1365. #app-mount .mediaFade-1SdEfL {
  1366.   background: linear-gradient(180deg,transparent,var(--sheer));
  1367. }
  1368.  
  1369. #app-mount .gradientOverlayLeft-3w159C {
  1370.   background: linear-gradient(90deg,var(--sheer),transparent);
  1371. }
  1372.  
  1373. #app-mount .gradientOverlayRight-3vMuS8 {
  1374.   background: linear-gradient(90deg,transparent,var(--sheer));
  1375. }
  1376.  
  1377. .listingSmall-d9e5gC .purchaseUnit-2lxci3,
  1378. #app-mount .root-1bFE0x,
  1379. #app-mount .item-2yFVoY,
  1380. #app-mount .card-NB61oR,
  1381. #app-mount .guildSubscription-2bT8-B,
  1382. #app-mount .tier-3H4BXk,
  1383. #app-mount .guild-Hq0WWA {
  1384.   background: linear-gradient(var(--blurple-sheer), transparent 80%),var(--uno) var(--stars) top left fixed;
  1385. }
  1386.  
  1387. .checkmarkIcon-2EnYwn {
  1388.   color: var(--online);
  1389. }
  1390.  
  1391. #app-mount .row-1bU71H {
  1392.   background: linear-gradient(to right, transparent, var(--online-sheer)),var(--uno) var(--stars) top left fixed;
  1393. }
  1394.  
  1395. #app-mount .purchaseUnitOperatingSystem-cnbJPz,
  1396. #app-mount .background-3xPPFc {
  1397.   color: var(--blurple-sheer);
  1398. }
  1399.  
  1400.   /* E. Buttons, Switches, and Bars */
  1401. .headerButtonColor-G7_f-V {
  1402.   background-color: var(--dos);
  1403. }
  1404.  
  1405. .userSettingsVoice-iwdUCU .media-engine-video {
  1406.   background: transparent;
  1407. }
  1408.  
  1409. .toolbar-2bjZV7 {
  1410.   background: rgba(0,0,0,0.9) var(--stars) top left !important;
  1411.   background-attachment: fixed;
  1412. }
  1413.  
  1414. .toolbar-2bjZV7:before {
  1415.   border-top-color: rgba(0,0,0,0.9);
  1416. }
  1417.  
  1418. .active-2HPddW, .hover-28QbSq:hover {
  1419.   background-color: var(--blurple-sheer);
  1420. }
  1421.  
  1422. .active-2HPddW .icon-KgGMGo, .hover-28QbSq:hover .icon-KgGMGo {
  1423.   color: var(--blurple);
  1424. }
  1425.  
  1426.  
  1427. #app-mount .bar-2Qqk5Z,
  1428. .themeDefault-24hCdX,
  1429. #app-mount .userSettingsVoice-iwdUCU .previewOverlay-2O7_KC,
  1430. #bd-settingspane-container .ui-switch-item .ui-switch-wrapper .ui-switch,
  1431. #app-mount .interactive-1FxC7B:hover,
  1432. #app-mount .price-NUANu6,
  1433. #app-mount .playerOverflow-2Hf77M,
  1434. #app-mount .barBackground-2EEiLw,
  1435. .bd-switch {
  1436.   background-color: var(--sheer);
  1437. }
  1438.  
  1439. #app-mount .tierMarkerBackground-3q29am {
  1440.   background: linear-gradient(var(--sheer), var(--sheer)), var(--stars) top left, linear-gradient(var(--quatro), var(--quatro));
  1441.   background-attachment: fixed;
  1442. }
  1443.  
  1444. #app-mount .userSettingsVoice-iwdUCU .previewOverlay-2O7_KC {
  1445.   border-color: rgb(0, 0, 0);
  1446. }
  1447.  
  1448. #app-mount .accountBtnInner-sj5jLs,
  1449. #app-mount .button-mM-y8i,
  1450. #app-mount .restoreButton-22-SIW,
  1451. #app-mount .topPill-30KHOu .itemSelected-1qLhcL,
  1452. #app-mount .side-8zPYf6 .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ,
  1453. #app-mount .topPill-30KHOu .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ,
  1454. #app-mount #bd-settings-sidebar .ui-tab-bar-item.selected,
  1455. #app-mount .listDefault-2y5Z9D .clickable-23RaYz:hover .content-3xS9Lh,
  1456. #app-mount .pageButton-MknE-_:hover {
  1457.   background-color: var(--veil);
  1458. }
  1459.  
  1460. #app-mount .topPill-30KHOu .itemSelected-1qLhcL,
  1461. #app-mount .side-8zPYf6 .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ,
  1462. #app-mount .topPill-30KHOu .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ,
  1463. #app-mount #bd-settings-sidebar .ui-tab-bar-item.selected {
  1464.   color: var(--blurple)
  1465. }
  1466.  
  1467. #app-mount .side-8zPYf6 .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ:hover,
  1468. #app-mount .topPill-30KHOu .themed-OHr7kt.selected-3s45Ha.item-PXvHYJ:hover,
  1469. #app-mount #bd-settings-sidebar .ui-tab-bar-item.selected:hover {
  1470.   background-color: var(--greyple-sheer);
  1471.   color: var(--greyple);
  1472. }
  1473.  
  1474. #app-mount .accountBtnInner-sj5jLs:hover,
  1475. #app-mount .topPill-30KHOu .item-PXvHYJ:hover:not(.itemSelected-1qLhcL) {
  1476.   background-color: var(--sheer);
  1477. }
  1478.  
  1479. #app-mount .background-yZEZik {
  1480.   stroke: var(--sheer);
  1481. }
  1482.  
  1483. #app-mount .circleIconButton-jET_ig {
  1484.   background: transparent;
  1485.   color: var(--blurple-sheer)
  1486. }
  1487.  
  1488. #app-mount .circleIconButton-jET_ig:hover {
  1489.   color: var(--blurple)
  1490. }
  1491.  
  1492. #app-mount .moreUsers-1s5Her,
  1493. #app-mount .lookFilled-1Gx00P.colorGrey-2DXtkV:hover,
  1494. #app-mount .lookFilled-1Gx00P.colorBrand-3pXr91,
  1495. #app-mount .side-8zPYf6 .themed-OHr7kt.item-PXvHYJ:hover,
  1496. #app-mount .topPill-30KHOu .themed-OHr7kt.item-PXvHYJ:hover,
  1497. #app-mount #bd-settings-sidebar .ui-tab-bar-item:hover,
  1498. #app-mount .boostCount-UFqabz,
  1499. #app-mount .tag-2gHSR7,
  1500. #app-mount .listDefault-2y5Z9D .clickable-23RaYz.selected-3TGCSZ .content-3xS9Lh,
  1501. .bd-pfbtn:hover,
  1502. .bd-button:hover {
  1503.   background-color: var(--blurple-sheer);
  1504. }
  1505.  
  1506. #app-mount .lookFilled-1Gx00P.colorBrand-3pXr91:hover,
  1507. .bd-switch.bd-switch-checked,
  1508. .bd-addon-list .bd-card-footer button,
  1509. .bd-button,
  1510. .bd-pfbtn,
  1511. .colorable-1bkp8v.primaryDark-3mSFDl {
  1512.   background-color: var(--blurple)
  1513. }
  1514.  
  1515. #app-mount .lookFilled-1Gx00P.hoverGreen-1gjdJc.hasHover-3X1-zV:hover {
  1516.   background-color: var(--online-sheer);
  1517. }
  1518.  
  1519.   /* F. Change SVGs */
  1520. svg[name="Nova_Bell"] path,
  1521. svg[name="Nova_BellOff"] path,
  1522. svg[name="Nova_Pin"] path,
  1523. svg[name="Nova_People"] path,
  1524. svg[name="Nova_At"] path,
  1525. svg[name="Nova-CallJoin"] path,
  1526. svg[name="PersonWaving"] path,
  1527. svg[name="NitroWheel"] path,
  1528. svg[name="Library"] path,
  1529. svg[name="Activity"] path{
  1530.   display: none;
  1531. }
  1532.  
  1533. svg[name="Nova_Bell"] {
  1534.   background-color: currentColor;
  1535.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/svgs/bell.svg) center/100% no-repeat;
  1536.   mask: url(https://monstrousdev.github.io/themes/assets/svgs/bell.svg) center/100% no-repeat;
  1537. }
  1538.  
  1539. svg[name="Nova_BellOff"] {
  1540.   background-color: currentColor;
  1541.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/svgs/bell-off.svg) center/100% no-repeat;
  1542.   mask: url(https://monstrousdev.github.io/themes/assets/svgs/bell.svg) center/100% no-repeat;
  1543. }
  1544.  
  1545. svg[name="Nova_Pin"] {
  1546.   background-color: currentColor;
  1547.   -webkit-mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhbHF1ZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBmaWxsPSJub25lIiBkPSJNMCwwaDI0djI0SDBWMHoiLz4NCjxwb2x5Z29uIGZpbGw9IiNGRkZGRkYiIHBvaW50cz0iMTcuOSwxMy43IDE1LjgsMTIuNiAxNS4xLDUuMyAxNi40LDUgMTYuNCwzIDcuNiwzIDcuNiw1IDguOSw1LjMgOC4yLDEyLjYgNi4xLDEzLjcgNi4xLDE1LjcgDQoJMTEsMTUuNyAxMSwyMSAxMywyMSAxMywxNS43IDE3LjksMTUuNyAiLz4NCjwvc3ZnPg0K") center/100% no-repeat;
  1548.   mask: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4NCjwhLS0gR2VuZXJhdG9yOiBBZG9iZSBJbGx1c3RyYXRvciAxOC4wLjAsIFNWRyBFeHBvcnQgUGx1Zy1JbiAuIFNWRyBWZXJzaW9uOiA2LjAwIEJ1aWxkIDApICAtLT4NCjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+DQo8c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkNhbHF1ZV8xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB4PSIwcHgiIHk9IjBweCINCgkgdmlld0JveD0iMCAwIDI0IDI0IiBlbmFibGUtYmFja2dyb3VuZD0ibmV3IDAgMCAyNCAyNCIgeG1sOnNwYWNlPSJwcmVzZXJ2ZSI+DQo8cGF0aCBmaWxsPSJub25lIiBkPSJNMCwwaDI0djI0SDBWMHoiLz4NCjxwb2x5Z29uIGZpbGw9IiNGRkZGRkYiIHBvaW50cz0iMTcuOSwxMy43IDE1LjgsMTIuNiAxNS4xLDUuMyAxNi40LDUgMTYuNCwzIDcuNiwzIDcuNiw1IDguOSw1LjMgOC4yLDEyLjYgNi4xLDEzLjcgNi4xLDE1LjcgDQoJMTEsMTUuNyAxMSwyMSAxMywyMSAxMywxNS43IDE3LjksMTUuNyAiLz4NCjwvc3ZnPg0K") center/100% no-repeat;
  1549.   transform: scaleX(-1)
  1550. }
  1551.  
  1552. svg[name="Nova_People"] {
  1553.   background-color: currentColor;
  1554.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/friends.svg) center/100% no-repeat;
  1555.   mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/friends.svg) center/100% no-repeat;
  1556. }
  1557.  
  1558. svg[name="Nova_At"] {
  1559.   background-color: currentColor;
  1560.   -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' name='Mention' class='iconInactive-g2AXfB icon-1R19_H da-iconInactive da-icon' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' class='iconForeground-3y9f0B da-iconForeground' fill-rule='evenodd' d='M12.2608,9.57136 C11.91424,9.57136 11.6072,9.67136 11.3464,9.87136 C11.0856,10.07136 10.86432,10.32496 10.68208,10.63568 C10.5,10.94288 10.36432,11.2856 10.26784,11.65712 C10.17488,12.02864 10.12496,12.38944 10.12496,12.73216 C10.12496,12.90352 10.14288,13.08576 10.17856,13.28224 C10.21424,13.47504 10.2856,13.6536 10.39632,13.82144 C10.50352,13.9856 10.64624,14.12144 10.82128,14.22864 C10.99632,14.33584 11.22848,14.38944 11.51776,14.38944 C11.91056,14.38944 12.24272,14.2928 12.51776,14.1 C12.7928,13.9072 13.01776,13.66416 13.1928,13.36784 C13.36784,13.07504 13.4928,12.7536 13.57504,12.41088 C13.6536,12.068 13.6928,11.75008 13.6928,11.46432 C13.6928,11.23568 13.67136,11.01072 13.62864,10.78576 C13.58576,10.56432 13.51088,10.36432 13.4,10.18224 C13.2928,10.00368 13.14288,9.85728 12.9536,9.74288 C12.76784,9.62864 12.53584,9.57136 12.2608,9.57136 L12.2608,9.57136 Z M18.57808,16.8728 C18.84672,17.16224 18.84672,17.63168 18.55136,17.89328 C17.81248,18.54608 16.96928,19.0408 16.02144,19.37504 C14.8464,19.7928 13.6072,20 12.30352,20 C11.05696,20 9.92128,19.80352 8.9,19.4072 C7.87856,19.0144 7.00352,18.46416 6.28208,17.7608 C5.55712,17.05728 4.99632,16.21424 4.59632,15.23216 C4.19648,14.24992 4,13.17856 4,12.01792 C4,10.87136 4.21792,9.81072 4.6536,8.83568 C5.08928,7.86064 5.68208,7.01424 6.43568,6.29632 C7.18928,5.57856 8.06784,5.01776 9.07856,4.60704 C10.08208,4.20352 11.16064,4 12.30352,4 C13.28912,4 14.2464,4.14288 15.17136,4.42864 C16.1,4.7144 16.92144,5.1464 17.63936,5.71792 C18.35712,6.29296 18.92864,7.0072 19.35712,7.86784 C19.78576,8.72864 20,9.73936 20,10.9 C20,11.76064 19.88224,12.52144 19.64288,13.17856 C19.40368,13.8392 19.08592,14.38928 18.68592,14.83568 C18.28592,15.28208 17.83232,15.61408 17.31792,15.83568 C16.80368,16.05712 16.26448,16.16768 15.70016,16.16768 C15.1216,16.16768 14.65728,16.032 14.30736,15.76064 C13.96096,15.48912 13.78592,15.14272 13.78592,14.72848 L13.67872,14.72848 C13.46096,15.07136 13.12864,15.39984 12.67872,15.70704 C12.2288,16.01424 11.67872,16.1712 11.02512,16.1712 C10.03936,16.1712 9.27872,15.84976 8.74288,15.20336 C8.2072,14.55696 7.93936,13.72112 7.93936,12.6856 C7.93936,12.08192 8.03936,11.48912 8.24288,10.89984 C8.4464,10.31056 8.73584,9.78912 9.11072,9.32848 C9.48576,8.87136 9.93568,8.49984 10.45712,8.22128 C10.97856,7.94272 11.55712,7.80352 12.19648,7.80352 C12.74656,7.80352 13.21088,7.91776 13.58928,8.1464 C13.96432,8.37504 14.21088,8.65712 14.32864,8.98576 L14.35008,8.98576 L14.38288,8.82512 C14.46144,8.4384 14.8448,8.12512 15.23936,8.12512 L15.74656,8.12512 C16.14128,8.12512 16.3952,8.43792 16.31408,8.824 L15.60736,12.19296 C15.57872,12.39296 15.53936,12.6144 15.48944,12.8608 C15.43952,13.10384 15.4144,13.33232 15.4144,13.55024 C15.4144,13.79312 15.46096,13.99664 15.55744,14.16448 C15.65024,14.3288 15.836,14.41104 16.11088,14.41104 C16.6752,14.41104 17.14304,14.11088 17.51456,13.50752 C17.8824,12.904 18.068,12.0968 18.068,11.07888 C18.068,10.21824 17.9216,9.45392 17.63232,8.7896 C17.34288,8.12176 16.93936,7.56464 16.42512,7.11104 C15.91088,6.66112 15.29648,6.31824 14.58928,6.0896 C13.87872,5.86096 13.10368,5.74672 12.26448,5.74672 C11.35008,5.74672 10.5144,5.90736 9.75376,6.22896 C8.99296,6.5504 8.34304,6.9968 7.8072,7.56112 C7.27152,8.12896 6.85376,8.79328 6.55728,9.56112 C6.25728,10.32544 6.10736,11.15408 6.10736,12.04336 C6.10736,12.98976 6.26448,13.84336 6.5752,14.604 C6.88592,15.36464 7.32528,16.0112 7.88944,16.5504 C8.4536,17.0896 9.1288,17.50048 9.91088,17.78624 C10.69312,18.07184 11.55728,18.21472 12.49664,18.21472 C13.67168,18.21472 14.6824,18.02912 15.5288,17.65408 C16.16528,17.37488 16.76304,17.01264 17.32304,16.56944 C17.632,16.3248 18.08192,16.3384 18.35056,16.62768 L18.57808,16.8728 L18.57808,16.8728 Z'%3E%3C/path%3E%3C/svg%3E") center/100% no-repeat;
  1561.   mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' name='Mention' class='iconInactive-g2AXfB icon-1R19_H da-iconInactive da-icon' width='16' height='16' viewBox='0 0 24 24'%3E%3Cpath fill='currentColor' class='iconForeground-3y9f0B da-iconForeground' fill-rule='evenodd' d='M12.2608,9.57136 C11.91424,9.57136 11.6072,9.67136 11.3464,9.87136 C11.0856,10.07136 10.86432,10.32496 10.68208,10.63568 C10.5,10.94288 10.36432,11.2856 10.26784,11.65712 C10.17488,12.02864 10.12496,12.38944 10.12496,12.73216 C10.12496,12.90352 10.14288,13.08576 10.17856,13.28224 C10.21424,13.47504 10.2856,13.6536 10.39632,13.82144 C10.50352,13.9856 10.64624,14.12144 10.82128,14.22864 C10.99632,14.33584 11.22848,14.38944 11.51776,14.38944 C11.91056,14.38944 12.24272,14.2928 12.51776,14.1 C12.7928,13.9072 13.01776,13.66416 13.1928,13.36784 C13.36784,13.07504 13.4928,12.7536 13.57504,12.41088 C13.6536,12.068 13.6928,11.75008 13.6928,11.46432 C13.6928,11.23568 13.67136,11.01072 13.62864,10.78576 C13.58576,10.56432 13.51088,10.36432 13.4,10.18224 C13.2928,10.00368 13.14288,9.85728 12.9536,9.74288 C12.76784,9.62864 12.53584,9.57136 12.2608,9.57136 L12.2608,9.57136 Z M18.57808,16.8728 C18.84672,17.16224 18.84672,17.63168 18.55136,17.89328 C17.81248,18.54608 16.96928,19.0408 16.02144,19.37504 C14.8464,19.7928 13.6072,20 12.30352,20 C11.05696,20 9.92128,19.80352 8.9,19.4072 C7.87856,19.0144 7.00352,18.46416 6.28208,17.7608 C5.55712,17.05728 4.99632,16.21424 4.59632,15.23216 C4.19648,14.24992 4,13.17856 4,12.01792 C4,10.87136 4.21792,9.81072 4.6536,8.83568 C5.08928,7.86064 5.68208,7.01424 6.43568,6.29632 C7.18928,5.57856 8.06784,5.01776 9.07856,4.60704 C10.08208,4.20352 11.16064,4 12.30352,4 C13.28912,4 14.2464,4.14288 15.17136,4.42864 C16.1,4.7144 16.92144,5.1464 17.63936,5.71792 C18.35712,6.29296 18.92864,7.0072 19.35712,7.86784 C19.78576,8.72864 20,9.73936 20,10.9 C20,11.76064 19.88224,12.52144 19.64288,13.17856 C19.40368,13.8392 19.08592,14.38928 18.68592,14.83568 C18.28592,15.28208 17.83232,15.61408 17.31792,15.83568 C16.80368,16.05712 16.26448,16.16768 15.70016,16.16768 C15.1216,16.16768 14.65728,16.032 14.30736,15.76064 C13.96096,15.48912 13.78592,15.14272 13.78592,14.72848 L13.67872,14.72848 C13.46096,15.07136 13.12864,15.39984 12.67872,15.70704 C12.2288,16.01424 11.67872,16.1712 11.02512,16.1712 C10.03936,16.1712 9.27872,15.84976 8.74288,15.20336 C8.2072,14.55696 7.93936,13.72112 7.93936,12.6856 C7.93936,12.08192 8.03936,11.48912 8.24288,10.89984 C8.4464,10.31056 8.73584,9.78912 9.11072,9.32848 C9.48576,8.87136 9.93568,8.49984 10.45712,8.22128 C10.97856,7.94272 11.55712,7.80352 12.19648,7.80352 C12.74656,7.80352 13.21088,7.91776 13.58928,8.1464 C13.96432,8.37504 14.21088,8.65712 14.32864,8.98576 L14.35008,8.98576 L14.38288,8.82512 C14.46144,8.4384 14.8448,8.12512 15.23936,8.12512 L15.74656,8.12512 C16.14128,8.12512 16.3952,8.43792 16.31408,8.824 L15.60736,12.19296 C15.57872,12.39296 15.53936,12.6144 15.48944,12.8608 C15.43952,13.10384 15.4144,13.33232 15.4144,13.55024 C15.4144,13.79312 15.46096,13.99664 15.55744,14.16448 C15.65024,14.3288 15.836,14.41104 16.11088,14.41104 C16.6752,14.41104 17.14304,14.11088 17.51456,13.50752 C17.8824,12.904 18.068,12.0968 18.068,11.07888 C18.068,10.21824 17.9216,9.45392 17.63232,8.7896 C17.34288,8.12176 16.93936,7.56464 16.42512,7.11104 C15.91088,6.66112 15.29648,6.31824 14.58928,6.0896 C13.87872,5.86096 13.10368,5.74672 12.26448,5.74672 C11.35008,5.74672 10.5144,5.90736 9.75376,6.22896 C8.99296,6.5504 8.34304,6.9968 7.8072,7.56112 C7.27152,8.12896 6.85376,8.79328 6.55728,9.56112 C6.25728,10.32544 6.10736,11.15408 6.10736,12.04336 C6.10736,12.98976 6.26448,13.84336 6.5752,14.604 C6.88592,15.36464 7.32528,16.0112 7.88944,16.5504 C8.4536,17.0896 9.1288,17.50048 9.91088,17.78624 C10.69312,18.07184 11.55728,18.21472 12.49664,18.21472 C13.67168,18.21472 14.6824,18.02912 15.5288,17.65408 C16.16528,17.37488 16.76304,17.01264 17.32304,16.56944 C17.632,16.3248 18.08192,16.3384 18.35056,16.62768 L18.57808,16.8728 L18.57808,16.8728 Z'%3E%3C/path%3E%3C/svg%3E") center/100% no-repeat;
  1562. }
  1563.  
  1564.  
  1565. svg[name="Nova_CallJoin"] {
  1566.   background-color: currentColor;
  1567.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/svgs/phone-call.svg) center/100% no-repeat;
  1568.   mask: url(https://monstrousdev.github.io/themes/assets/svgs/phone-call.svg) center/100% no-repeat;
  1569. }
  1570.  
  1571. svg[name="Nova_CallVideo"] {
  1572.   background-color: currentColor;
  1573.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/svgs/video-call.svg) center/100% no-repeat;
  1574.   mask: url(https://monstrousdev.github.io/themes/assets/svgs/video-call.svg) center/100% no-repeat;
  1575. }
  1576.  
  1577. svg[name="PersonWaving"] {
  1578.   color: inherit !important;
  1579.   background-color: currentColor;
  1580.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/friends.svg) center/100% no-repeat;;
  1581. }
  1582.  
  1583. svg[name="NitroWheel"] {
  1584.   color: inherit !important;
  1585.   background-color: currentColor;
  1586.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/nitro.svg) center/100% no-repeat;;
  1587. }
  1588.  
  1589. svg[name="Library"] {
  1590.   color: inherit !important;
  1591.   background-color: currentColor;
  1592.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/library.svg) center/100% no-repeat;;
  1593. }
  1594.  
  1595. svg[name="Activity"] {
  1596.   color: inherit !important;
  1597.   background-color: currentColor;
  1598.   -webkit-mask: url(https://monstrousdev.github.io/themes/assets/home-tabs/activity.svg) center/100% no-repeat;;
  1599. }
  1600.  
  1601. /* VI. Top Layers */
  1602. #app-mount  .standardSidebarView-3F1I7i,
  1603. #app-mount .sidebarRegion-VFTUkN {
  1604.   background: transparent;
  1605. }
  1606.  
  1607. #app-mount .contentRegion-3nDuYy {
  1608.   background: var(--quatro)  var(--stars) top left;
  1609.   background-attachment: fixed;
  1610.   margin-bottom: 10px;
  1611.   margin-right: 10px;
  1612.   border-radius: 10px;
  1613. }
  1614.  
  1615. .sidebarRegionScroller-3MXcoP,
  1616. #app-mount .sidebarRegion-VFTUkN .scrollerWrap-2lJEkd {
  1617.   justify-content: center;
  1618.   text-align: center;
  1619. }
  1620.  
  1621.  
  1622.  
  1623.  
  1624. /* VII. Scrollbars */
  1625.  
  1626. .scroller-2FKFPG::-webkit-scrollbar,
  1627. .rolesList-22qj2L::-webkit-scrollbar,
  1628. #bd-settingspane-container .scroller-wrap .scroller::-webkit-scrollbar {
  1629.   width: 5px !important;
  1630. }
  1631.  
  1632. .scroller-2FKFPG::-webkit-scrollbar-track,
  1633. .scroller-2FKFPG::-webkit-scrollbar-track-piece,
  1634. .rolesList-22qj2L::-webkit-scrollbar-track-piece,
  1635. #bd-settingspane-container .scroller-wrap .scroller::-webkit-scrollbar-track-piece,
  1636. .scroller-2LSbBU::-webkit-scrollbar-track,
  1637. .scroller-2LSbBU::-webkit-scrollbar-track-piece {
  1638.   background: transparent !important;
  1639.   border: none !important;
  1640.   border-radius: 10px;
  1641. }
  1642.  
  1643. .scroller-2FKFPG::-webkit-scrollbar-thumb,
  1644. .rolesList-22qj2L::-webkit-scrollbar-thumb,
  1645. #bd-settingspane-container .scroller-wrap .scroller::-webkit-scrollbar-thumb {
  1646.   border: none;
  1647.   background-color: var(--blurple) !important;
  1648.   border-radius: 10px;
  1649. }
  1650.  
  1651.  
  1652.  
  1653.  
  1654.  
  1655.  
  1656.  
  1657.  
  1658.  
  1659.  
  1660. /* =================== MODALS AND POPOUTS ================== */
  1661.  
  1662. /* VIII. Menus */
  1663.   /* A. Server Menu */
  1664. #app-mount .menu-3sdvDG {
  1665.   background: var(--quatro)  var(--stars) top left;
  1666.   background-attachment: fixed;
  1667.   border-radius: 0;
  1668.   display: flex;
  1669.   flex-flow: row wrap;
  1670.   position: relative;
  1671. }
  1672.  
  1673. #app-mount .item-1GzJrl:hover {
  1674.   background: var(--uno)  var(--stars) top left;
  1675.   background-attachment: fixed;
  1676.   color: var(--blurple);
  1677. }
  1678.  
  1679. .item-1GzJrl {
  1680.   margin: 0;
  1681.   padding: 0px;
  1682.   width: 40px;
  1683.   justify-content: center;
  1684. }
  1685.  
  1686. .icon-2doZ3q,
  1687. .iconContainer-2ZxvJk,
  1688. .premiumGuildIcon-BhwtRn {
  1689.   margin: 0;
  1690. }
  1691.  
  1692. .label-1Y-LW5 {
  1693.   display: none;
  1694. }
  1695.  
  1696. .popoutBottom-1YbShG[style*="overflow: hidden; visibility: visible;"][role*="dialog"] {
  1697.   width: fit-content !important;
  1698.   top: 58px !important;
  1699.   left: 190px !important;
  1700.   transform: translateX(-50%) !important;
  1701.   border: 1px solid var(--blurple);
  1702.   border-radius: 0;
  1703.   animation: popoutanim-min 300ms cubic-bezier(.4, 0, 0, 1);
  1704. }
  1705.  
  1706.   /* B. User Status */
  1707.   .layer-v9HyYc[style*="; bottom: 5"][id*="popout_"] {
  1708.   height: fit-content !important;
  1709.   width: fit-content !important;
  1710.   animation: popoutanim-status 300ms cubic-bezier(.4, 0, 0, 1);
  1711. }
  1712.  
  1713. .layer-v9HyYc[style*="; bottom: "][id*="popout_"],
  1714. .layer-v9HyYc[style*="; bottom: "][id*="popout_"] .menu-3sdvDG {
  1715.   height: fit-content !important;
  1716. }
  1717.  
  1718. .layer-v9HyYc[style*="; bottom: "][id*="popout_"] .menu-3sdvDG {
  1719.   box-shadow: 0 -2px 15px rgba(0,0,0,0.6);
  1720. }
  1721.  
  1722. .layer-v9HyYc[style*="; bottom: "][id*="popout_"] .menu-3sdvDG{
  1723.   bottom: 0px !important;
  1724.   left: -5.5px !important;
  1725. }
  1726.  
  1727. #status-picker {
  1728.   width: fit-content;
  1729. }
  1730.  
  1731. #status-picker .scroller-3BxosC {
  1732.   padding: 0;
  1733.   overflow: visible !important;
  1734. }
  1735.  
  1736. #status-picker .item-1tOPte:nth-child(7) > div {
  1737.   position: relative;
  1738.   width: 100%;
  1739. }
  1740.  
  1741. #status-picker .item-1tOPte:nth-child(7) .status-1fhblQ,
  1742. #status-picker .item-1tOPte:nth-child(7) .customText-tY5LJn {
  1743.   margin-left: 10px;
  1744. }
  1745.  
  1746. #status-picker .item-1tOPte:nth-child(7) .customStatusWithEmoji-8-XZ8I,
  1747. #status-picker .item-1tOPte:nth-child(7) .statusItem-33LqPf {
  1748.   display: flex;
  1749.   flex-flow: row wrap;
  1750.   justify-content: flex-start;
  1751.   padding: 0 15px;
  1752. }
  1753.  
  1754. .clearStatusButton-1Mxs1q {
  1755.   width: fit-content;
  1756.   margin-left: auto;
  1757. }
  1758.  
  1759. .menu-3sdvDG .separator-2I32lJ,
  1760. #status-picker .item-1tOPte:not(:nth-child(7)) * {
  1761.   display: none;
  1762. }
  1763.  
  1764. #status-picker .item-1tOPte {
  1765.   display: inline-block;
  1766.   height: 41px;
  1767.   width: 41px;
  1768.   margin: .5vw;
  1769.   transition: all .2s ease-in-out;
  1770. }
  1771.  
  1772. #status-picker .item-1tOPte:nth-child(1) {
  1773.   background: var(--online) !important;
  1774.   -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTEyIDJDNi40OCAyIDIgNi40OCAyIDEyczQuNDggMTAgMTAgMTAgMTAtNC40OCAxMC0xMFMxNy41MiAyIDEyIDJ6bS0yIDE1bC01LTUgMS40MS0xLjQxTDEwIDE0LjE3bDcuNTktNy41OUwxOSA4bC05IDl6Ii8+PC9zdmc+) center/90% no-repeat;
  1775. }
  1776.  
  1777. #status-picker .item-1tOPte:nth-child(3) {
  1778.   background: var(--idle) !important;
  1779.   -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTE1IDFIOXYyaDZWMXptLTQgMTNoMlY4aC0ydjZ6bTguMDMtNi42MWwxLjQyLTEuNDJjLS40My0uNTEtLjktLjk5LTEuNDEtMS40MWwtMS40MiAxLjQyQzE2LjA3IDQuNzQgMTQuMTIgNCAxMiA0Yy00Ljk3IDAtOSA0LjAzLTkgOXM0LjAyIDkgOSA5IDktNC4wMyA5LTljMC0yLjEyLS43NC00LjA3LTEuOTctNS42MXpNMTIgMjBjLTMuODcgMC03LTMuMTMtNy03czMuMTMtNyA3LTcgNyAzLjEzIDcgNy0zLjEzIDctNyA3eiIvPjwvc3ZnPg==) center/90% no-repeat;
  1780. }
  1781.  
  1782. #status-picker .item-1tOPte:nth-child(4) {
  1783.   background: var(--dnd) !important;
  1784.   -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTkuMzEgMTdsMi40NC0yLjQ0TDE0LjE5IDE3bDEuMDYtMS4wNi0yLjQ0LTIuNDQgMi40NC0yLjQ0TDE0LjE5IDEwbC0yLjQ0IDIuNDRMOS4zMSAxMGwtMS4wNiAxLjA2IDIuNDQgMi40NC0yLjQ0IDIuNDRMOS4zMSAxN3pNMTkgM2gtMVYxaC0ydjJIOFYxSDZ2Mkg1Yy0xLjExIDAtMS45OS45LTEuOTkgMkwzIDE5YzAgMS4xLjg5IDIgMiAyaDE0YzEuMSAwIDItLjkgMi0yVjVjMC0xLjEtLjktMi0yLTJ6bTAgMTZINVY4aDE0djExeiIvPjwvc3ZnPg==) center/90% no-repeat;
  1785. }
  1786.  
  1787. #status-picker .item-1tOPte:nth-child(5) {
  1788.   background: var(--invisi) !important;
  1789.   -webkit-mask: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBkPSJNMCAwaDI0djI0SDB6IiBmaWxsPSJub25lIi8+PHBhdGggZD0iTTEyIDQuNUM3IDQuNSAyLjczIDcuNjEgMSAxMmMxLjczIDQuMzkgNiA3LjUgMTEgNy41czkuMjctMy4xMSAxMS03LjVjLTEuNzMtNC4zOS02LTcuNS0xMS03LjV6TTEyIDE3Yy0yLjc2IDAtNS0yLjI0LTUtNXMyLjI0LTUgNS01IDUgMi4yNCA1IDUtMi4yNCA1LTUgNXptMC04Yy0xLjY2IDAtMyAxLjM0LTMgM3MxLjM0IDMgMyAzIDMtMS4zNCAzLTMtMS4zNC0zLTMtM3oiLz48L3N2Zz4=) center/90% no-repeat;
  1790. }
  1791.  
  1792. #status-picker .item-1tOPte:nth-child(7) {
  1793.   display: block;
  1794.   width: 100%;
  1795.   top: 0;
  1796.   left: 0;
  1797.   padding: 5px;
  1798.   height: fit-content;
  1799.   position: absolute;
  1800.   transform: translateY(-95%);
  1801.   box-sizing: border-box;
  1802.   margin: 0;
  1803.   background: var(--quatro)  var(--stars) top left;
  1804.   background-attachment: fixed;
  1805.   z-index: -1;
  1806. }
  1807.  
  1808. #status-picker .item-1GzJrl:nth-child(7) .customStatusContentIcon-2sionu {
  1809.   height: 100%;
  1810.   width: 100%;
  1811.   display: flex;
  1812.   flex-flow: row wrap;
  1813.   justify-content: center;
  1814. }
  1815.  
  1816. #status-picker .item-1tOPte:last-child:nth-child(7) {
  1817.   background: var(--quatro)  var(--stars) top left;
  1818.   background-attachment: fixed;
  1819.   display: flex;
  1820.   flex-flow: row wrap;
  1821.   justify-content: space-between;
  1822. }
  1823.  
  1824. #status-picker .item-1tOPte:not(:nth-child(7)):hover {
  1825.   transform: scale(1.3);
  1826. }
  1827.  
  1828.   /* C. Context Menu */
  1829. #app-mount .contextMenu-HLZMGh,
  1830. #app-mount .container-3cGP6G {
  1831.   background: var(--quatro)  var(--stars) top left;
  1832.   background-attachment: fixed;
  1833.   border: 1px solid rgb(0, 0, 0);
  1834. }
  1835.  
  1836. #app-mount .itemGroup-1tL0uz {
  1837.   border-color: rgb(0, 0, 0);
  1838. }
  1839.  
  1840. #app-mount .itemSubMenu-1vN_Yn:hover,
  1841. #app-mount .item-1Yvehc:hover,
  1842. #app-mount .item-2J1YMK:hover {
  1843.   background-color: var(--sheer);
  1844. }
  1845.  
  1846.   /* D. Dropdown Menus */
  1847. #app-mount .select-2TCrqx .Select-menu-outer,
  1848. #app-mount .popout-2sKjHu,
  1849. #app-mount .popoutList-T9CKZQ,
  1850. #app-mount .css-n57xjs-menu {
  1851.   background: var(--quatro)  var(--stars) top left;
  1852.   background-attachment: fixed;
  1853.   border: 1px solid rgb(0, 0, 0);
  1854. }
  1855.  
  1856. #app-mount .css-1wqqa50-container {
  1857.   background-color: var(--veil);
  1858. }
  1859.  
  1860. #app-mount .css-12o7ek3-option {
  1861.   background-color: var(--blurple-sheer);
  1862. }
  1863.  
  1864. #app-mount .selectableItem-1MP3MQ[style*="background: rgb(114, 137, 218)"] {
  1865.   background-color: var(--blurple-sheer) !important;
  1866. }
  1867.  
  1868. #app-mount .select-2TCrqx .Select-option.is-focused,
  1869. #app-mount .select-2TCrqx .Select-option:hover,
  1870. #app-mount .optionActive-KkAdqq,
  1871. #app-mount .selectableItem-1MP3MQ:hover,
  1872. #app-mount .css-1gnr91b-option {
  1873.   background: var(--sheer);
  1874. }
  1875.  
  1876. /* IX. Popouts */
  1877.  
  1878.   /* A. User Popout */
  1879. #app-mount .headerNormal-T_seeN,
  1880. #app-mount .body-3iLsc4,
  1881. #app-mount .footer-1fjuF6,
  1882. #app-mount .headerPlaying-j0WQBV,
  1883. #app-mount .headerXbox-3G-4PF,
  1884. #app-mount .headerSpotify-zpWxgT,
  1885. #app-mount .headerStreaming-2FjmGz,
  1886. #app-mount .bodyInner-245q0L {
  1887.   background: transparent;
  1888. }
  1889.  
  1890. .rolesList-22qj2L {
  1891.   max-height: 70px;
  1892.   overflow: auto;
  1893. }
  1894.  
  1895. .role-2irmRk {
  1896.   border-width: 1px;
  1897.   border-style: solid;
  1898.   border-radius: 2px;
  1899.   box-sizing: content-box;
  1900.   height: 16px;
  1901.   margin: 3px;
  1902.   padding: 2px;
  1903.   position: relative;
  1904.   line-height: 16px;
  1905.   font-size: 10px;
  1906.   font-weight: 400;
  1907.   text-transform: uppercase;
  1908.   overflow: visible;
  1909. }
  1910.  
  1911. .role-2irmRk::before {
  1912.   content: '';
  1913.   position: absolute;
  1914.   top: 0;
  1915.   left: -1px;
  1916.   height: 100%;
  1917.   width: calc(100% + 1px);
  1918.   border-top: 21px solid;
  1919.   border-color: inherit;
  1920.   opacity: 0.5;
  1921. }
  1922.  
  1923. .roleName-32vpEy {
  1924.   margin: 0 4px;
  1925. }
  1926.  
  1927. .roleCircle-3xAZ1j {
  1928.   position: absolute;
  1929.   height: 20px;
  1930.   width: 20px;
  1931.   border-radius: 0px;
  1932.   margin: 0;
  1933.   left: 0;
  1934. }
  1935.  
  1936. .roleCircle-3xAZ1j {
  1937.   padding: 0;
  1938.   position: absolute;
  1939.   z-index: 2;
  1940.   height: 22px;
  1941.   top: -1px;
  1942.   left: 0px;
  1943.   border-radius: 2px 0 0 2px;
  1944.   width: 22px;
  1945.   display: flex !important;
  1946.   transition: width 0.2s;
  1947.   background-color: transparent !important;
  1948.   overflow: hidden;
  1949. }
  1950.  
  1951. .addButton-pcyyf6 {
  1952.   line-height: 10px;
  1953.   width: 22px;
  1954.   box-sizing: border-box;
  1955.   height: 22px;
  1956. }
  1957.  
  1958. .roleRemoveIcon-2-TeGW {
  1959.   display: block;
  1960.   opacity: 0;
  1961.   transition: opacity 200ms ease-in-out;
  1962.   background-color: inherit;
  1963.   height: 20px;
  1964.   width: 22px;
  1965.   left: -22px;
  1966. }
  1967.  
  1968. .roleRemoveIcon-2-TeGW path:first-child {
  1969.   fill: rgba(0,0,0,.8) !important;
  1970. }
  1971.  
  1972. .roleRemoveIcon-2-TeGW path:last-child {
  1973.   transform: scale(0.6);
  1974.   transform-origin: center center;
  1975.   fill: white;
  1976. }
  1977.  
  1978. .role-2irmRk:hover .roleRemoveIcon-2-TeGW {
  1979.   opacity: 1;
  1980.   transition: opacity 0.2s;
  1981. }
  1982.  
  1983. .addButtonIcon-1NMJ8u {
  1984.   height: 7px;
  1985.   width: 7px;
  1986. }
  1987.  
  1988. #app-mount .userPopout-3XzG_A {
  1989.   background: linear-gradient(transparent, var(--uno) 90%), var(--quatro) var(--stars) top left fixed;
  1990. }
  1991.  
  1992. #app-mount .headerPlaying-j0WQBV {
  1993.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--stars) top left fixed;
  1994. }
  1995.  
  1996. #app-mount .headerXbox-3G-4PF,
  1997. #app-mount .headerSpotify-zpWxgT {
  1998.   background: linear-gradient(var(--online-sheer), transparent 80%), var(--stars) top left fixed;
  1999. }
  2000.  
  2001. #app-mount .headerStreaming-2FjmGz {
  2002.   background: linear-gradient(var(--streaming-sheer), transparent 80%), var(--stars) top left fixed;
  2003. }
  2004.  
  2005.   /* B. Message Popout */
  2006. .layer-v9HyYc[id*="popout"][style*="absolute; right:"] {
  2007.   transform-origin: 50% -10%;
  2008.   animation: popoutanim 300ms cubic-bezier(.4, 0, 0, 1), opacity 100ms ease 100ms backwards;
  2009. }
  2010.  
  2011. #app-mount .messagesPopoutWrap-1MQ1bW,
  2012. .container-enaOkj {
  2013.   background: var(--quatro) var(--stars) top left !important;
  2014.   background-attachment: fixed;
  2015. }
  2016.  
  2017. #app-mount .messagesPopout-24nkyi {
  2018.   background: transparent;
  2019. }
  2020.  
  2021. .channelHeader-3Gd2xq {
  2022.   background: linear-gradient(var(--sheer), var(--sheer)), var(--stars) top left, linear-gradient(var(--quatro), var(--quatro)) !important;
  2023.   background-attachment: fixed;
  2024.   padding: 12px 20px !important;
  2025.   margin-top: 10px;
  2026.   border-radius: 5px 5px 0 0;
  2027. }
  2028.  
  2029. .messages-3G3erD,
  2030. .messageContainer-gbhlwo {
  2031.   background: linear-gradient(var(--veil), var(--veil)), var(--stars) top left, linear-gradient(var(--quatro), var(--quatro)) !important;
  2032.   background-attachment: fixed;
  2033.   border-radius: 0 0 5px 5px;
  2034. }
  2035.  
  2036. .collapseButton-2ZsEjz {
  2037.   left: 0px;
  2038. }
  2039.  
  2040. #app-mount .header-ykumBX,
  2041. #app-mount .themedPopout-25DgLi .footer-SRC48P {
  2042.   background: var(--veil) var(--stars) top left !important;
  2043.   background-attachment: fixed;
  2044. }
  2045.  
  2046. #app-mount .messageGroupWrapper-o-Zw7G {
  2047.   background: var(--sheer) var(--stars) top left !important;
  2048.   background-attachment: fixed;
  2049.   border-color: var(--quatro);
  2050. }
  2051.  
  2052. #app-mount .top-28JiJ- .itemSelected-1qLhcL {
  2053.   color: var(--greyple) !important;
  2054.   border-color: var(--greyple) !important;
  2055. }
  2056.  
  2057. #app-mount .hasMoreButton-1MELpI {
  2058.   background: var(--sheer) var(--stars) top left !important;
  2059.   background-attachment: fixed;
  2060.   border-color: var(--quatro);
  2061. }
  2062.  
  2063. #app-mount .messageGroupWrapper-o-Zw7G:hover .actionButtons-1sUUug {
  2064.   background-color: var(--veil);
  2065.   box-shadow: 0 0 6px 4px var(--veil);
  2066. }
  2067.  
  2068. #app-mount .jumpButton-3DTcS_ {
  2069.   background-color: var(--veil);
  2070. }
  2071.  
  2072.   /* C. Search Popout & Results */
  2073. #app-mount .container-3ayLPN,
  2074. .searchResultsWrap-3-pOjs,
  2075. .searchResult-9tQ1uo.expanded-ovgtuV {
  2076.   background: var(--quatro) var(--stars) top left fixed;
  2077. }
  2078.  
  2079. #app-mount .option-96V44q:after {
  2080.   background: linear-gradient(90deg,transparent,var(--sheer) 80%);
  2081. }
  2082.  
  2083. #app-mount .option-96V44q.selected-rZcOL-,
  2084. #app-mount .searchAnswer-3Dz2-q,
  2085. #app-mount .searchFilter-2ESiM3 {
  2086.   background-color: var(--veil);
  2087. }
  2088.  
  2089. #app-mount .channelSeparator-1DOiGt .channelName-1JRO3C {
  2090.   background-color: var(--sheer);
  2091.   padding-left: 8px;
  2092.   border-radius: 5px 5px 0 0;
  2093. }
  2094.  
  2095. #app-mount .searchResult-9tQ1uo:before {
  2096.   background-image: linear-gradient(0deg,transparent,var(--sheer));
  2097. }
  2098.  
  2099. #app-mount .searchResult-9tQ1uo .searchResultMessage-1fxgXh.hit-1fVM9e {
  2100.   background: var(--sheer);
  2101.   box-shadow: 0 0 10px 6px var(--sheer);
  2102.   border-color: rgb(0, 0, 0);
  2103. }
  2104.  
  2105. #app-mount .jumpButton-1ol35X {
  2106.   background-color: var(--blurple);
  2107.   color: rgb(255, 255, 255);
  2108.   transition: all .2s ease-in-out;
  2109. }
  2110.  
  2111. #app-mount .searchBar-1MOL6S {
  2112.   background-color: var(--veil);
  2113. }
  2114.  
  2115. #app-mount .quickMessage-1yeL4E,
  2116. #app-mount .searchOption-8nCYo-.selected-1r_nkg {
  2117.   background: var(--sheer) var(--stars) top left !important;
  2118.   background-attachment: fixed;
  2119.   border-color: rgb(0, 0, 0);
  2120. }
  2121.  
  2122. #app-mount .jumpButton-Ia2hRJ:hover,
  2123. #app-mount .dim-1l4L4y span {
  2124.   background-color: var(--greyple);
  2125. }
  2126.  
  2127. #app-mount .calendarPicker-2yf6Ci .react-datepicker__day--disabled,
  2128. #app-mount .calendarPicker-2yf6Ci .react-datepicker__day--outside-month {
  2129.   background-color: var(--sheer);
  2130. }
  2131.  
  2132. #app-mount .dim-1l4L4y span {
  2133.   color: rgb(255, 255, 255);
  2134. }
  2135.  
  2136. #app-mount .searchResult-9tQ1uo:after {
  2137.   background: linear-gradient(180deg,transparent,var(--sheer));
  2138. }
  2139.  
  2140. #app-mount .searchResultsWrap-2DKFzt {
  2141.   background: var(--quatro) var(--stars) top left !important;
  2142.   background-attachment: fixed;
  2143. }
  2144.  
  2145. #app-mount .searchHeader-1l-wpR,
  2146. #app-mount .focused-2bY0OD,
  2147. #app-mount .focused-1Yu0L3 {
  2148.   background: var(--veil) var(--stars) top left !important;
  2149.   background-attachment: fixed;
  2150. }
  2151.  
  2152. #app-mount .calendarPicker-2yf6Ci .react-datepicker {
  2153.   background: var(--blurple-sheer);
  2154. }
  2155.  
  2156. #app-mount .calendarPicker-2yf6Ci .react-datepicker__header {
  2157.   background: transparent;
  2158. }
  2159.  
  2160. #app-mount .searchResultsContainer-1ma_dc,
  2161. #app-mount .popout-13LQ_3 {
  2162.   background: var(--uno) var(--stars) top left fixed;
  2163. }
  2164.  
  2165. #app-mount .searchHeader-1l-wpR .tab-2Ixsn0.selected-16te-P,
  2166. #app-mount .searchHeader-1l-wpR .tab-2Ixsn0:hover {
  2167.   color: var(--greyple);
  2168.   border-color: var(--greyple);
  2169. }
  2170.  
  2171.   /* D. Attach Popout, Add Game popout */
  2172. #app-mount .attachPopout-1n-ZKM,
  2173. #app-mount .colorPickerCustom-2CWBn2 {
  2174.   background: var(--uno) var(--stars) top left !important;
  2175.   background-attachment: fixed;
  2176. }
  2177.  
  2178. #app-mount .attachPopoutRow-KrE-f6:hover {
  2179.   background: var(--veil) var(--stars) top left !important;
  2180.   background-attachment: fixed;
  2181. }
  2182.  
  2183. #app-mount .preview-yX6Nx7,
  2184. #app-mount .invite-18yqGF {
  2185.   background: var(--sheer);
  2186.   border-color: rgb(0, 0, 0);
  2187. }
  2188.  
  2189. #app-mount .modal-3HD5ck .inner-zqa7da {
  2190.   background: var(--veil);
  2191. }
  2192.  
  2193. .lookFilled-1Gx00P.colorGrey-2DXtkV {
  2194.   background: var(--uno);
  2195. }
  2196.  
  2197.   /* E. Tooltips & Notices */
  2198. .tooltip-2QfLtc {
  2199.   border-radius: 5px !important;
  2200. }
  2201.  
  2202. #app-mount .tooltip-2QfLtc.tooltipRed-8-9NeP {
  2203.   background: var(--dnd);
  2204. }
  2205.  
  2206. #app-mount .tooltip-2QfLtc.tooltipGreen-WdeQwd {
  2207.   background: var(--online);
  2208. }
  2209.  
  2210. #app-mount .tooltipRed-8-9NeP .tooltipPointer-3ZfirK {
  2211.   border-top-color: var(--dnd);
  2212. }
  2213.  
  2214. #app-mount .tooltipGreen-WdeQwd .tooltipPointer-3ZfirK {
  2215.   border-top-color: var(--online);
  2216. }
  2217.    
  2218. #app-mount .tooltip-2QfLtc,
  2219. #app-mount .bubble-3we2di {
  2220.   background: var(--blurple);
  2221. }
  2222.    
  2223. #app-mount .tooltipBlack-PPG47z .tooltipPointer-3ZfirK,
  2224. #app-mount .bubble-3we2di:before {
  2225.   border-top-color: var(--blurple) !important;
  2226. }
  2227.  
  2228. #app-mount .notice-2FJMB4 {
  2229.   border-radius: 5px !important;
  2230.   background-image: var(--stars), linear-gradient(to right, var(--sheer), var(--sheer));
  2231. }
  2232.    
  2233. #app-mount .button-1MICoQ:hover {
  2234.   background: var(--blurple-sheer);
  2235.   border-color: var(--blurple-sheer);
  2236.   color: rgb(255, 255, 255);
  2237. }
  2238.  
  2239. .channelNotices-41mJbj .channelNotice-1-XFjC.guildMFAWarning-3GEzs8 {
  2240.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--stars) top left fixed;
  2241.   border-radius: 10px 10px 0 0;
  2242. }
  2243.  
  2244. /* tropix's fade in tooltip anim */
  2245.    
  2246. .layerContainer-yqaFcK .tooltip-2QfLtc.tooltipRight-2JM5PQ {
  2247.   animation: fadeFromRight 200ms
  2248. }
  2249.  
  2250. .layerContainer-yqaFcK .tooltip-2QfLtc.tooltipBottom-3ARrEK {
  2251.   animation: fadeFromBottom 200ms
  2252. }
  2253.  
  2254. .layerContainer-yqaFcK .tooltip-2QfLtc[class*="tooltipLeft-"] {
  2255.   animation: fadeFromLeft 200ms
  2256. }
  2257.  
  2258. .layerContainer-yqaFcK .tooltip-2QfLtc.tooltipTop-XDDSxx{
  2259.   animation: fadeFromTop 200ms;
  2260. }
  2261.  
  2262.   /* F. Autocomplete & Everyone Popout */
  2263. #app-mount .autocomplete-1vrmpx,
  2264. #app-mount .everyonePopout-nEbJY3 {
  2265.   background: linear-gradient(transparent, var(--blurple-sheer) 80%),var(--uno) var(--stars) top left !important;
  2266.   background-attachment: fixed;
  2267.   border: 1px solid var(--sheer);
  2268. }
  2269.  
  2270. #app-mount .content-Qb0rXO {
  2271.   color: rgb(255, 255, 255);
  2272. }
  2273.  
  2274. #app-mount .footer-2aTx0s {
  2275.   background: transparent;
  2276. }
  2277.  
  2278. #app-mount .selectorSelected-1_M1WV {
  2279.   background: var(--veil) var(--stars) top left !important;
  2280.   background-attachment: fixed;
  2281. }
  2282.  
  2283.   /* G. Gift Nitro and Gif Picker */
  2284. #app-mount .option-1l2vXE,
  2285. #app-mount .table-39R0Oe {
  2286.   background: var(--veil);
  2287. }
  2288.  
  2289. #app-mount .categoryFadeBlurple-1j72_A {
  2290.   background: var(--blurple) var(--stars) top left !important;
  2291.   background-attachment: fixed;
  2292.   opacity: .7;
  2293. }
  2294.  
  2295. #app-mount .categoryFade-2ybR1J {
  2296.   background: var(--quatro) var(--stars) top left !important;
  2297.   background-attachment: fixed;
  2298.   opacity: .4;
  2299. }
  2300.  
  2301. #app-mount .categoryFade-2ybR1J:hover {
  2302.   background: var(--quatro) var(--stars) top left !important;
  2303.   background-attachment: fixed;
  2304.   opacity: .7;
  2305. }
  2306.  
  2307.   /* H. Emoji Picker */
  2308. .contentWrapper-SvZHNd,
  2309. .emojiPicker-3PwZFl,
  2310. .diversitySelectorPopout-3FiGaM,
  2311. .premiumPromo-yVfLiA,
  2312. #app-mount #bda-qem-twitch-container,
  2313. #app-mount #bda-qem-favourite-container {
  2314.   background: var(--quatro) var(--stars) top left !important;
  2315.   background-attachment: fixed;
  2316.   border: 1px solid rgb(0, 0, 0);
  2317. }
  2318.  
  2319. .wrapper-2Gsate,
  2320. .inspector-sdLnLS
  2321. {
  2322.   background: var(--quatro) var(--stars) top left !important;
  2323.   background-attachment: fixed;
  2324. }
  2325.  
  2326.  
  2327. .bda-dark .emojiPicker-3m1S-j .category-2U57w6,
  2328. .emojiPicker-3m1S-j .category-2U57w6,
  2329. .emojiPicker-3m1S-j .categories-1feg4n,
  2330. #app-mount .emojiPicker-3m1S-j .searchBar-2pWH0_,
  2331. .guildIcon-3h-1IH {
  2332.   background-color: transparent;
  2333. }
  2334.  
  2335. #app-mount .diversitySelector-tmmMv0 .popout-2nUePc {
  2336.   width: unset;
  2337. }
  2338.  
  2339. #app-mount .lightTheme-3LGLQs.container-2XeR5Z {
  2340.   background: transparent
  2341. }
  2342.  
  2343. #bda-qem,
  2344. .infoBar-U6oBFk {
  2345.   background: var(--quatro) var(--stars) top left !important;
  2346.   background-attachment: fixed;
  2347.   border: 1px solid rgb(0, 0, 0);
  2348. }
  2349.  
  2350. .infoBarWrapper-283ttO.infoBarExpanded-2Of7UZ {
  2351.   position: absolute;
  2352.   bottom: 38px;
  2353.   left: 5px;
  2354.   border-radius: 5px;
  2355. }
  2356.  
  2357. .infoBar-U6oBFk {
  2358.   border: none;
  2359.   background: var(--stars) top left,
  2360.   linear-gradient(var(--blurple-sheer), var(--blurple-sheer)),
  2361.   linear-gradient(var(--quatro), var(--quatro)) !important;
  2362.   background-attachment: fixed;
  2363. }
  2364.  
  2365. #bda-qem button {
  2366.   border-left: 1px solid black;
  2367.   color: rgb(223, 223, 223);
  2368.   box-shadow: none;
  2369. }
  2370.  
  2371. #bda-qem button.active,
  2372. .navButtonActive-3RPAJy,
  2373. .emojiItem-14v6tW.emojiItemSelected-1aLkfV,
  2374. .categoryItemDefaultCategorySelected-_HCKoz,
  2375. .categoryItemDefaultCategorySelected-_HCKoz:hover {
  2376.   background-color: var(--blurple-sheer);
  2377. }
  2378.  
  2379. #app-mount .searchBar-2_Yu-C.searchBarLight-1NxoDG {
  2380.   background: transparent;
  2381. }
  2382.  
  2383. #app-mount .diversitySelector-tmmMv0 .popout-2nUePc .item-16cXuq:hover,
  2384. #bda-qem button:not(.active):hover {
  2385.   background-color: var(--veil);
  2386. }
  2387.  
  2388. #app-mount .searchBar-2_Yu-C.searchBarLight-1NxoDG .searchBarInner-1_Tg2R {
  2389.   background: var(--veil);
  2390. }
  2391.  
  2392. #app-mount .emojiPicker-3m1S-j .stickyHeader-1SS0JU,
  2393. #app-mount .quickSelectPopout-X1hvgV,
  2394. .wrapper-1-Fsb8 {
  2395.   background: var(--uno) var(--stars) top left !important;
  2396.   background-attachment: fixed;
  2397. }
  2398.  
  2399. .navButtonActive-1MkytQ,
  2400. .emojiPicker-3m1S-j .scroller-3vODG7 .emojiItem-109bjA.selected-39BZ4S,
  2401. .emote-container:hover {
  2402.   background-color: var(--blurple-sheer);
  2403. }
  2404.  
  2405. .emojiPicker-3m1S-j .categories-1feg4n .item-16cXuq {
  2406.   align-items: flex-start;
  2407.   margin-top: 4px;
  2408. }
  2409.  
  2410. .categoryItemDefaultCategory-aBZ6nJ svg {
  2411.   display: none;
  2412. }
  2413.  
  2414. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='recent'],
  2415. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='recent'].categoryItemDefaultCategorySelected-_HCKoz,
  2416. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='recent']:hover {
  2417.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/frequent.svg) !important
  2418. }
  2419.  
  2420. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='people'],
  2421. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='people'].categoryItemDefaultCategorySelected-_HCKoz,
  2422. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='people']:hover {
  2423.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/people.svg) !important
  2424. }
  2425.  
  2426. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='nature'],
  2427. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='nature'].categoryItemDefaultCategorySelected-_HCKoz,
  2428. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='nature']:hover {
  2429.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/nature.svg) !important
  2430. }
  2431.  
  2432. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='food'],
  2433. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='food'].categoryItemDefaultCategorySelected-_HCKoz,
  2434. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='food']:hover {
  2435.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/food.svg) !important
  2436. }
  2437.  
  2438. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='activity'],
  2439. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='activity'].categoryItemDefaultCategorySelected-_HCKoz,
  2440. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='activity']:hover {
  2441.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/activity.svg) !important
  2442. }
  2443.  
  2444. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='travel'],
  2445. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='travel'].categoryItemDefaultCategorySelected-_HCKoz,
  2446. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='travel']:hover {
  2447.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/travel.svg) !important
  2448. }
  2449.  
  2450. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='objects'],
  2451. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='objects'].categoryItemDefaultCategorySelected-_HCKoz,
  2452. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='objects']:hover {
  2453.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/objects.svg) !important
  2454. }
  2455.  
  2456. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='symbols'],
  2457. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='symbols'].categoryItemDefaultCategorySelected-_HCKoz,
  2458. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='symbols']:hover {
  2459.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/symbols.svg) !important
  2460. }
  2461.  
  2462. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='flags'],
  2463. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='flags'].categoryItemDefaultCategorySelected-_HCKoz,
  2464. .categoryItemDefaultCategory-aBZ6nJ[aria-label*='flags']:hover {
  2465.   background-image: url(https://monstrousdev.github.io/themes/assets/emojiCategory/flags.svg) !important
  2466. }
  2467.  
  2468. #app-mount .sadImage-2ph8SI {
  2469.   background: url(https://ellexidecodes.github.io/Discord-Themes/assets/sadDiscord.png) center/100% no-repeat;
  2470. }
  2471.  
  2472.   /* I. Game Preview */
  2473. #app-mount .gamePreview-9weYR2,
  2474. #app-mount .container-jGk-CT {
  2475.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
  2476.   background-attachment: fixed;
  2477. }
  2478.  
  2479. .news-2KwXHF,
  2480. #app-mount .body-1SVoBw,
  2481. #app-mount .news-2KwXHF {
  2482.   background: transparent;
  2483. }
  2484.  
  2485. .newsLink-38Naqi:hover {
  2486.   background: var(--sheer);
  2487. }
  2488.  
  2489. #app-mount .popout-3sVMXz .container-jGk-CT {
  2490.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
  2491.   background-attachment: fixed;
  2492. }
  2493.  
  2494. #app-mount .popout-3sVMXz .news-2KwXHF,
  2495. #app-mount .emptyPlayers-dx3qig,
  2496. #app-mount .players-1zg2l8,
  2497. #app-mount .footer-3J5oP4 {
  2498.   background-color: transparent;
  2499. }
  2500.  
  2501. #app-mount .player-3zB-0D:hover {
  2502.   background-color: var(--sheer);
  2503. }
  2504.  
  2505.   /* J. Add Roles Popout & Roles Overflow */
  2506. #app-mount .autocompleteArrow-Zxoy9H,
  2507. #app-mount .autocompleteHeaderBackground-30T70q {
  2508.   background: var(--quatro) var(--stars) top left !important;
  2509.   background-attachment: fixed;
  2510. }
  2511.  
  2512. #app-mount  .container-VSDcQc .sectionTag-pXyto9 {
  2513.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
  2514.   background-attachment: fixed;
  2515. }
  2516.  
  2517. #app-mount .overflowRolesPopout-140n9i {
  2518.   background: linear-gradient(var(--blurple-sheer), var(--blurple-sheer)), var(--quatro) var(--stars) top left !important;
  2519.   background-attachment: fixed;
  2520. }
  2521.  
  2522. #app-mount .row-rrHHJU.selected-1pIgLL {
  2523.   background: var(--blurple-sheer) var(--stars) top left !important;
  2524.   background-attachment: fixed;
  2525. }
  2526.  
  2527. #app-mount .overflowRolesPopoutArrow-2O66oH {
  2528.   background: linear-gradient(var(--blurple-sheer), var(--blurple-sheer)), var(--quatro);
  2529.   position: absolute;
  2530.   bottom: 0;
  2531.   left: 50%;
  2532.   transform: translateX(-50%) rotate(45deg);
  2533.   box-shadow: none;
  2534.   -webkit-box-shadow: none;
  2535. }
  2536.  
  2537.   /* K. RTC Connection */
  2538. #app-mount .container-2x5lvQ {
  2539.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
  2540.   background-attachment: fixed;
  2541. }
  2542.  
  2543. #app-mount .popout-2GtBL-:after {
  2544.   border-top-color: var(--quatro);
  2545. }
  2546.  
  2547. #app-mount .container-2x5lvQ header,
  2548. #app-mount .container-2x5lvQ section {
  2549.   background: transparent;
  2550. }
  2551.  
  2552.   /* L. Stream Popout */
  2553. #app-mount .previewContainer-12UlHl {
  2554.   background-color: transparent;
  2555. }
  2556.  
  2557. #app-mount .popout-1k352f,
  2558. #app-mount .streamPreview-2-WUWT,
  2559. #app-mount .root-25RxKh {
  2560.   background: var(--quatro) var(--stars) top left !important;
  2561.   background-attachment: fixed;
  2562. }
  2563.  
  2564.   /* M. Follow Channel */
  2565. #app-mount .header-1pGpFt,
  2566. #app-mount .channelContainer-1x3D6I,
  2567. #app-mount .footer-2gL1pp {
  2568.   background: transparent;
  2569. }
  2570.  
  2571. .channel-2PJTLY {
  2572.   background-color: var(--blurple-sheer)
  2573. }
  2574.  
  2575.  
  2576.  
  2577. /* X. Modals */
  2578.   /* A. User Modal */
  2579. #app-mount .inner-1ilYF7 .root-SR8cQa,
  2580. #app-mount .slide-2pHaq5,
  2581. #app-mount .root-1gCeng {
  2582.   background: linear-gradient(transparent, var(--uno) 90%), var(--quatro) var(--stars) top left fixed;
  2583.   border-radius: 10px;
  2584. }
  2585.  
  2586. #app-mount .topSectionNormal-2-vo2m,
  2587. #app-mount .body-3ND3kc,
  2588. #app-mount .topSectionPlaying-1J5E4n,
  2589. #app-mount .topSectionXbox-3fWLjS,
  2590. #app-mount .topSectionSpotify-1lI0-P,
  2591. #app-mount .topSectionStreaming-1Tpf5X{
  2592.   background: transparent;
  2593. }
  2594.  
  2595. #app-mount .topSectionPlaying-1J5E4n {
  2596.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--stars) top left fixed;
  2597. }
  2598.  
  2599. #app-mount .topSectionXbox-3fWLjS,
  2600. #app-mount .topSectionSpotify-1lI0-P {
  2601.   background: linear-gradient(var(--online-sheer), transparent 80%), var(--stars) top left fixed;
  2602. }
  2603.  
  2604. #app-mount .topSectionStreaming-1Tpf5X {
  2605.   background: linear-gradient(var(--streaming-sheer), transparent 80%), var(--stars) top left fixed;
  2606. }
  2607.  
  2608.   /* B. Upload Modal */
  2609. .uploadModal-2ifh8j,
  2610. #app-mount .addGamePopout-2RY8Ju,
  2611. #app-mount .inner-1JeGVc .container-3qKHyN,
  2612. #app-mount .keyboardShortcutsModal-3piNz7,
  2613. #app-mount .uploadModalIn-1z07Bv .uploadDropModal-2kTwbc .bgScale-1otPtc,
  2614. #app-mount .modalRoot-LW89o7 {
  2615.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
  2616.   background-attachment: fixed;
  2617.   border-radius: 10px;
  2618. }
  2619.  
  2620. .uploadModal-2ifh8j .inner-3nWsbo,
  2621. .uploadModal-2ifh8j .inner-3nWsbo .file-34mY5K .icon-kyxXVr.image-2yrs5j {
  2622.   border-color: var(--sheer)
  2623. }
  2624.  
  2625. .uploadModal-2ifh8j .inner-3nWsbo .file-34mY5K .icon-kyxXVr.image-2yrs5j:hover {
  2626.   width: 93%;
  2627.   height: 160%;
  2628.   margin-top: -95px;
  2629. }
  2630.  
  2631. .uploadModal-2ifh8j .footer-3mqk7D,
  2632. .ctaSection-izWwhs,
  2633. .formSection-1NFAGI {
  2634.   background: transparent;
  2635. }
  2636.  
  2637. .lookInverted-2D7oAl.colorBrand-3pXr91,
  2638. #app-mount .checked-3_4uQ9,
  2639. .theme-brand .inner-zqa7da,
  2640. .uploadModal-2ifh8j .inner-3nWsbo .file-34mY5K .icon-kyxXVr.image-2yrs5j,
  2641. #app-mount .resultFocused-3aIoYe,
  2642. .usagePill-_nSrnP,
  2643. .channelsWrapper-2HhUER,
  2644. .rolesWrapper-2yOx9S {
  2645.   background-color: var(--sheer);
  2646.   transition: all .2s ease-in-out;
  2647. }
  2648.  
  2649. .lookInverted-2D7oAl.colorBrand-3pXr91:hover,
  2650. #app-mount .input-2VB9rf,
  2651. #app-mount .container-2XeR5Z {
  2652.   background-color: var(--veil);
  2653. }
  2654.  
  2655. #app-mount .modal-3HD5ck,
  2656. #app-mount .modal-3v8ziU {
  2657.   background: var(--quatro) var(--stars) top left !important;
  2658. background-attachment: fixed;
  2659. }
  2660.  
  2661. #app-mount .footer-2yfCgX,
  2662. #app-mount .footer-1FPmkC,
  2663. #app-mount .footer-30ewN8 {
  2664.   background: transparent;
  2665.   box-shadow: none;
  2666.   -webkit-box-shadow: none;
  2667. }
  2668.  
  2669. #app-mount .scrollerOuter-3FLELE {
  2670.   margin-top: 0px;
  2671. }
  2672.  
  2673.   /* C. Join Guild Modal */
  2674. #app-mount .action-1lSjCi{
  2675.   background: var(--veil) var(--stars) top left !important;
  2676.   background-attachment: fixed;
  2677. }
  2678.  
  2679. #app-mount .slide-2pHaq5 .footer-3rDWdC {
  2680.   background: transparent;
  2681.   box-shadow: inset 0 1px 0 var(--blurple-sheer);
  2682. }
  2683.  
  2684. #app-mount .create-3jownz .actionIcon-2IISM_ {
  2685.   position: relative;
  2686.   background-image: none;
  2687.   background-color: var(--blurple);
  2688.   -webkit-mask: url(https://ellexidecodes.github.io/Discord-Themes/assets/add-btn.svg) center/112px 78px no-repeat;
  2689. }
  2690.  
  2691. .create-3jownz .actionIcon-2IISM_::after {
  2692.   content: '';
  2693.   position: absolute;
  2694.   top: 0;
  2695.   left: 0;
  2696.   height: 100%;
  2697.   width: 100%;
  2698.   background: rgb(255, 255, 255);
  2699.   opacity: .4;
  2700.   -webkit-mask: url(https://ellexidecodes.github.io/Discord-Themes/assets/add-btn-two.svg) center/112px 78px no-repeat;
  2701. }
  2702.  
  2703. #app-mount .join-33Tr-7 .actionIcon-2IISM_ {
  2704.   background-image: url(https://ellexidecodes.github.io/Discord-Themes/assets/join-btn.png);
  2705. }
  2706.  
  2707. #app-mount  .or-3THJsp {
  2708.   -webkit-mask: url('https://ellexidecodes.github.io/Discord-Themes/assets/or.svg');
  2709.   -webkit-mask-position: center;
  2710.   -webkit-mask-repeat: no-repeat;
  2711.   -webkit-mask-size: 52px 52px;
  2712.   background: var(--quatro) var(--stars) top left !important;
  2713.   background-attachment: fixed;
  2714.   color: var(--blurple);
  2715. }
  2716.  
  2717. #app-mount .theme-light .wrapper-2ZbzR9 {
  2718.   background: transparent;
  2719. }
  2720.  
  2721. .avatar-21196O {
  2722.   border-color: var(--greyple)
  2723. }
  2724.  
  2725. .avatarUploaderInner-3UNxY3 {
  2726.   background-color: var(--blurple-sheer);
  2727. }
  2728.  
  2729. .regionSelectModal-12e-57 {
  2730.   background: var(--quatro) var(--stars) top left !important;
  2731.   background-attachment: fixed;
  2732. }
  2733.  
  2734. .regionSelectModal-12e-57 .regionSelectModalOption-2DSIZ3 {
  2735.   background: var(--sheer);
  2736.   border-color: var(--sheer);
  2737.   transition: all .2s ease-in-out;
  2738. }
  2739.  
  2740. #app-mount .input-1mgnkM {
  2741.   color: rgb(187, 187, 187);
  2742. }
  2743.  
  2744.   /* D. Messages Modal, Games Download Modal, Screenshare */
  2745. #app-mount .message-2qRu38,
  2746. #app-mount .tiles-2aXG_k {
  2747.   background: var(--sheer) var(--stars) top left !important;
  2748.   background-attachment: fixed;
  2749.   box-shadow: none;
  2750. }
  2751.  
  2752. #app-mount .installSize-1eXbBX {
  2753.   background-color: var(--blurple-sheer);
  2754. }
  2755.  
  2756.   /* E. Incoming Call & Phone Verification */
  2757. #app-mount .incomingCallInner-2VmFiR {
  2758.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left no-repeat fixed;
  2759.   border-color: var(--blurple-sheer);
  2760.   border-radius: 10px;
  2761. }
  2762.  
  2763. #app-mount .lookFilled-1Gx00P.colorTransparent-1ewNp9 {
  2764.   background: var(--veil);
  2765. }
  2766.  
  2767. #app-mount .incomingCallInner-2VmFiR .lookFilled-1Gx00P.colorTransparent-1ewNp9 {
  2768.   background: var(--dnd-sheer);
  2769.   transition: background-color .2s ease-in-out;
  2770. }
  2771.  
  2772. #app-mount .incomingCallInner-2VmFiR .lookFilled-1Gx00P.colorTransparent-1ewNp9:hover {
  2773.   background: var(--dnd);
  2774. }
  2775.  
  2776. .lookFilled-1Gx00P.colorGreen-29iAKY {
  2777.   background: var(--online-sheer);
  2778.   transition: background-color .2s ease-in-out;
  2779. }
  2780.  
  2781. .lookFilled-1Gx00P.colorGreen-29iAKY:hover {
  2782.   background: var(--online);
  2783. }
  2784.  
  2785. #app-mount .phoneField-38N1bJ,
  2786. #app-mount .input-3yHnCz {
  2787.   background: var(--sheer) var(--stars) top left fixed;
  2788. }
  2789.  
  2790. #app-mount .phoneField-38N1bJ .countryButton-3xq3Ts {
  2791.   background: var(--veil) var(--stars) top left fixed;
  2792. }
  2793.  
  2794. #app-mount .phoneField-38N1bJ .inputField-aNPXsv {
  2795.   background: transparent;
  2796. }
  2797.  
  2798.   /* F. Reactions Modal & Server Invite Modal */
  2799. #app-mount .sidebar-1-SQro,
  2800. #app-mount  .reactors-Blmlhw {
  2801.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--sheer) var(--stars) top left fixed;
  2802. }
  2803.  
  2804. #app-mount #app-mount .reactors-Blmlhw {
  2805.   background: linear-gradient(var(--blurple-sheer), transparent 80%);
  2806. }
  2807.  
  2808. #app-mount .contentWrapper-3WC1ID {
  2809.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left fixed;
  2810. }
  2811.  
  2812. #app-mount .contentWrapper-3WC1ID .pill-1dHPfk:nth-child(2) {
  2813.   background: var(--offline-sheer);
  2814. }
  2815.  
  2816. #app-mount .contentWrapper-3WC1ID .pill-1dHPfk:nth-child(1) {
  2817.   background: var(--online-sheer);
  2818. }
  2819.  
  2820.   /* G. Gift Modal */
  2821. #app-mount .modal-yWgWj- {
  2822.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left fixed;
  2823.   border-radius: 5px;
  2824. }
  2825.  
  2826. #app-mount .footer-3rDWdC {
  2827.   background: transparent;
  2828. }
  2829.  
  2830. #app-mount .tierMarker-5HkGJ_[style*="background-image: linear-gradient(to right, rgb(32, 34, 37), rgb(32, 34, 37));"] {
  2831.   background: linear-gradient(to right, var(--quatro), var(--veil)) !important;
  2832. }
  2833.  
  2834.   /* H. Quick Switcher & Keyboard Shortcuts */
  2835. #app-mount .keybindShortcut-1BD6Z1 span {
  2836.   background-color: var(--blurple);
  2837. }
  2838.  
  2839. #app-mount .quickswitcher-3JagVE {
  2840.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left fixed;
  2841.   border-radius: 5px;
  2842. }
  2843.  
  2844. .scroller-zPkAnE {
  2845.   background: transparent;
  2846. }
  2847.  
  2848.   /* I. BetterDiscord Error Modal */
  2849. .bd-modal-wrapper .bd-modal-inner {
  2850.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left fixed;
  2851. }
  2852.  
  2853. .bd-modal-wrapper .header,
  2854. .bd-modal-wrapper .bd-modal-body {
  2855.   background: transparent;
  2856. }
  2857.  
  2858. /* XI. Keyframes */
  2859.  
  2860. @keyframes fadeIn {
  2861.   to {
  2862.     display: block;
  2863.     opacity: 1 !important;
  2864.   }
  2865. }
  2866.  
  2867. @keyframes slide-up {
  2868.   from {
  2869.     transform: translate(0, 100%);
  2870.   }
  2871. }
  2872.  
  2873. @keyframes slide-down {
  2874.   from {
  2875.     transform: translate(0, -100%);
  2876.   }
  2877. }
  2878.  
  2879. @keyframes slide-left {
  2880.   from {
  2881.     transform: translate(-100);
  2882.   }
  2883. }
  2884.  
  2885. @keyframes slide-right {
  2886.   from {
  2887.     transform: translate(100%);
  2888.   }
  2889. }
  2890.  
  2891. @keyframes show-status {
  2892.   from {
  2893.     transform: translateY(100%) translateX(0%) translateZ(0px);
  2894.   }
  2895. }
  2896.  
  2897. @keyframes status {
  2898.   from {
  2899.     transform: scale(0);
  2900.     opacity: 0
  2901.   }
  2902. }
  2903.  
  2904. @keyframes context-open-invertY {
  2905.   0% {
  2906.     padding-top: 0px;
  2907.     padding-bottom: 0px;
  2908.     margin-top: 0px;
  2909.   }
  2910. }
  2911.  
  2912. @keyframes context-open-new {
  2913.   0% {
  2914.     transform: scale(1, 0.8);
  2915.   }
  2916. }
  2917.  
  2918. @keyframes context-open {
  2919.   0% {
  2920.     padding-top: 0px;
  2921.     padding-bottom: 0px;
  2922.   }
  2923. }
  2924.  
  2925. @keyframes popoutanim-inner {
  2926.   0% {
  2927.     transform: scale(2);
  2928.   }
  2929.   100% {
  2930.     transform: scale(1);
  2931.   }
  2932. }
  2933.  
  2934. @keyframes popoutanim {
  2935.   0% {
  2936.     transform: scale(0);
  2937.   }
  2938.   100% {
  2939.     transform: scale(1);
  2940.   }
  2941. }
  2942.  
  2943. @keyframes popoutanim-status {
  2944.   0% {
  2945.     transform: scale(0) translateY(-100%);
  2946.   }
  2947.   100% {
  2948.     transform: scale(1) translateY(-100%);
  2949.   }
  2950. }
  2951.  
  2952. @keyframes popoutanim-min {
  2953.   0% {
  2954.     transform: translateX(-50%) scale(0);
  2955.   }
  2956.   100% {
  2957.     transform: translateX(-50%) scale(1);
  2958.   }
  2959. }
  2960.  
  2961. @keyframes fadeFromTop {
  2962.   0% {
  2963.       opacity: 0;
  2964.       transform: translateY(-50%)
  2965.   }
  2966.   100% {
  2967.       opacity: 0.9;
  2968.       transform: none
  2969.   }
  2970. }
  2971.  
  2972. @keyframes fadeFromRight {
  2973.   0% {
  2974.       opacity: 0;
  2975.       transform: translateX(50%)
  2976.   }
  2977.   100% {
  2978.       opacity: 0.9;
  2979.       transform: none
  2980.   }
  2981. }
  2982.  
  2983. @keyframes fadeFromBottom {
  2984.   0% {
  2985.       opacity: 0;
  2986.       transform: translateY(50%)
  2987.   }
  2988.   100% {
  2989.       opacity: 0.9;
  2990.       transform: none
  2991.   }
  2992. }
  2993.  
  2994. @keyframes fadeFromLeft {
  2995.   0% {
  2996.       opacity: 0;
  2997.       transform: translateX(-50%)
  2998.   }
  2999.   100% {
  3000.       opacity: 0.9;
  3001.       transform: none
  3002.   }
  3003. }
  3004.  
  3005. /* XII. Custom CSS */
  3006. .contentRegion-3nDuYy #bd-customcss-attach-controls,
  3007. #bd-customcss-detach-container #bd-customcss-attach-controls {
  3008.   background: transparent;
  3009.   box-shadow: none;
  3010. }
  3011.  
  3012. .standardSidebarView-3F1I7i #bd-customcss-attach-controls button,
  3013. .bd-detached-css-editor #bd-customcss-attach-controls button {
  3014.   background: var(--online-sheer);
  3015. }
  3016.  
  3017. .bd-detached-editor .chat .title-3qD0b- > div:last-child,
  3018. .bd-detached-editor .headerBar-UHpsPw > div:last-child {
  3019.     margin-right: 0 !important;
  3020. }
  3021.  
  3022. #bd-customcss-detach-container #bd-customcss-attach-controls{
  3023.     display: flex;
  3024.     flex-flow: column;
  3025.     align-items: center;
  3026. }
  3027. #bd-customcss-attach-controls {
  3028.     display: flex;
  3029.     flex-flow: column;
  3030.     align-items: center;
  3031. }
  3032. #bd-customcss-detach-controls-button > span {
  3033.     font-size: 0 !important;
  3034.     display: flex;
  3035.     flex-flow: column;
  3036.     align-items: center;
  3037. }
  3038. #bd-customcss-attach-controls .checkbox-group {
  3039.     order: 1;
  3040. }
  3041.  
  3042. /* Main CSS Box */
  3043. .contentColumnDefault-1VQkGM .ace-monokai {
  3044.   background-color: var(--sheer);
  3045.   color: rgb(255, 255, 255);
  3046.   border-radius: 10px;
  3047. }
  3048.  
  3049. /* Gutter Line */
  3050. .ace-monokai .ace_gutter {
  3051.   background: var(--tres) var(--stars) top left/cover fixed;
  3052.   border-radius: 10px 0 0 10px;
  3053.   color: var(--streaming);
  3054. }
  3055.  
  3056. /* Shorter Highlight Line */
  3057. .ace-monokai .ace_gutter-active-line {
  3058.   background-color: var(--quatro);
  3059. }
  3060.  
  3061. /* When Clicking and Dragging through the codes to highlight them */
  3062. .ace-monokai .ace_marker-layer .ace_selection {
  3063.   background: var(--blurple-sheer);
  3064. }
  3065.  
  3066. /* Long Highlight Line */
  3067. .ace-monokai .ace_marker-layer .ace_active-line {
  3068.   background: var(--offline-sheer);
  3069. }
  3070.  
  3071. /* Bracket Border */
  3072. .ace-monokai .ace_marker-layer .ace_bracket {
  3073.   margin: -1px 0 0 -1px;
  3074.   border: 1px solid var(--greyple-sheer);
  3075. }
  3076.  
  3077. /* Comment Code */
  3078. .ace-monokai .ace_comment {
  3079.   color: var(--online);
  3080. }
  3081.  
  3082. /* XIII. Plugin Optimization */
  3083.   /* A. Ghost Ping */
  3084. .ghostping-button-unread .ghostping-button-icon {
  3085.   color: var(--dnd);
  3086.   transition: color 200ms ease-in-out;
  3087. }
  3088.  
  3089. #ghostping-panel {
  3090.   height: calc(100% - 32px) !important;
  3091.   padding: 65px 30px 30px !important;
  3092.   box-sizing: border-box;
  3093.   left: 10px !important;
  3094.   background-color: var(--uno) !important;
  3095.   background-image: var(--stars);
  3096.   background-position: top left !important;
  3097.   background-attachment: fixed !important;
  3098.   border-radius: 10px;
  3099. }
  3100.  
  3101. #ghostping-panel[style*="opacity: 0.9"] {
  3102.   opacity: 1 !important;
  3103. }
  3104.  
  3105. #ghostping-panel #ghostping-panel-close-button ~ div {
  3106.   background-color: transparent !important;
  3107.   background-image: var(--stars), linear-gradient(to right, var(--blurple-sheer), var(--tres)) !important;
  3108.   background-size: 100%, 100% !important;
  3109.   background-position: top left, center !important;
  3110.   background-attachment: fixed, initial !important;
  3111.   width: calc(100% - 60px) !important;
  3112. }
  3113.  
  3114.   /* B. Permissions Viewer */
  3115. #permissions-modal-wrapper #permissions-modal {
  3116.   background: linear-gradient(var(--blurple-sheer), transparent 80%), var(--quatro) var(--stars) top left !important;
  3117.   background-attachment: fixed;
  3118.   border-radius: 10px;
  3119. }
  3120.  
  3121. #permissions-modal-wrapper .header,
  3122. #permissions-modal-wrapper .modal-body,
  3123. #permissions-modal-wrapper .role-side,
  3124. #permissions-modal-wrapper .perm-side {
  3125.   background: transparent;
  3126. }
  3127.  
  3128. /* XIV. Addon Optimization */
  3129.   /* A. Custom Background Popouts */
  3130.  
  3131. .header-QKLPzZ .wrapper-3t9DeA.avatar-3EQepX::before {
  3132.   content:'';
  3133.   position:absolute;
  3134.   top:-34px; /*Distance from the avatar container to the edge of the modal (y)*/
  3135.   left:-20px; /*Distance from the avatar container to the edge of the modal (x)*/
  3136.   width:601px; /*Width of modal header*/
  3137.   height: 300px; /*Height of modal header*/
  3138.   opacity:.5;
  3139.   pointer-events:none;
  3140.   background: var(--user-background) center/cover no-repeat;
  3141.   -webkit-mask: linear-gradient(black, transparent);
  3142.   display: block !important;
  3143. }
  3144.  
  3145. .header-QKLPzZ *:not(:first-child),
  3146. .tabBarItem-1b8RUP {
  3147.   z-index:1;
  3148. }
  3149.  
  3150. .userPopout-3XzG_A .wrapper-3t9DeA * {
  3151.   z-index: 1;
  3152. }
  3153.  
  3154. .userPopout-3XzG_A .wrapper-3t9DeA::after {
  3155.   z-index: unset;
  3156. }
Add Comment
Please, Sign In to add comment
Public Pastes
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!