Fluxer themes 的修订

下载 ZIP

jce 修订了这个 Gist 1774340227. 转到此修订

8 files changed, 0 insertions, 0 deletions

DIALOGUE.386-AHM.CSS 重命名为 DIALOGUE.386-AHM.css

文件已重命名，但内容与之前没有差异

DIALOGUE.386-AHN.CSS 重命名为 DIALOGUE.386-AHN.css

文件已重命名，但内容与之前没有差异

DIALOGUE.386-B612.CSS 重命名为 DIALOGUE.386-B612.css

文件已重命名，但内容与之前没有差异

DIALOGUE.386-B612Mono.CSS 重命名为 DIALOGUE.386-B612Mono.css

文件已重命名，但内容与之前没有差异

DIALOGUE.386-Plex.CSS 重命名为 DIALOGUE.386-Plex.css

文件已重命名，但内容与之前没有差异

DIALOGUE.386-PlexMono.CSS 重命名为 DIALOGUE.386-PlexMono.css

文件已重命名，但内容与之前没有差异

DIALOGUE.386-VT323.CSS 重命名为 DIALOGUE.386-VT323.css

文件已重命名，但内容与之前没有差异

DIALOGUE.386.CSS 重命名为 DIALOGUE.386.css

文件已重命名，但内容与之前没有差异

jce 修订了这个 Gist 1774340171. 转到此修订

9 files changed, 15031 insertions, 5 deletions

DIALOGUE.386-AHM.CSS(文件已创建)

差异内容过多而无法显示

DIALOGUE.386-AHN.CSS(文件已创建)

差异内容过多而无法显示

DIALOGUE.386-B612.CSS(文件已创建)

差异内容过多而无法显示

DIALOGUE.386-B612Mono.CSS(文件已创建)

差异内容过多而无法显示

DIALOGUE.386-Plex.CSS(文件已创建)

差异内容过多而无法显示

DIALOGUE.386-PlexMono.CSS(文件已创建)

差异内容过多而无法显示

DIALOGUE.386-VT323.CSS(文件已创建)

差异内容过多而无法显示

DIALOGUE.386.CSS(文件已创建)

		@@ -0,0 +1,1845 @@
