.card { border: 0; font-size: inherit!important; font-family: inherit!important; text-transform: none; background-color: transparent!important; background: 0 0!important; transition: -webkit-transform 100ms ease-out,opacity 100ms ease-out; transition: transform 100ms ease-out,opacity 100ms ease-out; margin: 1em 0em 1em 0em; padding: 0; display: block; color: inherit!important; -webkit-tap-highlight-color: transparent; outline: 0!important; contain: layout style paint; -webkit-flex-shrink: 0; flex-shrink: 0; font-weight: inherit!important; line-height: inherit; text-shadow: 2px 2px 5px #0000007a; } .card:hover { transform: scale(1.03); webkit-transform: scale(1.03); text-shadow: 2px 2px 5px black; } .card.itemAction { cursor: pointer; } .card-focustransform { contain: layout style; } .cardPadder-backdrop { padding-bottom: 56.25%; contain: strict; } .cardPadder-margin.cardPadder-backdrop { margin-bottom: 56.25%; } .cardPadder-square { padding-bottom: 100%; contain: strict; } .cardPadder-margin.cardPadder-square { margin-bottom: 100%; } .cardPadder-portrait { padding-bottom: 150%; contain: strict; } .cardPadder-margin.cardPadder-portrait { margin-bottom: 150%; } .cardPadder-fourThree { padding-bottom: 75%; contain: strict; } .cardPadder-margin.cardPadder-fourThree { margin-bottom: 75%; } .cardPadder-banner { padding-bottom: 18.5%; contain: strict; } .cardPadder-margin.cardPadder-banner { margin-bottom: 18.5%; } @supports (aspect-ratio: 16 / 9) { .cardPadder-backdrop { padding-bottom: 0 !important; aspect-ratio: 16/9; } .cardPadder-square { padding-bottom: 0 !important; aspect-ratio: 1; } .cardPadder-portrait { padding-bottom: 0 !important; aspect-ratio: 2/3; } .cardPadder-fourThree { padding-bottom: 0 !important; aspect-ratio: 4/3; } .cardPadder-banner { padding-bottom: 0 !important; aspect-ratio: 1000/185; } .cardPadder-margin { margin-bottom: 0 !important; } } .cardBox { padding: 0 !important; margin: 0.72em; margin: min(0.72em, max(0.38em, 1.06vw)); transition: none; border: 0 solid transparent; -webkit-tap-highlight-color: transparent; outline: 0 !important; contain: layout style; text-align: center; position: relative; } .card-padded { padding: 0.72em; padding: min(0.72em, max(0.38em, 1.06vw)); } .card-bottompadded { padding-bottom: 1.8em !important; } .cardBox-focustransform { transition: -webkit-transform 0.2s ease-out; transition: transform 0.2s ease-out; } .card:focus > .cardBox-focustransform { -webkit-transform: scale(1.18, 1.18); transform: scale(1.18, 1.18); } .card:focus > .cardBox-focustransform-titleadjust { -webkit-transform: scale(1.18, 1.18) translateY(0.5em); transform: scale(1.18, 1.18) translateY(0.5em); } .card-focustransform:focus .cardText { --theme-text-color-alpha: 1 !important; } .cardBox-bottompadded { margin-bottom: 1.8em !important; } .card:focus { z-index: 10 !important; } @media not all and (pointer: fine) { .cardBox-touchzoom { transition: -webkit-transform 0.3s ease-out; transition: transform 0.3s ease-out; transition-delay: 0.1s; } .card:active > .cardBox-touchzoom { -webkit-transform: scale(1.08); transform: scale(1.08); } } .cardBox-sideFooter { display: -webkit-flex; display: flex; -webkit-flex-direction: row; flex-direction: row; overflow: hidden; position: relative; } .cardSideFooter-bottomsections { -webkit-flex-basis: 100%; flex-basis: 100%; } .cardFooterContent { -webkit-flex-grow: 1; flex-grow: 1; padding: 0 1.25em; -webkit-justify-content: center; justify-content: center; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; overflow: hidden; font-weight: 600; min-height: 3em; box-sizing: border-box; } .cardFooterContent-start { text-align: start; padding: 0 0.5em; } .cardFooterContent > .cardText { padding-top: 0; -webkit-padding-start: 0.25em; padding-inline-start: 0.25em; -webkit-padding-end: 0.25em; padding-inline-end: 0.25em; } .mediaSourceIndicator { display: -webkit-flex; display: flex; position: absolute; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; top: 0.3em; left: 0.3em; inset-inline-start: 0.3em; inset-inline-end: initial; text-align: center; vertical-align: middle; width: 1.6em; height: 1.6em; border-radius: 50%; color: #fff; background: #38c; } .cardContent { overflow: hidden; display: block; margin: 0 !important; height: 100%; -webkit-tap-highlight-color: transparent; contain: strict; content-visibility: auto; position: relative; } .cardImageContainer { background-size: contain; background-repeat: no-repeat; background-position: center center; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; position: relative; color: inherit; height: 100%; border-radius: 0.3em; contain: strict; content-visibility: auto; } @supports (aspect-ratio: 16 / 9) { .cardImageContainer { background-clip: content-box !important; } } .chapterCardImageContainer { background-color: #000; border-radius: 0; } .cardContent-button { border: 0 !important; -webkit-padding-start: 0 !important; padding-inline-start: 0 !important; -webkit-padding-end: 0 !important; padding-inline-end: 0 !important; padding-top: 0 !important; cursor: pointer; color: inherit; width: 100%; vertical-align: middle; font-family: inherit; font-size: inherit; outline: 0; } .cardContent-bg-black { background-color: #000 !important; } .paddedImage { background-size: auto 70%; } .grayscaleImage { -webkit-filter: grayscale(100%); filter: grayscale(100%); } .visualCardBox .cardContent { border-bottom-left-radius: 0; border-bottom-right-radius: 0; border-end-start-radius: 0; border-end-end-radius: 0; } .cardImageContainer-sideFooter { position: relative; width: 5.4em; height: 5.4em; border-radius: 0; -webkit-flex-shrink: 0; flex-shrink: 0; padding: 0 !important; } .cardImageContainer-smallSideFooter { height: 3.6em; width: 3.6em; padding: 0 !important; } .cardImage { position: absolute; top: 0; bottom: 0; left: 0; right: 0; inset-inline-start: 0; inset-inline-end: 0; background-size: contain; background-repeat: no-repeat; background-position: center bottom; width: 100%; height: 100%; object-position: center center; object-fit: contain; border: 0 !important; contain: layout style paint; content-visibility: auto; } .cardImage-padded { height: 70%; top: 15%; bottom: 15%; } .cardContent-round { border-radius: 100em; background-size: cover; background-position: center center; object-fit: cover; } .coveredImage { background-size: 100% 100%; background-position: center center; object-fit: fill; } .coveredImage-noScale { background-size: cover; object-fit: cover; } .coveredImage-contain { background-size: contain; object-fit: contain; } .cardFooter { padding: 0.4em 0.5em 0.85em 0.5em; position: relative; } .cardFooter-side { padding-top: 0; padding-bottom: 0; } .cardFooter-vibrant::before { position: absolute; top: 0; bottom: 0; left: 0; right: 0; inset-inline-start: 0; inset-inline-end: 0; background: rgba(0, 0, 0, 0.1); content: " "; } .cardFooter-vibrant { padding: 0.5em 0.5em 0.85em 0.5em; font-weight: 600; position: relative; } .visualCardBox { box-shadow: 0 0.06933em 0.06933em 0 rgba(0, 0, 0, 0.14), 0 0.13866em 0.06933em -0.06933em rgba(0, 0, 0, 0.12), 0 0.06933em 0.208em 0 rgba(0, 0, 0, 0.2); border-radius: 0.42em; } .visualCardBox-vibrant { overflow: hidden; background-size: cover; background-repeat: no-repeat; } .innerCardFooter { background-color: transparent; position: absolute; bottom: 0; text-align: start; overflow: hidden; max-width: 100%; color: #fff; left: 0; right: 0; inset-inline-start: 0; inset-inline-end: 0; text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); } .cardText { padding: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .cardText-overview { white-space: normal; height: 3.8rem; -webkit-line-clamp: 3; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; text-align: left; } .cardText-secondary { font-size: 92%; } .cardText-first-padded { padding-top: 0.22em; } .innerCardFooter > .cardText { padding: 0.1em 0.35em; } .cardFooter-withlogo { -webkit-padding-start: 4em; padding-inline-start: 4em; position: relative; } .cardFooterLogo { position: absolute; top: 0; bottom: 0; left: 0; inset-inline-start: 0; inset-inline-end: initial; width: 4.5em; background-size: 70% auto; background-repeat: no-repeat; background-position: center center; } .cardDefaultText { white-space: normal; text-align: center; position: absolute; top: 30%; left: 10%; inset-inline-start: 10%; inset-inline-end: initial; width: 80%; } @supports (aspect-ratio: 16 / 9) { .cardDefaultText { position: static; top: initial; left: initial; right: initial; inset-inline-start: initial; inset-inline-end: initial; width: auto; } } .textActionButton { border: 0 !important; background: 0 0; border: 0 !important; padding: 0 !important; cursor: pointer; -webkit-tap-highlight-color: transparent; color: inherit !important; display: inline-block; vertical-align: middle; font-family: inherit; font-size: inherit; outline: 0 !important; font-weight: inherit; line-height: normal !important; } .cardTextActionButton { width: 100%; overflow: hidden; text-overflow: ellipsis; text-align: inherit; line-height: 2 !important; } .cardTextLinksLine > .cardTextActionButton { width: auto; } .cardImageIcon { font-size: 4em !important; color: inherit; } .cardImageIcon-sideFooter { font-size: 3em !important; } .cardImageIcon-smallSideFooter { font-size: 1.64em !important; } .cardImageIcon-center { width: 1em; height: 1em; position: absolute; top: 50%; left: 50%; inset-inline-start: 50%; inset-inline-end: initial; -webkit-margin-start: -0.5em; margin-inline-start: -0.5em; margin-top: -0.5em; } @supports (aspect-ratio: 16 / 9) { .cardImageIcon-center { width: auto; height: auto; position: initial; margin-top: 0; -webkit-margin-start: 0; margin-inline-start: 0; } } .cardRefreshIndicator-sideFooter { position: absolute !important; } .cardOverlayButton { color: rgba(255, 255, 255, 0.76); margin: 0; z-index: 1; } .cardOverlayButton-br { position: absolute; bottom: 0; right: 0; inset-inline-start: initial; inset-inline-end: 0; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; } .cardOverlayButtonIcon { border-radius: 100em; -webkit-justify-content: center; justify-content: center; -webkit-align-items: center; align-items: center; display: -webkit-flex; display: flex; } :root { --backdrop-cards: 1; --small-sidefooter-cards: 1.3; --sidefooter-cards: 1; --banner-cards: 1; --four-three-cards: 2; --square-cards: 2; --portrait-cards: 3; --user-cards-size-adjust: 0; --app-cards-size-adjust: 0; } .itemsContainer-defaultCardSize { --user-cards-size-adjust: 0; } .cardSizeSmaller { --app-cards-size-adjust: 1; } @media all and (min-width: 60em) and (max-width: 99em) { .skinBody-withFullDrawer { --app-cards-size-adjust: -1; } .skinBody-withFullDrawer .cardSizeSmaller { --app-cards-size-adjust: -1; } } .squareCard { width: 16.6666667%; width: calc(100% / (var(--square-cards) + var(--app-cards-size-adjust))); } .squareCard-horiz { width: 15.3333333vw; width: calc(92vw / var(--square-cards)); } .portraitCard { width: 16.6666667%; width: calc(100% / (var(--portrait-cards) + var(--app-cards-size-adjust))); } .portraitCard-horiz { width: 15.3333333vw; width: calc(92vw / var(--portrait-cards)); } .bannerCard { width: 33.333333%; width: calc(100% / (var(--banner-cards) + var(--app-cards-size-adjust))); } .bannerCard-horiz { width: 30.66667vw; width: calc(92vw / var(--banner-cards)); } .sideFooterCard { width: 25%; width: calc(100% / (var(--sidefooter-cards) + var(--app-cards-size-adjust))); } .sideFooterCard-horiz { width: 23vw; width: calc(92vw / var(--sidefooter-cards)); } .smallSideFooterCard { width: 16.6666667%; width: calc( 100% / (var(--small-sidefooter-cards) + var(--app-cards-size-adjust)) ); } .smallSideFooterCard-horiz { width: 15.3333333vw; width: calc( 92vw / (var(--small-sidefooter-cards) + var(--app-cards-size-adjust)) ); } .fourThreeCard { width: 25%; width: calc(100% / (var(--four-three-cards) + var(--app-cards-size-adjust))); } .fourThreeCard-horiz { width: 23vw; width: calc(92vw / var(--four-three-cards)); } .backdropCard { width: 25%; width: calc(100% / (var(--backdrop-cards) + var(--app-cards-size-adjust))); } .backdropCard-horiz { width: 23vw; width: calc(92vw / var(--backdrop-cards)); } @supports (width: max(10em, 5vw)) { .squareCard { width: calc( 100% / max( ( var(--square-cards) + var(--user-cards-size-adjust) + var(--app-cards-size-adjust) ), 2 ) ); } .squareCard-horiz { width: calc( 92vw / max((var(--square-cards) + var(--user-cards-size-adjust)), 2) ); } .portraitCard { width: calc( 100% / max( ( var(--portrait-cards) + var(--user-cards-size-adjust) + var(--app-cards-size-adjust) ), 3 ) ); } .portraitCard-horiz { width: calc( 92vw / max((var(--portrait-cards) + var(--user-cards-size-adjust)), 3) ); } .bannerCard { width: calc( 100% / max( ( var(--banner-cards) + var(--user-cards-size-adjust) + var(--app-cards-size-adjust) ), 1 ) ); } .bannerCard-horiz { width: calc( 92vw / max((var(--banner-cards) + var(--user-cards-size-adjust)), 1) ); } .sideFooterCard { width: calc( 100% / max( ( var(--sidefooter-cards) + var(--user-cards-size-adjust) + var(--app-cards-size-adjust) ), 1 ) ); } .sideFooterCard-horiz { width: calc( 92vw / max((var(--sidefooter-cards) + var(--user-cards-size-adjust)), 1) ); } .smallSideFooterCard { width: calc( 100% / max( ( var(--small-sidefooter-cards) + var(--user-cards-size-adjust) + var(--app-cards-size-adjust) ), 1.3 ) ); } .smallSideFooterCard-horiz { width: calc( 92vw / max( (var(--small-sidefooter-cards) + var(--user-cards-size-adjust)), 1.3 ) ); } .fourThreeCard { width: calc( 100% / max( ( var(--four-three-cards) + var(--user-cards-size-adjust) + var(--app-cards-size-adjust) ), 2 ) ); } .fourThreeCard-horiz { width: calc( 92vw / max((var(--four-three-cards) + var(--user-cards-size-adjust)), 2) ); } .backdropCard { width: calc( 100% / max( ( var(--backdrop-cards) + var(--user-cards-size-adjust) + var(--app-cards-size-adjust) ), 1 ) ); } .backdropCard-horiz { width: calc( 92vw / max((var(--backdrop-cards) + var(--user-cards-size-adjust)), 1) ); } } @media all and (orientation: landscape) { :root { --backdrop-cards: 2; } } @media all and (orientation: portrait) and (min-width: 24em) { :root { --backdrop-cards: 2; } } @media all and (orientation: portrait) and (min-width: 31.25em) { :root { --square-cards: 3; } } @media all and (min-width: 31.25em) { :root { --four-three-cards: 3; } } @media all and (min-width: 36em) { :root { --square-cards: 3; --portrait-cards: 4; } } @media all and (min-width: 40em) { :root { --square-cards: 4; --small-sidefooter-cards: 2; } } @media all and (orientation: landscape) and (min-width: 40em) { :root { --portrait-cards: 5; } } @media all and (orientation: landscape) and (min-width: 50em) { :root { --square-cards: 5; } } @media all and (min-width: 45em) { :root { --four-three-cards: 4; --sidefooter-cards: 2; } } @media all and (min-width: 50em) { :root { --small-sidefooter-cards: 3; } } @media (min-width: 50em) { :root { --backdrop-cards: 3; } } @media all and (min-width: 55em) { :root { --banner-cards: 2; --square-cards: 5; --portrait-cards: 5; } } @media (min-width: 62.5em) { :root { --backdrop-cards: 4; } } @media all and (min-width: 66em) { :root { --small-sidefooter-cards: 4; } } @media all and (min-width: 70em) { :root { --four-three-cards: 5; --square-cards: 6; --portrait-cards: 6; } } @media all and (min-width: 76em) { :root { --sidefooter-cards: 3; } } @media all and (min-width: 82.5em) { :root { --backdrop-cards: 5; } } @media all and (min-width: 85em) { :root { --square-cards: 7; --portrait-cards: 7; } } @media all and (min-width: 100em) { :root { --banner-cards: 3; --small-sidefooter-cards: 5; --four-three-cards: 6; --square-cards: 8; --portrait-cards: 8; } } @media all and (min-width: 115em) { :root { --small-sidefooter-cards: 6; --portrait-cards: 9; --square-cards: 9; } } @media all and (min-width: 120em) { :root { --small-sidefooter-cards: 6; } } @media all and (min-width: 130em) { :root { --square-cards: 10; --portrait-cards: 10; } } @media all and (min-width: 131.25em) { :root { --backdrop-cards: 6; --four-three-cards: 7; --sidefooter-cards: 4; } } @media all and (min-width: 145em) { :root { --square-cards: 11; --portrait-cards: 11; } } @media all and (min-width: 150em) { :root { --banner-cards: 4; } } @media all and (min-width: 160em) { :root { --backdrop-cards: 7; --small-sidefooter-cards: 7; --four-three-cards: 8; --square-cards: 12; --portrait-cards: 12; } } @media all and (min-width: 175em) { :root { --square-cards: 13; --portrait-cards: 13; } } @media all and (min-width: 180em) { :root { --small-sidefooter-cards: 8; --four-three-cards: 9; } } @media all and (min-width: 190em) { :root { --square-cards: 14; --portrait-cards: 14; } } @media all and (min-width: 200em) { :root { --banner-cards: 5; --sidefooter-cards: 5; --backdrop-cards: 8; --small-sidefooter-cards: 9; --four-three-cards: 10; } } @media all and (min-width: 205em) { :root { --square-cards: 15; --portrait-cards: 15; } } @media all and (min-width: 220em) { :root { --sidefooter-cards: 6; --backdrop-cards: 9; --small-sidefooter-cards: 10; --four-three-cards: 11; --square-cards: 16; --portrait-cards: 16; } } @media all and (min-width: 240em) { :root { --banner-cards: 6; --sidefooter-cards: 7; --small-sidefooter-cards: 11; --four-three-cards: 12; --square-cards: 17; --portrait-cards: 17; } } @media all and (orientation: portrait) and (max-width: 35em) { .scrollX { --backdrop-cards: 1.2; } } .layout-tv:root { --square-cards: 5; --banner-cards: 3; --sidefooter-cards: 3; --small-sidefooter-cards: 4; --portrait-cards: 6; --backdrop-cards: 4; --four-three-cards: 5; } .cardOverlayContainer { background: rgba(51, 51, 51, 0.5); opacity: 0; transition: opacity 0.2s ease-out; position: absolute; top: 0; bottom: 0; left: 0; right: 0; inset-inline-start: 0; inset-inline-end: 0; -webkit-user-select: none; user-select: none; display: none; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; border-radius: 0.3em; z-index: 2; contain: layout style; } .cardContent-button + .cardOverlayContainer { cursor: pointer; } .chkCardSelectContainer { font-size: 76%; width: auto !important; margin: 0 !important; display: -webkit-inline-flex !important; display: inline-flex !important; -webkit-padding-start: 0.7em !important; padding-inline-start: 0.7em !important; -webkit-align-items: flex-start !important; align-items: flex-start !important; padding-top: 0.8em !important; position: absolute !important; top: 0; left: 0; inset-inline-start: 0; inset-inline-end: initial; padding: 0.8em 0.7em !important; } @media (hover: hover) and (pointer: fine) { .cardOverlayContainer { display: -webkit-flex; display: flex; } .card-hoverable:hover .cardOverlayContainer { opacity: 1; } } .chkCardSelect { top: 0; left: 0; inset-inline-start: 0; inset-inline-end: initial; } .chkCardSelect + .checkboxLabel, .chkCardSelect + .checkboxLabel::before { border-radius: 100em !important; } .chkCardSelect-checkboxLabel::after { border-width: 0.2em !important; } .cardOverlayButton-hover { background: 0 0; color: #fff; } .cardOverlayButtonIcon-hover { background: 0 0 !important; line-height: initial !important; padding: 0.4em !important; } .cardOverlayFab-primary { font-size: 180% !important; padding: 0 !important; transition: -webkit-transform 240ms ease-out, opacity 180ms ease-out; transition: transform 240ms ease-out, opacity 180ms ease-out; position: absolute; top: 50%; left: 50%; inset-inline-start: 50%; inset-inline-end: initial; margin-top: -0.83em !important; margin-bottom: 0 !important; -webkit-margin-start: -0.83em !important; margin-inline-start: -0.83em !important; -webkit-margin-end: 0 !important; margin-inline-end: 0 !important; width: 1.66em; height: 1.66em; display: none; } .cardOverlayFab-primary:hover { -webkit-transform: scale(1.1); transform: scale(1.1); } [dir="rtl"] .cardOverlayFab-primary:hover { -webkit-transform: scaleX(-1) scale(1.1); transform: scaleX(-1) scale(1.1); } .multi-select-active .cardIndicator { display: none; } .multi-select-active .cardOverlayContainer { display: block !important; opacity: 1 !important; } .multi-select-active .cardImageContainer { transition: -webkit-transform 0.135s cubic-bezier(0, 0, 0.2, 1); transition: transform 0.135s cubic-bezier(0, 0, 0.2, 1); } .multi-select-active .cardOverlayButton:not(.chkCardSelectContainer) { opacity: 0 !important; display: none !important; } .multi-select-active .chkCardSelectContainer { opacity: 1 !important; } .item-multiselected .cardImageContainer { -webkit-transform: translateZ(0) scale3d(0.79, 0.84, 1); transform: translateZ(0) scale3d(0.79, 0.84, 1); } .item-multiselected .cardOverlayContainer { background: 0 0 !important; } .cardMissingIndicator { position: absolute; top: 0.35em; left: 0.225em; inset-inline-start: 0.225em; inset-inline-end: initial; margin: 0 !important; contain: layout style; } .cardSyncIndicator { position: absolute; bottom: 0.35em; right: 0.18em; inset-inline-start: initial; inset-inline-end: 0.18em; contain: layout style; } .cardPlayedIndicator, .cardTimerIndicator { border-radius: 100em; font-size: 1.28em; height: 1.25em; width: 1.25em; display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; top: 0.18em; position: absolute; right: 0.18em; inset-inline-start: initial; inset-inline-end: 0.18em; contain: layout style; } .cardPlayedIndicator + .cardTimerIndicator { right: 1.5em; inset-inline-start: initial; inset-inline-end: 1.5em; } .cardCountIndicator { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; top: 0.225em; position: absolute; right: 0.225em; inset-inline-start: initial; inset-inline-end: 0.225em; contain: layout style; } .cardProgramIndicator { contain: layout style; display: -webkit-inline-flex; display: inline-flex; margin-top: 0; margin-bottom: 0.2em; -webkit-margin-start: 0.35em; margin-inline-start: 0.35em; -webkit-margin-end: 0; margin-inline-end: 0; padding: 0.08em 0.5em; border-radius: 0.42em; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; text-transform: uppercase; font-size: 84%; font-weight: 600; } .drag-reorder-y-active .skinHeader { z-index: 0 !important; } .drag-reorder-y-active .appfooter { display: none !important; } .dragging .cardOverlayContainer, .dragging .cardIndicator:not(.cardIndicatorIcon-dragHandle) { display: none !important; } .cardIndicatorIcon { font-size: 1.6em; top: 0.225em; left: 0.225em; inset-inline-start: 0.225em; inset-inline-end: initial; position: absolute; color: #fff; } .cardIndicatorIcon-dragHandle { right: 0.225em; inset-inline-start: initial; inset-inline-end: 0.225em; text-shadow: 0.14em 0.14em 0.28em rgba(0, 0, 0, 0.45); cursor: pointer; } .cardMediaInfoItems { display: -webkit-flex; display: flex; -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; -webkit-column-gap: initial !important; column-gap: initial !important; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; } .cardMediaInfoItem { -webkit-align-items: center; align-items: center; -webkit-justify-content: center; justify-content: center; } .cardMediaInfoItem + .cardMediaInfoItem { -webkit-margin-start: 0.5em !important; margin-inline-start: 0.5em !important; } .cardMediaInfoItem .starIcon { line-height: 0.96; } .card.dragging-over { position: relative; contain: none !important; z-index: 1; } .dragging-over-left::before { content: " "; width: 0.24em; position: absolute; top: 0.8em; bottom: 0.8em; left: -0.14em; inset-inline-start: -0.14em; inset-inline-end: initial; z-index: 99999; border-radius: 100em; } .dragging-over-right::after { content: " "; width: 0.24em; position: absolute; right: -0.14em; top: 0.8em; bottom: 0.8em; inset-inline-start: initial; inset-inline-end: -0.14em; z-index: 99999; border-radius: 100em; } .cardProgressBarContainer { background: 0 0 !important; } .visualCardBox-vibrant-lg::before { content: " "; position: absolute; top: 0; bottom: 0; left: 0; right: 0; inset-inline-start: 0; inset-inline-end: 0; background: rgba(0, 0, 0, 0.2); z-index: -1; } .autoWidthCard { width: auto; } .card:focus .cardContent-bxsborder { contain: initial; content-visibility: initial; overflow: visible; } .card:focus-visible .cardContent-bxsborder-fv { contain: initial; content-visibility: initial; overflow: visible; } .sideFooterCard:focus .cardBox-sideFooter-f { overflow: visible; } .sideFooterCard:focus .cardBox-sideFooter-f .cardContent { border-start-start-radius: inherit; border-end-start-radius: inherit; } .card:focus .cardContent-bxsborder::before, .sideFooterCard:focus .cardBox-sideFooter-f::before { content: " "; position: absolute; top: -0.34em; left: -0.34em; right: -0.34em; bottom: -0.34em; border-width: 0.22em; border-style: solid; border-radius: 0.6em; } .sideFooterCard:focus .cardBox-sideFooter-f::before { border-radius: 0.72em; } .card:focus-visible .cardContent-bxsborder-fv::before { content: " "; position: absolute; top: -0.34em; left: -0.34em; right: -0.34em; bottom: -0.34em; border-width: 0.22em; border-style: solid; border-radius: 0.6em; } .card:focus .cardContent-bxsborder.cardContent-round::before { border-radius: 100em; } .card:focus .cardContent-bxsborder .cardImage { border-radius: inherit; } .card:focus-visible .cardContent-bxsborder-fv.cardContent-round::before { border-radius: 100em; } .card:focus-visible .cardContent-bxsborder-fv .cardImage { border-radius: inherit; } .buttonCardBox { border-radius: 0.6em; margin: 0.4em; } .buttonCardBox::before, .cardBox-sideFooter::before { display: none !important; }