diff --git a/package.json b/package.json
index f3f3fd5b..650a2a99 100755
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "frankerfacez",
   "author": "Dan Salvato LLC",
-  "version": "4.22.3",
+  "version": "4.22.4",
   "description": "FrankerFaceZ is a Twitch enhancement suite.",
   "private": true,
   "license": "Apache-2.0",
diff --git a/src/sites/twitch-twilight/modules/menu_button.jsx b/src/sites/twitch-twilight/modules/menu_button.jsx
index 0d9fcf67..b16ed2f1 100644
--- a/src/sites/twitch-twilight/modules/menu_button.jsx
+++ b/src/sites/twitch-twilight/modules/menu_button.jsx
@@ -406,14 +406,14 @@ export default class MenuButton extends SiteModule {
 
 			progress_bar = (<div class="ffz-toast--progress tw-absolute tw-overflow-hidden tw-z-below">
 				<div
-					class="tw-border-radius-rounded tw-progress-bar tw-progress-bar--countdown tw-progress-bar--default tw-progress-bar--mask"
+					class="tw-border-radius-rounded ffz-progress-bar ffz-progress-bar--countdown ffz-progress-bar--default ffz-progress-bar--mask"
 					role="progressbar"
 					aria-valuenow={percentage}
 					aria-valuemin="0"
 					aria-valuemax="100"
 				>
 					<div
-						class={`tw-block tw-border-bottom-left-radius-rounded tw-border-top-left-radius-rounded tw-progress-bar__fill`}
+						class={`tw-block tw-border-bottom-left-radius-rounded tw-border-top-left-radius-rounded ffz-progress-bar__fill`}
 						data-a-target="tw-progress-bar-animation"
 						style={{
 							width: `${percentage}%`,
diff --git a/src/sites/twitch-twilight/modules/player.jsx b/src/sites/twitch-twilight/modules/player.jsx
index 6af56c26..8e0a323e 100644
--- a/src/sites/twitch-twilight/modules/player.jsx
+++ b/src/sites/twitch-twilight/modules/player.jsx
@@ -108,6 +108,12 @@ export default class Player extends PlayerBase {
 
 		this.settings.add('player.theatre.metadata', {
 			default: false,
+			requires: ['context.route.name'],
+			process(ctx, val) {
+				if ( ctx.get('context.route.name') === 'video' )
+					return false;
+				return val
+			},
 			ui: {
 				path: 'Player > General >> Theatre Mode',
 				title: 'Show metadata when mousing over the player.',
diff --git a/src/sites/twitch-twilight/styles/menu_button.scss b/src/sites/twitch-twilight/styles/menu_button.scss
index cb086fbd..4b614975 100644
--- a/src/sites/twitch-twilight/styles/menu_button.scss
+++ b/src/sites/twitch-twilight/styles/menu_button.scss
@@ -33,7 +33,7 @@
 	}
 
 	.ffz-toast {
-		&.ffz-toast--paused .tw-progress-bar--countdown .tw-progress-bar__fill {
+		&.ffz-toast--paused .ffz-progress-bar--countdown .ffz-progress-bar__fill {
 			animation: none !important;
 		}
 
diff --git a/styles/native/index.scss b/styles/native/index.scss
index 1d9c57de..ae9abd48 100644
--- a/styles/native/index.scss
+++ b/styles/native/index.scss
@@ -4,4 +4,5 @@
 @import "text";
 @import "link";
 @import "card";
-@import "tag";
\ No newline at end of file
+@import "tag";
+@import "progress";
diff --git a/styles/native/progress.scss b/styles/native/progress.scss
new file mode 100644
index 00000000..f991b437
--- /dev/null
+++ b/styles/native/progress.scss
@@ -0,0 +1,30 @@
+.ffz-progress-bar {
+	&--default {
+		overflow: hidden;
+		width: 100%;
+		height: 1rem;
+		background: var(--color-background-progress);
+	}
+
+	&__fill {
+		max-width: 100%;
+		height: 100%;
+		background: var(--color-background-progress-status);
+		animation-timing-function: linear;
+		animation-fill-mode: both;
+	}
+
+	&--countdown &__fill {
+		animation-name: ffz-progress-down;
+	}
+
+	.thingy {
+		bottom: -4px;
+	}
+}
+
+@keyframes ffz-progress-down {
+	100% {
+		width: 0%;
+	}
+}
\ No newline at end of file