1	+	/**
2	+	* @name DIALOGUE.386
3	+	* @description A late 80s to early 90s TUI-style theme based on System-Glass (system24) Theme by Deer ♡
4	+	* @basetheme dark
5	+	* @author jce:2492
6	+	* @invite https://fluxer.gg/themes
7	+	*/
8	+
9	+	body {
10	+	container-name: body;
11	+
12	+	/* ----------------------------------------------------------------------- */
13	+	/* Toggles
14	+	/* ----------------------------------------------------------------------- */
15	+
16	+	/* decide if you want square or rounded avatars. \| Options: off, on \| Recommended: on */
17	+	--SquareAvatars: on;
18	+	/* set the user online status appearance. outlines look better with square avatars, but only in the desktop client. \| Options: off, on \| Recommended: on */
19	+	--OutlineOnlineStatus: on;
20	+	/* decide if you want bubbles to highlight message groups. \| Options: off, on \| Currently broken
21	+	/* see also: --ThemeMessageBubbleColor */
22	+	--MessageBubbles: off;
23	+	/* decide if you want panel labels. looks better without a background image \| Options: off, on \| Currently broken */
24	+	--ThemePanelLabels: off;
25	+	/* overwrites fluxer's panel rounding in most places \| Options: off, on \| Recommended: off
26	+	/* see also: --ThemeRoundingMultiplier */
27	+	--UseDefaultRounding: off;
28	+	/* decide if you want to disable some additional animations added by the theme \| Options: off, on \| Recommended: off */
29	+	--ExtraAnimations: off;
30	+	/* set a custom app icon in the top left corner \| Options: off, on */
31	+	--CustomAppIcon: off;
32	+	/* link to your custom icon. currently it HAS to be hosted on fluxer's servers */
33	+	--ThemeCustomIconUrl: url('');
34	+	/* [Experimental] Controls the server list position, only works in the desktop client for now. \| Options: off \| on */
35	+	--Horizontal-Serverlist: off;
36	+	/* Controls the server list alignment. only works with horizontal serverlist enabled \| Options: left \| center \| right */
37	+	--Serverlist-Alignment: left;
38	+	}
39	+
40	+	:root {
41	+	/* ----------------------------------------------------------------------- */
42	+	/* Colors & default theme overrides
43	+	/* ----------------------------------------------------------------------- */
44	+
45	+	--brand-primary: #00ff00;
46	+	--brand-secondary: #00aa00;
47	+
48	+	--ThemeMessageBubbleColor: #cacaca;
49	+
50	+	--ThemeFlatPrimary: #000071;
51	+	--ThemeFlatLighter: #5500ff;
52	+	--ThemeFlatDarker: black;
53	+
54	+	--ThemeDarkenLight: #000071;
55	+	--ThemeDarkenMedium: #c0c0c088;
56	+	--ThemeBrightenLight: rgba(255, 255, 255, .06);
57	+	--ThemeBrightenMedium: rgba(255, 255, 255, .15);
58	+
59	+	/* color overrides */
60	+	--background-primary: var(--ThemeFlatDarker);
61	+	--background-secondary: var(--ThemeFlatPrimary);
62	+	--background-secondary-alt: var(--ThemeFlatLighter); /* mainly used in for mobile view*/
63	+	--background-tertiary: var(--ThemeFlatLighter); /* mainly used in for mobile view*/
64	+	--background-textarea: var(--ThemeDarkenLight); /* used in search bars */
65	+	--status-danger: #ff0055; /* notification badges */
66	+
67	+	/* ----------------------------------------------------------------------- */
68	+	/* Fonts & Text
69	+	/* ----------------------------------------------------------------------- */
70	+
71	+	/* change to '' for Fluxer's default font */
72	+	--font-sans: sans-serif;
73	+	/* change to '' for fluxer's default font */
74	+	--font-mono: monospace;
75	+	/* 300 is light, 400 is normal. DOES NOT AFFECT BOLD TEXT */
76	+	font-weight: 500;
77	+	/* decreases letter spacing for better readability. recommended on monospace fonts.*/
78	+	/* letter-spacing: -0.03ch; */
79	+
80	+	/* ----------------------------------------------------------------------- */
81	+	/* Background
82	+	/* ----------------------------------------------------------------------- */
83	+
84	+	/* Background Image \| fluxer currently only allows using images hosted on their own servers.
85	+	/* theres a list of presets further below, named --bg-1 to --bg-5. of course, you can also use your own images. */
86	+	--background-image: var(--bg-2);
87	+	/* fallback color behind the background image. can be used to give your bg image a tint */
88	+	--ThemeBackgroundColor: #b8b8b8;
89	+	/* Image position \| center, left, right, bottom, top */
90	+	--backgroundPosition: top;
91	+	/* To cover the entire app, set to "cover". You can also set it to "100% 100%" but the image will be stretched. Set to "contain" to see the entire image */
92	+	--backgroundSize: cover;
93	+	/* if you want the image to repeat */
94	+	--backgroundRepeat: no-repeat;
95	+	/* Set to 0 to remove blur. i recommend leaving this off and tweaking --ThemePanelBlur instead */
96	+	--backgroundBlur: 0px;
97	+	/* 0 is fully transparent, 1 is fully opaque */
98	+	--backgroundOpacity: 0;
99	+
100	+	/* ----------------------------------------------------------------------- */
101	+	/* panels
102	+	/* ----------------------------------------------------------------------- */
103	+
104	+	/* gap between panels */
105	+	--ThemePanelMargin: 16px;
106	+	/* panel */
107	+	--ThemePanelBGColor: var(--ThemeDarkenLight);
108	+	/* panel hovered */
109	+	/* --ThemePanelBGColorHovered: hsl(0, 0%, 10%); */
110	+	/* background color for tooltips, context panels etc */
111	+	--ThemePanelContextBGColor: #5500aa;
112	+	/* background color for media picker, notification inbox, search filters, pins etc */
113	+	--ThemePanelModalBGColor: #aa00aa;
114	+	/* panel border thickness */
115	+	--ThemePanelBorderThickness: 6px;
116	+	/* panel border rounding */
117	+	--ThemePanelBorderRounding: 0px;
118	+	/* panel border color (not hovered) */
119	+	--ThemePanelBorderColor: white;
120	+	/* panel border color (hovered) */
121	+	/* --ThemePanelBorderColorHovered: var(--brand-primary); */
122	+	/* panel shadows */
123	+	--ThemePanelShadow: 10px 10px rgb(0, 0, 0, 0.8);
124	+
125	+	/* you can ignore these */
126	+	--ThemePanelBorder: var(--ThemePanelBorderThickness) double var(--ThemePanelBorderColor);
127	+	--ThemePanelBorderHovered: var(--ThemePanelBorderThickness) solid var(--ThemePanelBorderColorHovered);
128	+
129	+	/* ----------------------------------------------------------------------- */
130	+	/* rounding
131	+	/* ----------------------------------------------------------------------- */
132	+
133	+	/* change this value to control the ui's overall rounding strength
134	+	* 1 is the default, 0 removes most rounding. */
135	+	--ThemeRoundingMultiplier: 0;
136	+
137	+	/* leave these alone unless you know what youre doing */
138	+	--radius-sm: calc(0.25rem * var(--ThemeRoundingMultiplier));
139	+	--radius-md: calc(0.375rem * var(--ThemeRoundingMultiplier));
140	+	--radius-lg: calc(0.5rem * var(--ThemeRoundingMultiplier));
141	+	--radius-xl: calc(0.75rem * var(--ThemeRoundingMultiplier));
142	+	--radius-2xl: calc(1rem * var(--ThemeRoundingMultiplier));
143	+	--radius-full: calc(9999px * var(--ThemeRoundingMultiplier));
144	+	--media-border-radius: calc(4px * var(--ThemeRoundingMultiplier));
145	+	--message-reply-spine-radius: calc(6px * var(--ThemeRoundingMultiplier));
146	+
147	+	/* set universal border rounding */
148	+	/* * { border-radius: var(--ThemePanelBorderRounding) !important; } */
149	+
150	+	/* ----------------------------------------------------------------------- */
151	+	/* background presets (credits to ThaSilentArtist)
152	+	/* ----------------------------------------------------------------------- */
153	+	--bg-1: url("https://fluxerusercontent.com/attachments/1474610319297830991/1481279988511911959/41511cd77e70.png");
154	+	--bg-2: url("https://fluxerusercontent.com/attachments/1474610319297830991/1481670714326512122/a8082672504ec71.gif");
155	+	--bg-3: url("https://fluxerusercontent.com/attachments/1474610319297830991/1481671197485134759/rocket_thasilentartist.png");
156	+	}
157	+
158	+
159	+	/* ################################################################################################# */
160	+	/* ################################################################################################# */
161	+	/* ################################################################################################# */
162	+
163	+	/* ---------------------------------------------------------------- */
164	+	/* basic setup */
165	+	/* ---------------------------------------------------------------- */
166	+
167	+	html {
168	+	background: var(--ThemeBackgroundColor);
169	+	opacity: 1;
170	+	background-image: radial-gradient(var(--ThemeFlatPrimary) 2px, var(--ThemeBackgroundColor) 2px);
171	+	background-size: 4px 4px;
172	+	}
173	+
174	+	/* prevent background turning black in mobile view */
175	+	body {
176	+	background: transparent!important;
177	+	}
178	+
179	+	/* this holds the background image */
180	+	body::before {
181	+	content: "";
182	+	position: fixed;
183	+	inset: 0;
184	+	background: var(--background-image);
185	+	background-size: var(--backgroundSize);
186	+	background-position: var(--backgroundPosition);
187	+	background-repeat: var(--backgroundRepeat);
188	+	filter: blur(var(--backgroundBlur));
189	+	opacity: var(--backgroundOpacity);
190	+	z-index: -1;
191	+	}
192	+
193	+
194	+	/* remove backgrounds. this is safer than overwriting the color variables directly */
195	+	html:not(.auth-page) [class*="App.module__appContainer_"],
196	+	[class*="App.module__appContainer_"],
197	+	[class*="GuildsLayout.module__guildsLayoutContainer_"],
198	+	[class*="GuildsLayout.module__guildListScrollContainer_"],
199	+	[class*="GuildsLayout.module__contentContainer_"],
200	+	[class*="UserArea.module__userAreaInnerWrapper_"],
201	+	[class*="OutlineFrame.module__frame_"],
202	+	[class*="GuildsLayout.module__contentInner_"],
203	+	[class*="GuildLayout.module__guildLayoutContainer_"],
204	+	[class*="ChannelListContent.module__channelListScroller_"],
205	+	[class*="GuildLayout.module__guildMainContent_"],
206	+	[class*="ChannelLayout.module__channelLayoutContainer_"],
207	+	[class*="ChannelIndexPage.module__channelGrid_"],
208	+	[class*="ChannelHeader.module__headerContainer_"],
209	+	[class*="ChannelChatLayout.module__container_"],
210	+	[class*="InputWrapper.module__box_"],
211	+	[class*="GuildHeader.module__headerContainer_"],
212	+	[class*="DMLayout.module__dmLayoutContainer_"],
213	+	[class*="DMList.module__dmListContainer_"],
214	+	[class*="DMList.module__dmListHeader_"],
215	+	[class*="DMList.module__desktopScroller_"],
216	+	[class*="DMList.module__dmChannelList_"],
217	+	[class*="DMLayout.module__contentColumn_"],
218	+	[class*="DMLayout.module__contentInner_"],
219	+	[class*="DMFriendsView.module__container_"],
220	+	[class*="UserProfileModal.module__modalContainer_"],
221	+	[class*="Divider.module__text_"],
222	+	[class*="Divider.module__dateWithUnreadText_"],
223	+	[class*="SplashScreen.module__splashOverlay_"],
224	+	[class*="MobileTextareaLayout.module__mobilePlusButton_"],
225	+	[class*="MobileTextareaLayout.module__mobileInputContainer_"],
226	+	[class*="MobileTextareaLayout.module__mobileVoiceButton_"],
227	+	[class*="ChannelHeader.module__iconButtonMobile_"],
228	+	[class*="NotificationsPage.module__container_"],
229	+	[class*="SelectBottomSheet.module__trigger_"],
230	+	[class*="NotificationsPage.module__bookmarkButton_"],
231	+	[class*="YouPage.module__profile_"],
232	+	[class*="YouPage.module__noteIconWrapper_"],
233	+	[class*="DMList.module__mobileContainer_"],
234	+	[class*="DMList.module__mobileScroller_"],
235	+	[class*="DMList.module__mobileHeaderButton_"],
236	+	[class*="DMList.module__mobileAddFriendButton_"],
237	+	[class*="MemberListContainer.module__memberListScroller_"],
238	+	[class*="ChannelSearchResults.module__container_"],
239	+	[class*="GuildNavbarSkeleton.module__skeletonHeader_"]
240	+	{
241	+	background: transparent;
242	+	}
243	+
244	+	/* ---------------------------------------------------------------- */
245	+	/* panel scaling fixes \| setup to ensure proper scaling with custom area margins
246	+	/* ---------------------------------------------------------------- */
247	+
248	+	/* server list container */
249	+	[class*="GuildsLayout.module__guildListScrollerWrapper_"],
250	+	/* server channel list */
251	+	[class*="GuildNavbar.module__guildNavbarContainer_"],
252	+	/* server channel list skeleton */
253	+	[class*="GuildNavbarSkeleton.module__skeletonContainer_"],
254	+	/* dm list container */
255	+	[class*="DMLayout.module__dmListColumn_"]
256	+	{
257	+	width: -webkit-fill-available;
258	+	height: calc(100% - var(--layout-user-area-reserved-height) - var(--layout-mobile-bottom-nav-reserved-height) - var(--ThemePanelMargin) - var(--ThemePanelBorderThickness) * 2);
259	+	}
260	+	/* self status */
261	+	[class*="GuildsLayout.module__userAreaWrapper_"]
262	+	{
263	+	width: calc(var(--layout-guild-list-width) + var(--layout-sidebar-width) + var(--ThemePanelMargin));
264	+	}
265	+
266	+	/* channel header to message list */
267	+	[class*="ChannelIndexPage.module__channelGrid_"]
268	+	{
269	+	display: flex;
270	+	flex-direction: column;
271	+	}
272	+	/* typing users list
273	+	[class*="ChannelChatLayout.module__typingArea_"]
274	+	{
275	+	height: fit-content;
276	+	transition-property: height;
277	+	transition-duration: 0.3s;
278	+	} */
279	+
280	+	/* self profile popout */
281	+	[class*="UserAreaPopout.module__container_"]
282	+	{
283	+	width: inherit;
284	+	}
285	+
286	+
287	+	/* ---------------------------------------------------------------- */
288	+	/* panel gaps/margins
289	+	/* ---------------------------------------------------------------- */
290	+
291	+	/* whole ui app layout container */
292	+	[class*="AppLayout.module__appLayout_"]
293	+	{
294	+	padding: var(--ThemePanelMargin);
295	+	gap: var(--ThemePanelMargin);
296	+	}
297	+
298	+	/* whole ui layout container */
299	+	[class*="GuildsLayout.module__guildsLayoutContainer_"],
300	+	/* whole ui content container */
301	+	[class*="GuildsLayout.module__contentContainer_"],
302	+	/* dm area container */
303	+	[class*="DMLayout.module__dmLayoutContainer_"],
304	+	/* channel header to message list */
305	+	[class*="ChannelIndexPage.module__channelGrid_"],
306	+	/* messages to text input */
307	+	[class*="ChannelChatLayout.module__container_"],
308	+	/* server area container */
309	+	[class*="GuildLayout.module__guildLayoutContent_"],
310	+	/* friendslist to active panel */
311	+	[class*="DMFriendsView.module__container_"],
312	+	/* friendslist header & friendslist */
313	+	[class*="DMFriendsView.module__mainColumn_"],
314	+	/* mobile notifications page header to notifs */
315	+	[class*="NotificationsPage.module__container_"]
316	+	{
317	+	gap: var(--ThemePanelMargin);
318	+	}
319	+
320	+	/* messages to text input \| correcting for the typing members section */
321	+	[class*="ChannelChatLayout.module__container_"] {
322	+	gap: calc(var(--ThemePanelMargin) / 2);
323	+	}
324	+
325	+
326	+	/* these require a margin because using gap leaves a gap even when those panels are hidden. */
327	+	/* message list to member list */
328	+	[class*="MemberListContainer.module__memberListContainer_"],
329	+	/* message list to search results */
330	+	[class*="ChannelIndexPage.module__searchPanel_"]
331	+	{
332	+	margin-left: var(--ThemePanelMargin);
333	+	margin-right: var(--ThemePanelMargin);
334	+	width: calc(100% - var(--ThemePanelMargin));
335	+	}
336	+
337	+	/* server list */
338	+	[class*="GuildsLayout.module__guildListScrollContainer_"] {
339	+	padding-top: var(--spacing-2);
340	+	}
341	+
342	+
343	+	/* ordered list fix */
344	+	[class*="Markup.module__markup_"] ol {
345	+	-webkit-margin-start: calc(1.4em + var(--totalCharacters, 1) * 0.6em);
346	+	margin-inline-start: calc(1.4em + var(--totalCharacters, 1) * 0.6em);
347	+	}
348	+	/* unordered list fix */
349	+	[class*="Markup.module__markup_"] ul {
350	+	-webkit-margin-start: calc(0.8em + var(--totalCharacters, 1) * 0.6em);
351	+	margin-inline-start: calc(0.8em + var(--totalCharacters, 1) * 0.6em);
352	+	}
353	+
354	+	/* ---------------------------------------------------------------- */
355	+	/* panel borders
356	+	/* ---------------------------------------------------------------- */
357	+
358	+	/* remove default panel dividers */
359	+	[class*="UserArea.module__separator_"],
360	+	[class*="OutlineFrame.module__divider_"],
361	+	[class*="ChannelIndexPage.module__memberListDivider_"]
362	+	{
363	+	display: none;
364	+	}
365	+	/* remove default panel borders */
366	+	[class*="ActiveNowSidebar.module__sidebar_"],
367	+	[class*="OutlineFrame.module__frame_"] {
368	+	border: none;
369	+	}
370	+
371	+
372	+
373	+	/* loading splashscreen */
374	+	[class*='SplashScreen.module__splashContent_'],
375	+	/* server sidebar */
376	+	[class*="GuildsLayout.module__guildListScroller"],
377	+	/* dm list */
378	+	[class*="DMLayout.module__dmListColumn_"],
379	+	/* server channel list */
380	+	[class*="GuildNavbar.module__guildNavbarContainer_"],
381	+	/* self status */
382	+	[class*="GuildsLayout.module__userAreaWrapper_"],
383	+	/* channel header */
384	+	[class*="ChannelHeader.module__headerWrapper_"],
385	+	/* channel member list */
386	+	[class*="MemberListContainer.module__memberListContainer_"],
387	+	/* friendslist */
388	+	[class*='DMFriendsView.module__content_'],
389	+	/* friendslist active now panel */
390	+	[class*="ActiveNowSidebar.module__sidebar_"],
391	+	/* search results */
392	+	[class*="ChannelIndexPage.module__searchPanel_"],
393	+	/* settings panel */
394	+	[class*="Modal.module__root_"],
395	+	/* VC panel */
396	+	[class*="VoiceCallView.module__root_"],
397	+	/* VC panel empty */
398	+	[class*="ChannelIndexPage.module__emptyStateContent_"],
399	+	/* server member page */
400	+	[class*="GuildMembersPage.module__pageContainer_"],
401	+	/* mobile bottom nav */
402	+	[class*="MobileBottomNav.module__container_"],
403	+	/* mobile notifications page header */
404	+	[class*="NotificationsPage.module__header_"],
405	+	/* mobile notifications page content */
406	+	[class*="NotificationsPage.module__content_"],
407	+	/* mobile own profile page */
408	+	[class*="YouPage.module__container_"],
409	+	/* server discovery explore page */
410	+	[class*="DiscoveryPage.module__container_"],
411	+	/* auth page */
412	+	[class*="AuthLayout.module__card_"],
413	+	/* server unavailable */
414	+	[class*="GuildLayout.module__guildUnavailableContainer_"],
415	+	/* server unavailable channels skeleton */
416	+	[class*="GuildNavbarSkeleton.module__skeletonContainer_"]
417	+	{
418	+	border: var(--ThemePanelBorder)!important;
419	+	border-radius: var(--ThemePanelBorderRounding)!important;
420	+	backdrop-filter: blur(var(--ThemePanelBlur)) !important;
421	+	-webkit-backdrop-filter: blur(var(--ThemePanelBlur)) !important;
422	+	background: var(--ThemePanelBGColor)!important;
423	+	transition: var(--transition-slow);
424	+	box-shadow: var(--ThemePanelShadow)!important;
425	+	}
426	+
427	+
428	+	/* channel message container */
429	+	[class*="ChannelChatLayout.module__messagesArea_"],
430	+	/* chat input area */
431	+	[class*='ChannelChatLayout\.module__textareaArea_'] {
432	+	border: var(--ThemePanelBorder)!important;
433	+	border-radius: var(--ThemePanelBorderRounding)!important;
434	+	backdrop-filter: blur(var(--ThemePanelBlur))!important;
435	+	-webkit-backdrop-filter: blur(var(--ThemePanelBlur))!important;
436	+	background: var(--ThemeFlatDarker)!important;
437	+	transition: var(--transition-slow);
438	+	box-shadow: none !important;
439	+	}
440	+
441	+	[class*="ChannelChatLayout.module__messagesArea___"] {
442	+	background: var(--ThemeFlatDarker);
443	+	}
444	+
445	+	[class*='ChannelChatLayout\.module__textareaArea_'],
446	+	[class*="TextareaInput.module__textarea___"],
447	+	[class*="TextareaButton.module__button___"] {
448	+	background: #aa0000 !important;
449	+	color: #ffff00 !important;
450	+	}
451	+
452	+
453	+
454	+	/* area borders hovered */
455	+	/* loading splashscreen */
456	+	[class*='SplashScreen.module__splashContent_']:hover,
457	+	/* server sidebar */
458	+	[class*="GuildsLayout.module__guildListScroller"]:hover,
459	+	/* dm list */
460	+	[class*="DMLayout.module__dmListColumn_"]:hover,
461	+	/* server channel list */
462	+	[class*="GuildNavbar.module__guildNavbarContainer_"]:hover,
463	+	/* self status */
464	+	[class*="GuildsLayout.module__userAreaWrapper_"]:hover,
465	+	/* channel header */
466	+	[class*="ChannelHeader.module__headerWrapper_"]:hover,
467	+	/* channel member list */
468	+	[class*="MemberListContainer.module__memberListContainer_"]:hover,
469	+	/* channel message container */
470	+	[class*="ChannelChatLayout.module__messagesArea_"]:hover,
471	+	/* chat input area */
472	+	[class*='ChannelChatLayout\.module__textareaArea_']:hover,
473	+	/* friendslist */
474	+	[class*='DMFriendsView.module__content_']:hover,
475	+	/* friendslist active now panel */
476	+	[class*="ActiveNowSidebar.module__sidebar_"]:hover,
477	+	/* search results */
478	+	[class*="ChannelIndexPage.module__searchPanel_"]:hover,
479	+	/* settings panel */
480	+	[class*="Modal.module__root_"]:hover,
481	+	/* VC panel */
482	+	[class*="VoiceCallView.module__root_"]:hover,
483	+	/* VC panel empty */
484	+	[class*="ChannelIndexPage.module__emptyStateContent_"]:hover,
485	+	/* server member page */
486	+	[class*="GuildMembersPage.module__pageContainer_"]:hover,
487	+	/* mobile bottom nav */
488	+	[class*="MobileBottomNav.module__container_"]:hover,
489	+	/* mobile notifications page header */
490	+	[class*="NotificationsPage.module__header_"]:hover,
491	+	/* mobile notifications page content */
492	+	[class*="NotificationsPage.module__content_"]:hover,
493	+	/* mobile own profile page */
494	+	[class*="YouPage.module__container_"]:hover,
495	+	/* server discovery explore page */
496	+	[class*="DiscoveryPage.module__container_"]:hover,
497	+	/* auth page */
498	+	[class*="AuthLayout.module__card_"]:hover,
499	+	/* server unavailable */
500	+	[class*="GuildLayout.module__guildUnavailableContainer_"]:hover,
501	+	/* server unavailable channels skeleton */
502	+	[class*="GuildNavbarSkeleton.module__skeletonContainer_"]:hover
503	+	{
504	+	background: var(--ThemePanelBGColor);
505	+	border: var(--ThemePanelBorder)!important;
506	+	transition: var(--transition-fast);
507	+	}
508	+
509	+
510	+	/* channel message container */
511	+	[class*="ChannelChatLayout.module__messagesArea_"]:hover,
512	+	/* chat input area */
513	+	[class*='ChannelChatLayout\.module__textareaArea_']:hover {
514	+	border: double yellow 6px !important;
515	+	}
516	+
517	+
518	+	/* hide Fluxer logo pulse */
519	+	[class*="iconPulse___"] {
520	+	display: none !important;
521	+	}
522	+
523	+
524	+
525	+	/* ---------------------------------------------------------------- */
526	+	/* settings menu
527	+	/* ---------------------------------------------------------------- */
528	+	/* settings menu backdrop */
529	+	[class*="Modal.module__modalBackdrop_"] {
530	+	backdrop-filter: blur(var(--ThemePanelBlur));
531	+	opacity: 1!important;
532	+	background: var(--ThemeDarkenMedium);
533	+	}
534	+
535	+	/* settings menu panel */
536	+	[class*="Modal.module__root_"] {
537	+	background-color: var(--ThemeDarkenMedium);
538	+	background-color: var(--ThemeFlatPrimary)!important;
539	+	}
540	+
541	+
542	+
543	+	/* ---------------------------------------------------------------- */
544	+	/* dm list
545	+	/* ---------------------------------------------------------------- */
546	+	/* dm list users */
547	+	[class*='DMList.module__dmItem_'] {
548	+	background: rgba(var(--brand-secondary), 0.8)!important;
549	+	transition: var(--transition-normal);
550	+	margin: 0px 6px 6px -2px !important;
551	+	width: calc(100% - 8px) !important;
552	+	}
553	+	/* dm list users hover*/
554	+	[class*='DMList.module__dmItem_']:hover {
555	+	background: var(--brand-primary)!important;
556	+	color: black !important;
557	+	transition-duration: 0.0s;
558	+	}
559	+
560	+	/* dm list active user */
561	+	[class*='DMList.module__dmItemSelected_'] {
562	+	background: var(--brand-primary)!important;
563	+	background: #ffffff21!important;
564	+	color: black !important;
565	+	}
566	+
567	+	[class*='DMList.module__dmItemSelected_']:hover {
568	+	filter: brightness(1.2);
569	+	}
570	+
571	+
572	+	/* ---------------------------------------------------------------- */
573	+	/* markup
574	+	/* ---------------------------------------------------------------- */
575	+
576	+	/block quote & markup alert panels /
577	+	[class*="Markup.module__blockquoteContainer_"],
578	+	[class*="Markup.module__alert_"]
579	+	{
580	+	background: linear-gradient(
581	+	90deg,
582	+	color-mix(in srgb, var(--brand-secondary) 50%, transparent),
583	+	transparent
584	+	)!important;
585	+	}
586	+	/* alert divider line */
587	+	[class*="Markup.module__alert_"]::before
588	+	{
589	+	border-radius: calc(4px * var(--ThemeRoundingMultiplier))!important;
590	+	}
591	+	/* blockquote divider line */
592	+	[class*="Markup.module__blockquoteDivider_"] {
593	+	background-color: var(--brand-primary) !important;
594	+	}
595	+
596	+
597	+	/* ---------------------------------------------------------------- */
598	+	/* modals
599	+	/* ---------------------------------------------------------------- */
600	+
601	+	/* NOTE: backdrop filter doesnt work on these panels. might reconsider re-adding backdropfilter to their parent Popout.module__popout_ */
602	+	/* media picker*/
603	+	[class*='ExpressionPickerPopout.module__container_'],
604	+	/* channel pins*/
605	+	[class*='ChannelPinsPopout.module__container_'],
606	+	/* right click side subpanel \| its inconsistent whether or not backdrop-filter works on these */
607	+	[class*='ContextMenu.module__submenuPopover_'],
608	+	/* searchbar filter list */
609	+	[class*="MessageSearchBar.module__popoutContainer_"],
610	+	/* settings profile profile type dropdown */
611	+	.css-206gj2-menu,
612	+	/* notifications inbox */
613	+	[class*='InboxPopout.module__container_'],
614	+	/* profile card */
615	+	[class*='ProfileCardLayout.module__profileCard_'],
616	+	/* server options context panel */
617	+	[class*='GuildHeaderPopout.module__container_'] {
618	+	background-color: var(--ThemePanelModalBGColor)!important;
619	+	border: var(--ThemePanelBorder)!important;
620	+	border-radius: var(--ThemePanelBorderRounding)!important;
621	+	box-shadow: var(--ThemePanelShadow)!important;
622	+	}
623	+
624	+	/* ---------------------------------------------------------------- */
625	+	/* context panels
626	+	/* ---------------------------------------------------------------- */
627	+
628	+	/* emoji tooltip */
629	+	[class*="EmojiTooltipContent.module__container_"],
630	+	/* tooltip panels */
631	+	[class*="Tooltip.module__tooltip_"] {
632	+	backdrop-filter: blur(var(--ThemePanelBlurSmall));
633	+	background: var(--ThemePanelContextBGColor)!important;
634	+	box-shadow: var(--ThemePanelShadow)!important;
635	+	border-radius: var(--ThemePanelBorderRounding)!important;
636	+	}
637	+
638	+	/* emoji autocomplete */
639	+	[class*="Autocomplete.module__container_"] {
640	+	border-left: unset!important;
641	+	border-right: unset!important;
642	+	border-bottom: unset!important;
643	+	border-radius: calc(var(--ThemePanelBorderRounding) - var(--ThemePanelBorderThickness))!important;
644	+	top: calc(0px - var(--ThemePanelMargin) - var(--ThemePanelBorderThickness)*2)!important;
645	+
646	+	backdrop-filter: blur(var(--ThemePanelBlurSmall));
647	+	background: var(--ThemePanelContextBGColor);
648	+	}
649	+
650	+
651	+	/* right click context menu */
652	+	[class*='module__contextMenu_'],
653	+	/* vc stats info panel */
654	+	[class*='VoiceStatsOverlay.module__overlay_'],
655	+	/* media buttons */
656	+	[class*='module__mediaHoverAction_'] > button {
657	+	backdrop-filter: blur(var(--ThemePanelBlurSmall));
658	+	background-color: var(--ThemePanelContextBGColor);
659	+	box-shadow: var(--ThemePanelShadow)!important;
660	+	border-radius: var(--ThemePanelBorderRounding)!important;
661	+	}
662	+
663	+	/* message hover reaction suggestions. blur effect doesnt seem to work correctly. */
664	+	[class*='MessageActionBar.module__actionBar_'] {
665	+	background-color: var(--ThemePanelContextBGColor);
666	+	box-shadow: var(--ThemePanelShadow)!important;
667	+	border-radius: var(--ThemePanelBorderRounding)!important;
668	+	}
669	+
670	+	/* ---------------------------------------------------------------- */
671	+	/* user profile poputs
672	+	/* ---------------------------------------------------------------- */
673	+
674	+	/* full user profile */
675	+	[class*='UserProfileModal.module__modalRoot_'] {
676	+	height: unset;
677	+	}
678	+
679	+	/* small user profile popouts */
680	+	[class*='ProfileCardLayout.module__profileCard_'],
681	+	/* big user profile popouts */
682	+	[class*='UserProfileModal.module__modalContainer_'] {
683	+	border-width: var(--ThemePanelBorderWidth)!important;
684	+	border-radius: var(--ThemePanelBorderRounding)!important;
685	+	}
686	+
687	+	/* pfp button */
688	+	[class*="ProfileCardBanner.module__avatarButton_"],
689	+	[class*="UserProfileModal.module__avatarContainer_"]
690	+	{
691	+	anchor-name: --anchor-userstatus;
692	+	background-color: var(--ThemePanelPrimary);
693	+	border-color: var(--ThemeFlatPrimary);
694	+	}
695	+
696	+	/* "display name, username, pronouns */
697	+	[class*="ProfileCardUserInfo.module__userInfoContainer_"],
698	+	[class*="UserProfileModal.module__userInfoContent_"]
699	+	{
700	+	display: flex;
701	+	flex-direction: row;
702	+	flex-wrap: wrap;
703	+	}
704	+	/* display name */
705	+	[class*="ProfileCardUserInfo.module__nameRow_"],
706	+	[class*="UserProfileModal.module__nameRow_"]
707	+	{
708	+	width: 100%;
709	+	}
710	+	/* username */
711	+	[class*="ProfileCardUserInfo.module__usernameRow_"],
712	+	[class*="UserProfileModal.module__usernameRow_"]
713	+	{
714	+	gap: unset;
715	+	color: var(--text-secondary);
716	+	}
717	+	/* username pronouns separator */
718	+	[class*="ProfileCardUserInfo.module__pronouns_"]::before,
719	+	[class*="UserProfileModal.module__pronouns_"]::before
720	+	{
721	+	content: "";
722	+	width: 4px!important;
723	+	height: 4px!important;
724	+	margin: 0rem 0.5rem;
725	+	background-color: var(--text-tertiary);
726	+	border-radius: var(--radius-full);
727	+	}
728	+
729	+	/* pronouns */
730	+	[class*="ProfileCardUserInfo.module__pronouns_"],
731	+	[class*="UserProfileModal.module__pronouns_"]
732	+	{
733	+	font-size: 14px;
734	+	margin-top: unset;
735	+	color: var(--text-secondary);
736	+	display: inline-flex;
737	+	align-items: center;
738	+	}
739	+
740	+	/* custom profile status */
741	+	[class*="UserProfilePopout.module__profileCustomStatus_"],
742	+	/* custom profile status (user area) */
743	+	[class*="UserAreaPopout.module__customStatusRow_"],
744	+	[class*="UserProfileModal.module__customStatusRow_"],
745	+	/* profile preview custom status */
746	+	[class*="ProfilePreview.module__profileCustomStatus_"]
747	+	{
748	+	align-items: flex-start;
749	+
750	+	position: absolute;
751	+	position-anchor: --anchor-userstatus;
752	+	position-area: right span-all;
753	+	position-visibility: always;
754	+
755	+
756	+	margin-left: 0.75rem;
757	+
758	+	width: max-content;
759	+	max-width: 175px;
760	+	max-height: 3.7rem;
761	+
762	+	overflow: hidden;
763	+
764	+	background: var(--ThemeFlatLighter);
765	+	/* border: 1px solid var(--background-header-secondary); */
766	+	border-radius: calc(4px * var(--ThemeRoundingMultiplier));
767	+	box-shadow: var(--shadow-md);
768	+
769	+	transition: var(--transition-normal);
770	+	}
771	+
772	+	/* custom profile status */
773	+	[class*="UserProfilePopout.module__profileCustomStatus_"]:hover,
774	+	/* custom profile status (user area) */
775	+	[class*="UserAreaPopout.module__customStatusRow_"]:hover,
776	+	[class*="UserProfileModal.module__customStatusRow_"]:hover,
777	+	/* profile preview custom status */
778	+	[class*="ProfilePreview.module__profileCustomStatus_"]:hover {
779	+	max-height: 10rem;
780	+	}
781	+
782	+	/* custom profile status inner */
783	+	[class="CustomStatusDisplay"] > [class="CustomStatusDisplay.module__content_"],
784	+	[class="UserProfilePopout"] > [class="CustomStatusDisplay.module__content_"],
785	+	[class="UserProfileModal"] > [class="CustomStatusDisplay.module__content_"],
786	+	[class="ProfilePreview"] > [class="CustomStatusDisplay.module__content_"] {
787	+	margin: 0.25rem 0.5rem;
788	+	}
789	+
790	+	[class*="UserProfileModal.module__profileContentWrapper_"] {
791	+	background: var(--ThemeFlatDarker);
792	+	}
793	+	/* mobile view personal page bio section */
794	+	[class*="YouPage.module__section_"],
795	+	/* mobile view personal page note section */
796	+	[class*="YouPage.module__noteButton_"],
797	+	/* mobile view personal page settings button */
798	+	[class*="YouPage.module__settingsButton_"] {
799	+	background: var(--ThemeDarkenLight);
800	+	}
801	+
802	+	/* bio join date notes etc container */
803	+	[class*="UserProfileModal.module__profileContent_"] {
804	+	padding-top: 16px!important;
805	+	}
806	+
807	+
808	+	/* ---------------------------------------------------------------- */
809	+	/* server member list panel
810	+	/* ---------------------------------------------------------------- */
811	+
812	+	/* sever member list tab table */
813	+	[class*="GuildMembersPage.module__tableWrapper_"],
814	+	/* sever member list tab rows per page dropdown */
815	+	.css-185nao-control {
816	+	background-color: var(--ThemeDarkenLight)!important;
817	+	}
818	+	.css-185nao-control:focus {
819	+	background-color: var(--ThemeDarkenLight)!important;
820	+	}
821	+
822	+	/* sever member list tab */
823	+	[class*="GuildMembersPage.module__table_"]
824	+	{
825	+	margin-top: 0;
826	+	}
827	+
828	+	/* ---------------------------------------------------------------- */
829	+	/* forwarded messages
830	+	/* ---------------------------------------------------------------- */
831	+
832	+	/* forwarded message link button */
833	+	[class*="MessageAttachments.module__forwardedSourceButton_"]
834	+	{
835	+	background-color: color-mix(in srgb, var(--markup-mention-fill) 70%, transparent);
836	+	border-color: color-mix(in srgb, var(--markup-mention-border) 65%, transparent);
837	+	color: var(--markup-mention-text);
838	+	}
839	+	/* forwarded message link button hover */
840	+	[class*="MessageAttachments.module__forwardedSourceButton_"]:hover
841	+	{
842	+	background-color: var(--markup-mention-fill);
843	+	border-color: var(--markup-mention-border);
844	+	}
845	+	/* "forwarded from" label */
846	+	[class*="MessageAttachments.module__forwardedSourceLabel_"]
847	+	{
848	+	color: var(--markup-mention-text);
849	+	}
850	+
851	+	/* forwarded message link source & destination label*/
852	+	[class*="MessageAttachments.module__forwardedSourceName_"]
853	+	{
854	+	color: var(--markup-mention-text);
855	+	}
856	+	/* forwarded message link channel symbol */
857	+	[class*="MessageAttachments.module__forwardedSourceButton_"] svg
858	+	{
859	+	fill: var(--markup-mention-text);
860	+	}
861	+
862	+	/* ---------------------------------------------------------------- */
863	+	/* titlebar
864	+	/** ---------------------------------------------------------------- */
865	+
866	+	/* window titlebar */
867	+	[class*="NativeTitlebar.module__titlebar_"] {
868	+	background: var(--ThemeBackgroundColor)!important;
869	+	}
870	+	/* Fluxer wordmark inside titlebar */
871	+	[class="NativeTitlebar"][class="module__wordmark"] {
872	+	color: var(--ThemeFlatPrimary) !important;
873	+	}
874	+	/* window control buttons (min/max/close) */
875	+	[class="NativeTitlebar"][class="module__controlButton"] {
876	+	background: var(--brand-primary)!important;
877	+	border-radius: var(--ThemePanelBorderRounding)!important;
878	+	margin: 2px 1px !important;
879	+	color: var(--ThemeFlatDarker) !important;
880	+	box-shadow: 3px 3px rgb(0, 0, 0, 0.8)!important;
881	+	}
882	+
883	+	[class="NativeTitlebar"][class="module__controlButton"]:hover {
884	+	background: var(--brand-secondary)!important;
885	+	box-shadow: 3px 3px rgb(0, 0, 0, 0.8)!important;
886	+	color: white !important;
887	+	}
888	+
889	+	[class="NativeTitlebar"][class="module__controlButton"]:active {
890	+	background: var(--ThemeFlatDarker) !important;
891	+	color: white !important;
892	+	margin: 3px 0 2px 0 !important;
893	+	box-shadow: none important;
894	+	}
895	+
896	+	/* ---------------------------------------------------------------- */
897	+	/* misc panels
898	+	/* ---------------------------------------------------------------- */
899	+
900	+	/* most buttons */
901	+	[class*="Button.module__button___"],
902	+	[class="Button.module__button___Yzg1Yz Button.module__inverted___Yzg1Yz Button.module__superCompact___Yzg1Yz Button.module__fitContent___Yzg1Yz"] {
903	+	border-radius: var(--ThemePanelBorderRounding)!important;
904	+	}
905	+
906	+	/* member list */
907	+	[class*="MemberListContainer.module__memberListContainer_"] {
908	+	min-width: 10rem;
909	+	max-width: 20rem;
910	+	}
911	+	[class*="DMList.module__dmItemUserTag___"],
912	+	[class*="DMFriendsView.module__tabButton___"] {
913	+	background: var(--brand-primary);
914	+	color: var(--ThemeFlatDarker);
915	+	}
916	+
917	+	/* generic button primary */
918	+	[class*="Button.module__primary_"] {
919	+	background: var(--brand-primary)!important;
920	+	color: black !important;
921	+	}
922	+	[class*="Button.module__primary_"]:hover {
923	+	background: var(--brand-secondary)!important;
924	+	color: white !important;
925	+	}
926	+
927	+	/* generic button secondary */
928	+	[class*="Button.module__secondary_"] {
929	+	background: var(--ThemeFlatLighter)!important;
930	+	color: white !important;
931	+	}
932	+	[class*="Button.module__secondary_"]:hover {
933	+	background: var(--ThemeFlatDarker)!important;
934	+	}
935	+
936	+	/* keyboard hints */
937	+	[class*="KeybindHint.module__key___"] {
938	+	background: var(--brand-primary);
939	+	color: var(--ThemeFlatDarker);
940	+	border-radius: var(--ThemePanelRounding);
941	+	}
942	+
943	+	/* scroll indicator */
944	+	[class*="ScrollIndicatorOverlay.module__indicator___"] {
945	+	background: var(--ThemePanelContextBGColor);
946	+	color: yellow !important;
947	+	border-radius: var(--ThemePanelBorderRounding);
948	+	box-shadow: var(--ThemePanelShadow);
949	+	}
950	+
951	+	/* embed cards */
952	+	[class*="EmbedCard.module__"],
953	+	[class*="ThemeEmbed.module__iconCircleActive___"] {
954	+	border-radius: var(--ThemePanelBorderRounding);
955	+	}
956	+	[class*="ThemeEmbed.module__iconOnBrand___"] {
957	+	background: var(--brand-primary);
958	+	color: var(--ThemeFlatDarker);
959	+	}
960	+
961	+	/* Plutonium-related elements */
962	+
963	+	[class*="ToggleButton.module__active___"] {
964	+	background: var(--brand-primary)!important;
965	+	color: black !important;
966	+	border-radius: var(--ThemePanelBorderRounding);
967	+	}
968	+
969	+	[class*="PricingCard.module__cardPopular___"],
970	+	[class*="PricingCard.module__cardTitlePopular___YmJhOD PricingCard.module__cardTitle___YmJhOD"],
971	+	[class*="PricingCard.module__cardPricePopular___YmJhOD PricingCard.module__cardPrice___YmJhOD"],
972	+	[class*="PricingCard.module__cardPeriodPopular___YmJhOD PricingCard.module__cardPeriod___YmJhOD"],
973	+	[class*="PlutoniumUpsell.module__text___"],
974	+	[class*="PlutoniumUpsell.module__icon___"]{
975	+	background: var(--brand-primary)!important;
976	+	color: black;
977	+	}
978	+
979	+	[class*="PricingCard.module__card___"] {
980	+	border-radius: var(--ThemePanelBorderRounding)!important;
981	+	}
982	+
983	+	[class*="PricingCard.module__popularBadge___"] {
984	+	color: black !important;
985	+	border-radius: var(--ThemePanelBorderRounding)!important;
986	+	}
987	+
988	+
989	+	/* user mentioned */
990	+	[class*="Message\.module__messageMentioned_"]
991	+	{
992	+	background: #aa0000 !important;
993	+	}
994	+	[class*="Markup.module__mention___"] {
995	+	background: var(--ThemeFlatLighter)!important;
996	+	color: yellow !important;
997	+	}
998	+
999	+	/* embed backgrounds */
1000	+	[class*="EmbedCard.module__wrapper_"],
1001	+	[class*="Embed.module__embedFull_"],
1002	+	[class*="AttachmentFile.module__attachmentContainer_"],
1003	+	[class*="InlineAudioPlayer.module__container_"] {
1004	+	background: var(--ThemeDarkenLight);
1005	+	}
1006	+
1007	+	/* Codeblocks */
1008	+	[class*="ThemeAcceptModal.module__codeContainer___"] pre,
1009	+	[class*="Markup.module__codeContainer___"] pre {
1010	+	background: var(--ThemeFlatDarker);
1011	+	}
1012	+
1013	+	/* attachment uploads */
1014	+	[class*="ChannelAttachmentArea.module__upload_"] {
1015	+	background: var(--ThemeDarkenLight);
1016	+	}
1017	+
1018	+	/* video controls */
1019	+	[class*="VideoPlayer.module__controlsRow_"] {
1020	+	background: var(--ThemeDarkenLight);
1021	+	}
1022	+
1023	+	/* message preview (like in bookmarks for example) */
1024	+	[class*="MessagePreview.module__previewCard_"]
1025	+	{
1026	+	overflow: hidden;
1027	+	background: var(--ThemeDarkenLight);
1028	+	}
1029	+
1030	+	/* vc header gradient */
1031	+	[class*='VoiceCallView.module__voiceHeader_']::before {
1032	+	border-radius: var(--ThemePanelBorderRounding) var(--ThemePanelBorderRounding) 0 0;
1033	+	}
1034	+	/* vc buttons gradient */
1035	+	[class*='VoiceCallView\.module__controlBarContainer_']::before {
1036	+	display: none;
1037	+	}
1038	+
1039	+
1040	+	/* user typing status user container thingy */
1041	+	[class*='ChannelChatLayout.module__typingContent_'] {
1042	+	/* these were from a test, it was kinda irritating to have the messages window shift whenever someone typed.
1043	+	height: fit-content;
1044	+	position: inherit;
1045	+	left: unset;
1046	+	right: unset;
1047	+	bottom: unset;
1048	+	*/
1049	+	transition-property: height;
1050	+	transition-duration: 0.3s;
1051	+	}
1052	+
1053	+	/* user typing status user pills */
1054	+	[class*='Message.module__typingPill_'] {
1055	+	backdrop-filter: blur(var(--ThemePanelBlurSmall));
1056	+	-webkit-backdrop-filter: blur(var(--ThemePanelBlurSmall))!important;
1057	+	background-color: var(--ThemePanelBGColor);
1058	+	box-shadow: var(--ThemePanelShadow);
1059	+	/* transform: none!important; */
1060	+	}
1061	+
1062	+	/* guild panel buttons */
1063	+
1064	+	[class*="GuildsLayout.module__fluxerButtonIcon___"] {
1065	+	background: var(--brand-primary);
1066	+	color: var(--ThemeFlatDarker)!important;
1067	+	}
1068	+
1069	+
1070	+	/* "X new messages since Date" panel */
1071	+	[class*='Messages.module__newMessagesBar_'] {
1072	+	padding-top: 0px;
1073	+	top: 0.5rem;
1074	+	border-radius: var(--ThemePanelBorderRounding)!important;
1075	+	}
1076	+	[class*="Messages.module__newMessagesBarText___"],
1077	+	[class*="Messages.module__newMessagesBarAction___"] {
1078	+	color: black !important;
1079	+	}
1080	+	/* "youre viewing older messages" panel */
1081	+	[aria-busy="false"][class*='Messages.module__newMessagesBar_'] {
1082	+	padding-top: 0px;
1083	+	bottom: 0.5rem!important;
1084	+	border-radius: var(--ThemePanelBorderRounding)!important;
1085	+	}
1086	+
1087	+
1088	+	/* emoji reactions */
1089	+	[class*='MessageReactions.module__reactionButton_'] {
1090	+	background: var(--ThemeDarkenLight);
1091	+	border: 1px solid var(--background-modifier-accent);
1092	+	}
1093	+
1094	+	/* profile role badge */
1095	+	[class*='RoleManagement.module__roleBadge_'] {
1096	+	background: var(--ThemeDarkenLight);
1097	+	}
1098	+
1099	+
1100	+	/* discovery explore page top banner */
1101	+	[class*="DiscoveryPage.module__hero_"]
1102	+	{
1103	+	border-radius: calc(var(--ThemePanelBorderRounding) - var(--spacing-5) / 2);
1104	+	margin: var(--spacing-5);
1105	+	margin-bottom: unset;
1106	+	}
1107	+
1108	+
1109	+	/* discovery explore page search bar */
1110	+	[class*="DiscoveryPage.module__searchInput_"]
1111	+	{
1112	+	background-color: var(--ThemeDarkenMedium);
1113	+	}
1114	+	/* search/input bars */
1115	+	[class*="Input.module__input_"] {
1116	+	background-color: var(--ThemeDarkenLight);
1117	+	}
1118	+
1119	+	/* search results container inner */
1120	+	[class*="ChannelSearchResults.module__container_"] {
1121	+	border: unset;
1122	+	border-radius: var(--ThemePanelBorderRounding);
1123	+	overflow: hidden;
1124	+	}
1125	+	/* search results */
1126	+	[class*="ChannelSearchResults.module__messageItem_"] {
1127	+	border-radius: calc(var(--ThemePanelBorderRounding) - 0.5rem);
1128	+	background-color: var(--ThemeDarkenLight);
1129	+	}
1130	+
1131	+	/* toasts */
1132	+	[class*="Toast.module__toast_"]
1133	+	{
1134	+	border-radius: var(--radius-full)!important;
1135	+	background-color: var(--ThemeFlatPrimary)!important;
1136	+	}
1137	+
1138	+	/* unread divider with date */
1139	+	[class*="Divider.module__dateWithUnreadText_"] {
1140	+	position: static;
1141	+	transform: none;
1142	+	}
1143	+
1144	+	/* server folder expanded */
1145	+	[class*="GuildFolderItem.module__expandedFolderBackground_"] {
1146	+	border-radius: calc(var(--guild-icon-size)/10030 + var(--guild-list-item-inset)); / focused server icon border-radius (30%) + padding */
1147	+	}
1148	+	/* server folder items container */
1149	+	[class*="GuildFolderItem.module__expandedGuilds_"] {
1150	+	padding-bottom: 0px;
1151	+	overflow: visible!important;
1152	+	}
1153	+
1154	+	/* make theme input field resizable */
1155	+	textarea.FormSurface\.module__surface___XzQ4ZT.Input\.module__input___ZGQ3MT.Scroller\.module__scroller___ZTgyZD {
1156	+	resize: vertical !important;
1157	+	max-height: 900px !important;
1158	+	}
1159	+
1160	+
1161	+	/* ---------------------------------------------------------------- */
1162	+	/* splashscreen
1163	+	/* ---------------------------------------------------------------- */
1164	+	[class*='SplashScreen.module__splashContent_'] {
1165	+	padding: 10px;
1166	+	background: var(--ThemePanelBGColor);
1167	+	aspect-ratio: 1 / 1;
1168	+	justify-content: center;
1169	+	}
1170	+
1171	+	@media (min-width: 1024px) {
1172	+	[class*='SplashScreen.module__splashContent_'] {
1173	+	width: 30rem;
1174	+	height: 30rem;
1175	+	}
1176	+	}
1177	+	@media (min-width: 768px) {
1178	+	[class*='SplashScreen.module__splashContent_'] {
1179	+	width: 30rem;
1180	+	height: 30rem;
1181	+	}
1182	+	}
1183	+	/* Loading screen message
1184	+	[class*='ChannelHeader.module__headerWrapper_']::after,
1185	+	[class='SplashScreen.module__connectionStatus_']::after /
1186	+	[class*='SplashScreen.module__splashContent_']::after {
1187	+
1188	+	border: var(--ThemePanelBorder)!important;
1189	+	border-radius: var(--ThemePanelBorderRounding)!important;
1190	+	backdrop-filter: blur(var(--ThemePanelBlur))!important;
1191	+	-webkit-backdrop-filter: blur(var(--ThemePanelBlur))!important;
1192	+
1193	+	transition: var(--transition-slow);
1194	+
1195	+
1196	+	position: absolute;
1197	+	bottom: calc(-64px - var(--ThemePanelMargin));
1198	+
1199	+	/* margin-top: calc(120px + var(--ThemePanelMargin)); */
1200	+	height: 40px;
1201	+	width: fit-content;
1202	+	padding: 0.3rem 0.5rem;
1203	+	line-height: 18px;
1204	+
1205	+
1206	+	content: "░▒▓ DIALOGUE.386 ▓▒░";
1207	+	background: var(--ThemePanelBGColor);
1208	+	color: var(--brand-primary);
1209	+	box-shadow: var(--ThemePanelShadow);
1210	+
1211	+	font-weight: bold;
1212	+	z-index: 100;
1213	+	}
1214	+
1215	+	/* ---------------------------------------------------------------- */
1216	+	/* fluxer ui fixes \| things that should be fixed on fluxer's end
1217	+	/* ---------------------------------------------------------------- */
1218	+
1219	+	[class*='ScreenShareSettingsModal.module__audioToggleRow_'] {
1220	+	padding: 12px;
1221	+	}
1222	+
1223	+	/* unread messages "NEW" divider */
1224	+	[class*='Divider.module__unreadBadge_'] {
1225	+	height: unset;
1226	+	}
1227	+
1228	+	/* profile role badge name */
1229	+	[class*='RoleManagement.module__roleName_'] {
1230	+	line-height: inherit;
1231	+	}
1232	+
1233	+	/* ################################################################################################# */
1234	+	/* ################################################################################################# */
1235	+	/* ################################################################################################# */
1236	+
1237	+	/* ---------------------------------------------------------------- */
1238	+	/* Customization: Panel labels */
1239	+	/* ---------------------------------------------------------------- */
1240	+	@property --ThemePanelLabels {
1241	+	syntax: 'off \| on';
1242	+	inherits: false;
1243	+	initial-value: on;
1244	+	}
1245	+
1246	+	@container body style(--ThemePanelLabels: on) {
1247	+
1248	+	/* prevent clipping off panel labels */
1249	+
1250	+	[class*="GuildNavbar.module__guildNavbarContainer_"],
1251	+	[class*="ChannelChatLayout.module__messagesArea_"],
1252	+	[class*="ChannelChatLayout.module__container_"],
1253	+	[class*="ChannelIndexPage.module__channelGrid_"],
1254	+	[class*="GuildLayout.module__guildMainContent_"],
1255	+	[class*="ChannelLayout.module__channelLayoutContainer_"],
1256	+	[class*="ChannelHeader.module__headerWrapper_"],
1257	+	[class*="ChannelIndexPage.module__contentGrid_"],
1258	+	[class*="OutlineFrame.module__frame_"],
1259	+	[class*="OutlineFrame.module__body_"],
1260	+	[class*="MemberListContainer.module__memberListContainer_"],
1261	+	[class*='ChannelChatLayout.module__textareaArea_'],
1262	+	[class*="NotificationsPage.module__content_"],
1263	+	[class*="GuildNavbarSkeleton.module__skeletonContainer_"] {
1264	+	overflow: visible!important;
1265	+	}
1266	+
1267	+	[class*="OutlineFrame.module__frame_"] {
1268	+	min-height: 0; /* magic memberlist overflow fix */
1269	+	}
1270	+
1271	+	/* server sidebar */
1272	+	[class*="GuildsLayout.module__guildListScroller"],
1273	+	/* dm list */
1274	+	[class*="DMLayout.module__dmListColumn_"],
1275	+	/* server channel list */
1276	+	[class*="GuildNavbar.module__guildNavbarContainer_"],
1277	+	/* self status */
1278	+	[class*="GuildsLayout.module__userAreaWrapper_"],
1279	+	/* channel header */
1280	+	[class*="ChannelHeader.module__headerWrapper_"],
1281	+	/* channel member list */
1282	+	[class*="MemberListContainer.module__memberListContainer_"],
1283	+	/* channel message container */
1284	+	[class*="ChannelChatLayout.module__messagesArea_"],
1285	+	/* chat input area */
1286	+	[class*='ChannelChatLayout\.module__textareaArea_'],
1287	+	/* friendslist */
1288	+	[class*='DMFriendsView.module__content_'],
1289	+	/* friendslist active now panel */
1290	+	[class*="ActiveNowSidebar.module__sidebar_"],
1291	+	/* search results */
1292	+	[class*="ChannelIndexPage.module__searchPanel_"],
1293	+	[class*="ChannelChatLayout.module__messagesArea_"],
1294	+	[class*="ChannelHeader.module__headerWrapper_"],
1295	+	[class*="MemberListContainer.module__memberListContainer_"],
1296	+	[class*='ChannelChatLayout.module__textareaArea_'],
1297	+	/* vc panel */
1298	+	[class*="VoiceCallView.module__root_"],
1299	+	/* vc panel empty */
1300	+	[class*="ChannelIndexPage.module__emptyStateContent_"],
1301	+	/* server member page */
1302	+	[class*="GuildMembersPage.module__pageContainer_"],
1303	+	/* mobile nav bar */
1304	+	[class*="MobileBottomNav.module__container_"],
1305	+	/* mobile notifications page list */
1306	+	[class*="NotificationsPage.module__content_"],
1307	+	/* server discovery explore page */
1308	+	[class*="DiscoveryPage.module__container_"],
1309	+	/* server unavailable channels skeleton */
1310	+	[class*="GuildNavbarSkeleton.module__skeletonContainer_"],
1311	+	/* server unavailable server area */
1312	+	[class*="GuildLayout.module__guildUnavailableContainer_"] {
1313	+	&::after {
1314	+	display: block;
1315	+	position: absolute;
1316	+	top: -11px;
1317	+	left: 8px;
1318	+	line-height: 14px;
1319	+	padding: 2px 4px;
1320	+	z-index: 100;
1321	+	font-size: 16px;
1322	+	font-weight: bold;
1323	+	background: var(--ThemePanelBGColor);
1324	+	color: var(--ThemePanelBorderColor);
1325	+
1326	+	transition: var(--transition-slow);
1327	+	}
1328	+
1329	+	&:hover::after {
1330	+	color: var(--brand-primary);
1331	+	transition: var(--transition-fast);
1332	+	}
1333	+	}
1334	+
1335	+
1336	+	/* chat input area */
1337	+	[class*='ChannelChatLayout.module__textareaArea_']::after {
1338	+	content: "input";
1339	+	}
1340	+	/* server member page */
1341	+	[class*="GuildMembersPage.module__pageContainer_"]::after,
1342	+	/* server member list */
1343	+	[class*="MemberListContainer.module__memberListContainer_"]::after {
1344	+	content: "members";
1345	+	}
1346	+	/* server channel list */
1347	+	[class*="ChannelHeader.module__headerWrapper_"]::after {
1348	+	content: "channel";
1349	+	}
1350	+	/* dm list */
1351	+	[class*="DMLayout.module__dmListColumn_"]::after {
1352	+	content: "users";
1353	+	}
1354	+	/* server channel list */
1355	+	[class*="GuildNavbar.module__guildNavbarContainer_"]::after,
1356	+	/* server unavailable channels skeleton */
1357	+	[class*="GuildNavbarSkeleton.module__skeletonContainer_"]::after {
1358	+	content: "channels";
1359	+	}
1360	+	/* search results */
1361	+	[class*="ChannelIndexPage.module__searchPanel_"]::after {
1362	+	content: "search";
1363	+	}
1364	+	/* server sidebar */
1365	+	[class*="GuildsLayout.module__guildListScroller"]::after,
1366	+	[class*="MobileBottomNav.module__container_"]::after {
1367	+	content: "nav";
1368	+	}
1369	+	/* self status */
1370	+	[class*="GuildsLayout.module__userAreaWrapper_"]::after {
1371	+	content: "user";
1372	+	}
1373	+	/* friendslist */
1374	+	[class*='DMFriendsView.module__content_']::after {
1375	+	content: "friends";
1376	+	}
1377	+	/* friendslist active now panel */
1378	+	[class*="ActiveNowSidebar.module__sidebar_"]::after {
1379	+	content: "activity";
1380	+	}
1381	+	/* vc panel */
1382	+	[class*="VoiceCallView.module__root_"]::after,
1383	+	[class*="ChannelIndexPage.module__emptyStateContent_"]::after {
1384	+	content: "voice";
1385	+	}
1386	+
1387	+	/* mobile notifications page list */
1388	+	[class*="NotificationsPage.module__content_"]::after {
1389	+	content: "messages";
1390	+	}
1391	+
1392	+	/* server discovery explore page */
1393	+	[class*="DiscoveryPage.module__container_"]::after {
1394	+	content: "servers";
1395	+	}
1396	+
1397	+	/* server unavailable server area */
1398	+	[class*="GuildLayout.module__guildUnavailableContainer_"]::after {
1399	+	content: "server";
1400	+	}
1401	+	/* cant get this one to work without clipping.
1402	+	[class*="ChannelChatLayout.module__messagesArea_"]::after {
1403	+	content: "chat";
1404	+	}
1405	+	*/
1406	+	}
1407	+
1408	+	/* ---------------------------------------------------------------- */
1409	+	/* Customization: Avatar Shape */
1410	+	/* ---------------------------------------------------------------- */
1411	+
1412	+	@property --SquareAvatars {
1413	+	syntax: 'off \| on';
1414	+	inherits: false;
1415	+	initial-value: on;
1416	+	}
1417	+
1418	+	@container body style(--SquareAvatars: off) {
1419	+	[class*="BaseAvatar"] {
1420	+	border-radius: 0px!important;
1421	+	}
1422	+	}
1423	+
1424	+	@container body style(--SquareAvatars: on) {
1425	+	[class*="BaseAvatar"] {
1426	+	border-radius: 0px!important;
1427	+	}
1428	+
1429	+	[class*="BaseAvatar"] > image {
1430	+	mask: none;
1431	+	}
1432	+	}
1433	+
1434	+
1435	+	/* ---------------------------------------------------------------- */
1436	+	/* Customization: border online status */
1437	+	/* ---------------------------------------------------------------- */
1438	+
1439	+	@property --OutlineOnlineStatus {
1440	+	syntax: 'off \| on';
1441	+	inherits: false;
1442	+	initial-value: on;
1443	+	}
1444	+
1445	+
1446	+	@container body style(--OutlineOnlineStatus: on) {
1447	+	/* hide original status indicator */
1448	+	[class*="BaseAvatar.module__statusContainer_"] {
1449	+	display: none!important;
1450	+	}
1451	+
1452	+	[class*="BaseAvatar"] > image {
1453	+	mask: none;
1454	+	border-radius: var(--radius-full)!important;
1455	+	}
1456	+
1457	+	[class*="BaseAvatar.module__container_"] {
1458	+	border-radius: var(--radius-full)!important;
1459	+	overflow: hidden;
1460	+	}
1461	+
1462	+
1463	+	[class="BaseAvatar.module__container_"][aria-label="Offline"],
1464	+	[class="BaseAvatar.module__container_"][aria-label="Do Not Disturb"],
1465	+	[class="BaseAvatar.module__container_"][aria-label="Idle"],
1466	+	[class="BaseAvatar.module__container_"][aria-label="Online"] {
1467	+	border-width: 0.15rem;
1468	+	border-style: solid;
1469	+	}
1470	+
1471	+	[class="BaseAvatar.module__container_"][aria-label="Offline"] {
1472	+	border-color: var(--status-offline);
1473	+	}
1474	+	[class="BaseAvatar.module__container_"][aria-label="Do Not Disturb"] {
1475	+	border-color: var(--status-dnd);
1476	+	}
1477	+	[class="BaseAvatar.module__container_"][aria-label="Idle"] {
1478	+	border-color: var(--status-idle);
1479	+	}
1480	+	[class="BaseAvatar.module__container_"][aria-label="Online"] {
1481	+	border-color: var(--status-online);
1482	+	}
1483	+
1484	+	/* pfp view outline medium */
1485	+	[class="UserProfileModal"] [class="BaseAvatar.module__container_"],
1486	+	[class="ProfileCardBanner"] [class="BaseAvatar.module__container_"],
1487	+	[class="YouPage"] [class="BaseAvatar.module__container_"]{
1488	+	border-width: 4px;
1489	+	}
1490	+	}
1491	+
1492	+
1493	+	/* ---------------------------------------------------------------- */
1494	+	/* Customization: App Icon */
1495	+	/* ---------------------------------------------------------------- */
1496	+
1497	+	@property --CustomAppIcon {
1498	+	syntax: 'off \| on';
1499	+	inherits: false;
1500	+	initial-value: on;
1501	+	}
1502	+
1503	+	@container body style(--CustomAppIcon: on) {
1504	+	/* replace appicon with custom image */
1505	+	[class*="GuildsLayout.module__fluxerSymbolIcon_"]
1506	+	{
1507	+	background: var(--ThemeCustomIconUrl) no-repeat;
1508	+	background-size: contain;
1509	+	}
1510	+	/* hide original svg path */
1511	+	[class*="GuildsLayout.module__fluxerSymbolIcon_"] > path {
1512	+	display: none;
1513	+	}
1514	+	}
1515	+
1516	+
1517	+	/* ---------------------------------------------------------------- */
1518	+	/* Customization: Rounding */
1519	+	/* ---------------------------------------------------------------- */
1520	+
1521	+	@property --UseDefaultRounding {
1522	+	syntax: 'off \| on';
1523	+	inherits: false;
1524	+	initial-value: on;
1525	+	}
1526	+
1527	+	@container body style(--UseDefaultRounding: off) {
1528	+	/* get rid of all panel rounding */
1529	+	* {
1530	+	border-radius: 0px!important;
1531	+	}
1532	+
1533	+	[class*="Markup.module__markup_"] ul {
1534	+	list-style-type: square;
1535	+	}
1536	+
1537	+	/* user popout banner pfp mask */
1538	+	[class*="ProfileCardBanner.module__bannerMask_"] > mask > circle,
1539	+	[class*="UserProfileModal.module__bannerMask_"] > mask > circle{
1540	+	display: none;
1541	+	}
1542	+	}
1543	+	/* ---------------------------------------------------------------- */
1544	+	/* Customization: Message Bubbles */
1545	+	/* ---------------------------------------------------------------- */
1546	+
1547	+	@property --MessageBubbles {
1548	+	syntax: 'off \| on';
1549	+	inherits: false;
1550	+	initial-value: on;
1551	+	}
1552	+
1553	+	@container body style(--MessageBubbles: on) {
1554	+
1555	+	/*
1556	+	[aria-label="Message group"] {
1557	+	background: var(--ThemeMessageBubbleColor);
1558	+	border-radius: calc(var(--ThemePanelBorderRounding) - var(--chat-horizontal-padding)/2);
1559	+	border-radius: calc(var(--ThemePanelBorderRounding) * var(--ThemeRoundingMultiplier));
1560	+	padding-left: 0.3rem;
1561	+	} */
1562	+
1563	+	[class*="messageContent"] {
1564	+	/* display: block !important; restore proper layout */
1565	+	width: fit-content; /* shrink to content */
1566	+	margin-top: 4px;
1567	+	padding: 8px 14px;
1568	+	background: var(--ThemeMessageBubbleColor)!important;
1569	+	border-radius: 12px !important;
1570	+	}
1571	+	}
1572	+
1573	+
1574	+
1575	+	/* ---------------------------------------------------------------- */
1576	+	/* Customization: Animations */
1577	+	/* ---------------------------------------------------------------- */
1578	+
1579	+	@property --ExtraAnimations {
1580	+	syntax: 'off \| on';
1581	+	inherits: false;
1582	+	initial-value: on;
1583	+	}
1584	+
1585	+	@container body style(--ExtraAnimations: on) {
1586	+
1587	+	/* channel select flash */
1588	+	[class*="ChannelItemSurface\.module__channelItemSurfaceSelected_"] {
1589	+	background-color: var(--background-modifier-selected);
1590	+	animation-name: ChannelSelectAnim;
1591	+	animation-duration: 1s;
1592	+	}
1593	+
1594	+	@keyframes ChannelSelectAnim {
1595	+	from {background-color: var(--brand-primary);}
1596	+	to {background-color: var(--background-modifier-selected);}
1597	+	}
1598	+
1599	+	/* server list favorites icon */
1600	+	[class*="GuildsLayout.module__favoritesIcon_"] {
1601	+	transition: transform 0.5s;
1602	+	}
1603	+	[class="GuildsLayout.module__guildListItem_"]:hover [class="GuildsLayout.module__favoritesIcon_"] {
1604	+	transform: rotate(216deg);
1605	+	}
1606	+
1607	+	[class*="ChannelSearchResults.module__messageItem_"] {
1608	+	transition: var(--transition-fast);
1609	+	}
1610	+
1611	+	[class*="ChannelSearchResults.module__messageItem_"]:hover {
1612	+	border-color: var(--ThemePanelBorderColorHovered);
1613	+	background-color: var(--background-modifier-hover);
1614	+	}
1615	+	}
1616	+
1617	+
1618	+	/* ---------------------------------------------------------------- */
1619	+	/* Customization: horizontal server list */
1620	+	/* ---------------------------------------------------------------- */
1621	+
1622	+	/* setting property setup */
1623	+	@property --Horizontal-Serverlist {
1624	+	syntax: 'off \| on';
1625	+	inherits: false;
1626	+	initial-value: left;
1627	+	}
1628	+
1629	+	@property --Serverlist-Alignment {
1630	+	syntax: 'left \| center \| right';
1631	+	inherits: false;
1632	+	initial-value: left;
1633	+	}
1634	+
1635	+
1636	+	@container body style(--Horizontal-Serverlist: on) {
1637	+
1638	+	/* doesnt have any effect placed here. need to find a workaround. */
1639	+	:root {
1640	+	--layout-guild-list-width: 4.4rem; /* more compact */
1641	+	--layout-sidebar-width: calc(16.875rem + var(--layout-guild-list-width))!important; /* make sidebar wider to compensate for extra space */
1642	+	}
1643	+
1644	+	/* only show on desktop */
1645	+	@media (min-width: 650px) {
1646	+
1647	+
1648	+	/* container for server list & rest */
1649	+	[class*="GuildsLayout.module__guildsLayoutContainer_"] {
1650	+	display: flex;
1651	+	flex-direction: column;
1652	+	}
1653	+
1654	+	/* make channel list etc wider to match user area */
1655	+	[class*="GuildsLayout.module__userAreaWrapper_"] {
1656	+	width: var(--layout-sidebar-width);
1657	+	}
1658	+
1659	+	/* scroller wrapper */
1660	+	[class*="GuildsLayout.module__guildListScrollerWrapper_"] {
1661	+	height: var(--layout-guild-list-width);
1662	+	width: 100%;
1663	+	}
1664	+	/* scroller wrap \| changed to fix hover region while allowing panel labels */
1665	+	[class="GuildsLayout.module__guildListScrollerWrapper_"] [class="Scroller.module__scrollerWrap_"] {
1666	+	overflow: hidden;
1667	+	}
1668	+
1669	+	/* rotate scroller */
1670	+	[class*="GuildsLayout.module__guildListScrollContainer_"] {
1671	+	padding: var(--spacing-2) 0px;
1672	+	width: var(--layout-guild-list-width);
1673	+	height: calc(100vw - var(--ThemePanelMargin)2 - var(--ThemePanelBorderThickness) 2);
1674	+
1675	+	transform: rotateZ(-90deg);
1676	+	}
1677	+
1678	+	/* scroller child container*/
1679	+	[class="GuildsLayout.module__guildListScrollContainer_"] [class="Scroller.module__scrollerChildren_"] {
1680	+	align-items: flex-end;
1681	+	}
1682	+
1683	+	/* serverlist section container */
1684	+	[class*="GuildsLayout.module__guildListContent_"] {
1685	+	align-items: flex-end;
1686	+	width: var(--layout-guild-list-width);
1687	+	}
1688	+
1689	+	/* serverlist top & lower section */
1690	+	[class*="GuildsLayout.module__guildListTopSection_"],
1691	+	[class*="GuildsLayout.module__guildListGuildsSection_"] {
1692	+	width: unset;
1693	+	}
1694	+
1695	+	/* unrotate server button & misc buttons */
1696	+	[class*="GuildsLayout.module__guildListItem_"],
1697	+	[class*="GuildFolderItem.module__folderHeader_"] {
1698	+	width: 3.7rem;
1699	+	transform: rotateZ(-180deg);
1700	+	}
1701	+	/* unrotate server image & extra buttons */
1702	+	[class*="GuildListDMItem.module__relative_"],
1703	+	[class*="GuildsLayout.module__relative_"],
1704	+	[class*="GuildFolderItem.module__relative_"],
1705	+	[class*="GuildsLayout.module__addGuildButtonIcon_"]
1706	+	{
1707	+	transform: rotateZ(-90deg);
1708	+	}
1709	+
1710	+
1711	+	@container body style(--Serverlist-Alignment: left) {
1712	+	[class="GuildsLayout.module__guildListScrollContainer_"] [class="Scroller.module__scrollerChildren_"] {
1713	+	justify-content: start;
1714	+	}
1715	+	}
1716	+
1717	+	@container body style(--Serverlist-Alignment: center) {
1718	+	[class="GuildsLayout.module__guildListScrollContainer_"] [class="Scroller.module__scrollerChildren_"] {
1719	+	justify-content: center;
1720	+	}
1721	+	}
1722	+
1723	+	@container body style(--Serverlist-Alignment: right) {
1724	+
1725	+	/* reverse server list */
1726	+	[class*="GuildsLayout.module__guildListContent_"],
1727	+	[class*="GuildsLayout.module__guildListTopSection_"],
1728	+	[class*="GuildsLayout.module__guildListGuildsSection_"] {
1729	+	flex-direction: column-reverse;
1730	+	}
1731	+
1732	+	[class="GuildsLayout.module__guildListScrollContainer_"] [class="Scroller.module__scrollerChildren_"] {
1733	+	justify-content: end;
1734	+	}
1735	+	}
1736	+	}
1737	+	}
1738	+
1739	+
1740	+
1741	+	/* ################################################################################################# */
1742	+	/* ################################################################################################# */
1743	+	/* ################################################################################################# */
1744	+
1745	+
1746	+	/* ---------------------------------------------------------------- */
1747	+	/* mobile tweaks
1748	+	/* ---------------------------------------------------------------- */
1749	+
1750	+	@media (max-width: 840px) {
1751	+
1752	+	/* mobile bottom nav */
1753	+	[class*="MobileBottomNav.module__container_"] {
1754	+	margin: var(--ThemePanelMargin);
1755	+	margin-top: 0px;
1756	+	}
1757	+
1758	+
1759	+	/* mobile sheets */
1760	+	[class*="Sheet.module__root_"]
1761	+	/* mobile user profile popout
1762	+	[class="UserProfileMobileSheet.module__profileContent_"]/
1763	+	{
1764	+	background: var(--ThemeFlatDarker);
1765	+	}
1766	+	/* mobile sheets */
1767	+	[class*="Sheet.module__container_"]
1768	+	{
1769	+	border-radius: unset!important;
1770	+	}
1771	+
1772	+
1773	+	/* settings modal backdrop */
1774	+	[class*="Modal.module__modalBackdrop_"] {
1775	+	backdrop-filter: unset;
1776	+	}
1777	+
1778	+	/* add friend button */
1779	+	[class*="DMList.module__mobileAddFriendButton_"] {
1780	+	width: 2rem;
1781	+	height: 2rem;
1782	+	padding: unset;
1783	+	align-items: center;
1784	+	justify-content: center;
1785	+	}
1786	+	[class*="DMList.module__mobileAddFriendButton_"] > svg {
1787	+	width: 1.25rem;
1788	+	height: 1.25rem;
1789	+	}
1790	+	[class*="DMList.module__mobileAddFriendButton_"] > span {
1791	+	display: none;
1792	+	}
1793	+
1794	+
1795	+	/* notifications page content alignment */
1796	+	[class*="NotificationsPage.module__content_"] {
1797	+	justify-content: center;
1798	+	}
1799	+
1800	+	/* notifications page content alignment */
1801	+	[class*="DMList.module__dmItemMobile_"] {
1802	+	height: 2.7rem;
1803	+	}
1804	+
1805	+	/* notifications page X button */
1806	+	[class*="InboxMessageHeader\.module__headerIconButton_"] {
1807	+	background: var(--ThemeDarkenLight);
1808	+	background: transparent;
1809	+	}
1810	+
1811	+	/* server list container */
1812	+	[class*="GuildsLayout.module__guildListScrollerWrapper_"],
1813	+	/* server channel list */
1814	+	[class*="GuildNavbar.module__guildNavbarContainer_"],
1815	+	/* dm list container */
1816	+	[class*="DMLayout.module__dmListColumn_"]
1817	+	{
1818	+	width: -webkit-fill-available;
1819	+	/* idk why it doesnt need to multiply the themepanelborderthickness on mobile*/
1820	+	height: calc(100% - var(--layout-user-area-reserved-height) - var(--layout-mobile-bottom-nav-reserved-height) - var(--ThemePanelMargin) - var(--ThemePanelBorderThickness));
1821	+	}
1822	+
1823	+
1824	+	/* mobile notifications page */
1825	+	[class*="NotificationsPage.module__container_"],
1826	+	/* mobile notifications page */
1827	+	[class*="NotificationsPage.module__content_"],
1828	+	/* mobile self profile */
1829	+	[class*="YouPage.module__container_"] {
1830	+	height: calc(100% - var(--layout-user-area-reserved-height) - var(--layout-mobile-bottom-nav-reserved-height) - var(--ThemePanelMargin) - var(--ThemePanelBorderThickness) * 2);
1831	+	/* NOTE: currently need to hardcode var(--layout-mobile-bottom-nav-reserved-height) here since its wrongly set to 0 on the you page. */
1832	+	height: calc(100% - var(--layout-user-area-reserved-height) - 60px - var(--ThemePanelMargin) - var(--ThemePanelBorderThickness));
1833	+	overflow: hidden auto;
1834	+	}
1835	+
1836	+	/* mobile user profile banner */
1837	+	[class*="UserProfileMobileSheet.module__bannerContainer_"] {
1838	+	border-radius: unset;
1839	+	}
1840	+	}
1841	+
1842	+
1843	+	/* ################################################################################################# */
1844	+	/* ################################################################################################# */
1845	+	/* ################################################################################################# */

