diff --git a/src/sites/twitch-twilight/modules/directory/following.js b/src/sites/twitch-twilight/modules/directory/following.js
index 3bc9d3bb..cbb8ae06 100644
--- a/src/sites/twitch-twilight/modules/directory/following.js
+++ b/src/sites/twitch-twilight/modules/directory/following.js
@@ -251,7 +251,7 @@ export default class Following extends SiteModule {
 		// Hosted Channel Header
 		simplebarContentChildren.push(
 			e('p', {
-				className: 'pd-t-05 pd-x-1 c-text-alt-2',
+				className: 'tw-pd-t-05 tw-pd-x-1 tw-c-text-alt-2',
 				textContent: this.i18n.t('directory.hosted', 'Hosted Channel')
 			})
 		);
@@ -267,7 +267,7 @@ export default class Following extends SiteModule {
 						inst.props.viewerCount.hostData.channel,
 						this.destroyHostMenu.bind(this)
 					)
-			}, e('div', 'align-items-center flex flex-row flex-nowrap mg-x-1 mg-y-05',
+			}, e('div', 'tw-align-items-center tw-flex tw-flex-row tw-flex-nowrap tw-mg-x-1 tw-mg-y-05',
 				[
 					e('div', {
 						className: 'ffz-channel-avatar',
@@ -276,7 +276,7 @@ export default class Following extends SiteModule {
 						alt: inst.props.channelName
 					})),
 					e('p', {
-						className: 'ellipsis flex-grow-1 mg-l-1 font-size-5',
+						className: 'tw-ellipsis tw-flex-grow-1 tw-mg-l-1 tw-font-size-5',
 						textContent: inst.props.channelName
 					})
 				]
@@ -286,7 +286,7 @@ export default class Following extends SiteModule {
 		// Hosting Channels Header
 		simplebarContentChildren.push(
 			e('p', {
-				className: 'pd-t-05 pd-x-1 c-text-alt-2',
+				className: 'tw-pd-t-05 tw-pd-x-1 tw-c-text-alt-2',
 				textContent: this.i18n.t('directory.hosting', 'Hosting Channels')
 			})
 		);
@@ -300,7 +300,7 @@ export default class Following extends SiteModule {
 					className: 'tw-interactable',
 					href: `/${node.login}`,
 					onclick: event => this.parent.hijackUserClick(event, node.login, this.destroyHostMenu.bind(this))
-				}, e('div', 'align-items-center flex flex-row flex-nowrap mg-x-1 mg-y-05',
+				}, e('div', 'tw-align-items-center tw-flex tw-flex-row tw-flex-nowrap tw-mg-x-1 tw-mg-y-05',
 					[
 						e('div', {
 							className: 'ffz-channel-avatar',
@@ -309,7 +309,7 @@ export default class Following extends SiteModule {
 							alt: node.displayName
 						})),
 						e('p', {
-							className: 'ellipsis flex-grow-1 mg-l-1 font-size-5',
+							className: 'tw-ellipsis tw-flex-grow-1 tw-mg-l-1 tw-font-size-5',
 							textContent: node.displayName
 						})
 					]
@@ -317,19 +317,14 @@ export default class Following extends SiteModule {
 			);
 		}
 
-		this.hostMenu = e('div', 'ffz-host-menu tw-balloon block',
-			e('div', 'selectable-filter__balloon pd-y-05',
+		this.hostMenu = e('div', 'ffz-host-menu tw-balloon tw-block',
+			e('div', 'tw-selectable-filter__balloon tw-pd-y-05',
 				e('div', {
 					className: 'scrollable-area',
 					'data-simplebar': true,
-				}, [
-					e('div', 'simplebar-track vertical',
-						e('div', 'simplebar-scrollbar')
-					),
-					e('div', 'simplebar-scroll-content',
-						e('div', 'simplebar-content', simplebarContentChildren)
-					)
-				])
+				}, e('div', 'simplebar-scroll-content',
+					e('div', 'simplebar-content', simplebarContentChildren)
+				))
 			)
 		);
 
@@ -363,7 +358,7 @@ export default class Following extends SiteModule {
 
 		// Remove old elements
 		const hiddenBodyCard = card.querySelector('.tw-card-body.hide');
-		if (hiddenBodyCard !== null) hiddenBodyCard.classList.remove('hide');
+		if (hiddenBodyCard !== null) hiddenBodyCard.classList.remove('tw-hide');
 
 		const ffzChannelData = card.querySelector('.ffz-channel-data');
 		if (ffzChannelData !== null) ffzChannelData.remove();
@@ -388,7 +383,7 @@ export default class Following extends SiteModule {
 			let avatarDiv;
 			if (avatarSetting === 1) {
 				avatarDiv = e('a', {
-					className: 'ffz-channel-avatar mg-r-05 mg-t-05',
+					className: 'ffz-channel-avatar tw-mg-r-05 tw-mg-t-05',
 					href: hosting ? `/${channel}` : inst.props.linkTo.pathname,
 				}, e('img', {
 					title: inst.props.channelName,
@@ -399,7 +394,7 @@ export default class Following extends SiteModule {
 					className: 'ffz-channel-avatar',
 					href: hosting ? `/${channel}` : inst.props.linkTo.pathname,
 					onclick: event => this.parent.hijackUserClick(event, inst.props.streamNode.broadcaster.login)
-				}, e('div', 'live-channel-card__boxart bottom-0 absolute',
+				}, e('div', 'live-channel-card__boxart tw-bottom-0 tw-absolute',
 					e('figure', 'tw-aspect tw-aspect--align-top',
 						e('img', {
 							title: inst.props.channelName,
@@ -416,9 +411,9 @@ export default class Following extends SiteModule {
 			const cardDivParent = cardDiv.parentElement;
 			const ffzChannelData = cardDivParent.querySelector('.ffz-channel-data');
 			if (ffzChannelData === null) {
-				cardDiv.classList.add('hide');
+				cardDiv.classList.add('tw-hide');
 
-				const newCardDiv = e('div', 'ffz-channel-data flex flex-nowrap', [
+				const newCardDiv = e('div', 'ffz-channel-data tw-flex tw-flex-nowrap', [
 					avatarDiv, modifiedDiv
 				]);
 				cardDivParent.appendChild(newCardDiv);
diff --git a/src/sites/twitch-twilight/modules/directory/game.js b/src/sites/twitch-twilight/modules/directory/game.js
index 19649bfb..09a3fd07 100644
--- a/src/sites/twitch-twilight/modules/directory/game.js
+++ b/src/sites/twitch-twilight/modules/directory/game.js
@@ -46,15 +46,15 @@ export default class Game extends SiteModule {
 			for(const inst of instances) this.updateButtons(inst);
 		});
 
-		this.GameHeader.on('update', inst => this.updateButtons(inst));
+		this.GameHeader.on('update', this.updateButtons, this);
 	}
 
 	updateButtons(inst, update = false) {
 		const container = this.fine.getHostNode(inst);
 		if ( inst.props.directoryType !== 'GAMES' || ! container || ! container.querySelector )
 			return;
-
-		const buttons = container.querySelector('div > div.align-items-center'),
+		
+		const buttons = container.querySelector('div > div.tw-align-items-center'),
 			ffz_buttons = buttons && buttons.querySelector('.ffz-buttons');
 
 		if ( ! buttons || (ffz_buttons && ! update) )
@@ -80,7 +80,7 @@ export default class Game extends SiteModule {
 
 
 		block_btn = e('button', {
-			className: 'mg-l-1 tw-button ffz-directory-toggle-block',
+			className: 'tw-mg-l-1 tw-button ffz-directory-toggle-block',
 			onClick: this.generateClickHandler('directory.game.blocked-games', game, update_block)
 		}, block_label = e('span', 'tw-button__text'));
 
@@ -100,7 +100,7 @@ export default class Game extends SiteModule {
 		}
 
 		hidden_btn = e('button', {
-			className: 'mg-l-1 tw-button ffz-directory-toggle-thumbnail',
+			className: 'tw-mg-l-1 tw-button ffz-directory-toggle-thumbnail',
 			onClick: this.generateClickHandler('directory.game.hidden-thumbnails', game, update_hidden)
 		}, hidden_label = e('span', 'tw-button__text'));
 
diff --git a/src/sites/twitch-twilight/modules/directory/index.js b/src/sites/twitch-twilight/modules/directory/index.js
index 81675687..930ba608 100644
--- a/src/sites/twitch-twilight/modules/directory/index.js
+++ b/src/sites/twitch-twilight/modules/directory/index.js
@@ -103,7 +103,7 @@ export default class Directory extends SiteModule {
 			changed: value => {
 				this.css_tweaks.toggleHide('boxart-hide', value === 0);
 				this.css_tweaks.toggleHide('boxart-hover', value === 1);
-				this.ChannelCard.forceUpdate()
+				this.ChannelCard.forceUpdate();
 			}
 		});
 	}
@@ -128,9 +128,9 @@ export default class Directory extends SiteModule {
 			for(const inst of instances) this.updateChannelCard(inst);
 		});
 
-		this.ChannelCard.on('update', inst => this.updateChannelCard(inst), this);
-		this.ChannelCard.on('mount', inst => this.updateChannelCard(inst), this);
-		this.ChannelCard.on('unmount', inst => this.clearUptime(inst), this);
+		this.ChannelCard.on('update', this.updateChannelCard, this);
+		this.ChannelCard.on('mount', this.updateChannelCard, this);
+		this.ChannelCard.on('unmount', this.clearUptime, this);
 	}
 
 
@@ -206,12 +206,12 @@ export default class Directory extends SiteModule {
 
 		const up_text = duration_to_string(uptime, false, false, false, setting === 1);
 
-		if ( ! inst.ffz_uptime_el ) {
+		if ( ! inst.ffz_uptime_el || card.querySelector('.ffz-uptime-element') === undefined ) {
 			card.appendChild(inst.ffz_uptime_el = e('div',
-				'video-preview-card__preview-overlay-stat c-background-overlay c-text-overlay font-size-6 top-0 right-0 z-default inline-flex absolute mg-05',
-				e('div', 'tw-tooltip-wrapper inline-flex', [
+				'video-preview-card__preview-overlay-stat tw-c-background-overlay tw-c-text-overlay tw-font-size-6 tw-top-0 tw-right-0 tw-z-default tw-inline-flex tw-absolute tw-mg-05 ffz-uptime-element',
+				e('div', 'tw-tooltip-wrapper tw-inline-flex', [
 					e('div', 'tw-stat', [
-						e('span', 'c-text-live tw-stat__icon', e('figure', 'ffz-i-clock')),
+						e('span', 'tw-c-text-live tw-stat__icon', e('figure', 'ffz-i-clock')),
 						inst.ffz_uptime_span = e('span', 'tw-stat__value')
 					]),
 					inst.ffz_uptime_tt = e('div', 'tw-tooltip tw-tooltip--down tw-tooltip--align-center')
@@ -246,7 +246,7 @@ export default class Directory extends SiteModule {
 		// Remove old elements
 		const hiddenBodyCard = card.querySelector('.tw-card-body.hide');
 		if (hiddenBodyCard !== null)
-			hiddenBodyCard.classList.remove('hide');
+			hiddenBodyCard.classList.remove('tw-hide');
 
 		const ffzChannelData = card.querySelector('.ffz-channel-data');
 		if (ffzChannelData !== null)
@@ -267,7 +267,7 @@ export default class Directory extends SiteModule {
 				});
 
 				const avatarDiv = e('a', {
-					className: 'ffz-channel-avatar mg-r-05 mg-t-05',
+					className: 'ffz-channel-avatar tw-mg-r-05 tw-mg-t-05',
 					href: `/${inst.props.streamNode.broadcaster.login}`,
 					onclick: event => this.hijackUserClick(event, inst.props.streamNode.broadcaster.login)
 				}, e('img', {
@@ -278,9 +278,9 @@ export default class Directory extends SiteModule {
 				const cardDivParent = cardDiv.parentElement;
 
 				if (cardDivParent.querySelector('.ffz-channel-data') === null) {
-					cardDiv.classList.add('hide');
+					cardDiv.classList.add('tw-hide');
 
-					const newCardDiv = e('div', 'ffz-channel-data flex flex-nowrap', [
+					const newCardDiv = e('div', 'ffz-channel-data tw-flex tw-flex-nowrap', [
 						avatarDiv, modifiedDiv
 					]);
 					cardDivParent.appendChild(newCardDiv);
@@ -290,7 +290,7 @@ export default class Directory extends SiteModule {
 					className: 'ffz-channel-avatar',
 					href: `/${inst.props.streamNode.broadcaster.login}`,
 					onclick: event => this.hijackUserClick(event, inst.props.streamNode.broadcaster.login)
-				}, e('div', 'live-channel-card__boxart bottom-0 absolute',
+				}, e('div', 'live-channel-card__boxart tw-bottom-0 tw-absolute',
 					e('figure', 'tw-aspect tw-aspect--align-top',
 						e('img', {
 							title: inst.props.streamNode.broadcaster.displayName,