From e90cc1ee79de0178520b3f41fa9f0059d2595d04 Mon Sep 17 00:00:00 2001
From: Dym Sohin <re@dym.sh>
Date: Wed, 27 Dec 2023 15:56:44 +0100
Subject: [PATCH] mostly css

---
 assets/dist/base.css           |   87 +-
 assets/dist/profile.css        |  373 +++++---
 assets/dist/settings-style.css |    2 +-
 assets/dist/status.css         | 1482 ++++++++++++++++----------------
 template/about.tmpl            |    6 +-
 template/profile.tmpl          |   12 +-
 template/status.tmpl           |    2 +-
 7 files changed, 1076 insertions(+), 888 deletions(-)

diff --git a/assets/dist/base.css b/assets/dist/base.css
index 71c4cb8..068d2b6 100644
--- a/assets/dist/base.css
+++ b/assets/dist/base.css
@@ -65,6 +65,10 @@ pre {
 	font-size: 1em;
 }
 
+pre {
+	max-width: 35rem;
+}
+
 small {
 	font-size: 80%;
 }
@@ -180,6 +184,8 @@ nav
 , nav *
 , footer
 , footer *
+, aside
+, aside *
 { all: unset
 ; margin: 0
 ; padding: 0
@@ -214,7 +220,52 @@ body {
 	display: none;
 }
 
+aside {
+	gap: 1.25rem;
+	justify-content: center;
+	margin-bottom: 3rem;
+}
+aside a {
+	flex-basis: 7rem;
+	justify-content: center;
+	border-radius: 0.125rem;
+	padding: 0.5rem 1rem;
+	border: 0.125rem solid var(--green1);
+}
+aside a:active,
+aside a:focus,
+aside a:hover {
+	background: var(--bg);
+	box-shadow:
+		0 0 0 0.125rem var(--bg)
+		, 0 0 0 0.25rem var(--green1)
+		;
+}
+aside a
+, aside a > span
+, aside a:any-link
+, aside a:any-link > span {
+	color: var(--green1);
+}
+aside a:any-link > span {
+	text-decoration: underline;
+}
 
+aside a.current {
+	border: 0.125rem dotted var(--orange2);
+}
+aside a.current
+, aside a.current > span {
+	color: var(--orange2);
+	cursor: unset;
+	text-decoration: unset;
+}
+aside a.current:active,
+aside a.current:focus,
+aside a.current:hover {
+	background: unset;
+	box-shadow: unset;
+}
 
 h1 {
 	margin: 0;
@@ -668,6 +719,23 @@ label {
 	}
 
 
+ul {
+	padding: 1rem 0;
+	margin: 0;
+}
+ul li {
+	list-style: none;
+	margin-left: 1rem;
+}
+ul li::before {
+	content: "–";
+	margin-left: -2rem;
+	padding-right: 0.5rem;
+	width: 2rem;
+	display: inline-block;
+	text-align: right;
+}
+
 .about {
 	gap: 3rem;
 	display: grid;
@@ -677,7 +745,8 @@ label {
 .about a {
 	border-radius: 0.125rem;
 }
-.about a[href^='https://dym.sh/'] {
+.about a[href^='https://dym.sh/']
+, .about a[href^='/'] {
 	color: var(--green1);
 }
 .about a:active,
@@ -704,11 +773,6 @@ label {
 .about p {
 	margin: 0;
 }
-.about ul {
-	padding-left: 0;
-	list-style: none;
-	padding: 1rem 0;
-}
 .col-2 {
 	columns: 2;
 }
@@ -723,17 +787,6 @@ label {
 .about ul: last-child {
 	padding-bottom: 0;
 }
-ul li {
-	margin-left: 1rem;
-}
-ul li::before {
-	content: "–";
-	margin-left: -2rem;
-	padding-right: 0.5rem;
-	width: 2rem;
-	display: inline-block;
-	text-align: right;
-}
 
 
 @media screen and (max-width: 600px) {
diff --git a/assets/dist/profile.css b/assets/dist/profile.css
index 5466056..f86973c 100644
--- a/assets/dist/profile.css
+++ b/assets/dist/profile.css
@@ -1,3 +1,4 @@
+
 /*
 	GoToSocial
 	Copyright (C) 2021-2023 GoToSocial Authors admin@gotosocial.org
@@ -9,101 +10,180 @@
 
 	This program is distributed in the hope that it will be useful,
 	but WITHOUT ANY WARRANTY; without even the implied warranty of
-	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
+	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 	GNU Affero General Public License for more details.
 
 	You should have received a copy of the GNU Affero General Public License
-	along with this program. If not, see <http://www.gnu.org/licenses/>.
+	along with this program.  If not, see <http://www.gnu.org/licenses/>.
 */
 
-.profile {
-	display: flex;
-	gap: 1rem;
-}
-.profile .header {
-	display: flex;
-	flex-direction: column;
-	gap: 1rem;
-	justify-content: flex-start;
-	width: 20rem;
-	word-break: break-all;
+.page {
+	grid-template-columns: 1fr minmax(auto, 60rem) 1fr; /* fallback for lack of min() support */
+	grid-template-columns: 1fr min(92%, 65rem) 1fr;
 }
 
-.profile .header > * {
+.profile {
+	padding: 0.5rem;
 	border-radius: var(--br);
 }
 
-.profile figure {
-	margin: 0 0 0.5rem 0;
+.profile .column-split {
+		display: flex;
+		flex-wrap: wrap;
+		gap: 1rem;
+	}
+
+.profile .header {
+	background: var(--profile-bg);
 	border-radius: var(--br);
 	overflow: hidden;
+	margin-bottom: 1rem;
+}
+
+.profile .header .header-image {
+		position: relative;
+		padding-top: 33.33%;
+	}
+
+/* aspect-ratio 1/3 */
+
+.profile .header .header-image img {
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			width: 100%;
+			height: 100%;
+			-o-object-fit: cover;
+			   object-fit: cover;
+		}
+
+.profile .header {
+	--avatar-size: 8.5rem;
+	--name-size: 3rem;
+	--username-size: 2rem;
+
+	--overlap: calc(var(--avatar-size) - var(--name-size) - var(--username-size));
+}
+
+/*
+		Basic info container has the user's avatar, display- and username, and role
+		It's partially overlapped over the header image, by a negative margin-top
+	*/
+
+.profile .header .basic-info {
+		position: relative;
+		display: grid;
+		box-sizing: border-box;
+		grid-template-columns: var(--avatar-size) auto 1fr;
+		grid-template-rows: var(--overlap) var(--name-size) auto;
+		grid-template-areas:
+			"avatar . ."
+			"avatar displayname displayname"
+			"avatar username role";
+
+		margin: 1rem;
+		margin-top: calc(-1 * var(--overlap));
+		gap: 0 1rem;
+	}
+
+.profile .header .basic-info .avatar {
+			grid-area: avatar;
+			height: var(--avatar-size);
+			width: var(--avatar-size);
+			border: 0.2rem solid var(--avatar-border);
+			border-radius: var(--br);
+			overflow: hidden;
+		}
+
+/* prevents image extending beyond rounded borders */
+
+.profile .header .basic-info .avatar img {
+				height: 100%;
+				width: 100%;
+				-o-object-fit: cover;
+				   object-fit: cover;
+			}
+
+.profile .header .basic-info .displayname {
+			grid-area: displayname;
+			line-height: var(--name-size);
+			font-size: 1.5rem;
+			font-weight: bold;
+		}
+
+.profile .header .basic-info .username {
+			min-width: 0;
+			grid-area: username;
+			line-height: var(--username-size);
+
+			font-size: 1rem;
+			font-weight: bold;
+			color: var(--fg-accent);
+			-webkit-user-select: all;
+			        user-select: all;
+		}
+
+.profile .header .basic-info .role {
+			background: var(--bg);
+			color: var(--fg);
+			border: 0.13rem solid var(--bg);
+
+			grid-area: role;
+			align-self: center;
+			justify-self: start;
+			border-radius: var(--br);
+			padding: 0.3rem;
+
+			line-height: 1.1rem;
+			font-size: 0.9rem;
+			font-variant: small-caps;
+			font-weight: bold;
+		}
+
+.profile .header .basic-info .role.admin {
+				color: var(--role-admin);
+				border-color: var(--role-admin);
+			}
+
+.profile .header .basic-info .role.moderator {
+				color: var(--role-mod);
+				border-color: var(--role-mod);
+			}
+
+@media screen and (max-width: 750px) {
+		.profile .header .basic-info {
+			grid-template-columns: auto 1fr;
+			grid-template-rows: var(--avatar-size) var(--name-size) auto;
+			grid-template-areas:
+				"avatar avatar"
+				"displayname displayname"
+				"username role";
+		}
+
+			.profile .header .basic-info .displayname {
+				font-size: 1.4rem;
+			}
+}
+
+.profile .col-header {
 	display: flex;
-	justify-content: space-between;
-	position: relative;
-}
-.profile figure img.bg {
-	position: absolute;
-	width: 100%;
-	height: 100%;
-	z-index: 1;
-	object-fit: cover;
-}
+	justify-content: start;
+	gap: 2rem;
+	align-items: center;
 
-.profile figure img.avatar {
-	margin: 0.5rem;
-	width: 5rem;
-	height: 5rem;
-	z-index: 2;
-	object-fit: fill;
-	border-radius: var(--br);
-}
-
-.profile .header .user {
+	margin: 0;
 	background: var(--profile-bg);
-	display: flex;
-	flex-direction: column;
-	gap: 0.25rem;
-	padding: 1rem;
+	border-top-left-radius: var(--br);
+	border-top-right-radius: var(--br);
+	padding: 0.75rem;
 }
 
-.profile .header .displayname {
-	line-height: 1.25rem;
-	font-size: 1rem;
-	font-weight: 600;
-}
-
-.profile .header .username {
-	min-width: 0;
-	font-size: 1rem;
-	color: var(--fg-accent);
-	-webkit-user-select: all;
-	user-select: all;
-}
-
-.profile .header .role {
-	background: var(--bg);
-	color: var(--fg);
-
-	border: 0.075rem solid var(--bg);
-	border-radius: 0.25rem;
-	margin: 0.5rem;
-	padding: 0.25rem;
-	z-index: 2;
-	line-height: 0.75em;
-	font-size: 0.75rem;
-	font-variant: small-caps;
-  align-self: flex-start;
-}
-
-.profile .header .role.admin {
-	color: var(--role-admin);
-	border-color: var(--role-admin);
-}
-
-.profile .header .role.moderator {
-	color: var(--role-mod);
-	border-color: var(--role-mod);
-}
+.profile .col-header h1, .profile .col-header h2 {
+		font-size: 1.2rem;
+		line-height: 1.3rem;
+		margin: 0;
+	}
 
 .profile .toots {
 	flex: 65 25rem;
@@ -113,82 +193,95 @@
 }
 
 .profile .toots .col-header {
-	display: grid;
-	grid-template-columns: auto 1fr;
-	gap: 1rem;
-}
+		display: grid;
+		grid-template-columns: auto 1fr;
+		gap: 1rem;
+	}
 
 .profile .toots .col-header a {
-	justify-self: end;
-}
+			justify-self: end;
+		}
+
+.profile .toots .col-header .rss-icon {
+			display: block;
+			margin: -0.25rem 0;
+		}
+
+.profile .toots .col-header .rss-icon .fa {
+				font-size: 2rem;
+				-o-object-fit: contain;
+				   object-fit: contain;
+				vertical-align: middle;
+				color: var(--orange2);
+				/* can't size a single-color background, so we use a linear-gradient that's effectively white */
+				background: linear-gradient(to right, var(--white1) 100%, transparent 0) no-repeat center center;
+				background-size: 1.2rem 1.4rem;
+			}
 
 .profile .toots .toot {
-	border-radius: var(--br);
-}
-.toot .info {
-	flex-direction: row;
-	gap: 1rem;
-}
-.toot .info {
-	flex-direction: row;
-	gap: 1rem;
-}
+		border-radius: 0;
+	}
+
+.profile .toots .toot .info {
+			padding: 0.3rem 0.75rem;
+		}
+
+.profile .toots .toot:last-child {
+			border-bottom-left-radius: var(--br);
+			border-bottom-right-radius: var(--br);
+		}
 
 .profile .toots .backnextlinks {
-	display: flex;
-	justify-content: space-between;
-}
+		display: flex;
+		justify-content: space-between;
+	}
 
 .profile .toots .backnextlinks .next {
-	margin-left: auto;
+			margin-left: auto;
+		}
+
+.profile .about-user {
+	overflow: hidden;
+	display: flex;
+	flex-direction: column;
+	gap: 1rem;
 }
-
-.profile .col-header {
-	margin-bottom: -0.25rem;
-}
-
-
-.profile > * {
+.profile .about-user > * {
 	border-radius: var(--br);
 }
 
-.profile .fields {
-	background: var(--profile-bg);
-	display: grid;
-	grid-template-columns: 1fr 2fr;
-	padding: 0.5rem;
-}
+.profile .about-user .col-header {
+		margin-bottom: -0.25rem;
+	}
 
-.profile .fields > * {
-	padding: 0.5rem;
-}
-.profile .fields > b {
-	align-self: center;
-	justify-self: flex-end;
-	font-weight: 600;
-}
-.profile .fields > span + b,
-.profile .fields > time + b {
-	border-top: 0.1rem solid var(--gray2);
-	align-self: flex-start;
-	text-align: right;
-}
+.profile .about-user .fields {
+		background: var(--profile-bg);
+		display: grid;
+		grid-template: max-content 1fr;
+		padding: 0 0.5rem;
+	}
 
-.profile .rss-icon,
-.profile .rss-icon img {
-	width: 20px;
-	height: 20px;
-}
+.profile .about-user .fields .field + .field {
+				border-top: 0.1rem solid var(--gray2);
+			}
 
-.profile .fields .flex,
-.profile .fields .flex * {
-	display: flex;
-	line-height: 1rem;
-	gap: 0.5rem;
-	align-items: center;
-}
+.profile .about-user .bio {
+		background: var(--profile-bg);
+		padding: 1rem;
+	}
 
-.profile .bio {
-	background: var(--profile-bg);
-	padding: 1rem;
+.profile .about-user .accountstats {
+		background: var(--bg-accent);
+		padding: 1rem;
+
+		display: grid;
+		grid-template-columns: auto auto;
+		gap: 0.5rem 1rem;
+	}
+.profile .about-user .accountstats > b {
+	justify-self: end;
+	font-weight: normal;
+}
+.profile .about-user .accountstats > b + * {
+	justify-self: start;
 }
diff --git a/assets/dist/settings-style.css b/assets/dist/settings-style.css
index f11e308..39a0dd0 100644
--- a/assets/dist/settings-style.css
+++ b/assets/dist/settings-style.css
@@ -221,7 +221,7 @@ nav.menu-tree li.nested a.title {
 			padding-left: 1rem;
 			font-weight: normal;
 			color: var(--fg);
-			background: var(--gray3);
+			background: var(--gray4);
 		}
 
 nav.menu-tree li.nested a.title:focus {
diff --git a/assets/dist/status.css b/assets/dist/status.css
index c6310f3..0deef5b 100644
--- a/assets/dist/status.css
+++ b/assets/dist/status.css
@@ -1,46 +1,46 @@
-
-@charset "UTF-8";
-/*
-	GoToSocial
-	Copyright (C) 2021-2023 GoToSocial Authors admin@gotosocial.org
-
-	This program is free software: you can redistribute it and/or modify
-	it under the terms of the GNU Affero General Public License as published by
-	the Free Software Foundation, either version 3 of the License, or
-	(at your option) any later version.
-
-	This program is distributed in the hope that it will be useful,
-	but WITHOUT ANY WARRANTY; without even the implied warranty of
-	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
-	GNU Affero General Public License for more details.
-
-	You should have received a copy of the GNU Affero General Public License
-	along with this program. If not, see <http://www.gnu.org/licenses/>.
-*/
-/*! PhotoSwipe main CSS by Dmytro Semenov | photoswipe.com */
+
+@charset "UTF-8";
+/*
+	GoToSocial
+	Copyright (C) 2021-2023 GoToSocial Authors admin@gotosocial.org
+
+	This program is free software: you can redistribute it and/or modify
+	it under the terms of the GNU Affero General Public License as published by
+	the Free Software Foundation, either version 3 of the License, or
+	(at your option) any later version.
+
+	This program is distributed in the hope that it will be useful,
+	but WITHOUT ANY WARRANTY; without even the implied warranty of
+	MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
+	GNU Affero General Public License for more details.
+
+	You should have received a copy of the GNU Affero General Public License
+	along with this program.  If not, see <http://www.gnu.org/licenses/>.
+*/
+/*! PhotoSwipe main CSS by Dmytro Semenov | photoswipe.com */
 .pswp {
-	--pswp-bg: #000;
-	--pswp-placeholder-bg: #222;
+  --pswp-bg: #000;
+  --pswp-placeholder-bg: #222;
+  
 
+  --pswp-root-z-index: 100000;
+  
+  --pswp-preloader-color: rgba(79, 79, 79, 0.4);
+  --pswp-preloader-color-secondary: rgba(255, 255, 255, 0.9);
+  
+  /* defined via js:
+  --pswp-transition-duration: 333ms; */
+  
+  --pswp-icon-color: #fff;
+  --pswp-icon-color-secondary: #4f4f4f;
+  --pswp-icon-stroke-color: #4f4f4f;
+  --pswp-icon-stroke-width: 2px;
 
-	--pswp-root-z-index: 100000;
-
-	--pswp-preloader-color: rgba(79, 79, 79, 0.4);
-	--pswp-preloader-color-secondary: rgba(255, 255, 255, 0.9);
-
-	/* defined via js:
-	--pswp-transition-duration: 333ms; */
-
-	--pswp-icon-color: #fff;
-	--pswp-icon-color-secondary: #4f4f4f;
-	--pswp-icon-stroke-color: #4f4f4f;
-	--pswp-icon-stroke-width: 2px;
-
-	--pswp-error-text-color: var(--pswp-icon-color);
-}
+  --pswp-error-text-color: var(--pswp-icon-color);
+}
 /*
 	Styles for basic PhotoSwipe (pswp) functionality (sliding area, open/close transitions)
-*/
+*/
 .pswp {
 	position: fixed;
 	top: 0;
@@ -54,35 +54,35 @@
 	opacity: 0.003;
 	contain: layout style size;
 	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
-}
+}
 /* Prevents focus outline on the root element,
-	(it may be focused initially) */
+  (it may be focused initially) */
 .pswp:focus {
-	outline: 0;
-}
+  outline: 0;
+}
 .pswp * {
-	box-sizing: border-box;
-}
+  box-sizing: border-box;
+}
 .pswp img {
-	max-width: none;
-}
+  max-width: none;
+}
 .pswp--open {
 	display: block;
-}
+}
 .pswp,
 .pswp__bg {
 	-webkit-transform: translateZ(0);
-					transform: translateZ(0);
+	        transform: translateZ(0);
 	will-change: opacity;
-}
+}
 .pswp__bg {
-	opacity: 0.005;
+  opacity: 0.005;
 	background: var(--pswp-bg);
-}
+}
 .pswp,
 .pswp__scroll-wrap {
 	overflow: hidden;
-}
+}
 .pswp__scroll-wrap,
 .pswp__bg,
 .pswp__container,
@@ -95,87 +95,87 @@
 	left: 0;
 	width: 100%;
 	height: 100%;
-}
+}
 .pswp__img,
 .pswp__zoom-wrap {
 	width: auto;
 	height: auto;
-}
+}
 .pswp--click-to-zoom.pswp--zoom-allowed .pswp__img {
 	cursor: zoom-in;
-}
+}
 .pswp--click-to-zoom.pswp--zoomed-in .pswp__img {
 	cursor: move;
 	cursor: grab;
-}
+}
 .pswp--click-to-zoom.pswp--zoomed-in .pswp__img:active {
-	cursor: grabbing;
-}
-/* :active to override grabbing cursor */
+  cursor: grabbing;
+}
+/* :active to override grabbing cursor */
 .pswp--no-mouse-drag.pswp--zoomed-in .pswp__img,
 .pswp--no-mouse-drag.pswp--zoomed-in .pswp__img:active,
 .pswp__img {
 	cursor: zoom-out;
-}
-/* Prevent selection and tap highlights */
+}
+/* Prevent selection and tap highlights */
 .pswp__container,
 .pswp__img,
 .pswp__button,
 .pswp__counter {
 	-webkit-user-select: none;
 	user-select: none;
-}
+}
 .pswp__item {
 	/* z-index for fade transition */
 	z-index: 1;
 	overflow: hidden;
-}
+}
 .pswp__hidden {
 	display: none !important;
-}
-/* Allow to click through pswp__content element, but not its children */
+}
+/* Allow to click through pswp__content element, but not its children */
 .pswp__content {
-	pointer-events: none;
-}
+  pointer-events: none;
+}
 .pswp__content > * {
-	pointer-events: auto;
-}
+  pointer-events: auto;
+}
 /*
 
-	PhotoSwipe UI
+  PhotoSwipe UI
 
-*/
+*/
 /*
 	Error message appears when image is not loaded
 	(JS option errorMsg controls markup)
-*/
+*/
 .pswp__error-msg-container {
-	display: grid;
-}
+  display: grid;
+}
 .pswp__error-msg {
 	margin: auto;
 	font-size: 1em;
 	line-height: 1;
 	color: var(--pswp-error-text-color);
-}
+}
 /*
 class pswp__hide-on-close is applied to elements that
 should hide (for example fade out) when PhotoSwipe is closed
 and show (for example fade in) when PhotoSwipe is opened
- */
+ */
 .pswp .pswp__hide-on-close {
 	opacity: 0.005;
 	will-change: opacity;
 	transition: opacity var(--pswp-transition-duration) cubic-bezier(0.4, 0, 0.22, 1);
 	z-index: 10; /* always overlap slide content */
 	pointer-events: none; /* hidden elements should not be clickable */
-}
-/* class pswp--ui-visible is added when opening or closing transition starts */
+}
+/* class pswp--ui-visible is added when opening or closing transition starts */
 .pswp--ui-visible .pswp__hide-on-close {
 	opacity: 1;
 	pointer-events: auto;
-}
-/* <button> styles, including css reset */
+}
+/* <button> styles, including css reset */
 .pswp__button {
 	position: relative;
 	display: block;
@@ -191,51 +191,51 @@ and show (for example fade in) when PhotoSwipe is opened
 	opacity: 0.85;
 	-webkit-appearance: none;
 	-webkit-touch-callout: none;
-}
+}
 .pswp__button:hover,
 .pswp__button:active,
 .pswp__button:focus {
-	transition: none;
-	padding: 0;
-	background: none;
-	border: 0;
-	box-shadow: none;
-	opacity: 1;
-}
+  transition: none;
+  padding: 0;
+  background: none;
+  border: 0;
+  box-shadow: none;
+  opacity: 1;
+}
 .pswp__button:disabled {
-	opacity: 0.3;
-	cursor: auto;
-}
+  opacity: 0.3;
+  cursor: auto;
+}
 .pswp__icn {
-	fill: var(--pswp-icon-color);
-	color: var(--pswp-icon-color-secondary);
-}
+  fill: var(--pswp-icon-color);
+  color: var(--pswp-icon-color-secondary);
+}
 .pswp__icn {
-	position: absolute;
-	top: 14px;
-	left: 9px;
-	width: 32px;
-	height: 32px;
-	overflow: hidden;
-	pointer-events: none;
-}
+  position: absolute;
+  top: 14px;
+  left: 9px;
+  width: 32px;
+  height: 32px;
+  overflow: hidden;
+  pointer-events: none;
+}
 .pswp__icn-shadow {
-	stroke: var(--pswp-icon-stroke-color);
-	stroke-width: var(--pswp-icon-stroke-width);
-	fill: none;
-}
+  stroke: var(--pswp-icon-stroke-color);
+  stroke-width: var(--pswp-icon-stroke-width);
+  fill: none;
+}
 .pswp__icn:focus {
 	outline: 0;
-}
+}
 /*
 	div element that matches size of large image,
 	large image loads on top of it,
 	used when msrc is not provided
-*/
+*/
 div.pswp__img--placeholder,
 .pswp__img--with-bg {
 	background: var(--pswp-placeholder-bg);
-}
+}
 .pswp__top-bar {
 	position: absolute;
 	left: 0;
@@ -243,665 +243,707 @@ div.pswp__img--placeholder,
 	width: 100%;
 	height: 60px;
 	display: flex;
-	flex-direction: row;
-	justify-content: flex-end;
+  flex-direction: row;
+  justify-content: flex-end;
 	z-index: 10;
 
 	/* allow events to pass through top bar itself */
 	pointer-events: none !important;
-}
+}
 .pswp__top-bar > * {
-	pointer-events: auto;
-	/* this makes transition significantly more smooth,
-		even though inner elements are not animated */
-	will-change: opacity;
-}
+  pointer-events: auto;
+  /* this makes transition significantly more smooth,
+     even though inner elements are not animated */
+  will-change: opacity;
+}
 /*
 
-	Close button
+  Close button
 
-*/
+*/
 .pswp__button--close {
-	margin-right: 6px;
-}
+  margin-right: 6px;
+}
 /*
 
-	Arrow buttons
+  Arrow buttons
 
-*/
+*/
 .pswp__button--arrow {
-	position: absolute;
-	top: 0;
-	width: 75px;
-	height: 100px;
-	top: 50%;
-	margin-top: -50px;
-}
+  position: absolute;
+  top: 0;
+  width: 75px;
+  height: 100px;
+  top: 50%;
+  margin-top: -50px;
+}
 .pswp__button--arrow:disabled {
-	display: none;
-	cursor: default;
-}
+  display: none;
+  cursor: default;
+}
 .pswp__button--arrow .pswp__icn {
-	top: 50%;
-	margin-top: -30px;
-	width: 60px;
-	height: 60px;
-	background: none;
-	border-radius: 0;
-}
+  top: 50%;
+  margin-top: -30px;
+  width: 60px;
+  height: 60px;
+  background: none;
+  border-radius: 0;
+}
 .pswp--one-slide .pswp__button--arrow {
-	display: none;
-}
-/* hide arrows on touch screens */
+  display: none;
+}
+/* hide arrows on touch screens */
 .pswp--touch .pswp__button--arrow {
-	visibility: hidden;
-}
-/* show arrows only after mouse was used */
+  visibility: hidden;
+}
+/* show arrows only after mouse was used */
 .pswp--has_mouse .pswp__button--arrow {
-	visibility: visible;
-}
+  visibility: visible;
+}
 .pswp__button--arrow--prev {
-	right: auto;
-	left: 0px;
-}
+  right: auto;
+  left: 0px;
+}
 .pswp__button--arrow--next {
-	right: 0px;
-}
+  right: 0px;
+}
 .pswp__button--arrow--next .pswp__icn {
-	left: auto;
-	right: 14px;
-	/* flip horizontally */
-	-webkit-transform: scale(-1, 1);
-					transform: scale(-1, 1);
-}
+  left: auto;
+  right: 14px;
+  /* flip horizontally */
+  -webkit-transform: scale(-1, 1);
+          transform: scale(-1, 1);
+}
 /*
 
-	Zoom button
+  Zoom button
 
-*/
+*/
 .pswp__button--zoom {
-	display: none;
-}
+  display: none;
+}
 .pswp--zoom-allowed .pswp__button--zoom {
-	display: block;
-}
-/* "+" => "-" */
+  display: block;
+}
+/* "+" => "-" */
 .pswp--zoomed-in .pswp__zoom-icn-bar-v {
-	display: none;
-}
+  display: none;
+}
 /*
 
-	Loading indicator
+  Loading indicator
 
-*/
+*/
 .pswp__preloader {
-	position: relative;
-	overflow: hidden;
-	width: 50px;
-	height: 60px;
-	margin-right: auto;
-}
+  position: relative;
+  overflow: hidden;
+  width: 50px;
+  height: 60px;
+  margin-right: auto;
+}
 .pswp__preloader .pswp__icn {
-	opacity: 0;
-	transition: opacity 0.2s linear;
-	-webkit-animation: pswp-clockwise 600ms linear infinite;
-	animation: pswp-clockwise 600ms linear infinite;
-}
+  opacity: 0;
+  transition: opacity 0.2s linear;
+  -webkit-animation: pswp-clockwise 600ms linear infinite;
+          animation: pswp-clockwise 600ms linear infinite;
+}
 .pswp__preloader--active .pswp__icn {
-	opacity: 0.85;
-}
+  opacity: 0.85;
+}
 @-webkit-keyframes pswp-clockwise {
-	0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
-	100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
-}
+  0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
+  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
+}
 @keyframes pswp-clockwise {
-	0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
-	100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
-}
+  0% { -webkit-transform: rotate(0deg); transform: rotate(0deg); }
+  100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); }
+}
 /*
 
-	"1 of 10" counter
+  "1 of 10" counter
 
-*/
+*/
 .pswp__counter {
-	height: 30px;
-	margin-top: 15px;
-	-webkit-margin-start: 20px;
-					margin-inline-start: 20px;
-	font-size: 14px;
-	line-height: 30px;
-	color: var(--pswp-icon-color);
-	text-shadow: 1px 1px 3px var(--pswp-icon-color-secondary);
-	opacity: 0.85;
-}
+  height: 30px;
+  margin-top: 15px;
+  -webkit-margin-start: 20px;
+          margin-inline-start: 20px;
+  font-size: 14px;
+  line-height: 30px;
+  color: var(--pswp-icon-color);
+  text-shadow: 1px 1px 3px var(--pswp-icon-color-secondary);
+  opacity: 0.85;
+}
 .pswp--one-slide .pswp__counter {
-	display: none;
-}
+  display: none;
+}
 .pswp__dynamic-caption {
-	color: #fff;
-	position: absolute;
-	width: 100%;
-	left: 0;
-	top: 0;
-	transition: opacity 120ms linear !important; /* override default */
-}
+  color: #fff;
+  position: absolute;
+  width: 100%;
+  left: 0;
+  top: 0;
+  transition: opacity 120ms linear !important; /* override default */
+}
 .pswp-caption-content {
-	display: none;
-}
+  display: none;
+}
 .pswp__dynamic-caption a {
-	color: #fff;
-}
+  color: #fff;
+}
 .pswp__dynamic-caption--faded {
-	opacity: 0 !important;
-}
+  opacity: 0 !important;
+}
 .pswp__dynamic-caption--aside {
-	width: auto;
-	max-width: 300px;
-	padding: 20px 15px 20px 20px;
-	margin-top: 70px;
-}
+  width: auto;
+  max-width: 300px;
+  padding: 20px 15px 20px 20px;
+  margin-top: 70px;
+}
 .pswp__dynamic-caption--below {
-	width: auto;
-	max-width: 700px;
-	padding: 15px 0 0;
-}
+  width: auto;
+  max-width: 700px;
+  padding: 15px 0 0;
+}
 .pswp__dynamic-caption--on-hor-edge {
-	padding-left: 15px;
-	padding-right: 15px;
-}
+  padding-left: 15px;
+  padding-right: 15px;
+}
 .pswp__dynamic-caption--mobile {
-	width: 100%;
-	background: rgba(0,0,0,0.5);
-	padding: 10px 15px;
+  width: 100%;
+  background: rgba(0,0,0,0.5);
+  padding: 10px 15px;
 
-	right: 0;
-	bottom: 0;
+  right: 0;
+  bottom: 0;
 
-	/* override styles that were set via JS.
-		as they interfere with size measurement */
-	top: auto !important;
-	left: 0 !important;
-}
-@-webkit-keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}
-@keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}
-@-webkit-keyframes plyr-popup{0%{opacity:.5;-webkit-transform:translateY(10px);transform:translateY(10px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}
-@keyframes plyr-popup{0%{opacity:.5;-webkit-transform:translateY(10px);transform:translateY(10px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}
-@-webkit-keyframes plyr-fade-in{0%{opacity:0}to{opacity:1}}
-@keyframes plyr-fade-in{0%{opacity:0}to{opacity:1}}
-.plyr{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;align-items:center;direction:ltr;display:flex;flex-direction:column;font-family:inherit;font-family:var(--plyr-font-family,inherit);font-variant-numeric:tabular-nums;font-weight:400;font-weight:var(--plyr-font-weight-regular,400);line-height:1.7;line-height:var(--plyr-line-height,1.7);max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease;z-index:0}
-.plyr audio,.plyr iframe,.plyr video{display:block;height:100%;width:100%}
-.plyr button{font:inherit;line-height:inherit;width:auto}
-.plyr:focus{outline:0}
-.plyr--full-ui{box-sizing:border-box}
-.plyr--full-ui *,.plyr--full-ui :after,.plyr--full-ui :before{box-sizing:inherit}
-.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}
-.plyr__badge{background:#4a5464;background:var(--plyr-badge-background,#4a5464);border-radius:2px;border-radius:var(--plyr-badge-border-radius,2px);color:#fff;color:var(--plyr-badge-text-color,#fff);font-size:9px;font-size:var(--plyr-font-size-badge,9px);line-height:1;padding:3px 4px}
-.plyr--full-ui ::-webkit-media-text-track-container{display:none}
-.plyr__captions{-webkit-animation:plyr-fade-in .3s ease;animation:plyr-fade-in .3s ease;bottom:0;display:none;font-size:13px;font-size:var(--plyr-font-size-small,13px);left:0;padding:10px;padding:var(--plyr-control-spacing,10px);position:absolute;text-align:center;transition:-webkit-transform .4s ease-in-out;transition:transform .4s ease-in-out;transition:transform .4s ease-in-out, -webkit-transform .4s ease-in-out;width:100%}
-.plyr__captions span:empty{display:none}
-@media (min-width:480px){.plyr__captions{font-size:15px;font-size:var(--plyr-font-size-base,15px);padding:20px;padding:calc(var(--plyr-control-spacing, 10px)*2)}}
-@media (min-width:768px){.plyr__captions{font-size:18px;font-size:var(--plyr-font-size-large,18px)}}
-.plyr--captions-active .plyr__captions{display:block}
-.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{-webkit-transform:translateY(-40px);transform:translateY(-40px);-webkit-transform:translateY(calc(var(--plyr-control-spacing, 10px)*-4));transform:translateY(calc(var(--plyr-control-spacing, 10px)*-4))}
-.plyr__caption{background:#000c;background:var(--plyr-captions-background,#000c);border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;color:#fff;color:var(--plyr-captions-text-color,#fff);line-height:185%;padding:.2em .5em;white-space:pre-wrap}
-.plyr__caption div{display:inline}
-.plyr__control{background:#0000;border:0;border-radius:4px;border-radius:var(--plyr-control-radius,4px);color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:7px;padding:calc(var(--plyr-control-spacing, 10px)*.7);position:relative;transition:all .3s ease}
-.plyr__control svg{fill:currentColor;display:block;height:18px;height:var(--plyr-control-icon-size,18px);pointer-events:none;width:18px;width:var(--plyr-control-icon-size,18px)}
-.plyr__control:focus{outline:0}
-.plyr__control:focus-visible{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}
-a.plyr__control{text-decoration:none}
-.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed,a.plyr__control:after,a.plyr__control:before{display:none}
-.plyr--full-ui ::-webkit-media-controls{display:none}
-.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}
-.plyr__controls .plyr__progress__container{flex:1;min-width:0}
-.plyr__controls .plyr__controls__item{margin-left:2.5px;margin-left:calc(var(--plyr-control-spacing, 10px)/4)}
-.plyr__controls .plyr__controls__item:first-child{margin-left:0;margin-right:auto}
-.plyr__controls .plyr__controls__item.plyr__progress__container{padding-left:2.5px;padding-left:calc(var(--plyr-control-spacing, 10px)/4)}
-.plyr__controls .plyr__controls__item.plyr__time{padding:0 5px;padding:0 calc(var(--plyr-control-spacing, 10px)/2)}
-.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child{padding-left:0}
-.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip],.plyr__controls:empty{display:none}
-.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}
-.plyr__menu{display:flex;position:relative}
-.plyr__menu .plyr__control svg{transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease, -webkit-transform .3s ease}
-.plyr__menu .plyr__control[aria-expanded=true] svg{-webkit-transform:rotate(90deg);transform:rotate(90deg)}
-.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}
-.plyr__menu__container{-webkit-animation:plyr-popup .2s ease;animation:plyr-popup .2s ease;background:#ffffffe6;background:var(--plyr-menu-background,#ffffffe6);border-radius:8px;border-radius:var(--plyr-menu-radius,8px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-menu-shadow,0 1px 2px #00000026);color:#4a5464;color:var(--plyr-menu-color,#4a5464);font-size:15px;font-size:var(--plyr-font-size-base,15px);margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}
-.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}
-.plyr__menu__container:after{border:4px solid #0000;border-top-color:#ffffffe6;border:var(--plyr-menu-arrow-size,4px) solid #0000;border-top-color:var(--plyr-menu-background,#ffffffe6);content:"";height:0;position:absolute;right:14px;right:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7 - var(--plyr-menu-arrow-size, 4px)/2);top:100%;width:0}
-.plyr__menu__container [role=menu]{padding:7px;padding:calc(var(--plyr-control-spacing, 10px)*.7)}
-.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}
-.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}
-.plyr__menu__container .plyr__control{align-items:center;color:#4a5464;color:var(--plyr-menu-color,#4a5464);display:flex;font-size:13px;font-size:var(--plyr-font-size-menu,var(--plyr-font-size-small,13px));padding:4.66667px 10.5px;padding:calc(var(--plyr-control-spacing, 10px)*.7/1.5) calc(var(--plyr-control-spacing, 10px)*.7*1.5);-webkit-user-select:none;user-select:none;width:100%}
-.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}
-.plyr__menu__container .plyr__control:after{border:4px solid #0000;border:var(--plyr-menu-item-arrow-size,4px) solid #0000;content:"";position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}
-.plyr__menu__container .plyr__control--forward{padding-right:28px;padding-right:calc(var(--plyr-control-spacing, 10px)*.7*4)}
-.plyr__menu__container .plyr__control--forward:after{border-left-color:#728197;border-left-color:var(--plyr-menu-arrow-color,#728197);right:6.5px;right:calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))}
-.plyr__menu__container .plyr__control--forward:focus-visible:after,.plyr__menu__container .plyr__control--forward:hover:after{border-left-color:initial}
-.plyr__menu__container .plyr__control--back{font-weight:400;font-weight:var(--plyr-font-weight-regular,400);margin:7px;margin:calc(var(--plyr-control-spacing, 10px)*.7);margin-bottom:3.5px;margin-bottom:calc(var(--plyr-control-spacing, 10px)*.7/2);padding-left:28px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7*4);position:relative;width:calc(100% - 14px);width:calc(100% - var(--plyr-control-spacing, 10px)*.7*2)}
-.plyr__menu__container .plyr__control--back:after{border-right-color:#728197;border-right-color:var(--plyr-menu-arrow-color,#728197);left:6.5px;left:calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))}
-.plyr__menu__container .plyr__control--back:before{background:#dcdfe5;background:var(--plyr-menu-back-border-color,#dcdfe5);box-shadow:0 1px 0 #fff;box-shadow:0 1px 0 var(--plyr-menu-back-border-shadow-color,#fff);content:"";height:1px;left:0;margin-top:3.5px;margin-top:calc(var(--plyr-control-spacing, 10px)*.7/2);overflow:hidden;position:absolute;right:0;top:100%}
-.plyr__menu__container .plyr__control--back:focus-visible:after,.plyr__menu__container .plyr__control--back:hover:after{border-right-color:initial}
-.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:7px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7)}
-.plyr__menu__container .plyr__control[role=menuitemradio]:after,.plyr__menu__container .plyr__control[role=menuitemradio]:before{border-radius:100%}
-.plyr__menu__container .plyr__control[role=menuitemradio]:before{background:#0000001a;content:"";display:block;flex-shrink:0;height:16px;margin-right:10px;margin-right:var(--plyr-control-spacing,10px);transition:all .3s ease;width:16px}
-.plyr__menu__container .plyr__control[role=menuitemradio]:after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;-webkit-transform:translateY(-50%) scale(0);transform:translateY(-50%) scale(0);transition:opacity .3s ease,-webkit-transform .3s ease;transition:transform .3s ease,opacity .3s ease;transition:transform .3s ease,opacity .3s ease,-webkit-transform .3s ease;width:6px}
-.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before{background:#00b2ff;background:var(--plyr-control-toggle-checked-background,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)))}
-.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:after{opacity:1;-webkit-transform:translateY(-50%) scale(1);transform:translateY(-50%) scale(1)}
-.plyr__menu__container .plyr__control[role=menuitemradio]:focus-visible:before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover:before{background:#23282f1a}
-.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:-5px;margin-right:calc(var(--plyr-control-spacing, 10px)*.7*-1 - -2px);overflow:hidden;padding-left:24.5px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7*3.5);pointer-events:none}
-.plyr--full-ui input[type=range]{-webkit-appearance:none;appearance:none;background:#0000;border:0;border-radius:26px;border-radius:calc(var(--plyr-range-thumb-height, 13px)*2);color:#00b2ff;color:var(--plyr-range-fill-background,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));display:block;height:19px;height:calc(var(--plyr-range-thumb-active-shadow-width, 3px)*2 + var(--plyr-range-thumb-height, 13px));margin:0;min-width:0;padding:0;transition:box-shadow .3s ease;width:100%}
-.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:#0000;background-image:linear-gradient(90deg,currentColor 0,#0000 0);background-image:linear-gradient(to right,currentColor var(--value,0),#0000 var(--value,0));border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-webkit-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none}
-.plyr--full-ui input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);margin-top:-4px;margin-top:calc((var(--plyr-range-thumb-height, 13px) - var(--plyr-range-track-height, 5px))/2*-1);position:relative;-webkit-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}
-.plyr--full-ui input[type=range]::-moz-range-track{background:#0000;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-moz-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}
-.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-moz-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}
-.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px)}
-.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}
-.plyr--full-ui input[type=range]:focus{outline:0}
-.plyr--full-ui input[type=range]:focus-visible::-webkit-slider-runnable-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}
-.plyr--full-ui input[type=range]:focus-visible::-moz-range-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}
-.plyr__poster{background-color:#000;background-color:var(--plyr-video-background,var(--plyr-video-background,#000));background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}
-.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}
-.plyr--youtube.plyr--paused.plyr__poster-enabled:not(.plyr--stopped) .plyr__poster{display:none}
-.plyr__time{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}
-.plyr__time+.plyr__time:before{content:"⁄";margin-right:10px;margin-right:var(--plyr-control-spacing,10px)}
-@media (max-width:767px){.plyr__time+.plyr__time{display:none}}
-.plyr__tooltip{background:#fff;background:var(--plyr-tooltip-background,#fff);border-radius:5px;border-radius:var(--plyr-tooltip-radius,5px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-tooltip-shadow,0 1px 2px #00000026);color:#4a5464;color:var(--plyr-tooltip-color,#4a5464);font-size:13px;font-size:var(--plyr-font-size-small,13px);font-weight:400;font-weight:var(--plyr-font-weight-regular,400);left:50%;line-height:1.3;margin-bottom:10px;margin-bottom:calc(var(--plyr-control-spacing, 10px)/2*2);opacity:0;padding:5px 7.5px;padding:calc(var(--plyr-control-spacing, 10px)/2) calc(var(--plyr-control-spacing, 10px)/2*1.5);pointer-events:none;position:absolute;-webkit-transform:translate(-50%,10px) scale(.8);transform:translate(-50%,10px) scale(.8);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;transition:opacity .2s ease .1s,-webkit-transform .2s ease .1s;transition:transform .2s ease .1s,opacity .2s ease .1s;transition:transform .2s ease .1s,opacity .2s ease .1s,-webkit-transform .2s ease .1s;white-space:nowrap;z-index:2}
-.plyr__tooltip:before{border-left:4px solid #0000;border-left:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-right:4px solid #0000;border-right:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-top:4px solid #fff;border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,#fff);bottom:-4px;bottom:calc(var(--plyr-tooltip-arrow-size, 4px)*-1);content:"";height:0;left:50%;position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;z-index:2}
-.plyr .plyr__control:focus-visible .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;-webkit-transform:translate(-50%) scale(1);transform:translate(-50%) scale(1)}
-.plyr .plyr__control:hover .plyr__tooltip{z-index:3}
-.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;-webkit-transform:translateY(10px) scale(.8);transform:translateY(10px) scale(.8);-webkit-transform-origin:0 100%;transform-origin:0 100%}
-.plyr__controls>.plyr__control:first-child .plyr__tooltip:before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip:before{left:16px;left:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7)}
-.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;-webkit-transform:translateY(10px) scale(.8);transform:translateY(10px) scale(.8);-webkit-transform-origin:100% 100%;transform-origin:100% 100%}
-.plyr__controls>.plyr__control:last-child .plyr__tooltip:before{left:auto;right:16px;right:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7);-webkit-transform:translateX(50%);transform:translateX(50%)}
-.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}
-.plyr__progress{left:6.5px;left:calc(var(--plyr-range-thumb-height, 13px)*.5);margin-right:13px;margin-right:var(--plyr-range-thumb-height,13px);position:relative}
-.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:-6.5px;margin-left:calc(var(--plyr-range-thumb-height, 13px)*-.5);margin-right:-6.5px;margin-right:calc(var(--plyr-range-thumb-height, 13px)*-.5);width:calc(100% + 13px);width:calc(100% + var(--plyr-range-thumb-height, 13px))}
-.plyr__progress input[type=range]{position:relative;z-index:2}
-.plyr__progress .plyr__tooltip{left:0;max-width:120px;overflow-wrap:break-word}
-.plyr__progress__buffer{-webkit-appearance:none;background:#0000;border:0;border-radius:100px;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin-top:-2.5px;margin-top:calc((var(--plyr-range-track-height, 5px)/2)*-1);padding:0;position:absolute;top:50%}
-.plyr__progress__buffer::-webkit-progress-bar{background:#0000}
-.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-webkit-transition:width .2s ease;transition:width .2s ease}
-.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-moz-transition:width .2s ease;transition:width .2s ease}
-.plyr--loading .plyr__progress__buffer{-webkit-animation:plyr-progress 1s linear infinite;animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,#23282f99 25%,#0000 0,#0000 50%,#23282f99 0,#23282f99 75%,#0000 0,#0000);background-image:linear-gradient(-45deg,var(--plyr-progress-loading-background,#23282f99) 25%,#0000 25%,#0000 50%,var(--plyr-progress-loading-background,#23282f99) 50%,var(--plyr-progress-loading-background,#23282f99) 75%,#0000 75%,#0000);background-repeat:repeat-x;background-size:25px 25px;background-size:var(--plyr-progress-loading-size,25px) var(--plyr-progress-loading-size,25px);color:#0000}
-.plyr--video.plyr--loading .plyr__progress__buffer{background-color:#ffffff40;background-color:var(--plyr-video-progress-buffered-background,#ffffff40)}
-.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:#c1c8d199;background-color:var(--plyr-audio-progress-buffered-background,#c1c8d199)}
-.plyr__progress__marker{background-color:#fff;background-color:var(--plyr-progress-marker-background,#fff);border-radius:1px;height:5px;height:var(--plyr-range-track-height,5px);position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:3px;width:var(--plyr-progress-marker-width,3px);z-index:3}
-.plyr__volume{align-items:center;display:flex;position:relative}
-.plyr__volume input[type=range]{margin-left:5px;margin-left:calc(var(--plyr-control-spacing, 10px)/2);margin-right:5px;margin-right:calc(var(--plyr-control-spacing, 10px)/2);max-width:90px;min-width:60px;position:relative;z-index:2}
-.plyr--audio{display:block}
-.plyr--audio .plyr__controls{background:#fff;background:var(--plyr-audio-controls-background,#fff);border-radius:inherit;color:#4a5464;color:var(--plyr-audio-control-color,#4a5464);padding:10px;padding:var(--plyr-control-spacing,10px)}
-.plyr--audio .plyr__control:focus-visible,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#00b2ff;background:var(--plyr-audio-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));color:#fff;color:var(--plyr-audio-control-color-hover,#fff)}
-.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}
-.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}
-.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}
-.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}
-.plyr--audio .plyr__progress__buffer{color:#c1c8d199;color:var(--plyr-audio-progress-buffered-background,#c1c8d199)}
-.plyr--video{overflow:hidden}
-.plyr--video.plyr--menu-open{overflow:visible}
-.plyr__video-wrapper{background:#000;background:var(--plyr-video-background,var(--plyr-video-background,#000));border-radius:inherit;height:100%;margin:auto;overflow:hidden;position:relative;width:100%}
-.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{aspect-ratio:16/9}
-@supports not (aspect-ratio:16/9){.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%;position:relative}}
-.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;height:100%;left:0;position:absolute;top:0;width:100%}
-.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;-webkit-transform:translateY(-38.28125%);transform:translateY(-38.28125%)}
-.plyr--video .plyr__controls{background:linear-gradient(#0000,#000000bf);background:var(--plyr-video-controls-background,linear-gradient(#0000,#000000bf));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;color:var(--plyr-video-control-color,#fff);left:0;padding:5px;padding:calc(var(--plyr-control-spacing, 10px)/2);padding-top:20px;padding-top:calc(var(--plyr-control-spacing, 10px)*2);position:absolute;right:0;transition:opacity .4s ease-in-out,-webkit-transform .4s ease-in-out;transition:opacity .4s ease-in-out,transform .4s ease-in-out;transition:opacity .4s ease-in-out,transform .4s ease-in-out,-webkit-transform .4s ease-in-out;z-index:3}
-@media (min-width:480px){.plyr--video .plyr__controls{padding:10px;padding:var(--plyr-control-spacing,10px);padding-top:35px;padding-top:calc(var(--plyr-control-spacing, 10px)*3.5)}}
-.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;-webkit-transform:translateY(100%);transform:translateY(100%)}
-.plyr--video .plyr__control:focus-visible,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#00b2ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));color:#fff;color:var(--plyr-video-control-color-hover,#fff)}
-.plyr__control--overlaid{background:#00b2ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));border:0;border-radius:100%;color:#fff;color:var(--plyr-video-control-color,#fff);display:none;left:50%;opacity:.9;padding:15px;padding:calc(var(--plyr-control-spacing, 10px)*1.5);position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);transition:.3s;z-index:2}
-.plyr__control--overlaid svg{left:2px;position:relative}
-.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{opacity:1}
-.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}
-.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}
-.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}
-.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}
-.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}
-.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}
-.plyr--video .plyr__progress__buffer{color:#ffffff40;color:var(--plyr-video-progress-buffered-background,#ffffff40)}
-.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}
-.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}
-.plyr:-webkit-full-screen video{height:100%}
-.plyr:fullscreen video{height:100%}
-.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}
-.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}
-.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}
-.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}
-.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}
-.plyr:fullscreen.plyr--hide-controls{cursor:none}
-@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}.plyr:fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}
-.plyr--fullscreen-fallback{background:#000;border-radius:0!important;bottom:0;height:100%;left:0;margin:0;position:fixed;right:0;top:0;width:100%;z-index:10000000}
-.plyr--fullscreen-fallback video{height:100%}
-.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}
-.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}
-.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}
-@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}
-.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}
-.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}
-.plyr__ads:after{background:#23282f;border-radius:2px;bottom:10px;bottom:var(--plyr-control-spacing,10px);color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;right:var(--plyr-control-spacing,10px);z-index:3}
-.plyr__ads:empty:after{display:none}
-.plyr__cues{background:currentColor;display:block;height:5px;height:var(--plyr-range-track-height,5px);left:0;opacity:.8;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:3px;z-index:3}
-.plyr__preview-thumb{background-color:#fff;background-color:var(--plyr-tooltip-background,#fff);border-radius:8px;border-radius:var(--plyr-menu-radius,8px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-tooltip-shadow,0 1px 2px #00000026);margin-bottom:10px;margin-bottom:calc(var(--plyr-control-spacing, 10px)/2*2);opacity:0;padding:3px;pointer-events:none;position:absolute;-webkit-transform:translateY(10px) scale(.8);transform:translateY(10px) scale(.8);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;transition:opacity .2s ease .1s,-webkit-transform .2s ease .1s;transition:transform .2s ease .1s,opacity .2s ease .1s;transition:transform .2s ease .1s,opacity .2s ease .1s,-webkit-transform .2s ease .1s;z-index:2}
-.plyr__preview-thumb--is-shown{opacity:1;-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}
-.plyr__preview-thumb:before{border-left:4px solid #0000;border-left:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-right:4px solid #0000;border-right:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-top:4px solid #fff;border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,#fff);bottom:-4px;bottom:calc(var(--plyr-tooltip-arrow-size, 4px)*-1);content:"";height:0;left:calc(50% + var(--preview-arrow-offset));position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;z-index:2}
-.plyr__preview-thumb__image-container{background:#c1c8d1;border-radius:7px;border-radius:calc(var(--plyr-menu-radius, 8px) - 1px);overflow:hidden;position:relative;z-index:0}
-.plyr__preview-thumb__image-container img,.plyr__preview-thumb__image-container:after{height:100%;left:0;position:absolute;top:0;width:100%}
-.plyr__preview-thumb__image-container:after{border-radius:inherit;box-shadow:inset 0 0 0 1px #00000026;content:"";pointer-events:none}
-.plyr__preview-thumb__image-container img{max-height:none;max-width:none}
-.plyr__preview-thumb__time-container{background:linear-gradient(#0000,#000000bf);background:var(--plyr-video-controls-background,linear-gradient(#0000,#000000bf));border-bottom-left-radius:7px;border-bottom-left-radius:calc(var(--plyr-menu-radius, 8px) - 1px);border-bottom-right-radius:7px;border-bottom-right-radius:calc(var(--plyr-menu-radius, 8px) - 1px);bottom:0;left:0;line-height:1.1;padding:20px 6px 6px;position:absolute;right:0;z-index:3}
-.plyr__preview-thumb__time-container span{color:#fff;font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}
-.plyr__preview-scrubbing{bottom:0;-webkit-filter:blur(1px);filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}
-.plyr__preview-scrubbing--is-shown{opacity:1}
-.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;-o-object-fit:contain;object-fit:contain;position:absolute;top:0;width:100%}
-.plyr--no-transition{transition:none!important}
-.plyr__sr-only{clip:rect(1px,1px,1px,1px);border:0!important;height:1px!important;overflow:hidden;padding:0!important;position:absolute!important;width:1px!important}
-.plyr [hidden]{display:none!important}
-main {
-	background: transparent;
-	grid-auto-rows: auto;
-}
-.thread {
-	display: flex;
-	flex-direction: column;
-	gap: 1rem;
-	border-radius: var(--br);
-}
-.toot {
-	background: var(--toot-bg);
-	border-radius: var(--br);
-	display: flex;
-	flex-direction: column;
-	padding: 1rem;
-	gap: 0.75rem;
-}
-.toot a {
-		color: inherit;
-		text-decoration: none;
-	}
-.toot .author {
-		display: flex;
-		flex-direction: row;
-		flex-wrap: nowrap;
-		gap: 0.75rem;
-	}
-.toot .author .avatar {
-		height: 3rem;
-		width: 3rem;
-		-o-object-fit: cover;
-		object-fit: cover;
-		border-radius: var(--br);
-		overflow: hidden;
-	}
-.toot .author .avatar img {
-			height: 100%;
-			width: 100%;
-			-o-object-fit: cover;
-			object-fit: cover;
-		}
-
-.toot .author .user-info {
-		display: flex;
-		flex-direction: column;
-		flex-wrap: nowrap;
-		justify-content: space-around;
-	}
-.toot .author .displayname,
-.toot .author .username {
-			white-space: nowrap;
-			overflow: hidden;
-			text-overflow: ellipsis;
-		}
-.toot .author .displayname {
-			font-weight: bold;
-		}
-.toot .author .username {
-			color: var(--link-fg);
-		}
-
-.toot .body {
-		display: flex;
-		flex-direction: column;
-		gap: 0.5rem;
-	}
-.toot details > summary {
-		display: inline-block;
-		list-style: none;
-	}
-.toot details > summary::-webkit-details-marker {
-			display: none; /* Safari */
-		}
-.toot details > summary .button {
-			white-space: nowrap;
-			cursor: pointer;
-		}
-.toot .text details > summary {
-			padding-bottom: 0.5rem;
-		}
-.toot .text details > summary .button {
-				padding: 0.2rem 0.3rem;
-				font-size: 1rem;
-			}
-.toot .text a {
-			color: var(--link-fg);
-			text-decoration: underline;
-		}
-.toot .text .content {
-			word-break: break-word;
-		}
-.toot .text .content blockquote {
-				padding: 0.25rem 0 0.25rem 0.5rem;
-				border-left: 0.25rem solid var(--border-accent);
-				margin: 0;
-				font-style: italic;
-			}
-.toot .text .content hr {
-				border: 1px dashed var(--border-accent);
-			}
-.toot .text .content pre, .toot .text .content code {
-				background-color: var(--gray2);
-			}
-.toot .text .content code {
-				padding: 0.25rem 0.5rem;
-				border-radius: var(--br-inner);
-			}
-.toot .text .content pre {
-				display: flex;
-				border-radius: var(--br);
-				overflow: hidden;
-				margin: 0;
-			}
-.toot .text .content pre code {	
-					padding: 0.25rem 0.5rem;
-					white-space: pre;
-					border-radius: 0;
-					overflow: auto;
-					-webkit-overflow-scrolling: touch;
-				}
-.toot .text .content img {
-				max-width: 100%;
-				margin: 5px auto;
-			}
-.toot .text .content img[alt~="!center"] {
-				display: block;
-			}
-.toot .text .emoji {
-			transition: 0.1s;
-		}
-.toot .text .emoji:hover, .toot .text .emoji:active {
-			-webkit-transform: scale(2);
-			transform: scale(2);
-			background-color: var(--bg);
-			box-shadow: var(--boxshadow);
-			border: var(--boxshadow-border);
-			border-radius: var(--br-inner);
-		}
-.toot .media {
-		grid-column: span 3;
-		display: grid;
-		grid-template-columns: 50% 50%;
-		grid-auto-rows: 10rem;
-		overflow: hidden;
-	}
-.toot .media .media-wrapper {
-			height: 100%;
-			width: 100%;
-			box-sizing: border-box;
-			border: 0.15rem solid var(--gray2);
-			border-radius: var(--br);
-			position: relative;
-			overflow: hidden;
-			z-index: 2;
-		}
-.toot .media .media-wrapper details {
-				position: absolute;
-				height: 100%;
-				width: 100%;
-			}
-.toot .media .media-wrapper details[open] summary {
-					height: auto;
-					width: auto;
-					margin: 1rem;
-					padding: 0;
-				}
-.toot .media .media-wrapper details[open] summary .show, .toot .media .media-wrapper details[open] summary video, .toot .media .media-wrapper details[open] summary img {
-						display: none;
-					}
-.toot .media .media-wrapper details[open] summary .eye.button .hide {
-						display: inline-block;
-						grid-column: 1 / span 3;
-						grid-row: 1 / span 2;
-					}
-.toot .media .media-wrapper details summary {
-					position: absolute;
-					height: 100%;
-					width: 100%;
-					z-index: 3;
-					overflow: hidden;
-					
-					display: grid;
-					padding: 1rem;
-					grid-template-columns: 1fr auto 1fr;
-					grid-template-rows: 1fr 1fr;
-					grid-template-areas: 
-						"eye  sensitive  ."
-						".    sensitive  .";
-				}
-.toot .media .media-wrapper details summary .eye.button {
-						grid-area: eye;
-						align-self: start;
-						justify-self: start;
-						margin: 0;
-						padding: 0.4rem;
-					}
-.toot .media .media-wrapper details summary .eye.button .fa-fw {
-							line-height: var(--fa-fw);
-						}
-.toot .media .media-wrapper details summary .eye.button .hide {
-							display: none;
-						}
-.toot .media .media-wrapper details summary .show.sensitive {
-						grid-area: sensitive;
-						align-self: center;
-					}
-.toot .media .media-wrapper details summary .show.sensitive .button {
-							cursor: pointer;
-							align-self: center;
-						}
-.toot .media .media-wrapper details summary video, .toot .media .media-wrapper details summary img {
-						z-index: -1;
-						position: absolute;
-						height: calc(100% + 1.2rem);
-						width: calc(100% + 1.2rem);
-						top: -0.6rem;
-						left: -0.6rem;
-						-webkit-filter: blur(1.2rem);
-						filter: blur(1.2rem);
-					}
-.toot .media .media-wrapper details video.plyr-video, .toot .media .media-wrapper details .plyr {
-					position: absolute;
-					height: 100%;
-					width: 100%;
-					-o-object-fit: contain;
-					object-fit: contain;
-					background: var(--gray2);
-				}
-.toot .media.single .media-wrapper {
-			grid-column: span 2;
-		}
-.toot .media.odd .media-wrapper:first-child, .toot .media.double .media-wrapper {
-			grid-row: span 2;
-		}
-.toot .media img {
-			width: 100%;
-			height: 100%;
-			-o-object-fit: cover;
-			object-fit: cover;
-		}
-.toot .meta {
-		display: flex;
-		flex-direction: row;
+  /* override styles that were set via JS.
+    as they interfere with size measurement */
+  top: auto !important; 
+  left: 0 !important;
+}
+@-webkit-keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}
+@keyframes plyr-progress{to{background-position:25px 0;background-position:var(--plyr-progress-loading-size,25px) 0}}
+@-webkit-keyframes plyr-popup{0%{opacity:.5;-webkit-transform:translateY(10px);transform:translateY(10px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}
+@keyframes plyr-popup{0%{opacity:.5;-webkit-transform:translateY(10px);transform:translateY(10px)}to{opacity:1;-webkit-transform:translateY(0);transform:translateY(0)}}
+@-webkit-keyframes plyr-fade-in{0%{opacity:0}to{opacity:1}}
+@keyframes plyr-fade-in{0%{opacity:0}to{opacity:1}}
+.plyr{-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;align-items:center;direction:ltr;display:flex;flex-direction:column;font-family:inherit;font-family:var(--plyr-font-family,inherit);font-variant-numeric:tabular-nums;font-weight:400;font-weight:var(--plyr-font-weight-regular,400);line-height:1.7;line-height:var(--plyr-line-height,1.7);max-width:100%;min-width:200px;position:relative;text-shadow:none;transition:box-shadow .3s ease;z-index:0}
+.plyr audio,.plyr iframe,.plyr video{display:block;height:100%;width:100%}
+.plyr button{font:inherit;line-height:inherit;width:auto}
+.plyr:focus{outline:0}
+.plyr--full-ui{box-sizing:border-box}
+.plyr--full-ui *,.plyr--full-ui :after,.plyr--full-ui :before{box-sizing:inherit}
+.plyr--full-ui a,.plyr--full-ui button,.plyr--full-ui input,.plyr--full-ui label{touch-action:manipulation}
+.plyr__badge{background:#4a5464;background:var(--plyr-badge-background,#4a5464);border-radius:2px;border-radius:var(--plyr-badge-border-radius,2px);color:#fff;color:var(--plyr-badge-text-color,#fff);font-size:9px;font-size:var(--plyr-font-size-badge,9px);line-height:1;padding:3px 4px}
+.plyr--full-ui ::-webkit-media-text-track-container{display:none}
+.plyr__captions{-webkit-animation:plyr-fade-in .3s ease;animation:plyr-fade-in .3s ease;bottom:0;display:none;font-size:13px;font-size:var(--plyr-font-size-small,13px);left:0;padding:10px;padding:var(--plyr-control-spacing,10px);position:absolute;text-align:center;transition:-webkit-transform .4s ease-in-out;transition:transform .4s ease-in-out;transition:transform .4s ease-in-out, -webkit-transform .4s ease-in-out;width:100%}
+.plyr__captions span:empty{display:none}
+@media (min-width:480px){.plyr__captions{font-size:15px;font-size:var(--plyr-font-size-base,15px);padding:20px;padding:calc(var(--plyr-control-spacing, 10px)*2)}}
+@media (min-width:768px){.plyr__captions{font-size:18px;font-size:var(--plyr-font-size-large,18px)}}
+.plyr--captions-active .plyr__captions{display:block}
+.plyr:not(.plyr--hide-controls) .plyr__controls:not(:empty)~.plyr__captions{-webkit-transform:translateY(-40px);transform:translateY(-40px);-webkit-transform:translateY(calc(var(--plyr-control-spacing, 10px)*-4));transform:translateY(calc(var(--plyr-control-spacing, 10px)*-4))}
+.plyr__caption{background:#000c;background:var(--plyr-captions-background,#000c);border-radius:2px;-webkit-box-decoration-break:clone;box-decoration-break:clone;color:#fff;color:var(--plyr-captions-text-color,#fff);line-height:185%;padding:.2em .5em;white-space:pre-wrap}
+.plyr__caption div{display:inline}
+.plyr__control{background:#0000;border:0;border-radius:4px;border-radius:var(--plyr-control-radius,4px);color:inherit;cursor:pointer;flex-shrink:0;overflow:visible;padding:7px;padding:calc(var(--plyr-control-spacing, 10px)*.7);position:relative;transition:all .3s ease}
+.plyr__control svg{fill:currentColor;display:block;height:18px;height:var(--plyr-control-icon-size,18px);pointer-events:none;width:18px;width:var(--plyr-control-icon-size,18px)}
+.plyr__control:focus{outline:0}
+.plyr__control:focus-visible{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}
+a.plyr__control{text-decoration:none}
+.plyr__control.plyr__control--pressed .icon--not-pressed,.plyr__control.plyr__control--pressed .label--not-pressed,.plyr__control:not(.plyr__control--pressed) .icon--pressed,.plyr__control:not(.plyr__control--pressed) .label--pressed,a.plyr__control:after,a.plyr__control:before{display:none}
+.plyr--full-ui ::-webkit-media-controls{display:none}
+.plyr__controls{align-items:center;display:flex;justify-content:flex-end;text-align:center}
+.plyr__controls .plyr__progress__container{flex:1;min-width:0}
+.plyr__controls .plyr__controls__item{margin-left:2.5px;margin-left:calc(var(--plyr-control-spacing, 10px)/4)}
+.plyr__controls .plyr__controls__item:first-child{margin-left:0;margin-right:auto}
+.plyr__controls .plyr__controls__item.plyr__progress__container{padding-left:2.5px;padding-left:calc(var(--plyr-control-spacing, 10px)/4)}
+.plyr__controls .plyr__controls__item.plyr__time{padding:0 5px;padding:0 calc(var(--plyr-control-spacing, 10px)/2)}
+.plyr__controls .plyr__controls__item.plyr__progress__container:first-child,.plyr__controls .plyr__controls__item.plyr__time+.plyr__time,.plyr__controls .plyr__controls__item.plyr__time:first-child{padding-left:0}
+.plyr [data-plyr=airplay],.plyr [data-plyr=captions],.plyr [data-plyr=fullscreen],.plyr [data-plyr=pip],.plyr__controls:empty{display:none}
+.plyr--airplay-supported [data-plyr=airplay],.plyr--captions-enabled [data-plyr=captions],.plyr--fullscreen-enabled [data-plyr=fullscreen],.plyr--pip-supported [data-plyr=pip]{display:inline-block}
+.plyr__menu{display:flex;position:relative}
+.plyr__menu .plyr__control svg{transition:-webkit-transform .3s ease;transition:transform .3s ease;transition:transform .3s ease, -webkit-transform .3s ease}
+.plyr__menu .plyr__control[aria-expanded=true] svg{-webkit-transform:rotate(90deg);transform:rotate(90deg)}
+.plyr__menu .plyr__control[aria-expanded=true] .plyr__tooltip{display:none}
+.plyr__menu__container{-webkit-animation:plyr-popup .2s ease;animation:plyr-popup .2s ease;background:#ffffffe6;background:var(--plyr-menu-background,#ffffffe6);border-radius:8px;border-radius:var(--plyr-menu-radius,8px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-menu-shadow,0 1px 2px #00000026);color:#4a5464;color:var(--plyr-menu-color,#4a5464);font-size:15px;font-size:var(--plyr-font-size-base,15px);margin-bottom:10px;position:absolute;right:-3px;text-align:left;white-space:nowrap;z-index:3}
+.plyr__menu__container>div{overflow:hidden;transition:height .35s cubic-bezier(.4,0,.2,1),width .35s cubic-bezier(.4,0,.2,1)}
+.plyr__menu__container:after{border:4px solid #0000;border-top-color:#ffffffe6;border:var(--plyr-menu-arrow-size,4px) solid #0000;border-top-color:var(--plyr-menu-background,#ffffffe6);content:"";height:0;position:absolute;right:14px;right:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7 - var(--plyr-menu-arrow-size, 4px)/2);top:100%;width:0}
+.plyr__menu__container [role=menu]{padding:7px;padding:calc(var(--plyr-control-spacing, 10px)*.7)}
+.plyr__menu__container [role=menuitem],.plyr__menu__container [role=menuitemradio]{margin-top:2px}
+.plyr__menu__container [role=menuitem]:first-child,.plyr__menu__container [role=menuitemradio]:first-child{margin-top:0}
+.plyr__menu__container .plyr__control{align-items:center;color:#4a5464;color:var(--plyr-menu-color,#4a5464);display:flex;font-size:13px;font-size:var(--plyr-font-size-menu,var(--plyr-font-size-small,13px));padding:4.66667px 10.5px;padding:calc(var(--plyr-control-spacing, 10px)*.7/1.5) calc(var(--plyr-control-spacing, 10px)*.7*1.5);-webkit-user-select:none;user-select:none;width:100%}
+.plyr__menu__container .plyr__control>span{align-items:inherit;display:flex;width:100%}
+.plyr__menu__container .plyr__control:after{border:4px solid #0000;border:var(--plyr-menu-item-arrow-size,4px) solid #0000;content:"";position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}
+.plyr__menu__container .plyr__control--forward{padding-right:28px;padding-right:calc(var(--plyr-control-spacing, 10px)*.7*4)}
+.plyr__menu__container .plyr__control--forward:after{border-left-color:#728197;border-left-color:var(--plyr-menu-arrow-color,#728197);right:6.5px;right:calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))}
+.plyr__menu__container .plyr__control--forward:focus-visible:after,.plyr__menu__container .plyr__control--forward:hover:after{border-left-color:initial}
+.plyr__menu__container .plyr__control--back{font-weight:400;font-weight:var(--plyr-font-weight-regular,400);margin:7px;margin:calc(var(--plyr-control-spacing, 10px)*.7);margin-bottom:3.5px;margin-bottom:calc(var(--plyr-control-spacing, 10px)*.7/2);padding-left:28px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7*4);position:relative;width:calc(100% - 14px);width:calc(100% - var(--plyr-control-spacing, 10px)*.7*2)}
+.plyr__menu__container .plyr__control--back:after{border-right-color:#728197;border-right-color:var(--plyr-menu-arrow-color,#728197);left:6.5px;left:calc(var(--plyr-control-spacing, 10px)*.7*1.5 - var(--plyr-menu-item-arrow-size, 4px))}
+.plyr__menu__container .plyr__control--back:before{background:#dcdfe5;background:var(--plyr-menu-back-border-color,#dcdfe5);box-shadow:0 1px 0 #fff;box-shadow:0 1px 0 var(--plyr-menu-back-border-shadow-color,#fff);content:"";height:1px;left:0;margin-top:3.5px;margin-top:calc(var(--plyr-control-spacing, 10px)*.7/2);overflow:hidden;position:absolute;right:0;top:100%}
+.plyr__menu__container .plyr__control--back:focus-visible:after,.plyr__menu__container .plyr__control--back:hover:after{border-right-color:initial}
+.plyr__menu__container .plyr__control[role=menuitemradio]{padding-left:7px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7)}
+.plyr__menu__container .plyr__control[role=menuitemradio]:after,.plyr__menu__container .plyr__control[role=menuitemradio]:before{border-radius:100%}
+.plyr__menu__container .plyr__control[role=menuitemradio]:before{background:#0000001a;content:"";display:block;flex-shrink:0;height:16px;margin-right:10px;margin-right:var(--plyr-control-spacing,10px);transition:all .3s ease;width:16px}
+.plyr__menu__container .plyr__control[role=menuitemradio]:after{background:#fff;border:0;height:6px;left:12px;opacity:0;top:50%;-webkit-transform:translateY(-50%) scale(0);transform:translateY(-50%) scale(0);transition:opacity .3s ease,-webkit-transform .3s ease;transition:transform .3s ease,opacity .3s ease;transition:transform .3s ease,opacity .3s ease,-webkit-transform .3s ease;width:6px}
+.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:before{background:#00b2ff;background:var(--plyr-control-toggle-checked-background,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)))}
+.plyr__menu__container .plyr__control[role=menuitemradio][aria-checked=true]:after{opacity:1;-webkit-transform:translateY(-50%) scale(1);transform:translateY(-50%) scale(1)}
+.plyr__menu__container .plyr__control[role=menuitemradio]:focus-visible:before,.plyr__menu__container .plyr__control[role=menuitemradio]:hover:before{background:#23282f1a}
+.plyr__menu__container .plyr__menu__value{align-items:center;display:flex;margin-left:auto;margin-right:-5px;margin-right:calc(var(--plyr-control-spacing, 10px)*.7*-1 - -2px);overflow:hidden;padding-left:24.5px;padding-left:calc(var(--plyr-control-spacing, 10px)*.7*3.5);pointer-events:none}
+.plyr--full-ui input[type=range]{-webkit-appearance:none;appearance:none;background:#0000;border:0;border-radius:26px;border-radius:calc(var(--plyr-range-thumb-height, 13px)*2);color:#00b2ff;color:var(--plyr-range-fill-background,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));display:block;height:19px;height:calc(var(--plyr-range-thumb-active-shadow-width, 3px)*2 + var(--plyr-range-thumb-height, 13px));margin:0;min-width:0;padding:0;transition:box-shadow .3s ease;width:100%}
+.plyr--full-ui input[type=range]::-webkit-slider-runnable-track{background:#0000;background-image:linear-gradient(90deg,currentColor 0,#0000 0);background-image:linear-gradient(to right,currentColor var(--value,0),#0000 var(--value,0));border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-webkit-transition:box-shadow .3s ease;transition:box-shadow .3s ease;-webkit-user-select:none;user-select:none}
+.plyr--full-ui input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);margin-top:-4px;margin-top:calc((var(--plyr-range-thumb-height, 13px) - var(--plyr-range-track-height, 5px))/2*-1);position:relative;-webkit-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}
+.plyr--full-ui input[type=range]::-moz-range-track{background:#0000;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-moz-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}
+.plyr--full-ui input[type=range]::-moz-range-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);position:relative;-moz-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}
+.plyr--full-ui input[type=range]::-moz-range-progress{background:currentColor;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px)}
+.plyr--full-ui input[type=range]::-ms-track{color:#0000}
+.plyr--full-ui input[type=range]::-ms-fill-upper,.plyr--full-ui input[type=range]::-ms-track{background:#0000;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}
+.plyr--full-ui input[type=range]::-ms-fill-lower{background:#0000;background:currentColor;border:0;border-radius:2.5px;border-radius:calc(var(--plyr-range-track-height, 5px)/2);height:5px;height:var(--plyr-range-track-height,5px);-ms-transition:box-shadow .3s ease;transition:box-shadow .3s ease;user-select:none}
+.plyr--full-ui input[type=range]::-ms-thumb{background:#fff;background:var(--plyr-range-thumb-background,#fff);border:0;border-radius:100%;box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33);height:13px;height:var(--plyr-range-thumb-height,13px);margin-top:0;position:relative;-ms-transition:all .2s ease;transition:all .2s ease;width:13px;width:var(--plyr-range-thumb-height,13px)}
+.plyr--full-ui input[type=range]::-ms-tooltip{display:none}
+.plyr--full-ui input[type=range]::-moz-focus-outer{border:0}
+.plyr--full-ui input[type=range]:focus{outline:0}
+.plyr--full-ui input[type=range]:focus-visible::-webkit-slider-runnable-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}
+.plyr--full-ui input[type=range]:focus-visible::-moz-range-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}
+.plyr--full-ui input[type=range]:focus-visible::-ms-track{outline:2px dashed #00b2ff;outline:2px dashed var(--plyr-focus-visible-color,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));outline-offset:2px}
+.plyr__poster{background-color:#000;background-color:var(--plyr-video-background,var(--plyr-video-background,#000));background-position:50% 50%;background-repeat:no-repeat;background-size:contain;height:100%;left:0;opacity:0;position:absolute;top:0;transition:opacity .2s ease;width:100%;z-index:1}
+.plyr--stopped.plyr__poster-enabled .plyr__poster{opacity:1}
+.plyr--youtube.plyr--paused.plyr__poster-enabled:not(.plyr--stopped) .plyr__poster{display:none}
+.plyr__time{font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}
+.plyr__time+.plyr__time:before{content:"⁄";margin-right:10px;margin-right:var(--plyr-control-spacing,10px)}
+@media (max-width:767px){.plyr__time+.plyr__time{display:none}}
+.plyr__tooltip{background:#fff;background:var(--plyr-tooltip-background,#fff);border-radius:5px;border-radius:var(--plyr-tooltip-radius,5px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-tooltip-shadow,0 1px 2px #00000026);color:#4a5464;color:var(--plyr-tooltip-color,#4a5464);font-size:13px;font-size:var(--plyr-font-size-small,13px);font-weight:400;font-weight:var(--plyr-font-weight-regular,400);left:50%;line-height:1.3;margin-bottom:10px;margin-bottom:calc(var(--plyr-control-spacing, 10px)/2*2);opacity:0;padding:5px 7.5px;padding:calc(var(--plyr-control-spacing, 10px)/2) calc(var(--plyr-control-spacing, 10px)/2*1.5);pointer-events:none;position:absolute;-webkit-transform:translate(-50%,10px) scale(.8);transform:translate(-50%,10px) scale(.8);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;transition:opacity .2s ease .1s,-webkit-transform .2s ease .1s;transition:transform .2s ease .1s,opacity .2s ease .1s;transition:transform .2s ease .1s,opacity .2s ease .1s,-webkit-transform .2s ease .1s;white-space:nowrap;z-index:2}
+.plyr__tooltip:before{border-left:4px solid #0000;border-left:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-right:4px solid #0000;border-right:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-top:4px solid #fff;border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,#fff);bottom:-4px;bottom:calc(var(--plyr-tooltip-arrow-size, 4px)*-1);content:"";height:0;left:50%;position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;z-index:2}
+.plyr .plyr__control:focus-visible .plyr__tooltip,.plyr .plyr__control:hover .plyr__tooltip,.plyr__tooltip--visible{opacity:1;-webkit-transform:translate(-50%) scale(1);transform:translate(-50%) scale(1)}
+.plyr .plyr__control:hover .plyr__tooltip{z-index:3}
+.plyr__controls>.plyr__control:first-child .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip{left:0;-webkit-transform:translateY(10px) scale(.8);transform:translateY(10px) scale(.8);-webkit-transform-origin:0 100%;transform-origin:0 100%}
+.plyr__controls>.plyr__control:first-child .plyr__tooltip:before,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip:before{left:16px;left:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7)}
+.plyr__controls>.plyr__control:last-child .plyr__tooltip{left:auto;right:0;-webkit-transform:translateY(10px) scale(.8);transform:translateY(10px) scale(.8);-webkit-transform-origin:100% 100%;transform-origin:100% 100%}
+.plyr__controls>.plyr__control:last-child .plyr__tooltip:before{left:auto;right:16px;right:calc(var(--plyr-control-icon-size, 18px)/2 + var(--plyr-control-spacing, 10px)*.7);-webkit-transform:translateX(50%);transform:translateX(50%)}
+.plyr__controls>.plyr__control:first-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control .plyr__tooltip--visible,.plyr__controls>.plyr__control:first-child+.plyr__control:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:first-child+.plyr__control:hover .plyr__tooltip,.plyr__controls>.plyr__control:first-child:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:first-child:hover .plyr__tooltip,.plyr__controls>.plyr__control:last-child .plyr__tooltip--visible,.plyr__controls>.plyr__control:last-child:focus-visible .plyr__tooltip,.plyr__controls>.plyr__control:last-child:hover .plyr__tooltip{-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}
+.plyr__progress{left:6.5px;left:calc(var(--plyr-range-thumb-height, 13px)*.5);margin-right:13px;margin-right:var(--plyr-range-thumb-height,13px);position:relative}
+.plyr__progress input[type=range],.plyr__progress__buffer{margin-left:-6.5px;margin-left:calc(var(--plyr-range-thumb-height, 13px)*-.5);margin-right:-6.5px;margin-right:calc(var(--plyr-range-thumb-height, 13px)*-.5);width:calc(100% + 13px);width:calc(100% + var(--plyr-range-thumb-height, 13px))}
+.plyr__progress input[type=range]{position:relative;z-index:2}
+.plyr__progress .plyr__tooltip{left:0;max-width:120px;overflow-wrap:break-word}
+.plyr__progress__buffer{-webkit-appearance:none;background:#0000;border:0;border-radius:100px;height:5px;height:var(--plyr-range-track-height,5px);left:0;margin-top:-2.5px;margin-top:calc((var(--plyr-range-track-height, 5px)/2)*-1);padding:0;position:absolute;top:50%}
+.plyr__progress__buffer::-webkit-progress-bar{background:#0000}
+.plyr__progress__buffer::-webkit-progress-value{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-webkit-transition:width .2s ease;transition:width .2s ease}
+.plyr__progress__buffer::-moz-progress-bar{background:currentColor;border-radius:100px;min-width:5px;min-width:var(--plyr-range-track-height,5px);-moz-transition:width .2s ease;transition:width .2s ease}
+.plyr__progress__buffer::-ms-fill{border-radius:100px;-ms-transition:width .2s ease;transition:width .2s ease}
+.plyr--loading .plyr__progress__buffer{-webkit-animation:plyr-progress 1s linear infinite;animation:plyr-progress 1s linear infinite;background-image:linear-gradient(-45deg,#23282f99 25%,#0000 0,#0000 50%,#23282f99 0,#23282f99 75%,#0000 0,#0000);background-image:linear-gradient(-45deg,var(--plyr-progress-loading-background,#23282f99) 25%,#0000 25%,#0000 50%,var(--plyr-progress-loading-background,#23282f99) 50%,var(--plyr-progress-loading-background,#23282f99) 75%,#0000 75%,#0000);background-repeat:repeat-x;background-size:25px 25px;background-size:var(--plyr-progress-loading-size,25px) var(--plyr-progress-loading-size,25px);color:#0000}
+.plyr--video.plyr--loading .plyr__progress__buffer{background-color:#ffffff40;background-color:var(--plyr-video-progress-buffered-background,#ffffff40)}
+.plyr--audio.plyr--loading .plyr__progress__buffer{background-color:#c1c8d199;background-color:var(--plyr-audio-progress-buffered-background,#c1c8d199)}
+.plyr__progress__marker{background-color:#fff;background-color:var(--plyr-progress-marker-background,#fff);border-radius:1px;height:5px;height:var(--plyr-range-track-height,5px);position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);width:3px;width:var(--plyr-progress-marker-width,3px);z-index:3}
+.plyr__volume{align-items:center;display:flex;position:relative}
+.plyr__volume input[type=range]{margin-left:5px;margin-left:calc(var(--plyr-control-spacing, 10px)/2);margin-right:5px;margin-right:calc(var(--plyr-control-spacing, 10px)/2);max-width:90px;min-width:60px;position:relative;z-index:2}
+.plyr--audio{display:block}
+.plyr--audio .plyr__controls{background:#fff;background:var(--plyr-audio-controls-background,#fff);border-radius:inherit;color:#4a5464;color:var(--plyr-audio-control-color,#4a5464);padding:10px;padding:var(--plyr-control-spacing,10px)}
+.plyr--audio .plyr__control:focus-visible,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#00b2ff;background:var(--plyr-audio-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));color:#fff;color:var(--plyr-audio-control-color-hover,#fff)}
+.plyr--full-ui.plyr--audio input[type=range]::-webkit-slider-runnable-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}
+.plyr--full-ui.plyr--audio input[type=range]::-moz-range-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}
+.plyr--full-ui.plyr--audio input[type=range]::-ms-track{background-color:#c1c8d199;background-color:var(--plyr-audio-range-track-background,var(--plyr-audio-progress-buffered-background,#c1c8d199))}
+.plyr--full-ui.plyr--audio input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}
+.plyr--full-ui.plyr--audio input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}
+.plyr--full-ui.plyr--audio input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #23282f1a;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#23282f1a)}
+.plyr--audio .plyr__progress__buffer{color:#c1c8d199;color:var(--plyr-audio-progress-buffered-background,#c1c8d199)}
+.plyr--video{overflow:hidden}
+.plyr--video.plyr--menu-open{overflow:visible}
+.plyr__video-wrapper{background:#000;background:var(--plyr-video-background,var(--plyr-video-background,#000));border-radius:inherit;height:100%;margin:auto;overflow:hidden;position:relative;width:100%}
+.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{aspect-ratio:16/9}
+@supports not (aspect-ratio:16/9){.plyr__video-embed,.plyr__video-wrapper--fixed-ratio{height:0;padding-bottom:56.25%;position:relative}}
+.plyr__video-embed iframe,.plyr__video-wrapper--fixed-ratio video{border:0;height:100%;left:0;position:absolute;top:0;width:100%}
+.plyr--full-ui .plyr__video-embed>.plyr__video-embed__container{padding-bottom:240%;position:relative;-webkit-transform:translateY(-38.28125%);transform:translateY(-38.28125%)}
+.plyr--video .plyr__controls{background:linear-gradient(#0000,#000000bf);background:var(--plyr-video-controls-background,linear-gradient(#0000,#000000bf));border-bottom-left-radius:inherit;border-bottom-right-radius:inherit;bottom:0;color:#fff;color:var(--plyr-video-control-color,#fff);left:0;padding:5px;padding:calc(var(--plyr-control-spacing, 10px)/2);padding-top:20px;padding-top:calc(var(--plyr-control-spacing, 10px)*2);position:absolute;right:0;transition:opacity .4s ease-in-out,-webkit-transform .4s ease-in-out;transition:opacity .4s ease-in-out,transform .4s ease-in-out;transition:opacity .4s ease-in-out,transform .4s ease-in-out,-webkit-transform .4s ease-in-out;z-index:3}
+@media (min-width:480px){.plyr--video .plyr__controls{padding:10px;padding:var(--plyr-control-spacing,10px);padding-top:35px;padding-top:calc(var(--plyr-control-spacing, 10px)*3.5)}}
+.plyr--video.plyr--hide-controls .plyr__controls{opacity:0;pointer-events:none;-webkit-transform:translateY(100%);transform:translateY(100%)}
+.plyr--video .plyr__control:focus-visible,.plyr--video .plyr__control:hover,.plyr--video .plyr__control[aria-expanded=true]{background:#00b2ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));color:#fff;color:var(--plyr-video-control-color-hover,#fff)}
+.plyr__control--overlaid{background:#00b2ff;background:var(--plyr-video-control-background-hover,var(--plyr-color-main,var(--plyr-color-main,#00b2ff)));border:0;border-radius:100%;color:#fff;color:var(--plyr-video-control-color,#fff);display:none;left:50%;opacity:.9;padding:15px;padding:calc(var(--plyr-control-spacing, 10px)*1.5);position:absolute;top:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);transition:.3s;z-index:2}
+.plyr__control--overlaid svg{left:2px;position:relative}
+.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{opacity:1}
+.plyr--playing .plyr__control--overlaid{opacity:0;visibility:hidden}
+.plyr--full-ui.plyr--video .plyr__control--overlaid{display:block}
+.plyr--full-ui.plyr--video input[type=range]::-webkit-slider-runnable-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}
+.plyr--full-ui.plyr--video input[type=range]::-moz-range-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}
+.plyr--full-ui.plyr--video input[type=range]::-ms-track{background-color:#ffffff40;background-color:var(--plyr-video-range-track-background,var(--plyr-video-progress-buffered-background,#ffffff40))}
+.plyr--full-ui.plyr--video input[type=range]:active::-webkit-slider-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}
+.plyr--full-ui.plyr--video input[type=range]:active::-moz-range-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}
+.plyr--full-ui.plyr--video input[type=range]:active::-ms-thumb{box-shadow:0 1px 1px #23282f26,0 0 0 1px #23282f33,0 0 0 3px #ffffff80;box-shadow:var(--plyr-range-thumb-shadow,0 1px 1px #23282f26,0 0 0 1px #23282f33),0 0 0 var(--plyr-range-thumb-active-shadow-width,3px) var(--plyr-audio-range-thumb-active-shadow-color,#ffffff80)}
+.plyr--video .plyr__progress__buffer{color:#ffffff40;color:var(--plyr-video-progress-buffered-background,#ffffff40)}
+.plyr:-webkit-full-screen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}
+.plyr:fullscreen{background:#000;border-radius:0!important;height:100%;margin:0;width:100%}
+.plyr:-webkit-full-screen video{height:100%}
+.plyr:fullscreen video{height:100%}
+.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen{display:block}
+.plyr:fullscreen .plyr__control .icon--exit-fullscreen{display:block}
+.plyr:-webkit-full-screen .plyr__control .icon--exit-fullscreen+svg{display:none}
+.plyr:fullscreen .plyr__control .icon--exit-fullscreen+svg{display:none}
+.plyr:-webkit-full-screen.plyr--hide-controls{cursor:none}
+.plyr:fullscreen.plyr--hide-controls{cursor:none}
+@media (min-width:1024px){.plyr:-webkit-full-screen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}.plyr:fullscreen .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}
+.plyr--fullscreen-fallback{background:#000;border-radius:0!important;bottom:0;height:100%;left:0;margin:0;position:fixed;right:0;top:0;width:100%;z-index:10000000}
+.plyr--fullscreen-fallback video{height:100%}
+.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen{display:block}
+.plyr--fullscreen-fallback .plyr__control .icon--exit-fullscreen+svg{display:none}
+.plyr--fullscreen-fallback.plyr--hide-controls{cursor:none}
+@media (min-width:1024px){.plyr--fullscreen-fallback .plyr__captions{font-size:21px;font-size:var(--plyr-font-size-xlarge,21px)}}
+.plyr__ads{border-radius:inherit;bottom:0;cursor:pointer;left:0;overflow:hidden;position:absolute;right:0;top:0;z-index:-1}
+.plyr__ads>div,.plyr__ads>div iframe{height:100%;position:absolute;width:100%}
+.plyr__ads:after{background:#23282f;border-radius:2px;bottom:10px;bottom:var(--plyr-control-spacing,10px);color:#fff;content:attr(data-badge-text);font-size:11px;padding:2px 6px;pointer-events:none;position:absolute;right:10px;right:var(--plyr-control-spacing,10px);z-index:3}
+.plyr__ads:empty:after{display:none}
+.plyr__cues{background:currentColor;display:block;height:5px;height:var(--plyr-range-track-height,5px);left:0;opacity:.8;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:3px;z-index:3}
+.plyr__preview-thumb{background-color:#fff;background-color:var(--plyr-tooltip-background,#fff);border-radius:8px;border-radius:var(--plyr-menu-radius,8px);bottom:100%;box-shadow:0 1px 2px #00000026;box-shadow:var(--plyr-tooltip-shadow,0 1px 2px #00000026);margin-bottom:10px;margin-bottom:calc(var(--plyr-control-spacing, 10px)/2*2);opacity:0;padding:3px;pointer-events:none;position:absolute;-webkit-transform:translateY(10px) scale(.8);transform:translateY(10px) scale(.8);-webkit-transform-origin:50% 100%;transform-origin:50% 100%;transition:opacity .2s ease .1s,-webkit-transform .2s ease .1s;transition:transform .2s ease .1s,opacity .2s ease .1s;transition:transform .2s ease .1s,opacity .2s ease .1s,-webkit-transform .2s ease .1s;z-index:2}
+.plyr__preview-thumb--is-shown{opacity:1;-webkit-transform:translate(0) scale(1);transform:translate(0) scale(1)}
+.plyr__preview-thumb:before{border-left:4px solid #0000;border-left:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-right:4px solid #0000;border-right:var(--plyr-tooltip-arrow-size,4px) solid #0000;border-top:4px solid #fff;border-top:var(--plyr-tooltip-arrow-size,4px) solid var(--plyr-tooltip-background,#fff);bottom:-4px;bottom:calc(var(--plyr-tooltip-arrow-size, 4px)*-1);content:"";height:0;left:calc(50% + var(--preview-arrow-offset));position:absolute;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:0;z-index:2}
+.plyr__preview-thumb__image-container{background:#c1c8d1;border-radius:7px;border-radius:calc(var(--plyr-menu-radius, 8px) - 1px);overflow:hidden;position:relative;z-index:0}
+.plyr__preview-thumb__image-container img,.plyr__preview-thumb__image-container:after{height:100%;left:0;position:absolute;top:0;width:100%}
+.plyr__preview-thumb__image-container:after{border-radius:inherit;box-shadow:inset 0 0 0 1px #00000026;content:"";pointer-events:none}
+.plyr__preview-thumb__image-container img{max-height:none;max-width:none}
+.plyr__preview-thumb__time-container{background:linear-gradient(#0000,#000000bf);background:var(--plyr-video-controls-background,linear-gradient(#0000,#000000bf));border-bottom-left-radius:7px;border-bottom-left-radius:calc(var(--plyr-menu-radius, 8px) - 1px);border-bottom-right-radius:7px;border-bottom-right-radius:calc(var(--plyr-menu-radius, 8px) - 1px);bottom:0;left:0;line-height:1.1;padding:20px 6px 6px;position:absolute;right:0;z-index:3}
+.plyr__preview-thumb__time-container span{color:#fff;font-size:13px;font-size:var(--plyr-font-size-time,var(--plyr-font-size-small,13px))}
+.plyr__preview-scrubbing{bottom:0;-webkit-filter:blur(1px);filter:blur(1px);height:100%;left:0;margin:auto;opacity:0;overflow:hidden;pointer-events:none;position:absolute;right:0;top:0;transition:opacity .3s ease;width:100%;z-index:1}
+.plyr__preview-scrubbing--is-shown{opacity:1}
+.plyr__preview-scrubbing img{height:100%;left:0;max-height:none;max-width:none;-o-object-fit:contain;object-fit:contain;position:absolute;top:0;width:100%}
+.plyr--no-transition{transition:none!important}
+.plyr__sr-only{clip:rect(1px,1px,1px,1px);border:0!important;height:1px!important;overflow:hidden;padding:0!important;position:absolute!important;width:1px!important}
+.plyr [hidden]{display:none!important}
+main {
+	background: transparent;
+	grid-auto-rows: auto;
+}
+.thread {
+	display: flex;
+	flex-direction: column;
+	border-radius: var(--br);
+}
+.toot {
+	background: var(--toot-bg);
+	box-shadow: var(--boxshadow);
+	border: var(--boxshadow-border);
+	border-radius: var(--br);
+	position: relative;
+	margin-bottom: var(--br);
+	padding-top: 0.75rem;
+}
+.toot a {
+		position: relative;
+		z-index: 1;
+		color: inherit;
+		text-decoration: none;
+	}
+.toot .author > a {
+		padding: 0 0.75rem;
+		display: grid;
+		grid-template-columns: 3.5rem 1fr auto;
+		grid-template-rows: auto auto;
+		grid-template-areas:
+			"avatar display date"
+			"avatar user .";
+		gap: 0 0.5rem;
+	}
+.toot .author > a .avatar {
+			grid-area: avatar;
+			height: 3.5rem;
+			width: 3.5rem;
+			-o-object-fit: cover;
+			   object-fit: cover;
+
+			border: 0.15rem solid var(--avatar-border);
+			border-radius: var(--br);
+			overflow: hidden;
+		}
+/* hides corners from img overflowing */
+.toot .author > a .avatar img {
+				height: 100%;
+				width: 100%;
+				-o-object-fit: cover;
+				   object-fit: cover;
+				background: var(--bg);
+			}
+.toot .author > a .displayname, .toot .author > a .username {
+			justify-self: start;
+			align-self: start;
+		
+			max-width: 100%;
+			white-space: nowrap;
+			overflow: hidden;
+			text-overflow: ellipsis;
+		}
+.toot .author > a .displayname {
+			grid-area: display;
+			font-weight: bold;
+			font-size: 1rem;
+			line-height: 1.3rem;
+			/* margin-top: -0.5rem; */
+		}
+.toot .author > a .username {
+			grid-area: user;
+			color: var(--link-fg);
+			font-size: 1rem;
+			line-height: 1.3rem;
+		}
+.toot .author > a .timestamp {
+			grid-area: date;
+			color: var(--fg-reduced);
+		}
+.toot .body {
+		padding: 0.5rem 0.75rem;
+		display: flex;
+		flex-direction: column;
+		gap: 0.5rem;
+	}
+.toot details > summary {
+		display: inline-block;
+		list-style: none;
+	}
+.toot details > summary::-webkit-details-marker {
+			display: none; /* Safari */
+		}
+.toot details > summary .button {
+			white-space: nowrap;
+			cursor: pointer;
+		}
+.toot .text {
+		margin: 0;
+		grid-row: span 1;
+		grid-column: 1 / span 3;
+
+		position: relative;
+		z-index: 2;
+
+		width: 100%;
+	}
+.toot .text details > summary {
+			padding-bottom: 0.5rem;
+		}
+.toot .text details > summary .button {
+				padding: 0.2rem 0.3rem;
+				font-size: 1rem;
+			}
+.toot .text a {
+			color: var(--link-fg);
+			text-decoration: underline;
+		}
+.toot .text .content {
+			word-break: break-word;
+		}
+.toot .text .content blockquote {
+				padding: 0.5rem 0 0.5rem 0.5rem;
+				border-left: 0.2rem solid var(--border-accent);
+				margin: 0;
+				font-style: italic;
+			}
+.toot .text .content hr {
+				border: 1px dashed var(--border-accent);
+			}
+.toot .text .content pre, .toot .text .content code {
+				background-color: var(--gray2);
+			}
+.toot .text .content code {
+				padding: 0.25rem;
+				border-radius: var(--br-inner);
+			}
+.toot .text .content pre {
+				display: flex;
+				border-radius: var(--br);
+				padding: 0.5rem;
+			}
+.toot .text .content pre code {	
+					padding: 0.5rem;
+					white-space: pre;
+					border-radius: 0;
+					overflow-x: auto;
+					-webkit-overflow-scrolling: touch;
+				}
+.toot .text .content img {
+				max-width: 100%;
+				margin: 5px auto;
+			}
+.toot .text .content img[alt~="!center"] {
+				display: block;
+			}
+.toot .text .emoji {
+			transition: 0.1s;
+		}
+.toot .text .emoji:hover, .toot .text .emoji:active {
+			-webkit-transform: scale(2);
+			        transform: scale(2);
+			background-color: var(--bg);
+			box-shadow: var(--boxshadow);
+			border: var(--boxshadow-border);
+			border-radius: var(--br-inner);
+		}
+.toot .media {
+		grid-column: span 3;
+		display: grid;
+		grid-template-columns: 50% 50%;
+		grid-auto-rows: 10rem;
+		overflow: hidden;
+	}
+.toot .media .media-wrapper {
+			height: 100%;
+			width: 100%;
+			box-sizing: border-box;
+			border: 0.15rem solid var(--gray1);
+			border-radius: var(--br);
+			position: relative;
+			overflow: hidden;
+			z-index: 2;
+		}
+.toot .media .media-wrapper details {
+				position: absolute;
+				height: 100%;
+				width: 100%;
+			}
+.toot .media .media-wrapper details[open] summary {
+					height: auto;
+					width: auto;
+					margin: 1rem;
+					padding: 0;
+				}
+.toot .media .media-wrapper details[open] summary .show, .toot .media .media-wrapper details[open] summary video, .toot .media .media-wrapper details[open] summary img {
+						display: none;
+					}
+.toot .media .media-wrapper details[open] summary .eye.button .hide {
+						display: inline-block;
+						grid-column: 1 / span 3;
+						grid-row: 1 / span 2;
+					}
+.toot .media .media-wrapper details summary {
+					position: absolute;
+					height: 100%;
+					width: 100%;
+					z-index: 3;
+					overflow: hidden;
+					
+					display: grid;
+					padding: 1rem;
+					grid-template-columns: 1fr auto 1fr;
+					grid-template-rows: 1fr 1fr;
+					grid-template-areas: 
+						"eye sensitive ."
+						".   sensitive  .";
+				}
+.toot .media .media-wrapper details summary .eye.button {
+						grid-area: eye;
+						align-self: start;
+						justify-self: start;
+						margin: 0;
+						padding: 0.4rem;
+					}
+.toot .media .media-wrapper details summary .eye.button .fa-fw {
+							line-height: var(--fa-fw);
+						}
+.toot .media .media-wrapper details summary .eye.button .hide {
+							display: none;
+						}
+.toot .media .media-wrapper details summary .show.sensitive {
+						grid-area: sensitive;
+						align-self: center;
+					}
+.toot .media .media-wrapper details summary .show.sensitive .button {
+							cursor: pointer;
+							align-self: center;
+						}
+.toot .media .media-wrapper details summary video, .toot .media .media-wrapper details summary img {
+						z-index: -1;
+						position: absolute;
+						height: calc(100% + 1.2rem);
+						width: calc(100% + 1.2rem);
+						top: -0.6rem;
+						left: -0.6rem;
+						-webkit-filter: blur(1.2rem);
+						        filter: blur(1.2rem);
+					}
+.toot .media .media-wrapper details video.plyr-video, .toot .media .media-wrapper details .plyr {
+					position: absolute;
+					height: 100%;
+					width: 100%;
+					-o-object-fit: contain;
+					   object-fit: contain;
+					background: var(--gray1);
+				}
+.toot .media.single .media-wrapper {
+			grid-column: span 2;
+		}
+.toot .media.odd .media-wrapper:first-child, .toot .media.double .media-wrapper {
+			grid-row: span 2;
+		}
+.toot .media img {
+			width: 100%;
+			height: 100%;
+			-o-object-fit: cover;
+			   object-fit: cover;
+		}
+.toot .info {
+		display: flex;
+		background: var(--toot-info-bg);
+		color: var(--fg-reduced);
+		border-top: 0.15rem solid var(--toot-info-border);
+		padding: 0.5rem 0.75rem;
+	}
+.toot .info div, .toot .info time {
+			padding-right: 1rem;
+		}
+.toot .info .stats {
+			display: flex;
+		}
+.toot .info{
+
+		grid-column: span 3;
 		flex-wrap: wrap;
-		gap: 0.75rem;
-		align-items: flex-start;
-		justify-content: space-between;
-}
-
-.toot .info {
-		display: flex;
-		flex-direction: column;
-		flex-wrap: wrap;
-		gap: 0.5rem;
-		line-height: 1rem;
-		color: var(--fg-reduced);
-		align-items: flex-end;
-}
-.toot .info .stats {
-		display: flex;
-		flex-direction: row;
-		flex-wrap: wrap;
-		gap: 1rem;
-		line-height: 1rem;
-		color: var(--fg-reduced);
-}
-.stats
-.toot:first-child {
-		/* top left, top right */
-		border-top-left-radius: var(--br);
-		border-top-right-radius: var(--br);
-	}
-.toot:last-child, .toot:last-child .info {
-		/* bottom left, bottom right */
-		border-bottom-left-radius: var(--br);
-		border-bottom-right-radius: var(--br);
-		margin-bottom: 0;
-	}
-.toot.expanded {
-		background: var(--toot-focus-bg);
-	}
-.toot.expanded .info {
-			background: var(--toot-focus-info-bg);
-		}
-.plyr--video {
-	flex-direction: column-reverse;
-}
-.plyr--video .plyr__video-wrapper {
-		position: relative;
-	}
-.plyr--video .plyr__controls {
-		align-self: stretch;
-		position: initial;
-		padding: 0.1rem;
-		padding-top: 0.2rem;
-	}
-.plyr--video .plyr__control {
-		box-shadow: none;
-	}
-.plyr--video .plyr__control--overlaid {
-		top: calc(50% - 18px);
-	}
-.pswp__content {
-	padding: 2rem;
-}
-.pswp__content .plyr {
-		max-height: 100%;
-	}
-
-
+}
+.toot .toot-link {
+		top: 0;
+		right: 0;
+		bottom: 0;
+		left: 0;
+		overflow: hidden;
+		text-indent: 100%;
+		white-space: nowrap;
+
+		position: absolute;
+		z-index: 0;
+	}
+.toot:first-child {
+		/* top left, top right */
+		border-top-left-radius: var(--br);
+		border-top-right-radius: var(--br);
+	}
+.toot:last-child, .toot:last-child .info {
+		/* bottom left, bottom right */
+		border-bottom-left-radius: var(--br);
+		border-bottom-right-radius: var(--br);
+		margin-bottom: 0;
+	}
+.toot.expanded {
+		background: var(--toot-focus-bg);
+		padding-bottom: 0;
+	}
+.toot.expanded .info {
+			background: var(--toot-focus-info-bg);
+		}
+.plyr--video {
+	flex-direction: column-reverse;
+}
+.plyr--video .plyr__video-wrapper {
+		position: relative;
+	}
+.plyr--video .plyr__controls {
+		align-self: stretch;
+		position: initial;
+		padding: 0.1rem;
+		padding-top: 0.2rem;
+	}
+.plyr--video .plyr__control {
+		box-shadow: none;
+	}
+.plyr--video .plyr__control--overlaid {
+		top: calc(50% - 18px);
+	}
+.pswp__content {
+	padding: 2rem;
+}
+.pswp__content .plyr {
+		max-height: 100%;
+	}
+
+
diff --git a/template/about.tmpl b/template/about.tmpl
index 172de11..1b1f2d0 100644
--- a/template/about.tmpl
+++ b/template/about.tmpl
@@ -67,12 +67,14 @@
  		<li><a target="_blank" href="mailto:re@dym.sh">email</a>/<a target="_blank" href="/pgp.txt">pgp</a></li>
 		<li><a target="_blank" href="https://dym.sh/@dym">microblog</a></li>
 		<li><a target="_blank" href="https://lemmy.world/u/dym_sh">lemmy</a></li>
+		<li><a target="_blank" href="https://indieweb.org/User:Dym.sh">indieweb</a></li>
+		<li><a target="_blank" href="https://dym-sh.tumblr.com">tumblr</a></li>
+
 		<li><a target="_blank" href="https://figma.com/@dym_sh">figma</a></li>
 		<li><a target="_blank" href="https://layers.to/dym_sh">layers</a></li>
 		<li><a target="_blank" href="https://codepen.io/dym-sh">codepen</a></li>
 		<li><a target="_blank" href="https://userstyles.world/user/dym-sh">userstyles</a></li>
-		<li><a target="_blank" href="https://github/dym-sh">github</a></li>
-		<li><a target="_blank" href="https://indieweb.org/User:Dym.sh">indieweb</a></li>
+		<li><a target="_blank" href="https://github.com/dym-sh">github</a></li>
 	</ul>
 
 </main>
diff --git a/template/profile.tmpl b/template/profile.tmpl
index d9b885d..aac9af4 100644
--- a/template/profile.tmpl
+++ b/template/profile.tmpl
@@ -28,13 +28,11 @@
 				<img src="{{.account.Header}}" class="bg" alt="">
 				<img src="{{.account.Avatar}}" class="avatar" alt="">
 				{{ if and (.account.Role) (ne .account.Role.Name "user") }}
-				<figcaption class="role {{ .account.Role.Name }}">
-					{{ if and (.account.Role) (eq .account.Role.Name "admin") }}
-						webmain
-					{{ else }}
-						{{ .account.Role.Name }}
-					{{ end }}
-				</figcaption>
+				<figcaption class="role {{ .account.Role.Name }}">{{
+					if and (.account.Role) (eq .account.Role.Name "admin")
+					}}webmain{{
+					else }}{{ .account.Role.Name }}{{ end
+				}}</figcaption>
 				{{ end }}
 			</figure>
 
diff --git a/template/status.tmpl b/template/status.tmpl
index f0ebbc9..29ea005 100644
--- a/template/status.tmpl
+++ b/template/status.tmpl
@@ -28,7 +28,7 @@
 				{{.Account.Username}}
 				{{end}}
 			</span>
-			<span class="username">@{{.Account.Username}}</span>
+			<span class="username">@{{.Account.Username}}</div>
 		</span>
 	</a>