memphis-storm.css

			@@ -1,8 +1,10 @@
1		-	/* ═══════════════════════════════════════════════════
2		-	* Memphis Storm theme based on
3		-	* WINDOWS 95 — FLUXER THEME v3
4		-	* Built from real inspected class names only.
5		-	* ═══════════════════════════════════════════════════ */
	1	+	/**
	2	+	* @name Memphis Storm
	3	+	* @description A theme based on WINDOWS 95 — FLUXER THEME v3 by SupremeGooper:9570 and the Storm (VGA) theme from Windows 98/2000.
	4	+	* @basetheme light
	5	+	* @author jce:2492
	6	+	* @invite https://fluxer.gg/themes
	7	+	*/
6	8
7	9		/* ─────────────────────────────────────────────────
8	10		* CHAT BACKGROUND
			@@ -2147,3 +2149,4 @@ button[class*="actionButton___XzNjNz"]:hover {
2147	2149		color: #ffffff !important;
2148	2150		/* filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5)) !important; */
2149	2151		}
	2152	+

jce 修订了这个 Gist 1772701624. 转到此修订

没有任何变更

jce 修订了这个 Gist 1772701593. 转到此修订

1 file changed, 1 deletion

memphis-storm.css

			@@ -2147,4 +2147,3 @@ button[class*="actionButton___XzNjNz"]:hover {
2147	2147		color: #ffffff !important;
2148	2148		/* filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5)) !important; */
2149	2149		}
2150		-

