diff --git a/scyfin-wll.css b/scyfin-wll.css
new file mode 100644
index 0000000..b01f46a
--- /dev/null
+++ b/scyfin-wll.css
@@ -0,0 +1,1602 @@
+/* Variables */
+:root {
+    --primary-r: 0;
+    --primary-g: 164;
+    --primary-b: 220;
+    --primary-accent-color: rgba(var(--primary-r), var(--primary-g), var(--primary-b), 1.0);
+    --secondary-accent-color: #00a4dc20;
+    --primary-background-color: #101010;
+    --secondary-background-color: #181818;
+    --primary-background-transparent: rgba(35, 35, 35, 0.5);
+    --secondary-background-transparent: rgba(0, 0, 0, 0.6);
+    --rounded-cards: 15px;
+    --blur: 10px;
+
+    /* Alternate accents*/
+    --primary-alt1: rgb(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 1);
+    --primary-alt2: rgb(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 0.85);
+    --primary-alt3: rgb(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 0.7);
+    --primary-alt4: rgb(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 0.55);
+    --primary-alt5: rgb(calc(var(--primary-r) - 30), calc(var(--primary-g) - 30), calc(var(--primary-b) - 30), 0.4);
+}
+
+/* Setting accent color variable */
+.emby-checkbox:checked+span+.checkboxOutline,
+.selectionCommandsPanel,
+.countIndicator,
+.MuiButton-root.MuiButton-containedSizeMedium,
+.MuiChip-root.MuiChip-colorInfo:not(.MuiChip-root.MuiChip-colorError),
+progress[aria-valuenow]:before {
+    background: var(--primary-accent-color) !important;
+}
+
+progress::-moz-progress-bar {
+    background: var(--primary-accent-color) !important;
+}
+
+progress::-webkit-progress-value {
+    background: var(--primary-accent-color) !important;
+}
+
+.MuiAlert-root.MuiAlert-standardInfo {
+    background: var(--secondary-accent-color) !important;
+}
+
+.emby-checkbox:checked+span+.checkboxOutline,
+.emby-checkbox:focus:not(:checked)+span+.checkboxOutline,
+.emby-input:focus,
+.emby-textarea:focus,
+.emby-select-withcolor:focus,
+.mdl-spinner__layer-1,
+.mdl-spinner__layer-2,
+.mdl-spinner__layer-3,
+.mdl-spinner__layer-4,
+.progressring-spiner {
+    border-color: var(--primary-accent-color) !important;
+}
+
+.button-link:not(.itemDetailPage .button-link),
+.selectLabelFocused,
+.textareaLabelFocused,
+.inputLabelFocused,
+.emby-tab-button:hover,
+.metadataSidebarIcon,
+.upNextDialog-countdownText,
+.MuiSvgIcon-root.MuiSvgIcon-fontSizeInherit,
+.listItemImageButton:hover,
+.button-flat:hover,
+#divRunningTasks span {
+    color: var(--primary-accent-color) !important;
+}
+
+@media (hover: hover) and (pointer: fine) {
+    .paper-icon-button-light:hover:not(:disabled) {
+        color: var(--primary-accent-color) !important;
+        background-color: var(--secondary-accent-color) !important;
+    }
+}
+
+/* Increase size of Jellyfin logo */
+.layout-desktop .pageTitleWithLogo {
+    margin-left: 25px !important;
+    height: 40px !important;
+}
+
+/* Fix for empty header with padding */
+[dir="ltr"] .pageTitle:not(.pageTitleWithLogo):empty {
+    margin: 0 !important;
+}
+
+/* Static left drawer */
+.layout-desktop .mainDrawer {
+    left: 0 !important;
+    top: 0 !important;
+    width: 250px !important;
+    /* Modified background color */
+    background: var(--secondary-background-color) !important;
+    /* Move drawer behind header */
+    z-index: 998 !important;
+}
+
+/* Lower drawer buttons */
+.layout-desktop .mainDrawer-scrollContainer {
+    margin-top: 95px !important;
+    margin-left: 10px !important;
+}
+
+.layout-mobile .mainDrawer-scrollContainer {
+    margin-top: 15px !important;
+}
+
+/* Shift content to the right */
+.layout-desktop .libraryPage:not(#editItemMetadataPage) {
+    margin-left: 250px !important;
+}
+
+/* Fix for Jellyfin Media Player */
+.quickConnectSettingsContainer {
+    margin-left: 250px !important;
+}
+
+/* Hide transition on page load */
+.layout-desktop .touch-menu-la.transition {
+    transition: none !important;
+}
+
+/* Hide hamburger button */
+.layout-desktop .mainDrawerButton {
+    display: none !important;
+}
+
+/* Fix for dashboard leaking out of the sections */
+.dashboardColumn {
+    flex-shrink: inherit;
+}
+
+/* Fix for dashboard drawer button height */
+.layout-desktop .dashboardDocument .mainDrawer-scrollContainer {
+    padding-top: 0 !important;
+}
+
+/* Hide home button */
+.layout-desktop .headerHomeButton {
+    display: none !important;
+}
+
+.layout-desktop .dashboardDocument .headerHomeButton {
+    display: block !important;
+}
+
+/* Fix for video player and login page */
+.layout-desktop .hide-scroll .mainDrawer,
+.layout-desktop .hideMainDrawer .mainDrawer {
+    left: -320px !important;
+}
+
+/* Fix for scroll menus on home page */
+.emby-scroller {
+    margin-right: -2% !important;
+}
+
+/* Fix for collection items misalignment */
+.layout-desktop .collectionItems .collectionItemsContainer {
+    padding-left: 0% !important;
+}
+
+/* Dynamic buttons */
+.layout-desktop .navMenuOption:hover:not(.navMenuOption-selected) {
+    transform: scale(1.05) !important;
+}
+
+.layout-desktop .listItem {
+    transition: .2s !important;
+    border-radius: var(--rounded-cards) !important;
+}
+
+.layout-desktop #myPreferencesMenuPage .listItem:hover {
+    transform: scale(1.015);
+}
+
+
+
+/* Rounded cards */
+.cardContent,
+.cardPadder,
+.cardOverlayContainer,
+.blurhash-canvas,
+.dialog,
+.itemSelectionPanel {
+    border-radius: var(--rounded-cards) !important;
+}
+
+/* Rounded selection menu */
+.itemSelectionPanel {
+    border: 2px solid var(--primary-accent-color) !important;
+}
+
+.itemSelectionPanel .checkboxOutline {
+    margin: 7px !important;
+}
+
+
+
+/* Floating progress bar */
+.innerCardFooter {
+    border-radius: var(--rounded-cards) !important;
+    margin-left: 5px !important;
+    margin-bottom: 5px !important;
+    padding: 5px 15px 5px 5px !important;
+    bottom: 0% !important;
+    background: rgba(0, 0, 0, 0.5) !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+.fullInnerCardFooter {
+    bottom: 5% !important;
+    width: 90% !important;
+    margin: auto !important;
+    border-radius: 100px !important;
+    padding: 0px !important;
+    backdrop-filter: none !important;
+}
+
+.itemProgressBar:not(.playbackProgress):not(.transcodingProgress):not(.backgroundProgress) {
+    height: 10px !important;
+    background: var(--primary-background-transparent) !important;
+    backdrop-filter: blur(2px) !important;
+    border-radius: 100px !important;
+}
+
+.innerCardFooterClear {
+    background-color: none !important;
+}
+
+.innerCardFooter .cardText {
+    padding: 0 0 0 10px !important
+}
+
+.itemProgressBarForeground:not(.playbackProgress .itemProgressBarForeground):not(.transcodingProgress .itemProgressBarForeground):not(.backgroundProgress .itemProgressBarForeground) {
+    background: var(--primary-accent-color) !important;
+}
+
+.itemProgressBarForeground {
+    border-radius: 100px !important;
+}
+
+.transcodingProgress>div {
+    background-color: hsla(0, 0%, 100%, .2) !important;
+}
+
+.activeSession .backgroundProgress,
+.activeSession .playbackProgress,
+.activeSession .transcodingProgress {
+    bottom: 10px !important;
+    border-radius: 100px !important;
+    width: 90% !important;
+    left: 5% !important;
+}
+
+.sessionNowPlayingInnerContent {
+    padding-bottom: 12px !important;
+    padding-inline: 17px !important;
+}
+
+.sessionAppInfo {
+    padding: .5em 0em !important;
+}
+
+.sessionNowPlayingInfo {
+    padding: .8em 0em !important;
+}
+
+
+
+/* Green watched indicator */
+.playedIndicator {
+    background: #409843 !important;
+}
+
+
+
+/* Rounded left drawer buttons */
+.navMenuOption,
+.navMenuOption:hover,
+.navMenuOption-selected {
+    border-radius: 100px !important;
+    width: 85% !important;
+    margin: auto !important;
+    text-align: center !important;
+    height: 45px !important;
+    margin-top: 3px !important;
+    margin-bottom: 3px !important;
+}
+
+.navMenuOption:hover:not(.navMenuOption-selected) {
+    background-color: rgba(44, 44, 44, 0.7);
+}
+
+/* Center icons and text and shift to the left */
+.navMenuOptionIcon,
+.navMenuOptionText {
+    position: inherit !important;
+    left: -10% !important;
+    margin-top: 0 !important;
+}
+
+/* Fix for header buttons */
+.layout-desktop .emby-button-foreground {
+    top: -9px !important;
+}
+
+.layout-tv .emby-button-foreground {
+    top: -14px !important;
+}
+
+
+
+/* Custom button color */
+.navMenuOption-selected {
+    background: var(--secondary-accent-color) !important;
+    color: var(--primary-accent-color) !important;
+}
+
+/* Modified background color */
+html,
+.backgroundContainer:not(.withBackdrop):not(.backgroundContainer-transparent),
+.noBackdropTransparency .detailPageSecondaryContainer {
+    background-color: var(--primary-background-color) !important;
+}
+
+
+/* Transparent header bar */
+.skinHeader {
+    background-color: transparent !important;
+}
+
+.layout-desktop .skinHeader,
+.layout-tv .skinHeader {
+    padding-top: 1.5em !important;
+}
+
+.layout-tv .skinHeader {
+    padding-bottom: 10px !important;
+}
+
+/* Rounded header buttons */
+.headerTabs,
+.headerRight {
+    background-color: var(--primary-background-transparent) !important;
+    border-radius: 50px !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+.layout-desktop .headerTabs,
+.layout-tv .headerTabs {
+    margin-bottom: 10px !important;
+}
+
+.layout-desktop .headerTabs {
+    margin-left: 160px !important;
+    margin-top: -58px !important;
+}
+
+/* Button height */
+.headerRight,
+.emby-tab-button {
+    height: 45px !important;
+}
+
+/* Lower header and add padding to right buttons */
+.layout-desktop .headerRight {
+    padding: 0px 5px !important;
+}
+
+.layout-tv .headerRight {
+    padding: 20px 10px !important;
+}
+
+/* Move left header back up */
+.layout-desktop .headerLeft .layout-tv .headerLeft {
+    position: relative !important;
+    top: -17px !important;
+}
+
+/* Mobile fixes */
+.layout-mobile .headroom--unpinned {
+    transform: translateY(-50%);
+}
+
+.layout-mobile .sectionTabs {
+    margin-left: auto !important;
+    margin-right: auto !important;
+    width: auto !important;
+    max-width: 100% !important;
+}
+
+.layout-mobile .emby-button-foreground {
+    top: -2px !important;
+}
+
+.layout-mobile .skinHeader {
+    transition: .1s !important;
+}
+
+.layout-mobile .mainDrawer {
+    background: var(--secondary-background-color) !important;
+}
+
+.layout-mobile .headroom--unpinned {
+    transform: none;
+}
+
+.layout-mobile .headroom--unpinned:has(.headerTabs.sectionTabs:not(.hide)) {
+    transform: translateY(-50%);
+}
+
+.layout-mobile .headroom--not-top {
+    background: var(--primary-background-transparent) !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+.layout-mobile .headroom--not-top .headerRight {
+    background: none !important;
+}
+
+.layout-mobile .headroom--top,
+.layout-mobile .headroom--not-top:has(.headerTabs.sectionTabs:not(.hide)) {
+    background: transparent !important;
+    backdrop-filter: none !important;
+}
+
+.layout-mobile .headroom--top .headerRight,
+.layout-mobile .headroom--not-top:has(.headerTabs.sectionTabs:not(.hide)) .headerRight {
+    background: var(--primary-background-transparent) !important;
+}
+
+@media (max-width: 380px) {
+    .layout-mobile .pageTitle:not(.pageTitleWithLogo):not(:empty) {
+        position: absolute !important;
+        margin-left: 50% !important;
+        transform: translate(-50%, 0) !important;
+        top: 60px !important;
+    }
+
+    .layout-mobile .headerTop:has(.pageTitle:not(.pageTitleWithLogo):not(:empty)) {
+        -webkit-align-items: start !important;
+        align-items: start !important;
+    }
+
+    .layout-mobile .skinHeader:has(.pageTitle:not(.pageTitleWithLogo):not(:empty)) {
+        height: 110px !important;
+    }
+
+    .layout-mobile .skinHeader:has(.pageTitle:not(.pageTitleWithLogo):not(:empty)):has(.sectionTabs:not(.hide)) {
+        height: 140px !important;
+    }
+
+    .layout-mobile .libraryPage:not(.noSecondaryNavPage) {
+        padding-top: 9.5em !important;
+    }
+
+    .layout-mobile .headroom--unpinned:has(.headerTabs.sectionTabs:not(.hide)):has(.pageTitle:not(.pageTitleWithLogo):not(:empty)) {
+        transform: translateY(-60%);
+    }
+}
+
+
+
+/* Player modifications */
+.upNextContainer:not(#skipIntro),
+.toastVisible {
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+.upNextContainer:not(#skipIntro) {
+    border-radius: var(--rounded-cards) !important;
+    background-color: rgba(0, 0, 0, 0.6) !important;
+}
+
+.upNextContainer {
+    margin: 4% !important;
+}
+
+.toastVisible {
+    border-radius: 30px !important;
+    background-color: var(--primary-background-transparent) !important;
+}
+
+.sliderBubble {
+    border-radius: var(--rounded-cards) !important;
+    background-color: var(--secondary-background-transparent) !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+.sliderBubble:not(.osdVolumeSliderContainer .sliderBubble):has(.chapterThumbContainer) {
+    background-color: #ffffff00 !important;
+    top: 25px !important;
+    backdrop-filter: unset !important;
+}
+
+.mdl-slider-background-flex {
+    height: 10px !important;
+    margin-top: -5px !important;
+    border-radius: 100px !important;
+    background: hsla(0, 0%, 100%, .2) !important;
+}
+
+.mdl-slider-background-lower {
+    border-radius: 100px !important;
+    background-color: var(--primary-accent-color) !important;
+}
+
+/* Moz */
+.mdl-slider::-moz-range-thumb {
+    background: #ffffff00 !important;
+    height: 10px !important;
+    width: 8px !important;
+    border-radius: 2px !important;
+}
+
+.mdl-slider-hoverthumb:hover::-moz-range-thumb {
+    transform: scaleY(2);
+    background: #fff !important;
+}
+
+/* Webkit */
+.mdl-slider::-webkit-slider-thumb {
+    background: #ffffff00 !important;
+    height: 10px !important;
+    width: 8px !important;
+    border-radius: 2px !important;
+}
+
+.mdl-slider-hoverthumb:hover::-webkit-slider-thumb {
+    transform: scaleY(2);
+    background: #fff !important;
+}
+
+.mdl-slider-background-upper {
+    border-top-right-radius: 100px !important;
+    border-bottom-right-radius: 100px !important;
+    background: hsla(0, 0%, 100%, .2) !important;
+    transform: translateX(-3px) !important;
+}
+
+.iconOsdProgressInner {
+    background: var(--primary-accent-color) !important;
+}
+
+/* Up next card */
+.upNextDialog-buttons .upNextDialog-button {
+    transition: .2s !important;
+}
+
+.upNextDialog-buttons .upNextDialog-button:hover {
+    transform: scale(1.1);
+}
+
+/* Support for Jellyscrub plugin */
+.chapterThumbContainer {
+    background: none !important;
+    border-radius: var(--rounded-cards) !important;
+    box-shadow: unset !important;
+}
+
+.chapterThumb {
+    border-radius: var(--rounded-cards) !important;
+    margin-bottom: 47px !important;
+    box-shadow: 0 0 1.9vh #000 !important;
+}
+
+.chapterThumbTextContainer {
+    background: none !important;
+}
+
+.chapterThumbText {
+    text-align: center !important;
+}
+
+.chapterThumbText-dim {
+    display: none !important;
+}
+
+/* Support for IntroSkipper plugin */
+#skipIntro .btnSkipIntro {
+    transition: 0.2s;
+    border-radius: 100px !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+#skipIntro .btnSkipIntro:hover {
+    transition: .2s;
+    transform: scale(1.05);
+    background: var(--primary-accent-color) !important;
+}
+
+#skipIntro .paper-icon-button-light:hover:not(:disabled) {
+    color: #FFF !important;
+}
+
+.sliderContainer:has(.mdl-slider-hoverthumb:not(:hover)) .sliderMarker {
+    opacity: 0 !important;
+    transition: 0.2s !important;
+}
+
+.sliderContainer:has(.mdl-slider-hoverthumb:hover) .sliderMarker {
+    opacity: 1 !important;
+    transition: 0.2s !important;
+    height: 10px !important;
+    transform: translate3d(0, 40%, 0) !important;
+    -webkit-transform: translate3d(0, 40%, 0) !important;
+}
+
+.sliderMarker.watched {
+    background-color: #FFFFFF90 !important;
+    z-index: 10 !important;
+}
+
+#skipIntro .upNextContainer {
+    padding: 0px !important;
+}
+
+#skipIntro .emby-button {
+    background: rgba(30, 30, 30, 0.7) !important;
+}
+
+#skipIntro .emby-button:hover {
+    box-shadow: 0 0 8px rgba(var(--primary-accent-color), 0.6) !important;
+}
+
+#skipIntro .emby-button:focus {
+    background: rgba(30, 30, 30, 0.7) !important;
+    box-shadow: unset !important;
+}
+
+/* Support for InPlayerEpisodePreview plugin */
+.layout-desktop #popupFocusContainer {
+    padding: 10px !important;
+}
+
+.layout-desktop #popupTitleContainer {
+    margin: 0px !important;
+    padding: 10px 0px 10px 0px !important;
+}
+
+.layout-desktop #popupContentContainer .previewEpisodeDetails {
+    position: unset !important;
+    margin: 0px 0px 6px 10px !important;
+    font-size: 13.5px !important;
+}
+
+.layout-desktop #popupContentContainer .previewEpisodeTitle {
+    font-size: 16.5px !important;
+}
+
+.layout-desktop #popupContentContainer .listItem {
+    padding: .25em .25em .25em .5em !important;
+}
+
+/* Modify player buttons */
+.material-icons.fast_rewind::before {
+    content: "\e059";
+}
+
+.material-icons.fast_forward::before {
+    content: "\e057";
+}
+
+.material-icons.audiotrack::before {
+    content: "\e91f";
+}
+
+
+
+/* Settings and dashboard modifications */
+.emby-input,
+.emby-textarea,
+.paperList,
+.listItem:hover,
+.subtitleappearance-preview {
+    border-radius: var(--rounded-cards) !important;
+}
+
+.button-submit,
+.emby-select,
+.checkboxOutline,
+.btnRefresh,
+#btnShutdown,
+.raised {
+    border-radius: 100px !important;
+}
+
+.button-submit {
+    background: var(--primary-accent-color) !important;
+}
+
+/* Modify username placement on profile page */
+.layout-desktop #userProfilePage .readOnlyContent div:not([class]),
+div[class=""] {
+    align-items: initial !important;
+}
+
+.layout-desktop .username {
+    margin: 0px 0px 10px 10px !important;
+}
+
+/* Red shutdown button */
+#btnShutdown {
+    background: #AE3739 !important;
+}
+
+/* Remove border under certain dashboard items */
+.listItem-border {
+    border: 0 !important;
+}
+
+/* Add padding to list items */
+.layout-desktop .listItem,
+.layout-tv .listItem {
+    padding-inline: 15px !important;
+}
+
+/* Rounded dashboard cards */
+.cardBox {
+    border-radius: var(--rounded-cards) !important;
+}
+
+/* Removed ugliness of border-card styling */
+.layout-desktop fieldset.verticalSection-extrabottompadding,
+.layout-tv fieldset.verticalSection-extrabottompadding {
+    border-radius: var(--rounded-cards) !important;
+    border-color: #3B3B3B !important;
+    padding: 10px 35px !important;
+}
+
+/* Rounded tab selections in dashboard */
+.layout-desktop .localnav {
+    border-radius: 100px !important;
+    background: #202020 !important;
+    width: fit-content !important;
+}
+
+.layout-desktop a[data-role="button"] {
+    background: none !important;
+}
+
+.layout-desktop div[data-role="controlgroup"] a.ui-btn-active {
+    background: var(--primary-accent-color) !important;
+    border-radius: 100px !important;
+}
+
+.layout-desktop .dashboardDocument .mainAnimatedPage {
+    left: 260px !important;
+}
+
+#libraryDisplayPage,
+#metadataImagesConfigurationPage,
+#metadataNfoPage {
+    margin-top: 40px !important;
+}
+
+#mediaLibraryPage {
+    margin-top: 10px !important;
+}
+
+/* Re-align active devices in dashboard */
+.activeDevices.itemsContainer {
+    margin: 0px !important;
+}
+
+.playbackProgress>div {
+    background: var(--primary-accent-color) !important;
+}
+
+/* IntroSkipper settings */
+.layout-desktop summary {
+    border-radius: 100px !important;
+}
+
+.layout-desktop fieldset.verticalSection-extrabottompadding,
+.layout-tv fieldset.verticalSection-extrabottompadding {
+    padding: 10px 35px 20px 35px !important;
+}
+
+#intro_reqs,
+#edl,
+#silence,
+#support {
+    padding-bottom: 10px !important;
+}
+
+/* Dashboard fixes for 10.9.x */
+.layout-desktop #userProfilesPage {
+    left: 260px !important;
+}
+
+.MuiAlert-message {
+    color: #fff !important;
+}
+
+.MuiDataGrid-root.MuiDataGrid-withBorderColor {
+    border-radius: var(--rounded-cards) !important;
+}
+
+.infoBanner {
+    border-radius: var(--rounded-cards) !important;
+}
+
+.MuiToggleButton-root.MuiToggleButtonGroup-groupedHorizontal {
+    border-radius: var(--rounded-cards);
+    padding-inline: 15px !important;
+}
+
+.MuiAppBar-root.MuiAppBar-positionFixed {
+    padding: 10px !important;
+}
+
+.MuiAppBar-root.MuiAppBar-positionFixed.MuiAppBar-colorPrimary {
+    background: var(--primary-background-transparent) !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+.MuiList-root.MuiList-subheader {
+    padding-left: 10px !important;
+}
+
+.MuiList-subheader .MuiListItem-root.MuiListItem-gutters {
+    width: 85% !important;
+    margin-inline: auto !important;
+}
+
+.MuiList-subheader .MuiListItemButton-root.MuiListItemButton-gutters {
+    border-radius: 100px !important;
+    margin: 2px 0px !important;
+    transition: .2s !important;
+    height: 45px !important
+}
+
+.MuiList-subheader .MuiListItemButton-root.MuiListItemButton-gutters:not(.Mui-selected) .MuiListItemIcon-root,
+.MuiList-subheader .MuiListItemButton-root.MuiListItemButton-gutters:not(.Mui-selected) {
+    color: #D1D1D1
+}
+
+.MuiList-subheader .MuiListItemButton-root.MuiListItemButton-gutters:hover:not(.Mui-selected) {
+    transform: scale(1.05) !important;
+    background: rgba(44, 44, 44, 0.7) !important;
+}
+
+.MuiListItemButton-root.Mui-selected {
+    background: var(--secondary-accent-color) !important;
+}
+
+.MuiListItemButton-root.Mui-selected .MuiListItemIcon-root,
+.MuiListItemButton-root.Mui-selected {
+    color: var(--primary-accent-color) !important;
+}
+
+.MuiPaper-root.MuiDrawer-paperAnchorDockedLeft {
+    border-right: none !important;
+    background: var(--secondary-background-color) !important;
+    width: 250px !important;
+}
+
+.MuiListItemIcon-root.MuiSvgIcon-fontSizeMedium {
+    color: inherit !important;
+}
+
+.MuiPaper-root.MuiPopover-paper {
+    background: #252525 !important;
+    color: #D1D1D1 !important;
+    border-radius: var(--rounded-cards) !important;
+}
+
+.listItemIcon:not(.listItemIcon-transparent):not(.notification_important) {
+    background: var(--secondary-accent-color) !important;
+    color: var(--primary-accent-color) !important;
+}
+
+.MuiList-root:not(.MuiList-subheader) .MuiListItemButton-root.MuiListItemButton-gutters {
+    padding: 20px 38px 10px 38px !important;
+}
+
+.MuiCollapse-root.MuiCollapse-vertical .MuiListItemButton-root.MuiListItemButton-gutters {
+    width: 85% !important;
+    margin-inline: auto !important;
+    padding: 8px 16px !important;
+}
+
+/* Dynamic colors for "Active Devices" section to respect theme */
+.defaultCardBackground1 {
+    background-color: var(--primary-alt1) !important;
+}
+
+.defaultCardBackground2 {
+    background-color: var(--primary-alt2) !important;
+}
+
+.defaultCardBackground3 {
+    background-color: var(--primary-alt3) !important;
+}
+
+.defaultCardBackground4 {
+    background-color: var(--primary-alt4) !important;
+}
+
+.defaultCardBackground5 {
+    background-color: var(--primary-alt5) !important;
+}
+
+
+
+/* Metadata editor fixes */
+.layout-desktop .editPageSidebar {
+    width: 25vw !important;
+}
+
+.layout-desktop .editPageInnerContent {
+    width: 74vw !important;
+}
+
+.jstree-default-large .jstree-node {
+    line-height: 35px !important;
+}
+
+.jstree-default .jstree-wholerow-clicked {
+    background: var(--secondary-accent-color) !important;
+}
+
+.jstree-wholerow-hovered {
+    background: var(--primary-background-transparent) !important;
+}
+
+.jstree-children {
+    margin-left: -10px !important;
+}
+
+#editItemMetadataPage .btnHeaderSave {
+    background: var(--primary-accent-color) !important;
+    border-radius: 100px !important;
+    height: 40px !important;
+    color: white !important;
+}
+
+
+
+/* Resize show/movie image on details page */
+.layout-desktop .detailImageContainer .card {
+    top: 9em !important;
+    width: 18.3vw !important;
+}
+
+/* Re-position content on details page */
+.layout-desktop .detailSection {
+    margin-right: 0 !important;
+}
+
+.layout-desktop .detailPageContent {
+    padding-left: 3.3% !important;
+}
+
+/* Re-position logo */
+.layout-desktop .detailLogo,
+.layout-tv .detailLogo {
+    right: 0 !important;
+    left: 4% !important;
+    top: 10% !important;
+}
+
+/* Transparent ribbon bar */
+.detailRibbon {
+    background: transparent !important;
+}
+
+/* Add card around top-right buttons */
+.mainDetailButtons {
+    background: var(--primary-background-transparent) !important;
+    border-radius: 100px !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+/* Add card around groups section */
+.layout-desktop .detailsGroupItem {
+    background: var(--secondary-background-color) !important;
+    padding: 10px 20px !important;
+    border-radius: 20px !important;
+    width: fit-content !important;
+    max-width: max-content !important;
+    display: flex;
+    gap: 1em;
+}
+
+/* Fix for group section labels */
+.detailsGroupItem .label,
+.trackSelections .selectContainer .selectLabel {
+    min-width: 75px;
+    flex-basis: unset;
+    margin: unset;
+}
+
+/* Alternative mobile group section card */
+.layout-mobile .itemDetailsGroup {
+    background: var(--secondary-background-color) !important;
+    padding: 15px 20px 5px 20px !important;
+    border-radius: var(--rounded-cards) !important;
+}
+
+/* Add card around description */
+.layout-desktop .detailSectionContent {
+    background: var(--secondary-background-color) !important;
+    border-radius: var(--rounded-cards) !important;
+    padding: 40px 20px 10px 20px !important;
+    margin-top: 50px !important;
+}
+
+.layout-mobile .detailSectionContent {
+    background: var(--secondary-background-color) !important;
+    border-radius: var(--rounded-cards) !important;
+    padding: 10px 20px !important;
+}
+
+/* Add card around track selection */
+.trackSelections {
+    background: var(--secondary-background-color) !important;
+    border-radius: var(--rounded-cards) !important;
+    padding: 10px 20px !important;
+    margin-top: 20px !important;
+}
+
+/* Fix for track select dropdowns */
+.trackSelections .selectContainer .detailTrackSelect {
+    padding: 0 10px;
+    margin-left: 10px !important;
+}
+
+/* Re-position title */
+.layout-desktop .infoWrapper {
+    margin-top: 245px !important;
+    margin-left: 20.8vw !important;
+}
+
+.layout-desktop .detailPagePrimaryContainer {
+    padding-left: 3.3% !important;
+}
+
+.layout-desktop .nameContainer {
+    position: absolute !important;
+    margin-top: -48px !important;
+}
+
+.layout-desktop .itemMiscInfo {
+    position: absolute !important;
+    margin-left: 12px !important;
+    margin-top: 16px !important;
+}
+
+/* Move description box */
+.layout-desktop .detailPagePrimaryContent {
+    padding-left: 20.4vw !important;
+}
+
+/* Padding for 2:3 posters */
+.layout-desktop .detailPageWrapperContainer:has(.detailImageContainer .portraitCard) .detailPagePrimaryContent {
+    min-height: 29vw !important;
+}
+
+/* Padding for 1:1 posters */
+.layout-desktop .detailPageWrapperContainer:has(.detailImageContainer .squareCard) .detailPagePrimaryContent {
+    min-height: 20vw !important;
+}
+
+/* Padding for 16:9 posters */
+.layout-desktop .detailPageWrapperContainer:has(.detailImageContainer .backdropCard) .detailPagePrimaryContent {
+    min-height: 12vw !important;
+}
+
+/* Fix for JMP */
+@supports not selector(:has(*)) {
+    .layout-desktop .detailPageWrapperContainer .detailPagePrimaryContent {
+        min-height: 29vw !important;
+    }
+}
+
+/* Move track selection box */
+.detailSection {
+    display: -webkit-box;
+    display: -moz-box;
+    display: box;
+    -webkit-box-orient: vertical;
+    -moz-box-orient: vertical;
+    box-orient: vertical;
+}
+
+.detailSection .detailSectionContent {
+    -webkit-box-ordinal-group: 1;
+    -moz-box-ordinal-group: 1;
+    box-ordinal-group: 1;
+}
+
+.detailSection .recordingFields {
+    -webkit-box-ordinal-group: 2;
+    -moz-box-ordinal-group: 2;
+    box-ordinal-group: 2;
+}
+
+.detailSection .trackSelections {
+    -webkit-box-ordinal-group: 3;
+    -moz-box-ordinal-group: 3;
+    box-ordinal-group: 3;
+}
+
+.detailSection .itemDetailsGroup {
+    -webkit-box-ordinal-group: 4;
+    -moz-box-ordinal-group: 4;
+    box-ordinal-group: 4;
+}
+
+/* Move episode title */
+.layout-desktop .nameContainer {
+    display: -webkit-box;
+    display: -moz-box;
+    display: box;
+    -webkit-box-orient: horizontal;
+    -moz-box-orient: horizontal;
+    box-orient: horizontal;
+}
+
+.layout-desktop .nameContainer .parentName {
+    -webkit-box-ordinal-group: 1;
+    -moz-box-ordinal-group: 1;
+    box-ordinal-group: 1;
+}
+
+.layout-desktop .nameContainer .itemName {
+    -webkit-box-ordinal-group: 2;
+    -moz-box-ordinal-group: 2;
+    box-ordinal-group: 2;
+}
+
+/* Modify original title / episode name position */
+.layout-desktop .nameContainer .itemName.originalTitle {
+    margin: .5em 20px !important;
+}
+
+.layout-desktop .nameContainer .itemName.infoText.subtitle {
+    margin: .5em 20px !important;
+    padding: 0px !important;
+}
+
+/* Modify play button */
+.layout-desktop .mainDetailButtons .btnPlay::after {
+    content: "Play" !important;
+}
+
+.layout-desktop .mainDetailButtons .btnPlay {
+    position: relative !important;
+    margin-right: -85px !important;
+    padding-right: 20px !important;
+    right: 110px !important;
+    background: var(--primary-accent-color) !important;
+    border-radius: 100px !important;
+    color: var(--secondary-background-color) !important;
+}
+
+.layout-desktop .mainDetailButtons .detailButton {
+    -webkit-flex-direction: row !important;
+    flex-direction: row !important;
+}
+
+/* Change crop for list item images */
+.listItemImage {
+    background-size: contain !important;
+    border-radius: var(--rounded-cards);
+}
+
+
+
+/* Live TV */
+/* Modified background color of active guide cells */
+.programCell-active {
+    background: var(--secondary-background-color) !important;
+}
+
+/* Repositioned record button */
+.recordingFields {
+    margin: 5px 0 -7px 0 !important;
+}
+
+.recordingButton {
+    height: 40px !important;
+}
+
+.recordingIcon {
+    color: red !important;
+}
+
+/* Remove overlapping text */
+.itemMiscInfo.itemMiscInfo-secondary {
+    margin-left: 65px !important;
+}
+
+
+
+/* Music Player */
+.layout-desktop .appfooter {
+    margin-left: 250px !important;
+}
+
+.layout-desktop .appfooter .nowPlayingBarInfoContainer {
+    margin-left: 10px !important;
+}
+
+.layout-desktop .volumeOsd {
+    border-radius: var(--rounded-cards) !important;
+    background: var(--secondary-background-transparent) !important;
+}
+
+.layout-desktop .nameContainer .musicParentName {
+    margin-top: 18px !important;
+    margin-right: 22px !important;
+}
+
+.layout-desktop .appfooter .nowPlayingBar {
+    margin-top: 20px !important;
+}
+
+.layout-desktop .appfooter .nowPlayingBar .nowPlayingBarPositionContainer {
+    top: -15px !important;
+}
+
+
+
+/* Fix for scaling issues */
+@media (width: 1600px) {
+    .layout-desktop .headerRight {
+        margin-bottom: 0 !important;
+    }
+
+    .layout-desktop .emby-button-foreground {
+        top: -4px !important;
+    }
+}
+
+@media (max-width: 1599px) {
+    .layout-desktop .pageTitleWithLogo {
+        margin-left: 25px !important;
+    }
+
+    .layout-desktop .headerTabs {
+        margin-top: -65px !important;
+    }
+
+    .layout-desktop .headerRight {
+        margin-right: 15px !important;
+    }
+
+    .layout-desktop .sectionTabs {
+        width: auto !important;
+        align-self: center !important;
+    }
+
+    .layout-desktop .emby-button-foreground {
+        top: -2px !important;
+    }
+}
+
+
+
+/* Fixes for TV Layout */
+.layout-tv .sectionTabs {
+    width: auto !important;
+}
+
+.layout-tv .headerLeft {
+    padding: 5px !important;
+}
+
+
+
+/* Login page */
+.layout-desktop #loginPage {
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+
+.layout-desktop #loginPage .padded-left.padded-right.padded-bottom-page.margin-auto-y {
+    background: var(--secondary-background-color) !important;
+    width: 400px !important;
+    border-radius: 25px !important;
+    padding: 50px !important;
+}
+
+.layout-desktop #loginPage .manualLoginForm .btnCancel {
+    position: absolute !important;
+    background: none !important;
+    width: 100px !important;
+    margin-left: -10px !important;
+    margin-top: 70px !important;
+    text-align: left !important;
+}
+
+.layout-desktop #loginPage .visualLoginForm {
+    position: relative !important;
+    background: var(--secondary-background-color) !important;
+    z-index: 1000 !important;
+}
+
+.layout-desktop #loginPage .btnForgotPassword {
+    background: none !important;
+    font-weight: normal !important;
+    width: 150px !important;
+    text-align: right !important;
+    position: absolute !important;
+    margin-left: 255px !important;
+    margin-top: -195px !important;
+    font-size: smaller !important;
+    color: rgba(255, 255, 255, 0.5) !important;
+    z-index: 1 !important;
+}
+
+.layout-desktop #loginPage .loginDisclaimerContainer {
+    top: 130px !important;
+    position: relative !important;
+    left: -50px !important;
+    width: 500px !important;
+    margin-top: -35px !important;
+}
+
+.layout-desktop #loginPage .squareCard {
+    width: 25% !important;
+    font-size: smaller !important;
+}
+
+@media (max-width: 100em) {
+    .layout-desktop #loginPage .squareCard {
+        width: 20% !important;
+    }
+
+    .layout-desktop #loginPage .padded-left.padded-right.padded-bottom-page.margin-auto-y {
+        width: 600px !important;
+    }
+
+    .layout-desktop #loginPage .btnForgotPassword {
+        margin-left: 450px !important;
+    }
+
+    .layout-desktop #loginPage .disclaimerContainer {
+        width: 700px !important;
+    }
+}
+
+@media (max-width: 87.5em) {
+    .layout-desktop #loginPage .squareCard {
+        width: 20% !important;
+    }
+}
+
+@media (max-width: 75em) {
+    .layout-desktop #loginPage .squareCard {
+        width: 20% !important;
+    }
+}
+
+@media (max-width: 43.75em) {
+    .layout-desktop #loginPage .squareCard {
+        width: 20% !important;
+    }
+}
+
+
+
+/* Dialog box */
+.dialog {
+    background-color: var(--secondary-background-color) !important;
+}
+
+.actionSheetTitle {
+    margin: 10px 20px !important;
+}
+
+
+
+/* Dynamic backdrop support */
+
+/* Translucent cards */
+.layout-desktop #itemDetailPage:not(.noBackdropTransparency) .detailsGroupItem,
+.layout-desktop #itemDetailPage:not(.noBackdropTransparency) .detailSectionContent,
+.layout-desktop #itemDetailPage:not(.noBackdropTransparency) .trackSelections {
+    background: var(--primary-background-transparent) !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+/* Transparent drawer */
+.layout-desktop .backgroundContainer.withBackdrop+div .mainDrawer {
+    background: linear-gradient(to right, #10101090, transparent) !important;
+}
+
+.layout-desktop:has(#itemDetailPage.noBackdropTransparency) .mainDrawer {
+    background: var(--secondary-background-color) !important;
+}
+
+/* Fix for JMP */
+@supports not selector(:has(*)) {
+    .layout-desktop .backgroundContainer.withBackdrop+div .mainDrawer {
+        background: transparent !important;
+    }
+
+    .layout-desktop #itemDetailPage.noBackdropTransparency::after {
+        position: fixed;
+        content: "";
+        top: 0;
+        left: 0;
+        height: 100%;
+        width: 250px;
+        background: var(--secondary-background-color);
+    }
+}
+
+/* Blur buttons */
+.layout-desktop:has(.backgroundContainer.withBackdrop) .navMenuOption-selected {
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+.layout-desktop:has(.backgroundContainer.withBackdrop) .navMenuOption:hover:not(.navMenuOption-selected) {
+    background: var(--primary-background-transparent) !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+/* Reset size of Jellyfin logo */
+.layout-desktop .pageTitleWithLogo {
+    height: 30px !important;
+    width: 100px !important;
+    margin: 0 1em 0 .5em !important;
+}
+
+[dir="ltr"] .pageTitle {
+    margin: 0 1em 0 .5em !important;
+}
+
+/* Un-static left drawer */
+.layout-desktop .mainDrawer:not(.dashboardDocument) {
+    left: -320px !important;
+    z-index: 1099 !important;
+    border-top-right-radius: var(--rounded-cards) !important;
+    border-bottom-right-radius: var(--rounded-cards) !important;
+    background: var(--secondary-background-color) !important;
+    backdrop-filter: none !important;
+}
+
+.layout-desktop:has(.backgroundContainer.withBackdrop) .mainDrawer:not(.dashboardDocument) {
+    width: 275px !important;
+    background-color: var(--primary-background-transparent) !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+@supports not selector(:has(*)) {
+    .layout-desktop .backgroundContainer.withBackdrop+div .mainDrawer {
+        background: var(--secondary-background-color) !important;
+        backdrop-filter: none !important;
+    }
+}
+
+/* Lower drawer buttons */
+.layout-desktop .mainDrawer-scrollContainer {
+    margin-top: 15px !important;
+}
+
+/* Shift content back to the left */
+.layout-desktop .libraryPage:not(#editItemMetadataPage) {
+    margin-left: 0px !important;
+}
+
+/* Fix for Jellyfin Media Player */
+.quickConnectSettingsContainer {
+    margin-left: 0px !important;
+}
+
+/* Add transition back */
+.layout-desktop .touch-menu-la.transition {
+    transition: transform .24s ease-out, left .26s ease-out, -webkit-transform .24s ease-out !important;
+}
+
+/* Show hamburger button */
+.layout-desktop .mainDrawerButton:not(.dashboardDocument) {
+    display: inline-flex !important;
+}
+
+/* Fix for dashboard */
+.layout-desktop .dashboardDocument .mainDrawer {
+    top: 0px !important;
+    left: 0px !important;
+    width: 300px !important;
+    z-index: 998 !important;
+}
+
+.layout-desktop .dashboardDocument .mainDrawer-scrollContainer {
+    padding-top: 75px !important;
+}
+
+/* Re-center header buttons */
+.layout-desktop .headerTabs {
+    margin-left: 0px !important;
+}
+
+/* Hide home button */
+.layout-desktop .headerHomeButton {
+    display: block !important;
+}
+
+.layout-desktop .dashboardDocument .headerHomeButton {
+    display: block !important;
+}
+
+/* Fix for scroll menus on home page */
+.emby-scroller {
+    margin-right: 3.3% !important;
+}
+
+/* Background for top left buttons */
+.layout-desktop .headerLeft:not(.libraryDocument:has(.videoPlayerContainer) .headerLeft) {
+    padding: 2px !important;
+    top: -3px !important;
+    background-color: var(--primary-background-transparent) !important;
+    border-radius: 50px !important;
+    backdrop-filter: blur(var(--blur)) !important;
+}
+
+/* Fix for JMP */
+@supports not selector(:has(*)) {
+    .layout-desktop .headerLeft {
+        padding: 2px !important;
+        top: -3px !important;
+        background-color: var(--primary-background-transparent) !important;
+        border-radius: 50px !important;
+        backdrop-filter: blur(var(--blur)) !important;
+    }
+}
+
+.headerLeft {
+    flex-grow: 0 !important;
+    -webkit-flex-grow: 0 !important;
+}
+
+.headerRight {
+    position: absolute !important;
+    right: 12px !important;
+}
+
+/* Music Player */
+.layout-desktop .appfooter {
+    margin-left: 0px !important;
+}
+
+:root {
+    --primary-r: 240;
+    --primary-g: 68;
+    --primary-b: 96;
+    --primary-accent-color: rgba(var(--primary-r), var(--primary-g), var(--primary-b), 1.0);
+    --secondary-accent-color: rgba(240, 68, 96, 0.2);
+    --blur: 20px;
+}
+
+.layout-desktop .pageTitleWithLogo {
+    width: 30px !important;
+}
+
+/* --- Backdrop & Header --- */
+.backgroundContainer.withBackdrop {
+    background-color: transparent !important;
+}
+
+.backdropContainer {
+    filter:
+        blur(8px) contrast(120%) brightness(60%);
+    mask-image: none;
+    -webkit-mask-image: none;
+}
+
+.listItemImage {
+    background-size: cover !important;
+    margin-top: .5em;
+    margin-bottom: .5em;
+}
+
+.layout-desktop .mainDetailButtons .btnPlay {
+    color: unset !important;
+}
+
+.layout-desktop .mainDetailButtons .btnPlay:hover {
+    color: rgba(255, 255, 255, 0.6) !important;
+}
+
+.layout-desktop .detailLogo,
+.layout-tv .detailLogo {
+    right: 25vw !important;
+    top: 10vh !important;
+    left: revert !important;
+}
+
+.chapterThumbTextContainer {
+    background: rgba(0, 0, 0, .7) !important;
+    border-radius: 12px 12px 0 0;
+}
\ No newline at end of file