jce 修订了这个 Gist 1772701565. 转到此修订

3 files changed, 2150 insertions

breeze-dark.scss 重命名为 breeze-dark.css

文件已重命名，但内容与之前没有差异

breeze-light.scss 重命名为 breeze-light.css

文件已重命名，但内容与之前没有差异

memphis-storm.css(文件已创建)

		@@ -0,0 +1,2150 @@
1	+	/* ═══════════════════════════════════════════════════
2	+	* Memphis Storm theme based on
3	+	* WINDOWS 95 — FLUXER THEME v3
4	+	* Built from real inspected class names only.
5	+	* ═══════════════════════════════════════════════════ */
6	+
7	+	/* ─────────────────────────────────────────────────
8	+	* CHAT BACKGROUND
9	+	* ───────────────────────────────────────────────── */
10	+	[class*="chatContent___"],
11	+	[class*="messagesWrapper___"] {
12	+	background: white !important;
13	+	}
14	+
15	+	/* ─────────────────────────────────────────────────
16	+	* GUILD LIST (far left icon rail)
17	+	* ───────────────────────────────────────────────── */
18	+	[class*="guildListScrollerWrapper___XzkwZG"],
19	+	[class*="guildListScrollContainer___XzkwZG"],
20	+	[class*="guildListContent___XzkwZG"],
21	+	[class*="guildListTopSection___XzkwZG"],
22	+	[class*="guildListGuildsSection___XzkwZG"] {
23	+	background: #c0c0c0 !important;
24	+	}
25	+
26	+	[class*="guildListScrollerWrapper___XzkwZG"] {
27	+	border-right: 2px solid #808080 !important;
28	+	}
29	+
30	+	[class*="guildIndicatorBar___XzkwZG"] {
31	+	background: #800080 !important;
32	+	}
33	+
34	+	[class*="guildDivider___XzkwZG"] {
35	+	background: #808080 !important;
36	+	border-bottom: 1px solid #ffffff !important;
37	+	}
38	+
39	+	[class*="addGuildButtonIcon___XzkwZG"] {
40	+	background: #c0c0c0 !important;
41	+	border-top: 2px solid #ffffff !important;
42	+	border-left: 2px solid #ffffff !important;
43	+	border-bottom: 2px solid #000000 !important;
44	+	border-right: 2px solid #000000 !important;
45	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
46	+	border-radius: 0 !important;
47	+	color: #800080 !important;
48	+	}
49	+
50	+	[class*="addGuildButtonIcon___XzkwZG"]:hover {
51	+	background: #c0c0c0 !important;
52	+	border-top: 2px solid #000000 !important;
53	+	border-left: 2px solid #000000 !important;
54	+	border-bottom: 2px solid #ffffff !important;
55	+	border-right: 2px solid #ffffff !important;
56	+	box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf !important;
57	+	}
58	+
59	+	[class*="fluxerButtonIcon___XzkwZG"] {
60	+	background: #c0c0c0 !important;
61	+	border-top: 2px solid #ffffff !important;
62	+	border-left: 2px solid #ffffff !important;
63	+	border-bottom: 2px solid #000000 !important;
64	+	border-right: 2px solid #000000 !important;
65	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
66	+	border-radius: 0 !important;
67	+	color: #800080 !important;
68	+	}
69	+
70	+	[class="fluxerButton___XzkwZG"]:hover [class="fluxerButtonIcon___XzkwZG"] {
71	+	border-top: 2px solid #000000 !important;
72	+	border-left: 2px solid #000000 !important;
73	+	border-bottom: 2px solid #ffffff !important;
74	+	border-right: 2px solid #ffffff !important;
75	+	}
76	+
77	+	/* ─────────────────────────────────────────────────
78	+	* DM LIST PANEL (Direct Messages column)
79	+	* ───────────────────────────────────────────────── */
80	+
81	+	/* Outer column wrapper */
82	+	.DMLayout\.module__dmListColumn___ZmIwOG,
83	+	[class="DMLayout.module__dmListColumn___ZmIwOG"],
84	+	div[class*="dmListColumn___ZmIwOG"] {
85	+	background: #c0c0c0 !important;
86	+	}
87	+
88	+	/* Main container + scroller */
89	+	div[class*="dmListContainer___XzM3ZG"],
90	+	div[class*="desktopScroller___XzM3ZG"],
91	+	div[class*="scrollerContent___XzM3ZG"],
92	+	div[class*="dmChannelList___XzM3ZG"] {
93	+	background: #c0c0c0 !important;
94	+	}
95	+
96	+	/* Quick Switcher header */
97	+	button[class*="dmListHeader___XzM3ZG"] {
98	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
99	+	border-bottom: 2px solid #000000 !important;
100	+	border-top: 1px solid #a0a0ff !important;
101	+	width: 100% !important;
102	+	}
103	+
104	+	span[class*="dmListHeaderText___XzM3ZG"] {
105	+	color: #ffffff !important;
106	+	}
107	+
108	+	/* Ctrl+K kbd badges */
109	+	div[class*="dmListHeaderShortcut___XzM3ZG"],
110	+	kbd[class*="key___XzViNG"],
111	+	span[class*="keybindHint___XzViNG"] {
112	+	background: #c0c0c0 !important;
113	+	color: #000000 !important;
114	+	border-top: 1px solid #ffffff !important;
115	+	border-left: 1px solid #ffffff !important;
116	+	border-bottom: 1px solid #000000 !important;
117	+	border-right: 1px solid #000000 !important;
118	+	border-radius: 0 !important;
119	+	}
120	+
121	+	/* Friends / Personal Notes / Plutonium nav buttons */
122	+	button[class*="clickableItem___XzM3ZG"] {
123	+	background: #c0c0c0 !important;
124	+	border-top: 2px solid #ffffff !important;
125	+	border-left: 2px solid #ffffff !important;
126	+	border-bottom: 2px solid #000000 !important;
127	+	border-right: 2px solid #000000 !important;
128	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
129	+	border-radius: 0 !important;
130	+	margin: 2px 4px !important;
131	+	transition: none !important;
132	+	width: calc(100% - 8px) !important;
133	+	}
134	+
135	+	button[class*="clickableItem___XzM3ZG"]:hover {
136	+	background: #800080 !important;
137	+	border-top: 2px solid #000000 !important;
138	+	border-left: 2px solid #000000 !important;
139	+	border-bottom: 2px solid #ffffff !important;
140	+	border-right: 2px solid #ffffff !important;
141	+	}
142	+
143	+	button[class="clickableItem___XzM3ZG"]:hover {
144	+	color: #ffffff !important;
145	+	}
146	+
147	+	span[class*="clickableItemText___XzM3ZG"],
148	+	div[class*="clickableItemIcon___XzM3ZG"] {
149	+	color: #000000 !important;
150	+	}
151	+
152	+	/* "Direct Messages" section separator */
153	+	div[class*="dmSectionSeparator___XzM3ZG"] {
154	+	background: #808080 !important;
155	+	border-bottom: 1px solid #ffffff !important;
156	+	height: 2px !important;
157	+	margin: 4px 0 !important;
158	+	}
159	+
160	+	/* "Direct Messages" section header row */
161	+	div[class*="dmSectionHeader___XzM3ZG"] {
162	+	background: #c0c0c0 !important;
163	+	border-top: 1px solid #808080 !important;
164	+	border-bottom: 1px solid #ffffff !important;
165	+	padding: 2px 8px !important;
166	+	}
167	+
168	+	span[class*="dmSectionHeaderLabel___XzM3ZG"] {
169	+	color: #000000 !important;
170	+	text-transform: uppercase !important;
171	+	letter-spacing: 0.05em !important;
172	+	}
173	+
174	+	/* + New DM button */
175	+	button[class*="dmCreateButton___XzM3ZG"] {
176	+	background: #c0c0c0 !important;
177	+	border-top: 2px solid #ffffff !important;
178	+	border-left: 2px solid #ffffff !important;
179	+	border-bottom: 2px solid #000000 !important;
180	+	border-right: 2px solid #000000 !important;
181	+	box-shadow: inset -1px -1px 0 #808080 !important;
182	+	border-radius: 0 !important;
183	+	color: #000000 !important;
184	+	}
185	+
186	+	button[class*="dmCreateButton___XzM3ZG"]:hover {
187	+	border-top: 2px solid #000000 !important;
188	+	border-left: 2px solid #000000 !important;
189	+	border-bottom: 2px solid #ffffff !important;
190	+	border-right: 2px solid #ffffff !important;
191	+	}
192	+
193	+	/* DM conversation items — normal */
194	+	button[class*="dmItem___XzM3ZG"] {
195	+	background: #c0c0c0 !important;
196	+	border-top: 2px solid #ffffff !important;
197	+	border-left: 2px solid #ffffff !important;
198	+	border-bottom: 2px solid #000000 !important;
199	+	border-right: 2px solid #000000 !important;
200	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
201	+	border-radius: 0 !important;
202	+	margin: 2px 4px !important;
203	+	transition: none !important;
204	+	width: calc(100% - 8px) !important;
205	+	}
206	+
207	+	button[class*="dmItem___XzM3ZG"]:hover {
208	+	background: #c0c0c0 !important;
209	+	outline: 1px dotted #800080 !important;
210	+	outline-offset: -2px !important;
211	+	}
212	+
213	+	/* DM item — SELECTED/active — sunken */
214	+	button[class*="dmItemSelected___XzM3ZG"] {
215	+	background: #c0c0c0 !important;
216	+	border-top: 2px solid #000000 !important;
217	+	border-left: 2px solid #000000 !important;
218	+	border-bottom: 2px solid #ffffff !important;
219	+	border-right: 2px solid #ffffff !important;
220	+	box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf !important;
221	+	}
222	+
223	+	button[class="dmItemSelected___XzM3ZG"] span[class="dmItemNameText___XzM3ZG"] {
224	+	text-decoration: underline !important;
225	+	}
226	+
227	+	/* DM item text */
228	+	span[class*="dmItemName___XzM3ZG"],
229	+	span[class*="dmItemNameText___XzM3ZG"] {
230	+	color: #000000 !important;
231	+	}
232	+
233	+	/* Close X button on DM items */
234	+	div[class*="dmItemCloseButton___XzM3ZG"] {
235	+	background: #c0c0c0 !important;
236	+	border-top: 2px solid #ffffff !important;
237	+	border-left: 2px solid #ffffff !important;
238	+	border-bottom: 2px solid #000000 !important;
239	+	border-right: 2px solid #000000 !important;
240	+	box-shadow: inset -1px -1px 0 #808080 !important;
241	+	border-radius: 0 !important;
242	+	color: #000000 !important;
243	+	}
244	+
245	+	div[class*="dmItemCloseButton___XzM3ZG"]:hover {
246	+	border-top: 2px solid #000000 !important;
247	+	border-left: 2px solid #000000 !important;
248	+	border-bottom: 2px solid #ffffff !important;
249	+	border-right: 2px solid #ffffff !important;
250	+	}
251	+
252	+	/* System tag badge (e.g. "SYSTEM" on Fluxer bot) */
253	+	span[class*="tag___XzM2Zm"] {
254	+	background: #800080 !important;
255	+	color: #ffffff !important;
256	+	border-radius: 0 !important;
257	+	padding: 1px 4px !important;
258	+	}
259	+
260	+	span[class*="text___XzM2Zm"] {
261	+	color: #ffffff !important;
262	+	}
263	+
264	+	/* ─────────────────────────────────────────────────
265	+	* CHANNEL LIST PANEL — silver chrome
266	+	* ───────────────────────────────────────────────── */
267	+	[class*="channelListScrollerWrapper___XzdlNz"] {
268	+	background: #c0c0c0 !important;
269	+	border-right: 2px solid #808080 !important;
270	+	}
271	+
272	+	[class*="channelListScroller___XzdlNz"] {
273	+	background: #c0c0c0 !important;
274	+	}
275	+
276	+	[class*="navigationContainer___XzdlNz"],
277	+	[class*="channelGroupsContainer___XzdlNz"],
278	+	[class*="channelGroup___XzdlNz"],
279	+	[class*="membersSection___XzdlNz"] {
280	+	background: transparent !important;
281	+	}
282	+
283	+	/* ─────────────────────────────────────────────────
284	+	* GUILD HEADER — title bar
285	+	* ───────────────────────────────────────────────── */
286	+	[class*="headerWrapper___ZGNlOD"] {
287	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
288	+	border-top: 2px solid #ffffff !important;
289	+	border-left: 2px solid #ffffff !important;
290	+	border-bottom: 2px solid #000000 !important;
291	+	border-right: 2px solid #000000 !important;
292	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #a0a0ff !important;
293	+	padding: 0 !important;
294	+	}
295	+
296	+	[class*="headerContainer___ZGNlOD"] {
297	+	background: transparent !important;
298	+	border: none !important;
299	+	box-shadow: none !important;
300	+	}
301	+
302	+	[class*="headerContent___ZGNlOD"] {
303	+	padding: 4px 8px !important;
304	+	}
305	+
306	+	[class*="guildName___ZGNlOD"] {
307	+	color: #ffffff !important;;
308	+	text-shadow: 1px 1px 0 #000040 !important;
309	+	}
310	+
311	+	[class*="caretIcon___ZGNlOD"] {
312	+	background: #c0c0c0 !important;
313	+	color: #000000 !important;
314	+	border-top: 2px solid #ffffff !important;
315	+	border-left: 2px solid #ffffff !important;
316	+	border-bottom: 2px solid #000000 !important;
317	+	border-right: 2px solid #000000 !important;
318	+	box-shadow: inset -1px -1px 0 #808080 !important;
319	+	border-radius: 0 !important;
320	+	padding: 2px !important;
321	+	width: 16px !important;
322	+	height: 14px !important;
323	+	}
324	+
325	+	[class="headerContent___ZGNlOD"]:hover [class="caretIcon___ZGNlOD"] {
326	+	border-top: 2px solid #000000 !important;
327	+	border-left: 2px solid #000000 !important;
328	+	border-bottom: 2px solid #ffffff !important;
329	+	border-right: 2px solid #ffffff !important;
330	+	}
331	+
332	+	/* ─────────────────────────────────────────────────
333	+	* CHANNEL HEADER BAR (top of chat)
334	+	* ──────────────────────────────�────────────────── */
335	+	[class*="headerWrapper___XzkyNm"] {
336	+	background: #c0c0c0 !important;
337	+	border-bottom: 2px solid #808080 !important;
338	+	border-top: 1px solid #ffffff !important;
339	+	}
340	+
341	+	[class*="headerContainer___XzkyNm"] {
342	+	background: transparent !important;
343	+	}
344	+
345	+	/* Channel name + icon */
346	+	[class*="channelName___XzkyNm"] {
347	+	color: #000000 !important;
348	+	}
349	+
350	+	[class*="channelIcon___XzkyNm"] {
351	+	color: #800080 !important;
352	+	}
353	+
354	+	/* Topic divider dot */
355	+	[class*="topicDivider___XzkyNm"] {
356	+	color: #808080 !important;
357	+	}
358	+
359	+	/* Topic text */
360	+	[class*="topicContainer___XzkyNm"],
361	+	[class*="topicButton___XzkyNm"],
362	+	[class="topicButton___XzkyNm"] {
363	+	color: #444444 !important;
364	+	}
365	+
366	+	/* Header icon buttons (star, bell, pin, members, search) */
367	+	[class*="iconButton___XzkyNm"] {
368	+	background: #c0c0c0 !important;
369	+	border-top: 2px solid #ffffff !important;
370	+	border-left: 2px solid #ffffff !important;
371	+	border-bottom: 2px solid #000000 !important;
372	+	border-right: 2px solid #000000 !important;
373	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
374	+	border-radius: 0 !important;
375	+	color: #000000 !important;
376	+	transition: none !important;
377	+	}
378	+
379	+	[class*="iconButton___XzkyNm"]:hover {
380	+	background: #c0c0c0 !important;
381	+	border-top: 2px solid #000000 !important;
382	+	border-left: 2px solid #000000 !important;
383	+	border-bottom: 2px solid #ffffff !important;
384	+	border-right: 2px solid #ffffff !important;
385	+	box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf !important;
386	+	}
387	+
388	+	/* Selected/active icon button (members panel toggle when open) */
389	+	[class*="iconButtonSelected___XzkyNm"] {
390	+	background: #c0c0c0 !important;
391	+	border-top: 2px solid #000000 !important;
392	+	border-left: 2px solid #000000 !important;
393	+	border-bottom: 2px solid #ffffff !important;
394	+	border-right: 2px solid #ffffff !important;
395	+	box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf !important;
396	+	border-radius: 0 !important;
397	+	color: #000000 !important;
398	+	}
399	+
400	+	[class*="buttonIcon___XzkyNm"] {
401	+	color: #000000 !important;
402	+	}
403	+
404	+	/* Back button */
405	+	[class*="backButton___XzkyNm"] {
406	+	background: #c0c0c0 !important;
407	+	border-top: 2px solid #ffffff !important;
408	+	border-left: 2px solid #ffffff !important;
409	+	border-bottom: 2px solid #000000 !important;
410	+	border-right: 2px solid #000000 !important;
411	+	box-shadow: inset -1px -1px 0 #808080 !important;
412	+	border-radius: 0 !important;
413	+	color: #000000 !important;
414	+	}
415	+
416	+	/* Search bar inside header */
417	+	[class*="inputContainer___XzZhZj"] {
418	+	background: #ffffff !important;
419	+	border-top: 2px solid #808080 !important;
420	+	border-left: 2px solid #808080 !important;
421	+	border-bottom: 2px solid #dfdfdf !important;
422	+	border-right: 2px solid #dfdfdf !important;
423	+	box-shadow: inset 1px 1px 0 #000000 !important;
424	+	border-radius: 0 !important;
425	+	}
426	+
427	+	[class*="input___XzZhZj"] {
428	+	background: transparent !important;
429	+	color: #000000 !important;
430	+	}
431	+
432	+	[class*="input___XzZhZj"]::placeholder {
433	+	color: #808080 !important;
434	+	}
435	+
436	+	[class*="scopeButton___XzZhZj"] {
437	+	background: transparent !important;
438	+	color: #800080 !important;
439	+	}
440	+
441	+	/* ─────────────────────────────────────────────────
442	+	* CHANNEL ITEMS — raised buttons
443	+	* ───────────────────────────────────────────────── */
444	+	[class*="container___Xzk5Zm"] {
445	+	margin: 2px 4px !important;
446	+	background: transparent !important;
447	+	}
448	+
449	+	[class*="channelItemSurface___YTdjZW"] {
450	+	background: #c0c0c0 !important;
451	+	border-top: 2px solid #ffffff !important;
452	+	border-left: 2px solid #ffffff !important;
453	+	border-bottom: 2px solid #000000 !important;
454	+	border-right: 2px solid #000000 !important;
455	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
456	+	border-radius: 0 !important;
457	+	padding: 3px 8px !important;
458	+	gap: 6px !important;
459	+	transition: none !important;
460	+	}
461	+
462	+	[class*="channelItemSurface___YTdjZW"]:hover {
463	+	background: #c0c0c0 !important;
464	+	outline: 1px dotted #800080 !important;
465	+	outline-offset: -2px !important;
466	+	}
467	+
468	+	[class="channelItemSurface___YTdjZW"]:hover [class="channelName___Xzk5Zm"] {
469	+	color: #800080 !important;
470	+	}
471	+
472	+	[class*="channelItemSurfaceSelected___YTdjZW"] {
473	+	background: #c0c0c0 !important;
474	+	border-top: 2px solid #000000 !important;
475	+	border-left: 2px solid #000000 !important;
476	+	border-bottom: 2px solid #ffffff !important;
477	+	border-right: 2px solid #ffffff !important;
478	+	box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf !important;
479	+	}
480	+
481	+	[class="channelItemSurfaceSelected___YTdjZW"] [class="channelName___Xzk5Zm"] {
482	+	color: #000000 !important;
483	+	text-decoration: underline !important;
484	+	}
485	+
486	+	[class*="channelItemCategory___Xzk5Zm"] {
487	+	background: #c0c0c0 !important;
488	+	border-top: 1px solid #808080 !important;
489	+	border-bottom: 1px solid #ffffff !important;
490	+	border-left: none !important;
491	+	border-right: none !important;
492	+	box-shadow: none !important;
493	+	padding: 2px 8px !important;
494	+	margin-top: 4px !important;
495	+	}
496	+
497	+	[class*="channelItemCategory___Xzk5Zm"]:hover {
498	+	outline: none !important;
499	+	background: #c0c0c0 !important;
500	+	}
501	+
502	+	[class*="categoryName___Xzk5Zm"] {
503	+	color: #000000 !important;
504	+	text-transform: uppercase !important;
505	+	letter-spacing: 0.05em !important;
506	+	}
507	+
508	+	[class*="channelName___Xzk5Zm"] {
509	+	color: #000000 !important;
510	+	}
511	+
512	+	[class*="channelItemIcon___Xzk5Zm"] {
513	+	color: #800080 !important;
514	+	}
515	+
516	+	[class*="channelItemIconSelected___Xzk5Zm"] {
517	+	color: #000000 !important;
518	+	}
519	+
520	+	[class*="iconButton___XzJiN2"] {
521	+	background: #c0c0c0 !important;
522	+	border-top: 2px solid #ffffff !important;
523	+	border-left: 2px solid #ffffff !important;
524	+	border-bottom: 2px solid #000000 !important;
525	+	border-right: 2px solid #000000 !important;
526	+	box-shadow: inset -1px -1px 0 #808080 !important;
527	+	border-radius: 0 !important;
528	+	color: #000000 !important;
529	+	}
530	+
531	+	[class*="iconButton___XzJiN2"]:hover {
532	+	border-top: 2px solid #000000 !important;
533	+	border-left: 2px solid #000000 !important;
534	+	border-bottom: 2px solid #ffffff !important;
535	+	border-right: 2px solid #ffffff !important;
536	+	}
537	+
538	+	/* ─────────────────────────────────────────────────
539	+	* MEMBER LIST (far right panel)
540	+	* ───────────────────────────────────────────────── */
541	+	[class*="memberListContainer___XzM3MW"],
542	+	[class*="memberListScroller___XzM3MW"] {
543	+	background: #c0c0c0 !important;
544	+	}
545	+
546	+	[class*="frame___ZmU4ZG"],
547	+	[class*="contentWrapper___ZmU4ZG"],
548	+	[class*="body___ZmU4ZG"] {
549	+	background: #c0c0c0 !important;
550	+	}
551	+
552	+	[class*="groupHeader___Yjk5ZT"] {
553	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
554	+	color: #ffffff !important;
555	+	text-transform: uppercase !important;
556	+	letter-spacing: 0.05em !important;
557	+	padding: 2px 8px !important;
558	+	border-top: 1px solid #a0a0ff !important;
559	+	border-bottom: 1px solid #000040 !important;
560	+	}
561	+
562	+	[class*="button___YTg2NG"] {
563	+	background: #c0c0c0 !important;
564	+	border-top: 2px solid #ffffff !important;
565	+	border-left: 2px solid #ffffff !important;
566	+	border-bottom: 2px solid #000000 !important;
567	+	border-right: 2px solid #000000 !important;
568	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
569	+	border-radius: 0 !important;
570	+	margin: 2px 4px !important;
571	+	transition: none !important;
572	+	}
573	+
574	+	[class*="button___YTg2NG"]:hover {
575	+	background: #800080 !important;
576	+	border-top: 2px solid #000000 !important;
577	+	border-left: 2px solid #000000 !important;
578	+	border-bottom: 2px solid #ffffff !important;
579	+	border-right: 2px solid #ffffff !important;
580	+	}
581	+
582	+	[class="button___YTg2NG"]:hover [class="name___YTg2NG"],
583	+	[class="button___YTg2NG"]:hover [class="truncatedText___XzM5NG"] {
584	+	color: #ffffff !important;
585	+	-webkit-text-fill-color: #ffffff !important;
586	+	}
587	+
588	+	[class*="truncatedText___XzM5NG"] {
589	+	color: #808080 !important;
590	+	}
591	+
592	+	[class*="track___YzkyYz"] {
593	+	background: #c0c0c0 !important;
594	+	border-left: 1px solid #808080 !important;
595	+	}
596	+
597	+	[class*="thumb___YzkyYz"] {
598	+	background: #c0c0c0 !important;
599	+	border-top: 2px solid #ffffff !important;
600	+	border-left: 2px solid #ffffff !important;
601	+	border-bottom: 2px solid #000000 !important;
602	+	border-right: 2px solid #000000 !important;
603	+	box-shadow: inset -1px -1px 0 #808080 !important;
604	+	border-radius: 0 !important;
605	+	}
606	+
607	+	/* ─────────────────────────────────────────────────
608	+	* USER AREA
609	+	* ───────────────────────────────────────────────── */
610	+	[class*="userAreaContainer"] {
611	+	background: #c0c0c0 !important;
612	+	border-top: 2px solid #808080 !important;
613	+	border-radius: 0 !important;
614	+	margin: 0 !important;
615	+	max-width: 100% !important;
616	+	}
617	+
618	+	[class*="userAreaInnerWrapper"],
619	+	[class*="userAreaWrapper"] {
620	+	background: transparent !important;
621	+	}
622	+
623	+	[class*="userName"] {
624	+	color: #000000 !important;
625	+	text-shadow: none !important;
626	+	}
627	+
628	+	[class*="userStatus"],
629	+	[class*="userStatusLabel"] {
630	+	color: #808080 !important;
631	+	}
632	+
633	+	[class*="userInfo"]:hover {
634	+	background: #800080 !important;
635	+	border-radius: 0 !important;
636	+	animation: none !important;
637	+	}
638	+
639	+	[class="userInfo"]:hover {
640	+	color: #ffffff !important;
641	+	}
642	+
643	+	[class*="controlButton"] {
644	+	background: #c0c0c0 !important;
645	+	border-top: 2px solid #ffffff !important;
646	+	border-left: 2px solid #ffffff !important;
647	+	border-bottom: 2px solid #000000 !important;
648	+	border-right: 2px solid #000000 !important;
649	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
650	+	border-radius: 0 !important;
651	+	color: #000000 !important;
652	+	width: 24px !important;
653	+	height: 24px !important;
654	+	min-width: 24px !important;
655	+	min-height: 24px !important;
656	+	animation: none !important;
657	+	}
658	+
659	+	[class*="controlButton"] svg {
660	+	color: #000000 !important;
661	+	width: 13px !important;
662	+	height: 13px !important;
663	+	filter: none !important;
664	+	}
665	+
666	+	[class*="controlButton"]:hover {
667	+	background: #c0c0c0 !important;
668	+	border-top: 2px solid #000000 !important;
669	+	border-left: 2px solid #000000 !important;
670	+	border-bottom: 2px solid #ffffff !important;
671	+	border-right: 2px solid #ffffff !important;
672	+	box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf !important;
673	+	animation: none !important;
674	+	}
675	+
676	+	[class*="controlsContainer"] {
677	+	gap: 3px !important;
678	+	padding: 3px 4px !important;
679	+	background: transparent !important;
680	+	}
681	+
682	+	/* ─────────────────────────────────────────────────
683	+	* MESSAGE EDIT TEXTAREA
684	+	* ───────────────────────────────────────────────── */
685	+	[class*="mainWrapperEditing___XzI3Mz"] {
686	+	background: #ffffff !important;
687	+	border-top: 2px solid #808080 !important;
688	+	border-left: 2px solid #808080 !important;
689	+	border-bottom: 2px solid #dfdfdf !important;
690	+	border-right: 2px solid #dfdfdf !important;
691	+	box-shadow: inset 1px 1px 0 #000000 !important;
692	+	border-radius: 0 !important;
693	+	padding: 4px !important;
694	+	}
695	+
696	+	[class*="contentAreaEditing___XzI3Mz"],
697	+	[class*="scroller___ZTdjNm"],
698	+	[class*="flexColumnContainer___ZTdjNm"] {
699	+	background: transparent !important;
700	+	}
701	+
702	+	[class*="textarea___XzI3Mz"] {
703	+	background: transparent !important;
704	+	color: #000000 !important;
705	+	-webkit-text-fill-color: #000000 !important;
706	+	caret-color: #000000 !important;
707	+	}
708	+
709	+	[class*="textarea___XzI3Mz"]::placeholder {
710	+	color: #808080 !important;
711	+	-webkit-text-fill-color: #808080 !important;
712	+	}
713	+
714	+	/* Emoji button inside edit box */
715	+	[class*="buttonCompact___XzMzZT"],
716	+	[class*="button___XzMzZT"] {
717	+	background: #c0c0c0 !important;
718	+	border-top: 2px solid #ffffff !important;
719	+	border-left: 2px solid #ffffff !important;
720	+	border-bottom: 2px solid #000000 !important;
721	+	border-right: 2px solid #000000 !important;
722	+	box-shadow: inset -1px -1px 0 #808080 !important;
723	+	border-radius: 0 !important;
724	+	color: #000000 !important;
725	+	}
726	+
727	+	[class*="buttonCompact___XzMzZT"]:hover,
728	+	[class*="button___XzMzZT"]:hover {
729	+	border-top: 2px solid #000000 !important;
730	+	border-left: 2px solid #000000 !important;
731	+	border-bottom: 2px solid #ffffff !important;
732	+	border-right: 2px solid #ffffff !important;
733	+	}
734	+
735	+	[class*="buttonContainerEditing___XzI3Mz"] {
736	+	background: transparent !important;
737	+	}
738	+
739	+	/* ─────────────────────────────────────────────────
740	+	* TEXTAREA
741	+	* ───────────────────────────────────────────────── */
742	+	[class*="textareaOuter"] {
743	+	background: #ffffff !important;
744	+	border-top: 2px solid #808080 !important;
745	+	border-left: 2px solid #808080 !important;
746	+	border-bottom: 2px solid #dfdfdf !important;
747	+	border-right: 2px solid #dfdfdf !important;
748	+	box-shadow: inset 1px 1px 0 #000000 !important;
749	+	border-radius: 0 !important;
750	+	margin: 4px !important;
751	+	}
752	+
753	+	[class*="textareaArea"] {
754	+	background: #c0c0c0 !important;
755	+	}
756	+
757	+	textarea[data-channel-textarea="true"] {
758	+	background: transparent !important;
759	+	color: #000000 !important;
760	+	-webkit-text-fill-color: #000000 !important;
761	+	caret-color: #000000 !important;
762	+	}
763	+
764	+	textarea[data-channel-textarea="true"]::placeholder {
765	+	color: #808080 !important;
766	+	-webkit-text-fill-color: #808080 !important;
767	+	opacity: 1 !important;
768	+	}
769	+
770	+	[class*="placeholder"] {
771	+	color: #808080 !important;
772	+	-webkit-text-fill-color: #808080 !important;
773	+	opacity: 1 !important;
774	+	}
775	+
776	+	/* ────────────────────�────────────────────────────
777	+	* MESSAGE BUBBLES
778	+	* ───────────────────────────────────────────────── */
779	+	[class*="messageContent"] {
780	+	background: rgba(192,192,192,0.92) !important;
781	+	border-top: 2px solid #ffffff !important;
782	+	border-left: 2px solid #ffffff !important;
783	+	border-bottom: 2px solid #000000 !important;
784	+	border-right: 2px solid #000000 !important;
785	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf, 2px 2px 0 rgba(0,0,0,0.3) !important;
786	+	border-radius: 0 !important;
787	+	padding: 5px 10px !important;
788	+	backdrop-filter: none !important;
789	+	color: #000000 !important;
790	+	}
791	+
792	+	[class="messageContent"] {
793	+	color: #000000 !important;
794	+	text-shadow: none !important;
795	+	}
796	+
797	+	/* Code blocks (triple backtick) */
798	+	[class*="messageContent"] pre,
799	+	[class*="messageContent"] code,
800	+	pre[class*="hljs"],
801	+	code[class*="hljs"],
802	+	[class*="codeBlock"],
803	+	[class*="markup___"] pre,
804	+	[class*="markup___"] code {
805	+	background: #ffffff !important;
806	+	color: #000000 !important;
807	+	-webkit-text-fill-color: #000000 !important;
808	+	border-top: 2px solid #808080 !important;
809	+	border-left: 2px solid #808080 !important;
810	+	border-bottom: 2px solid #dfdfdf !important;
811	+	border-right: 2px solid #dfdfdf !important;
812	+	box-shadow: inset 1px 1px 0 #000000 !important;
813	+	border-radius: 0 !important;
814	+	font-family: monospace !important;
815	+	padding: 6px 8px !important;
816	+	}
817	+
818	+	/* Inline backtick code */
819	+	[class*="messageContent"] code:not(pre code),
820	+	[class*="markup___"] code:not(pre code) {
821	+	background: #dfdfdf !important;
822	+	color: #000000 !important;
823	+	-webkit-text-fill-color: #000000 !important;
824	+	border-top: 1px solid #808080 !important;
825	+	border-left: 1px solid #808080 !important;
826	+	border-bottom: 1px solid #ffffff !important;
827	+	border-right: 1px solid #ffffff !important;
828	+	box-shadow: none !important;
829	+	padding: 1px 4px !important;
830	+	font-family: monospace !important;
831	+	}
832	+
833	+	/* Syntax highlight token colors — readable on white */
834	+	.hljs-keyword, .hljs-selector-tag, .hljs-built_in { color: #800080 !important; -webkit-text-fill-color: #800080 !important; }
835	+	.hljs-string, .hljs-attr { color: #800000 !important; -webkit-text-fill-color: #800000 !important; }
836	+	.hljs-number, .hljs-literal { color: #008000 !important; -webkit-text-fill-color: #008000 !important; }
837	+	.hljs-comment { color: #808080 !important; -webkit-text-fill-color: #808080 !important; font-style: italic !important; }
838	+	.hljs-function, .hljs-title { color: #800080 !important; -webkit-text-fill-color: #800080 !important; }
839	+	.hljs-variable, .hljs-name { color: #000000 !important; -webkit-text-fill-color: #000000 !important; }
840	+
841	+	[class*="username___"],
842	+	[class*="usernameBlock"] {
843	+	color: #800080 !important;
844	+	}
845	+
846	+	[class*="timestamp"] {
847	+	color: #808080 !important;
848	+	}
849	+
850	+	/* ─────────────────────────────────────────────────
851	+	* PROFILE POPOUT (quick card on member click)
852	+	* ───────────────────────────────────────────────── */
853	+	[class*="popout___XzkxYm"] {
854	+	background: #c0c0c0 !important;
855	+	border-top: 2px solid #ffffff !important;
856	+	border-left: 2px solid #ffffff !important;
857	+	border-bottom: 2px solid #000000 !important;
858	+	border-right: 2px solid #000000 !important;
859	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf, 4px 4px 0 #000000 !important;
860	+	border-radius: 0 !important;
861	+	}
862	+
863	+	/* Profile card inner container */
864	+	[class*="profileCard___XzE1MW"] {
865	+	background: #c0c0c0 !important;
866	+	border: none !important;
867	+	border-radius: 0 !important;
868	+	}
869	+
870	+	/* Banner area — W98 title bar gradient */
871	+	[class*="headerSection___XzU1Zj"] {
872	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
873	+	border-bottom: 2px solid #000000 !important;
874	+	}
875	+
876	+	[class*="bannerWrapper___XzU1Zj"] {
877	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
878	+	}
879	+
880	+	[class*="banner___XzU1Zj"] {
881	+	opacity: 0.25 !important;
882	+	}
883	+
884	+	/* Content area */
885	+	[class*="contentSection___XzRiYj"] {
886	+	background: #c0c0c0 !important;
887	+	border-radius: 0 !important;
888	+	padding: 8px !important;
889	+	}
890	+
891	+	/* Name button */
892	+	[class*="nameButton___YjA5MD"] {
893	+	color: #000000 !important;
894	+	}
895	+
896	+	/* Username tag */
897	+	[class*="usernameRow___YjA5MD"] button,
898	+	[class*="usernameButton___YjA5MD"] {
899	+	color: #444444 !important;
900	+	}
901	+
902	+	/* Membership info */
903	+	[class*="membershipContainer___YzQ4NT"],
904	+	[class*="membershipTitle___YzQ4NT"],
905	+	[class*="membershipDateText___YzQ4NT"] {
906	+	color: #000000 !important;
907	+	}
908	+
909	+	/* Action buttons (note, copy ID) */
910	+	[class*="noteButton___XzkwMW"],
911	+	[class*="copyIdButton___XzkwMW"] {
912	+	background: #c0c0c0 !important;
913	+	border-top: 2px solid #ffffff !important;
914	+	border-left: 2px solid #ffffff !important;
915	+	border-bottom: 2px solid #000000 !important;
916	+	border-right: 2px solid #000000 !important;
917	+	box-shadow: inset -1px -1px 0 #808080 !important;
918	+	border-radius: 0 !important;
919	+	color: #000000 !important;
920	+	}
921	+
922	+	[class*="noteButton___XzkwMW"]:hover,
923	+	[class*="copyIdButton___XzkwMW"]:hover {
924	+	border-top: 2px solid #000000 !important;
925	+	border-left: 2px solid #000000 !important;
926	+	border-bottom: 2px solid #ffffff !important;
927	+	border-right: 2px solid #ffffff !important;
928	+	}
929	+
930	+	/* Footer section */
931	+	[class*="footerSection___ZjVlMW"] {
932	+	background: #c0c0c0 !important;
933	+	border-top: 2px solid #808080 !important;
934	+	border-radius: 0 !important;
935	+	padding: 8px !important;
936	+	}
937	+
938	+	/* ─────────────────────────────────────────────────
939	+	* SHARED BUTTON MODULE (Message, Friend, etc.)
940	+	* ───────────────────────────────────────────────── */
941	+	[class*="button___Yzg1Yz"] {
942	+	border-radius: 0 !important;
943	+	transition: none !important;
944	+	}
945	+
946	+	[class="button___Yzg1Yz"][class="primary___Yzg1Yz"] {
947	+	background: #c0c0c0 !important;
948	+	border-top: 2px solid #ffffff !important;
949	+	border-left: 2px solid #ffffff !important;
950	+	border-bottom: 2px solid #000000 !important;
951	+	border-right: 2px solid #000000 !important;
952	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
953	+	color: #000000 !important;
954	+	}
955	+
956	+	[class="button___Yzg1Yz"][class="primary___Yzg1Yz"]:hover {
957	+	background: #800080 !important;
958	+	border-top: 2px solid #000000 !important;
959	+	border-left: 2px solid #000000 !important;
960	+	border-bottom: 2px solid #ffffff !important;
961	+	border-right: 2px solid #ffffff !important;
962	+	color: #ffffff !important;
963	+	}
964	+
965	+	[class="button___Yzg1Yz"][class="primary___Yzg1Yz"]:hover * {
966	+	color: #ffffff !important;
967	+	}
968	+
969	+	[class="button___Yzg1Yz"][class="secondary___Yzg1Yz"] {
970	+	background: #c0c0c0 !important;
971	+	border-top: 2px solid #ffffff !important;
972	+	border-left: 2px solid #ffffff !important;
973	+	border-bottom: 2px solid #000000 !important;
974	+	border-right: 2px solid #000000 !important;
975	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
976	+	color: #000000 !important;
977	+	}
978	+
979	+	[class="button___Yzg1Yz"][class="secondary___Yzg1Yz"]:hover {
980	+	background: #c0c0c0 !important;
981	+	border-top: 2px solid #000000 !important;
982	+	border-left: 2px solid #000000 !important;
983	+	border-bottom: 2px solid #ffffff !important;
984	+	border-right: 2px solid #ffffff !important;
985	+	outline: 1px dotted #800080 !important;
986	+	outline-offset: -3px !important;
987	+	}
988	+
989	+	/* ─────────────────────────────────────────────────
990	+	* FULL USER PROFILE MODAL
991	+	* ─────────────�─────────────────────────────────── */
992	+
993	+	/* Modal surface/backdrop */
994	+	[class*="surface___XzA4MW"] {
995	+	border-top: 2px solid #ffffff !important;
996	+	border-left: 2px solid #ffffff !important;
997	+	border-bottom: 2px solid #000000 !important;
998	+	border-right: 2px solid #000000 !important;
999	+	box-shadow: 4px 4px 0 #000000 !important;
1000	+	border-radius: 0 !important;
1001	+	overflow: hidden !important;
1002	+	}
1003	+
1004	+	/* Modal root and container */
1005	+	[class*="modalRoot___XzU2Zj"],
1006	+	[class*="modalContainer___XzU2Zj"] {
1007	+	background: #c0c0c0 !important;
1008	+	border: none !important;
1009	+	border-radius: 0 !important;
1010	+	}
1011	+
1012	+	/* Banner */
1013	+	[class*="bannerContainer___XzU2Zj"] {
1014	+	border-bottom: 2px solid #000000 !important;
1015	+	}
1016	+
1017	+	[class*="bannerImage___XzU2Zj"] {
1018	+	opacity: 0.3 !important;
1019	+	}
1020	+
1021	+	/* Header — W95 title bar */
1022	+	[class*="headerContainer___XzU2Zj"] {
1023	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
1024	+	border-bottom: 2px solid #000000 !important;
1025	+	padding: 4px 8px !important;
1026	+	}
1027	+
1028	+	/* Action buttons row */
1029	+	[class*="actionButtonsContainer___XzU2Zj"],
1030	+	[class*="actionButtons___XzU2Zj"] {
1031	+	background: transparent !important;
1032	+	}
1033	+
1034	+	/* Content container */
1035	+	[class*="contentContainer___XzU2Zj"] {
1036	+	background: #c0c0c0 !important;
1037	+	}
1038	+
1039	+	/* User name */
1040	+	[class*="userName___XzU2Zj"] {
1041	+	color: #000000 !important;
1042	+	text-shadow: none !important;
1043	+	}
1044	+
1045	+	/* Username tag row */
1046	+	[class*="usernameRow___XzU2Zj"] {
1047	+	color: #444444 !important;
1048	+	}
1049	+
1050	+	/* Pronouns */
1051	+	[class*="pronouns___XzU2Zj"] {
1052	+	color: #444444 !important;
1053	+	}
1054	+
1055	+	/* Tabs — Overview / Mutual Friends */
1056	+	[class*="tabsWrapper___XzU2Zj"] {
1057	+	background: #c0c0c0 !important;
1058	+	border-bottom: 2px solid #808080 !important;
1059	+	}
1060	+
1061	+	[class*="tab___XzIxNj"] {
1062	+	background: #c0c0c0 !important;
1063	+	border-top: 2px solid #ffffff !important;
1064	+	border-left: 2px solid #ffffff !important;
1065	+	border-bottom: 2px solid #000000 !important;
1066	+	border-right: 2px solid #000000 !important;
1067	+	box-shadow: inset -1px -1px 0 #808080 !important;
1068	+	border-radius: 0 !important;
1069	+	color: #000000 !important;
1070	+	margin-right: 2px !important;
1071	+	transition: none !important;
1072	+	}
1073	+
1074	+	[class*="tab___XzIxNj"]:hover {
1075	+	background: #c0c0c0 !important;
1076	+	outline: 1px dotted #800080 !important;
1077	+	outline-offset: -2px !important;
1078	+	}
1079	+
1080	+	[class*="selected___XzIxNj"] {
1081	+	background: #c0c0c0 !important;
1082	+	border-top: 2px solid #000000 !important;
1083	+	border-left: 2px solid #000000 !important;
1084	+	border-bottom: 2px solid #ffffff !important;
1085	+	border-right: 2px solid #ffffff !important;
1086	+	box-shadow: inset 1px 1px 0 #808080 !important;
1087	+	color: #000000 !important;
1088	+	}
1089	+
1090	+	/* Profile content area */
1091	+	[class*="profileContentWrapper___XzU2Zj"],
1092	+	[class*="profileContent___XzU2Zj"],
1093	+	[class*="profileContentHeader___XzU2Zj"] {
1094	+	background: #c0c0c0 !important;
1095	+	}
1096	+
1097	+	/* Bio */
1098	+	[class*="bioContainer___YzQ4NT"] {
1099	+	background: #ffffff !important;
1100	+	border-top: 2px solid #808080 !important;
1101	+	border-left: 2px solid #808080 !important;
1102	+	border-bottom: 2px solid #dfdfdf !important;
1103	+	border-right: 2px solid #dfdfdf !important;
1104	+	box-shadow: inset 1px 1px 0 #000000 !important;
1105	+	padding: 6px 8px !important;
1106	+	border-radius: 0 !important;
1107	+	color: #000000 !important;
1108	+	}
1109	+
1110	+	[class*="bio___XzBhZT"],
1111	+	[class="bio___XzBhZT"] {
1112	+	color: #000000 !important;
1113	+	}
1114	+
1115	+	[class*="link___XzBhZT"] {
1116	+	color: #800080 !important;
1117	+	text-decoration: underline !important;
1118	+	}
1119	+
1120	+	/* Roles */
1121	+	[class*="rolesContainer___YzQ4NT"] {
1122	+	background: transparent !important;
1123	+	}
1124	+
1125	+	[class*="rolesHeader___YzQ4NT"],
1126	+	[class*="rolesTitle___YzQ4NT"] {
1127	+	color: #000000 !important;
1128	+	text-transform: uppercase !important;
1129	+	letter-spacing: 0.05em !important;
1130	+	border-bottom: 1px solid #808080 !important;
1131	+	}
1132	+
1133	+	[class*="roleBadge___YWExM2"] {
1134	+	background: #c0c0c0 !important;
1135	+	border-top: 2px solid #ffffff !important;
1136	+	border-left: 2px solid #ffffff !important;
1137	+	border-bottom: 2px solid #000000 !important;
1138	+	border-right: 2px solid #000000 !important;
1139	+	box-shadow: inset -1px -1px 0 #808080 !important;
1140	+	border-radius: 0 !important;
1141	+	color: #000000 !important;
1142	+	}
1143	+
1144	+	[class*="roleName___YWExM2"] {
1145	+	color: #000000 !important;
1146	+	}
1147	+
1148	+	/* Connections */
1149	+	[class*="connectionsContainer___YzQ4NT"] {
1150	+	background: transparent !important;
1151	+	}
1152	+
1153	+	[class*="connectionsTitle___YzQ4NT"] {
1154	+	color: #000000 !important;
1155	+	text-transform: uppercase !important;
1156	+	letter-spacing: 0.05em !important;
1157	+	border-bottom: 1px solid #808080 !important;
1158	+	}
1159	+
1160	+	[class*="connectionCard___YzQ4NT"] {
1161	+	background: #c0c0c0 !important;
1162	+	border-top: 2px solid #ffffff !important;
1163	+	border-left: 2px solid #ffffff !important;
1164	+	border-bottom: 2px solid #000000 !important;
1165	+	border-right: 2px solid #000000 !important;
1166	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1167	+	border-radius: 0 !important;
1168	+	}
1169	+
1170	+	[class*="connectionCardName___YzQ4NT"],
1171	+	[class*="connectionCardNameRow___YzQ4NT"] {
1172	+	color: #000000 !important;
1173	+	}
1174	+
1175	+	[class*="connectionIcon___YzQ4NT"] {
1176	+	color: #800080 !important;
1177	+	}
1178	+
1179	+	/* Note textarea */
1180	+	[class*="noteLabel___XzU2Zj"] {
1181	+	color: #000000 !important;
1182	+	text-transform: uppercase !important;
1183	+	}
1184	+
1185	+	[class*="noteTextarea___XzU2Zj"] {
1186	+	background: #ffffff !important;
1187	+	color: #000000 !important;
1188	+	border-top: 2px solid #808080 !important;
1189	+	border-left: 2px solid #808080 !important;
1190	+	border-bottom: 2px solid #dfdfdf !important;
1191	+	border-right: 2px solid #dfdfdf !important;
1192	+	box-shadow: inset 1px 1px 0 #000000 !important;
1193	+	border-radius: 0 !important;
1194	+	}
1195	+
1196	+	[class*="noteTextarea___XzU2Zj"]::placeholder {
1197	+	color: #808080 !important;
1198	+	}
1199	+
1200	+	/* ─────────────────────────────────────────────────
1201	+	* CONTEXT MENU
1202	+	* ───────────────────────────────────────────────── */
1203	+	[class*="contextMenu___Yzg0NW"] {
1204	+	background: #c0c0c0 !important;
1205	+	border-top: 2px solid #ffffff !important;
1206	+	border-left: 2px solid #ffffff !important;
1207	+	border-bottom: 2px solid #000000 !important;
1208	+	border-right: 2px solid #000000 !important;
1209	+	box-shadow: 2px 2px 0 #000000 !important;
1210	+	border-radius: 0 !important;
1211	+	padding: 2px !important;
1212	+	}
1213	+
1214	+	[class*="item___Yzg0NW"] {
1215	+	background: transparent !important;
1216	+	color: #000000 !important;
1217	+	border-radius: 0 !important;
1218	+	padding: 3px 20px !important;
1219	+	}
1220	+
1221	+	[class*="item___Yzg0NW"]:hover,
1222	+	[class*="item___Yzg0NW"]:focus {
1223	+	background: #800080 !important;
1224	+	color: #ffffff !important;
1225	+	outline: none !important;
1226	+	}
1227	+
1228	+	[class="item___Yzg0NW"]:hover ,
1229	+	[class="item___Yzg0NW"]:focus { color: #ffffff !important; }
1230	+
1231	+	[class*="label___YjQzN2"] {
1232	+	color: inherit !important;
1233	+	}
1234	+
1235	+	[class*="itemIcon___Yzg0NW"] svg { color: #000000 !important; width: 14px !important; height: 14px !important; }
1236	+	[class="item___Yzg0NW"]:hover [class="itemIcon___Yzg0NW"] svg { color: #ffffff !important; }
1237	+	[class*="danger___Yzg0NW"] { color: #800000 !important; }
1238	+	[class*="danger___Yzg0NW"]:hover { background: #800000 !important; }
1239	+	[class="danger___Yzg0NW"]:hover { color: #ffffff !important; }
1240	+	[class*="submenuCaret___Yzg0NW"] { color: #000000 !important; }
1241	+	[class="item___Yzg0NW"]:hover [class="submenuCaret___Yzg0NW"] { color: #ffffff !important; }
1242	+	[class*="separator___Yzg0NW"] {
1243	+	height: 5px !important;
1244	+	background: transparent !important;
1245	+	border: none !important;
1246	+	border-top: 1px solid #808080 !important;
1247	+	border-bottom: 1px solid #ffffff !important;
1248	+	margin: 0 4px !important;
1249	+	}
1250	+
1251	+	/* ─────────────────────────────────────────────────
1252	+	* FAVORITES & DISCOVERY — main content area
1253	+	* ───────────────────────────────────────────────── */
1254	+
1255	+	/* Main content area background */
1256	+	[class*="guildMainContent___Xzk4ZG"] {
1257	+	background: #c0c0c0 !important;
1258	+	}
1259	+
1260	+	/* Favorites welcome section */
1261	+	[class*="welcomeSection___XzMxOT"] {
1262	+	background: #c0c0c0 !important;
1263	+	}
1264	+
1265	+	[class*="iconWrapper___XzMxOT"] {
1266	+	background: #c0c0c0 !important;
1267	+	border-top: 2px solid #ffffff !important;
1268	+	border-left: 2px solid #ffffff !important;
1269	+	border-bottom: 2px solid #000000 !important;
1270	+	border-right: 2px solid #000000 !important;
1271	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1272	+	border-radius: 0 !important;
1273	+	padding: 12px !important;
1274	+	color: #800080 !important;
1275	+	}
1276	+
1277	+	[class*="icon___XzMxOT"] {
1278	+	color: #800080 !important;
1279	+	}
1280	+
1281	+	[class*="heading___XzMxOT"] {
1282	+	color: #000000 !important;
1283	+	text-shadow: none !important;
1284	+	}
1285	+
1286	+	[class*="description___XzMxOT"],
1287	+	[class*="tip___XzMxOT"] {
1288	+	color: #000000 !important;
1289	+	}
1290	+
1291	+	[class*="tip___XzMxOT"] {
1292	+	color: #444444 !important;
1293	+	font-style: italic !important;
1294	+	}
1295	+
1296	+	/* Favorites guild header (top-left "Favorites" title bar) */
1297	+	[class*="headerIconContainer___Xzk2MT"] {
1298	+	background: transparent !important;
1299	+	}
1300	+
1301	+	[class*="headerIcon___Xzk2MT"] {
1302	+	color: #ffffff !important;
1303	+	}
1304	+
1305	+	/* Channel list skeleton (gray placeholder bars) */
1306	+	[class*="skeletonContent___XzRhYT"],
1307	+	[class*="skeletonCategory___XzRhYT"],
1308	+	[class*="skeletonChannel___XzRhYT"] {
1309	+	background: transparent !important;
1310	+	}
1311	+
1312	+	[class*="skeletonCategoryPill___XzRhYT"],
1313	+	[class*="skeletonChannelPill___XzRhYT"] {
1314	+	background: #a0a0a0 !important;
1315	+	border-radius: 0 !important;
1316	+	}
1317	+
1318	+	/* ─────────────────────────────────────────────────
1319	+	* DISCOVERY (Explore Communities) — left sidebar
1320	+	* ───────────────────────────────────────────────── */
1321	+
1322	+	[class*="guildNavbarContainer___Xzc4Nm"] {
1323	+	background: #c0c0c0 !important;
1324	+	border-right: 2px solid #808080 !important;
1325	+	}
1326	+
1327	+	/* "Explore" header — reuses ZGNlOD which is already navy, good */
1328	+	[class*="headerIconContainer___XzBlOG"] {
1329	+	background: transparent !important;
1330	+	}
1331	+
1332	+	[class*="headerIcon___XzBlOG"] {
1333	+	color: #ffffff !important;
1334	+	}
1335	+
1336	+	/* Discovery sidebar container */
1337	+	[class*="container___XzU1Nj"] {
1338	+	background: #c0c0c0 !important;
1339	+	}
1340	+
1341	+	[class*="categoryList___XzU1Nj"] {
1342	+	background: #c0c0c0 !important;
1343	+	padding: 4px !important;
1344	+	}
1345	+
1346	+	/* Category filter buttons */
1347	+	button[class*="categoryItem___XzU1Nj"] {
1348	+	background: #c0c0c0 !important;
1349	+	border-top: 2px solid #ffffff !important;
1350	+	border-left: 2px solid #ffffff !important;
1351	+	border-bottom: 2px solid #000000 !important;
1352	+	border-right: 2px solid #000000 !important;
1353	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1354	+	border-radius: 0 !important;
1355	+	color: #000000 !important;
1356	+	margin: 2px 0 !important;
1357	+	width: calc(100% - 4px) !important;
1358	+	text-align: left !important;
1359	+	padding: 4px 8px !important;
1360	+	transition: none !important;
1361	+	}
1362	+
1363	+	button[class*="categoryItem___XzU1Nj"]:hover {
1364	+	background: #c0c0c0 !important;
1365	+	outline: 1px dotted #800080 !important;
1366	+	outline-offset: -2px !important;
1367	+	}
1368	+
1369	+	/* Active/selected category — sunken */
1370	+	button[class*="categoryItemActive___XzU1Nj"] {
1371	+	background: #c0c0c0 !important;
1372	+	border-top: 2px solid #000000 !important;
1373	+	border-left: 2px solid #000000 !important;
1374	+	border-bottom: 2px solid #ffffff !important;
1375	+	border-right: 2px solid #ffffff !important;
1376	+	box-shadow: inset 1px 1px 0 #808080, inset -1px -1px 0 #dfdfdf !important;
1377	+	color: #000000 !important;
1378	+	text-decoration: underline !important;
1379	+	}
1380	+
1381	+	/* ─────────────────────────────────────────────────
1382	+	* DISCOVERY — main content grid + cards
1383	+	* ───────────────────────────────────────────────── */
1384	+
1385	+	[class*="container___ZTBkMm"] {
1386	+	background: #c0c0c0 !important;
1387	+	}
1388	+
1389	+	/* Hero search area */
1390	+	[class*="hero___ZTBkMm"] {
1391	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
1392	+	border-bottom: 2px solid #000000 !important;
1393	+	}
1394	+
1395	+	[class*="heroPattern___ZTBkMm"] {
1396	+	opacity: 0.1 !important;
1397	+	}
1398	+
1399	+	[class*="heroContent___ZTBkMm"],
1400	+	[class*="heroControls___ZTBkMm"] {
1401	+	background: transparent !important;
1402	+	}
1403	+
1404	+	/* Search input in hero */
1405	+	[class*="inputContainer___ZGQ3MT"],
1406	+	[class*="inputWrapper___ZGQ3MT"] {
1407	+	background: #ffffff !important;
1408	+	border-top: 2px solid #808080 !important;
1409	+	border-left: 2px solid #808080 !important;
1410	+	border-bottom: 2px solid #dfdfdf !important;
1411	+	border-right: 2px solid #dfdfdf !important;
1412	+	box-shadow: inset 1px 1px 0 #000000 !important;
1413	+	border-radius: 0 !important;
1414	+	}
1415	+
1416	+	[class*="input___ZGQ3MT"],
1417	+	[class*="searchInput___ZTBkMm"] {
1418	+	background: transparent !important;
1419	+	color: #000000 !important;
1420	+	-webkit-text-fill-color: #000000 !important;
1421	+	}
1422	+
1423	+	[class*="input___ZGQ3MT"]::placeholder {
1424	+	color: #808080 !important;
1425	+	-webkit-text-fill-color: #808080 !important;
1426	+	}
1427	+
1428	+	[class*="leftIcon___ZGQ3MT"] {
1429	+	color: #800080 !important;
1430	+	}
1431	+
1432	+	/* Content grid */
1433	+	[class*="content___ZTBkMm"],
1434	+	[class*="grid___ZTBkMm"] {
1435	+	background: #c0c0c0 !important;
1436	+	}
1437	+
1438	+	/* Guild cards */
1439	+	[class*="card___YzBjMm"] {
1440	+	background: #c0c0c0 !important;
1441	+	border-top: 2px solid #ffffff !important;
1442	+	border-left: 2px solid #ffffff !important;
1443	+	border-bottom: 2px solid #000000 !important;
1444	+	border-right: 2px solid #000000 !important;
1445	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1446	+	border-radius: 0 !important;
1447	+	transition: none !important;
1448	+	}
1449	+
1450	+	[class*="card___YzBjMm"]:hover {
1451	+	outline: 1px dotted #800080 !important;
1452	+	outline-offset: -2px !important;
1453	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1454	+	}
1455	+
1456	+	[class*="cardBody___YzBjMm"],
1457	+	[class*="footer___YzBjMm"] {
1458	+	background: transparent !important;
1459	+	}
1460	+
1461	+	[class*="footer___YzBjMm"] {
1462	+	border-top: 1px solid #808080 !important;
1463	+	padding-top: 6px !important;
1464	+	}
1465	+
1466	+	[class*="name___YzBjMm"] {
1467	+	color: #000000 !important;
1468	+	text-shadow: none !important;
1469	+	}
1470	+
1471	+	[class*="category___YzBjMm"] {
1472	+	color: #800080 !important;
1473	+	text-transform: uppercase !important;
1474	+	letter-spacing: 0.05em !important;
1475	+	}
1476	+
1477	+	[class*="description___YzBjMm"] {
1478	+	color: #000000 !important;
1479	+	}
1480	+
1481	+	[class*="statText___YzBjMm"] {
1482	+	color: #444444 !important;
1483	+	}
1484	+
1485	+	/* ─────────────────────────────────────────────────
1486	+	* ADD COMMUNITY MODAL (XzNjNz)
1487	+	* ───────────────────────────────────────────────── */
1488	+
1489	+	/* Modal surface already styled via XzA4MW, content area: */
1490	+	[class*="content___XzNjNz"],
1491	+	[class*="landingContainer___XzNjNz"] {
1492	+	background: #c0c0c0 !important;
1493	+	}
1494	+
1495	+	[class*="landingContainer___XzNjNz"] p {
1496	+	color: #000000 !important;
1497	+	}
1498	+
1499	+	/* Modal header */
1500	+	[class="layout___XzA4MW"][class="header___XzA4MW"] {
1501	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
1502	+	border-bottom: 2px solid #000000 !important;
1503	+	border-radius: 0 !important;
1504	+	}
1505	+
1506	+	[class*="headerText___XzA4MW"] h3 {
1507	+	color: #ffffff !important;
1508	+	text-shadow: 1px 1px 0 #000040 !important;
1509	+	}
1510	+
1511	+	/* Close button in modal header */
1512	+	[class="layout___XzA4MW"][class="header___XzA4MW"] button {
1513	+	background: #c0c0c0 !important;
1514	+	border-top: 2px solid #ffffff !important;
1515	+	border-left: 2px solid #ffffff !important;
1516	+	border-bottom: 2px solid #000000 !important;
1517	+	border-right: 2px solid #000000 !important;
1518	+	box-shadow: inset -1px -1px 0 #808080 !important;
1519	+	border-radius: 0 !important;
1520	+	color: #000000 !important;
1521	+	width: 16px !important;
1522	+	height: 14px !important;
1523	+	min-width: 16px !important;
1524	+	padding: 0 !important;
1525	+	}
1526	+
1527	+	[class="layout___XzA4MW"][class="header___XzA4MW"] button:hover {
1528	+	border-top: 2px solid #000000 !important;
1529	+	border-left: 2px solid #000000 !important;
1530	+	border-bottom: 2px solid #ffffff !important;
1531	+	border-right: 2px solid #ffffff !important;
1532	+	}
1533	+
1534	+	/* Action buttons: Create Community / Join Community / Import Template */
1535	+	button[class*="actionButton___XzNjNz"] {
1536	+	background: #c0c0c0 !important;
1537	+	border-top: 2px solid #ffffff !important;
1538	+	border-left: 2px solid #ffffff !important;
1539	+	border-bottom: 2px solid #000000 !important;
1540	+	border-right: 2px solid #000000 !important;
1541	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1542	+	border-radius: 0 !important;
1543	+	transition: none !important;
1544	+	}
1545	+
1546	+	button[class*="actionButton___XzNjNz"]:hover {
1547	+	background: #c0c0c0 !important;
1548	+	border-top: 2px solid #000000 !important;
1549	+	border-left: 2px solid #000000 !important;
1550	+	border-bottom: 2px solid #ffffff !important;
1551	+	border-right: 2px solid #ffffff !important;
1552	+	outline: 1px dotted #800080 !important;
1553	+	outline-offset: -3px !important;
1554	+	}
1555	+
1556	+	[class*="actionIcon___XzNjNz"] {
1557	+	background: #800080 !important;
1558	+	color: #ffffff !important;
1559	+	border-radius: 0 !important;
1560	+	padding: 8px !important;
1561	+	}
1562	+
1563	+	[class*="actionLabel___XzNjNz"] {
1564	+	color: #000000 !important;
1565	+	}
1566	+
1567	+	[class*="actionButtonsGroup___XzNjNz"],
1568	+	[class*="actionButtons___XzNjNz"] {
1569	+	background: transparent !important;
1570	+	}
1571	+
1572	+	/* ─────────────────────────────────────────────────
1573	+	* SETTINGS MODAL
1574	+	* ───────────────────────────────────────────────── */
1575	+	[class*="container___XzU3Zj"] { background: #c0c0c0 !important; }
1576	+
1577	+	[class*="desktopSidebar___XzU3Zj"],
1578	+	[class*="desktopSidebarInner___XzU3Zj"] {
1579	+	background: #c0c0c0 !important;
1580	+	border-right: 2px solid #808080 !important;
1581	+	}
1582	+
1583	+	[class*="sidebarCategoryTitle___XzU3Zj"] {
1584	+	color: #000000 !important;
1585	+	text-transform: uppercase !important;
1586	+	border-bottom: 1px solid #808080 !important;
1587	+	}
1588	+
1589	+	[class*="sidebarItem___XzU3Zj"] {
1590	+	color: #000000 !important;
1591	+	border-radius: 0 !important;
1592	+	background: transparent !important;
1593	+	}
1594	+
1595	+	[class*="sidebarItem___XzU3Zj"]:hover {
1596	+	background: #800080 !important;
1597	+	color: #ffffff !important;
1598	+	}
1599	+
1600	+	[class="sidebarItem___XzU3Zj"]:hover { color: #ffffff !important; }
1601	+
1602	+	[class*="sidebarItemSelected___XzU3Zj"],
1603	+	[class="sidebarItemSelected___XzU3Zj"] {
1604	+	background: #800080 !important;
1605	+	color: #ffffff !important;
1606	+	}
1607	+
1608	+	[class*="sidebarItemDanger___XzU3Zj"] { color: #800000 !important; }
1609	+
1610	+	[class*="desktopContent___XzU3Zj"],
1611	+	[class*="desktopContentCard___XzU3Zj"],
1612	+	[class*="desktopContentPad___XzU3Zj"] { background: #c0c0c0 !important; }
1613	+
1614	+	[class*="desktopHeader___XzU3Zj"] {
1615	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
1616	+	border-bottom: 2px solid #000000 !important;
1617	+	}
1618	+
1619	+	[class*="title___XzhlMD"],
1620	+	[class*="title___XzhkYm"] {
1621	+	color: #ffffff !important;
1622	+	}
1623	+
1624	+	[class*="desktopContent___XzU3Zj"] label,
1625	+	[class*="desktopContent___XzU3Zj"] p,
1626	+	[class*="desktopContent___XzU3Zj"] span,
1627	+	[class*="desktopContent___XzU3Zj"] div {
1628	+	color: #000000 !important;
1629	+	}
1630	+
1631	+	[class*="desktopContent___XzU3Zj"] input,
1632	+	[class*="desktopContent___XzU3Zj"] textarea {
1633	+	background: #ffffff !important;
1634	+	color: #000000 !important;
1635	+	-webkit-text-fill-color: #000000 !important;
1636	+	border-top: 2px solid #808080 !important;
1637	+	border-left: 2px solid #808080 !important;
1638	+	border-bottom: 2px solid #dfdfdf !important;
1639	+	border-right: 2px solid #dfdfdf !important;
1640	+	border-radius: 0 !important;
1641	+	}
1642	+
1643	+	[class*="legalLink___ZWQxYT"] { color: #800080 !important; }
1644	+	[class="sidebarFooter___XzU3Zj"] { color: #808080 !important; }
1645	+
1646	+	/* ═══════════════════════════════════════════════════════
1647	+	* VOICE CONNECTION STATUS AREA (user area / bottom panel)
1648	+	* ═══════════════════════════════════════════════════════ */
1649	+
1650	+	[class*="voiceConnectionWrapper___XzEyMT"],
1651	+	[class*="voiceConnectionContainer___XzRiYz"] {
1652	+	background: #c0c0c0 !important;
1653	+	border-top: 2px solid #808080 !important;
1654	+	}
1655	+
1656	+	/* "Voice Connected" status button */
1657	+	[class*="statusRow___XzRiYz"] {
1658	+	background: transparent !important;
1659	+	}
1660	+
1661	+	[class*="statusButton___XzRiYz"] {
1662	+	background: #c0c0c0 !important;
1663	+	border-top: 2px solid #ffffff !important;
1664	+	border-left: 2px solid #ffffff !important;
1665	+	border-bottom: 2px solid #000000 !important;
1666	+	border-right: 2px solid #000000 !important;
1667	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1668	+	border-radius: 0 !important;
1669	+	color: #000000 !important;
1670	+	transition: none !important;
1671	+	}
1672	+
1673	+	[class*="statusButton___XzRiYz"]:hover {
1674	+	border-top: 2px solid #000000 !important;
1675	+	border-left: 2px solid #000000 !important;
1676	+	border-bottom: 2px solid #ffffff !important;
1677	+	border-right: 2px solid #ffffff !important;
1678	+	outline: 1px dotted #800080 !important;
1679	+	outline-offset: -3px !important;
1680	+	}
1681	+
1682	+	/* Signal / ping icon — keep green */
1683	+	[class*="signalIcon___XzRiYz"] {
1684	+	color: #00aa00 !important;
1685	+	}
1686	+
1687	+	/* Noise suppression, disconnect, and other control buttons */
1688	+	[class*="controlButton___XzRiYz"],
1689	+	[class*="mediaButton___XzRiYz"] {
1690	+	background: #c0c0c0 !important;
1691	+	border-top: 2px solid #ffffff !important;
1692	+	border-left: 2px solid #ffffff !important;
1693	+	border-bottom: 2px solid #000000 !important;
1694	+	border-right: 2px solid #000000 !important;
1695	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1696	+	border-radius: 0 !important;
1697	+	color: #000000 !important;
1698	+	transition: none !important;
1699	+	}
1700	+
1701	+	[class*="controlButton___XzRiYz"]:hover,
1702	+	[class*="mediaButton___XzRiYz"]:hover {
1703	+	background: #c0c0c0 !important;
1704	+	border-top: 2px solid #000000 !important;
1705	+	border-left: 2px solid #000000 !important;
1706	+	border-bottom: 2px solid #ffffff !important;
1707	+	border-right: 2px solid #ffffff !important;
1708	+	}
1709	+
1710	+	/* Connection info text: channel name, connection ID */
1711	+	[class*="connectionInfo___XzRiYz"],
1712	+	[class*="channelSourceLink___XzRiYz"],
1713	+	[class*="connectionIdValue___XzRiYz"] {
1714	+	color: #000000 !important;
1715	+	text-shadow: none !important;
1716	+	}
1717	+
1718	+	[class*="channelSourceLink___XzRiYz"] {
1719	+	color: #800080 !important;
1720	+	text-decoration: underline !important;
1721	+	}
1722	+
1723	+	/* Avatar stack (participant mini-avatars) */
1724	+	[class*="channelAvatarStack___XzRiYz"] {
1725	+	background: transparent !important;
1726	+	}
1727	+
1728	+	/* ═══════════════════════════════════════════════════════
1729	+	* VOICE CALL PARTICIPANT GRID
1730	+	* ═══════════════════════════════════════════════════════ */
1731	+
1732	+	/* Root view — match chat wallpaper */
1733	+	[class*="root___XzdmOG"] {
1734	+	background: black !important;
1735	+	}
1736	+
1737	+	[class*="mainContent___XzdmOG"] {
1738	+	background: transparent !important;
1739	+	}
1740	+
1741	+	/* Grid viewport */
1742	+	[class*="gridViewport___XzYwZT"],
1743	+	[class*="grid___XzYwZT"] {
1744	+	background: transparent !important;
1745	+	}
1746	+
1747	+	/* Individual participant tiles */
1748	+	[class*="gridItem___XzYwZT"] {
1749	+	background: transparent !important;
1750	+	}
1751	+
1752	+	[class*="lkParticipantTile___XzdmOG"] {
1753	+	background: #c0c0c0 !important;
1754	+	border-top: 2px solid #ffffff !important;
1755	+	border-left: 2px solid #ffffff !important;
1756	+	border-bottom: 2px solid #000000 !important;
1757	+	border-right: 2px solid #000000 !important;
1758	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1759	+	border-radius: 0 !important;
1760	+	}
1761	+
1762	+	/* Avatar placeholder background inside tile */
1763	+	[class*="lkParticipantPlaceholder___XzdmOG"] {
1764	+	background: #a0a0a0 !important;
1765	+	border-radius: 0 !important;
1766	+	}
1767	+
1768	+	/* Avatar ring */
1769	+	[class*="avatarRing___XzdmMT"] {
1770	+	border-color: #800080 !important;
1771	+	border-radius: 50% !important;
1772	+	}
1773	+
1774	+	/* Name / metadata overlay at bottom of tile */
1775	+	[class*="lkParticipantMetadata___XzdmOG"] {
1776	+	background: linear-gradient(transparent, rgba(0,0,0,0.6)) !important;
1777	+	}
1778	+
1779	+	[class*="participantNameText___XzdmMT"] {
1780	+	color: #ffffff !important;
1781	+	text-shadow: 1px 1px 0 #000000 !important;
1782	+	}
1783	+
1784	+	[class*="participantConnectionText___XzdmMT"] {
1785	+	color: #c0c0c0 !important;
1786	+	text-shadow: 1px 1px 0 #000000 !important;
1787	+	}
1788	+
1789	+	/* Per-tile context menu button */
1790	+	[class*="menuButton___XzdmMT"] {
1791	+	background: #c0c0c0 !important;
1792	+	border-top: 2px solid #ffffff !important;
1793	+	border-left: 2px solid #ffffff !important;
1794	+	border-bottom: 2px solid #000000 !important;
1795	+	border-right: 2px solid #000000 !important;
1796	+	border-radius: 0 !important;
1797	+	color: #000000 !important;
1798	+	transition: none !important;
1799	+	}
1800	+
1801	+	/* Bottom control bar */
1802	+	[class*="container___XzgyOT"] {
1803	+	background: #c0c0c0 !important;
1804	+	border-top: 2px solid #808080 !important;
1805	+	box-shadow: none !important;
1806	+	}
1807	+
1808	+	[class*="button___XzgyOT"] {
1809	+	background: #c0c0c0 !important;
1810	+	border-top: 2px solid #ffffff !important;
1811	+	border-left: 2px solid #ffffff !important;
1812	+	border-bottom: 2px solid #000000 !important;
1813	+	border-right: 2px solid #000000 !important;
1814	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1815	+	border-radius: 0 !important;
1816	+	color: #000000 !important;
1817	+	transition: none !important;
1818	+	}
1819	+
1820	+	[class*="button___XzgyOT"]:hover {
1821	+	background: #c0c0c0 !important;
1822	+	border-top: 2px solid #000000 !important;
1823	+	border-left: 2px solid #000000 !important;
1824	+	border-bottom: 2px solid #ffffff !important;
1825	+	border-right: 2px solid #ffffff !important;
1826	+	outline: 1px dotted #800080 !important;
1827	+	outline-offset: -3px !important;
1828	+	}
1829	+
1830	+	/* Muted state — sunken/pressed button */
1831	+	[class*="buttonMuted___XzgyOT"] {
1832	+	background: #c0c0c0 !important;
1833	+	border-top: 2px solid #000000 !important;
1834	+	border-left: 2px solid #000000 !important;
1835	+	border-bottom: 2px solid #ffffff !important;
1836	+	border-right: 2px solid #ffffff !important;
1837	+	box-shadow: inset 1px 1px 0 #808080 !important;
1838	+	color: #800000 !important;
1839	+	}
1840	+
1841	+	/* Settings caret buttons */
1842	+	[class*="settingsButton___XzgyOT"] {
1843	+	background: #c0c0c0 !important;
1844	+	border-top: 2px solid #ffffff !important;
1845	+	border-left: 2px solid #ffffff !important;
1846	+	border-bottom: 2px solid #000000 !important;
1847	+	border-right: 2px solid #000000 !important;
1848	+	border-radius: 0 !important;
1849	+	color: #000000 !important;
1850	+	transition: none !important;
1851	+	}
1852	+
1853	+	/* Disconnect button — red W95 style */
1854	+	[class="button___XzgyOT"][class="disconnect"],
1855	+	[class="button___XzgyOT"][aria-label="Disconnect"],
1856	+	[class="button___XzgyOT"][aria-label="disconnect"] {
1857	+	background: #c0c0c0 !important;
1858	+	color: #800000 !important;
1859	+	border-top: 2px solid #ffffff !important;
1860	+	border-left: 2px solid #ffffff !important;
1861	+	border-bottom: 2px solid #000000 !important;
1862	+	border-right: 2px solid #000000 !important;
1863	+	}
1864	+
1865	+	/* Fullscreen button */
1866	+	[class*="fullscreenButtonWrap___XzdmOG"] button {
1867	+	background: #c0c0c0 !important;
1868	+	border-top: 2px solid #ffffff !important;
1869	+	border-left: 2px solid #ffffff !important;
1870	+	border-bottom: 2px solid #000000 !important;
1871	+	border-right: 2px solid #000000 !important;
1872	+	border-radius: 0 !important;
1873	+	color: #000000 !important;
1874	+	transition: none !important;
1875	+	}
1876	+
1877	+	/* Grey divider bar fix — any horizontal rule or separator in the voice view */
1878	+	[class*="root___XzdmOG"] hr,
1879	+	[class="root___XzdmOG"] [class="separator"],
1880	+	[class="root___XzdmOG"] [class="divider"] {
1881	+	background: #808080 !important;
1882	+	border: none !important;
1883	+	height: 2px !important;
1884	+	}
1885	+
1886	+	/* ══════════════════════════��═══════════════════════════
1887	+	* PICTURE-IN-PICTURE STREAMING OVERLAY
1888	+	* ═══════════════════════════════════════════════════════ */
1889	+
1890	+	[class*="container___ZjM0OD"] {
1891	+	background: #c0c0c0 !important;
1892	+	border-top: 2px solid #ffffff !important;
1893	+	border-left: 2px solid #ffffff !important;
1894	+	border-bottom: 2px solid #000000 !important;
1895	+	border-right: 2px solid #000000 !important;
1896	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1897	+	border-radius: 0 !important;
1898	+	}
1899	+
1900	+	/* Frozen/paused frame */
1901	+	[class*="frozenFrame___ZjM0OD"] {
1902	+	border-radius: 0 !important;
1903	+	opacity: 0.7 !important;
1904	+	}
1905	+
1906	+	/* Paused overlay */
1907	+	[class*="previewPausedOverlay___ZjM0OD"] {
1908	+	background: rgba(192, 192, 192, 0.92) !important;
1909	+	border-radius: 0 !important;
1910	+	}
1911	+
1912	+	[class*="previewPausedIcon___ZjM0OD"] {
1913	+	color: #800080 !important;
1914	+	}
1915	+
1916	+	[class*="previewPausedTextWrap___ZjM0OD"],
1917	+	[class="previewPausedTextWrap___ZjM0OD"] {
1918	+	color: #000000 !important;
1919	+	text-shadow: none !important;
1920	+	}
1921	+
1922	+	/* Hover overlay — header gradient */
1923	+	[class*="hoverOverlay___ZjM0OD"] {
1924	+	background: transparent !important;
1925	+	}
1926	+
1927	+	[class*="headerGradient___ZjM0OD"] {
1928	+	background: linear-gradient(180deg, rgba(0,0,128,0.9) 0%, transparent 100%) !important;
1929	+	}
1930	+
1931	+	[class*="headerContent___ZjM0OD"] {
1932	+	background: transparent !important;
1933	+	}
1934	+
1935	+	/* "Return to call" button */
1936	+	[class*="returnToCallButton___ZjM0OD"] {
1937	+	background: #c0c0c0 !important;
1938	+	border-top: 2px solid #ffffff !important;
1939	+	border-left: 2px solid #ffffff !important;
1940	+	border-bottom: 2px solid #000000 !important;
1941	+	border-right: 2px solid #000000 !important;
1942	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
1943	+	border-radius: 0 !important;
1944	+	transition: none !important;
1945	+	}
1946	+
1947	+	[class*="returnToCallButton___ZjM0OD"]:hover {
1948	+	border-top: 2px solid #000000 !important;
1949	+	border-left: 2px solid #000000 !important;
1950	+	border-bottom: 2px solid #ffffff !important;
1951	+	border-right: 2px solid #ffffff !important;
1952	+	}
1953	+
1954	+	[class*="returnToCallLabel___ZjM0OD"] {
1955	+	color: #000000 !important;
1956	+	}
1957	+
1958	+	[class*="returnToCallIcon___ZjM0OD"] {
1959	+	color: #800080 !important;
1960	+	}
1961	+
1962	+	/* Close button (X) */
1963	+	[class*="closeButton___ZjM0OD"] {
1964	+	background: #c0c0c0 !important;
1965	+	border-top: 2px solid #ffffff !important;
1966	+	border-left: 2px solid #ffffff !important;
1967	+	border-bottom: 2px solid #000000 !important;
1968	+	border-right: 2px solid #000000 !important;
1969	+	border-radius: 0 !important;
1970	+	color: #000000 !important;
1971	+	width: 16px !important;
1972	+	height: 14px !important;
1973	+	min-width: 16px !important;
1974	+	padding: 0 !important;
1975	+	transition: none !important;
1976	+	}
1977	+
1978	+	[class*="closeButton___ZjM0OD"]:hover {
1979	+	border-top: 2px solid #000000 !important;
1980	+	border-left: 2px solid #000000 !important;
1981	+	border-bottom: 2px solid #ffffff !important;
1982	+	border-right: 2px solid #ffffff !important;
1983	+	}
1984	+
1985	+	/* Footer gradient + streamer name */
1986	+	[class*="footerGradient___ZjM0OD"] {
1987	+	background: linear-gradient(0deg, rgba(0,0,128,0.9) 0%, transparent 100%) !important;
1988	+	}
1989	+
1990	+	[class*="footerContent___ZjM0OD"] {
1991	+	background: transparent !important;
1992	+	}
1993	+
1994	+	[class*="streamerName___ZjM0OD"] {
1995	+	color: #ffffff !important;
1996	+	text-shadow: 1px 1px 0 #000000 !important;
1997	+	}
1998	+
1999	+	/* Resize handles — W95 style gripper dots */
2000	+	[class*="resizeHandleTop___ZjM0OD"],
2001	+	[class*="resizeHandleBottom___ZjM0OD"],
2002	+	[class*="resizeHandleLeft___ZjM0OD"],
2003	+	[class*="resizeHandleRight___ZjM0OD"],
2004	+	[class*="resizeHandleTopLeft___ZjM0OD"],
2005	+	[class*="resizeHandleTopRight___ZjM0OD"],
2006	+	[class*="resizeHandleBottomLeft___ZjM0OD"],
2007	+	[class*="resizeHandleBottomRight___ZjM0OD"] {
2008	+	background: transparent !important;
2009	+	border: none !important;
2010	+	}
2011	+
2012	+	[class*="resizeHandleBottomRight___ZjM0OD"] {
2013	+	background-image: radial-gradient(circle, #808080 1px, transparent 1px) !important;
2014	+	background-size: 3px 3px !important;
2015	+	background-position: bottom right !important;
2016	+	background-repeat: repeat !important;
2017	+	width: 12px !important;
2018	+	height: 12px !important;
2019	+	}
2020	+
2021	+
2022	+	/* ═══════════════════════════════════════════════════════
2023	+	* WINDOWS SPLASH / LOADING SCREEN
2024	+	* ═══════════════════════════════════════════════════════ */
2025	+
2026	+	[class*="splashOverlay___ZTBkMm"] {
2027	+	background: black !important; /* Storm (VGA) only had a black desktop */
2028	+	display: flex !important;
2029	+	align-items: center !important;
2030	+	justify-content: center !important;
2031	+	}
2032	+
2033	+	[class*="topDragRegion___ZTBkMm"] {
2034	+	background: transparent !important;
2035	+	}
2036	+
2037	+	/* The window itself */
2038	+	[class*="splashContent___ZTBkMm"] {
2039	+	background: #c0c0c0 !important;
2040	+	border-top: 2px solid #ffffff !important;
2041	+	border-left: 2px solid #ffffff !important;
2042	+	border-bottom: 2px solid #000000 !important;
2043	+	border-right: 2px solid #000000 !important;
2044	+	box-shadow: inset -1px -1px 0 #808080, inset 1px 1px 0 #dfdfdf !important;
2045	+	border-radius: 0 !important;
2046	+	padding: 0 !important;
2047	+	width: 420px !important;
2048	+	display: flex !important;
2049	+	flex-direction: column !important;
2050	+	overflow: visible !important;
2051	+	}
2052	+
2053	+	/* Title bar via ::before */
2054	+	[class*="splashContent___ZTBkMm"]::before {
2055	+	content: "Fluxer" !important;
2056	+	display: flex !important;
2057	+	width: 99%;
2058	+	align: left !important;
2059	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
2060	+	color: #ffffff !important;
2061	+	padding: 3px 4px 3px 6px !important;
2062	+	text-shadow: 1px 1px 0 #000040 !important;
2063	+	flex-shrink: 0 !important;
2064	+	letter-spacing: 0 !important;
2065	+	}
2066	+
2067	+	/* Icon area */
2068	+
2069	+	/* Hide the Fluxer SVG icon pulse */
2070	+	[class*="iconPulse___ZTBkMm"] {
2071	+	display: none !important;
2072	+	}
2073	+
2074	+	/* Wordmark removed — logo image contains the text */
2075	+	[class*="iconWrapper___ZTBkMm"]::after {
2076	+	content: none !important;
2077	+	display: none !important;
2078	+	}
2079	+
2080	+	/* Quote / status area */
2081	+	[class*="quoteContainer___ZTBkMm"] {
2082	+	background: #c0c0c0 !important;
2083	+	padding: 10px 14px !important;
2084	+	border-bottom: 1px solid #808080 !important;
2085	+	display: flex !important;
2086	+	flex-direction: column !important;
2087	+	gap: 4px !important;
2088	+	}
2089	+
2090	+	[class*="quoteLink___ZTBkMm"] {
2091	+	color: #000000 !important;
2092	+	text-decoration: none !important;
2093	+	}
2094	+
2095	+	[class*="incidentCta___ZTBkMm"] {
2096	+	color: #800080 !important;
2097	+	text-decoration: underline !important;
2098	+	}
2099	+
2100	+	/* "Connecting" + progress bar */
2101	+	[class*="connectionStatus___ZTBkMm"] {
2102	+	background: #c0c0c0 !important;
2103	+	color: #000000 !important;
2104	+	text-transform: uppercase !important;
2105	+	letter-spacing: 0.05em !important;
2106	+	padding: 8px 14px 10px !important;
2107	+	margin: 0 !important;
2108	+	text-align: left !important;
2109	+	}
2110	+
2111	+	[class*="connectionStatus___ZTBkMm"]::after {
2112	+	content: "" !important;
2113	+	display: block !important;
2114	+	margin-top: 6px !important;
2115	+	height: 16px !important;
2116	+	background: repeating-linear-gradient(
2117	+	90deg,
2118	+	#800080 0px,
2119	+	#800080 10px,
2120	+	#c0c0c0 10px,
2121	+	#c0c0c0 12px
2122	+	) !important;
2123	+	border-top: 2px solid #808080 !important;
2124	+	border-left: 2px solid #808080 !important;
2125	+	border-bottom: 2px solid #ffffff !important;
2126	+	border-right: 2px solid #ffffff !important;
2127	+	animation: w98progress 1.4s steps(10, end) infinite !important;
2128	+	background-size: 220% 100% !important;
2129	+	}
2130	+
2131	+	@keyframes w98progress {
2132	+	0% { background-position: 0% 0%; }
2133	+	100% { background-position: -100% 0%; }
2134	+	}
2135	+
2136	+
2137	+	/* Desktop client title bar */
2138	+
2139	+	[class="NativeTitlebar"][class="module__titlebar"] {
2140	+	background: linear-gradient(90deg, #800080 0%, #388cb0 100%) !important;
2141	+	/* border-bottom: 1px solid #0e264a !important; */
2142	+	padding: 0 7px !important;
2143	+	}
2144	+
2145	+	/* Fluxer wordmark inside title bar */
2146	+	[class="NativeTitlebar"][class="module__wordmark"] {
2147	+	color: #ffffff !important;
2148	+	/* filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.5)) !important; */
2149	+	}
2150	+

jce 修订了这个 Gist 1771228677. 转到此修订

2 files changed, 3 insertions, 4 deletions

breeze-dark.scss

			@@ -1,4 +1,4 @@
1		-	* { border-radius: 5px !important; }
	1	+	* { border-radius: 5px !important; }
2	2
3	3		:root { --background-secondary: #141618; }
4	4		:root { --background-primary: #202326; }
			@@ -16,7 +16,7 @@
16	16		:root { --brand-primary-light: #3DAEE9; }
17	17		:root { --brand-primary-fill: #FCFCFC; }
18	18		:root { --status-online: #6EC137; }
19		-	:root { --status-idle: #FDBC4B; }
	19	+	:root { --status-idle: #C65C00; }
20	20		:root { --status-danger: #DA4453; }
21	21		:root { --status-dnd: #B03745; }
22	22		:root { --status-offline: #A1A9B1; }
			@@ -70,4 +70,3 @@
70	70		:root { --background-modifier-selected: #1E5774; }
71	71		:root { --text-primary: #FCFCFC; }
72	72		:root { --background-modifier-accent-focus: #3DAEE9; }
73		-

breeze-light.scss

			@@ -1,4 +1,4 @@
1		-	* { border-radius: 5px !important; }
	1	+	* { border-radius: 5px !important; }
2	2
3	3		:root { --background-primary: #EFF0F1; }
4	4		:root { --background-secondary: #FFFFFF; }

jce 修订了这个 Gist 1771228279. 转到此修订

1 file changed, 2 insertions, 1 deletion

breeze-dark.scss

			@@ -69,4 +69,5 @@
69	69		:root { --bg-table-row-even: #292C30; }
70	70		:root { --background-modifier-selected: #1E5774; }
71	71		:root { --text-primary: #FCFCFC; }
72		-	:root { --background-modifier-accent-focus: #A1A9B1; }
	72	+	:root { --background-modifier-accent-focus: #3DAEE9; }
	73	+

jce 修订了这个 Gist 1771227210. 转到此修订

1 file changed, 66 insertions

breeze-light.scss(文件已创建)

		@@ -0,0 +1,66 @@
1	+	* { border-radius: 5px !important; }
2	+
3	+	:root { --background-primary: #EFF0F1; }
4	+	:root { --background-secondary: #FFFFFF; }
5	+	:root { --background-secondary-alt: #F7F7F7; }
6	+	:root { --background-tertiary: #E3E5E7; }
7	+	:root { --background-textarea: #FFFFFF; }
8	+	:root { --background-header-primary: #DEE0E2; }
9	+	:root { --background-header-secondary: #EFF0F1; }
10	+	:root { --background-header-primary-hover: #E3E5E7; }
11	+	:root { --background-modifier-hover: #E3E5E7; }
12	+	:root { --background-modifier-accent: #707D8A; }
13	+	:root { --brand-primary: #3DAEE9; }
14	+	:root { --brand-secondary: #A3D4FA; }
15	+	:root { --brand-primary-light: #A3D4FA; }
16	+	:root { }
17	+	:root { --text-on-brand-primary: #232629; }
18	+	:root { --background-modifier-selected: #3DAEE9; }
19	+	:root { --text-primary-muted: #707D8A; }
20	+	:root { --text-chat-muted: #707D8A; }
21	+	:root { --text-tertiary-muted: #707D8A; }
22	+	:root { --border-color-focus: #3DAEE9; }
23	+	:root { --status-online: #27AE60; }
24	+	:root { --status-idle: #C65C00; }
25	+	:root { --status-dnd: #B03745; }
26	+	:root { --status-offline: #707D8A; }
27	+	:root { --status-danger: #DA4453; }
28	+	:root { --text-secondary: #707D8A; }
29	+	:root { --button-inverted-fill: #2A2E32; }
30	+	:root { --button-ghost-text: #232629; }
31	+	:root { --guild_list-foreground: #232629; }
32	+	:root { --text-primary: #232629; }
33	+	:root { --text-chat: #232629; }
34	+	:root { --button-secondary-fill: #A3D4FA; }
35	+	:root { --button-secondary-active-fill: #3DAEE9; }
36	+	:root { --button-secondary-text: #232629; }
37	+	:root { --button-secondary-active-text: #232629; }
38	+	:root { --button-inverted-text: #FCFCFC; }
39	+	:root { --button-outline-text: #232629; }
40	+	:root { --button-primary-text: #232629; }
41	+	:root { --button-danger-text: #232629; }
42	+	:root { --text-link: #2980B9; }
43	+	:root { --brand-primary-fill: #232629; }
44	+	:root { --accent-warning: #F67400; }
45	+	:root { --accent-danger: #DA4453; }
46	+	:root { --alert-note-color: #3DAEE9; }
47	+	:root { --alert-tip-color: #27AE60; }
48	+	:root { --accent-purple: #9B59B6; }
49	+	:root { --alert-warning-color: #F67400; }
50	+	:root { --alert-caution-color: #DA4453; }
51	+	:root { --alert-important-color: #9B59B6; }
52	+	:root { --markup-mention-text: #232629; }
53	+	:root { --markup-mention-fill: #A3D4FA; }
54	+	:root { --markup-interactive-hover-fill: #3DAEE9; }
55	+	:root { --markup-interactive-hover-text: #232629; }
56	+	:root { --button-primary-fill: #FCFCFC; }
57	+	:root { --button-primary-active-fill: #3DAEE9; }
58	+	:root { --button-danger-fill: #FCFCFC; }
59	+	:root { --button-danger-outline-border: #DA4453; }
60	+	:root { --button-danger-active-fill: #DA4453; }
61	+	:root { --button-danger-outline-text: #232629; }
62	+	:root { --button-danger-outline-active-fill: #DA4453; }
63	+	:root { --button-outline-border: #2A2E32; }
64	+	:root { --button-outline-active-fill: #3DAEE9; }
65	+	:root { --button-outline-active-border: #3DAEE9; }
66	+	:root { --background-modifier-accent-focus: #3DAEE9; }

jce 修订了这个 Gist 1771212752. 转到此修订

1 file changed, 72 insertions

breeze-dark.scss(文件已创建)

		@@ -0,0 +1,72 @@
1	+	* { border-radius: 5px !important; }
2	+
3	+	:root { --background-secondary: #141618; }
4	+	:root { --background-primary: #202326; }
5	+	:root { --background-secondary-alt: #292C30; }
6	+	:root { --background-tertiary: #141618; }
7	+	:root { --background-textarea: #141618; }
8	+	:root { --background-header-secondary: #202326; }
9	+	:root { --background-header-primary-hover: #292C30; }
10	+	:root { --background-modifier-hover: #292C30; }
11	+	:root { --guild-list-foreground: #141618; }
12	+	:root { --background-modifier-accent: #A1A9B1; }
13	+	:root { }
14	+	:root { --brand-primary: #1E5774; }
15	+	:root { --brand-secondary: #3DAEE9; }
16	+	:root { --brand-primary-light: #3DAEE9; }
17	+	:root { --brand-primary-fill: #FCFCFC; }
18	+	:root { --status-online: #6EC137; }
19	+	:root { --status-idle: #FDBC4B; }
20	+	:root { --status-danger: #DA4453; }
21	+	:root { --status-dnd: #B03745; }
22	+	:root { --status-offline: #A1A9B1; }
23	+	:root { }
24	+	:root { --text-secondary: #A1A9B1; }
25	+	:root { --text-tertiary: #A1A9B1; }
26	+	:root { --text-primary-muted: #A1A9B1; }
27	+	:root { --text-chat-muted: #A1A9B1; }
28	+	:root { --text-chat: #FCFCFC; }
29	+	:root { --text-link: #1D99F3; }
30	+	:root { --text-tertiary-muted: #A1A9B1; }
31	+	:root { --text-tertiary-secondary: #A1A9B1; }
32	+	:root { --border-color: #A1A9B1; }
33	+	:root { --border-color-hover: #1E5774; }
34	+	:root { --border-color-focus: #3DAEE9; }
35	+	:root { --accent-success: #27AE60; }
36	+	:root { --accent-warning: #F67400; }
37	+	:root { --accent-danger: #DA4453; }
38	+	:root { --alert-note-color: #3DAEE9; }
39	+	:root { --accent-purple: #9B59B6; }
40	+	:root { --alert-tip-color: #6EC137; }
41	+	:root { --alert-important-color: #AC8DD9; }
42	+	:root { --alert-warning-color: #DF6D44; }
43	+	:root { --alert-caution-color: #DD575C; }
44	+	:root { --markup-mention-text: #FCFCFC; }
45	+	:root { --markup-mention-fill: #1E5774; }
46	+	:root { --markup-interactive-hover-fill: #3DAEE9; }
47	+	:root { --markup-interactive-hover-text: #FCFCFC; }
48	+	:root { --button-primary-fill: #292C30; }
49	+	:root { --button-primary-active-fill: #3DAEE9; }
50	+	:root { --button-primary-text: #FCFCFC; }
51	+	:root { --button-inverted-text: #141618; }
52	+	:root { --button-secondary-fill: #1D1F22; }
53	+	:root { --button-secondary-active-fill: #1E5774; }
54	+	:root { --button-secondary-text: #FCFCFC; }
55	+	:root { --button-danger-fill: #292C30; }
56	+	:root { --button-danger-active-fill: #DA4453; }
57	+	:root { --button-danger-outline-border: #DA4453; }
58	+	:root { --button-danger-outline-active-fill: #DA4453; }
59	+	:root { --button-danger-text: #FCFCFC; }
60	+	:root { --button-danger-outline-text: #FCFCFC; }
61	+	:root { --button-danger-outline-active-border: #A1A9B1; }
62	+	:root { --button-outline-border: #A1A9B1; }
63	+	:root { --button-outline-text: #FCFCFC; }
64	+	:root { --button-outline-active-fill: #FCFCFC; }
65	+	:root { --button-outline-active-border: #3DAEE9; }
66	+	:root { --bg-code-block: #121417; }
67	+	:root { --bg-blockquote: #292C30; }
68	+	:root { --bg-table-row-odd: #141618; }
69	+	:root { --bg-table-row-even: #292C30; }
70	+	:root { --background-modifier-selected: #1E5774; }
71	+	:root { --text-primary: #FCFCFC; }
72	+	:root { --background-modifier-accent-focus: #A1A9B1; }