/* Videos (/videos/): Shorts im Vollbild + FCBinside TV. Maße aus den App-Screenshots (Faktor 402/921). */

.fi-videopage { background: #f4f4f6; }
.fi-videopage.is-shorts { overflow: hidden; background: #000; }
.fi-videopage.is-shorts .fi-footer, .fi-videopage.is-shorts .fi-appnav { display: none; }

/* ---------- Kopf: Zurück + "Shorts | TV" ---------- */
.fi-vid-top {
	position: fixed; top: 0; left: 0; right: 0; z-index: 60; display: flex; align-items: center; justify-content: center;
	height: calc(56px + env(safe-area-inset-top)); padding-top: env(safe-area-inset-top); color: #fff; pointer-events: none;
	background: linear-gradient(rgba(0, 0, 0, .45), rgba(0, 0, 0, 0));
}
.fi-videopage:not(.is-shorts) .fi-vid-top { position: sticky; background: linear-gradient(180deg, #2b0a14, #3d0d1c); }
.fi-vid-back { position: absolute; left: 10px; bottom: 8px; display: grid; place-items: center; width: 40px; height: 40px; color: #fff; pointer-events: auto; }
.fi-vid-tabs { display: flex; gap: 34px; pointer-events: auto; }
.fi-vid-tabs button {
	position: relative; display: flex; align-items: center; gap: 6px; height: 44px; padding: 0; border: 0; background: none; cursor: pointer;
	color: rgba(255, 255, 255, .62); font-family: inherit; font-size: 16.5px; font-weight: 700; letter-spacing: .02em; text-transform: uppercase;
	text-shadow: 0 1px 3px rgba(0, 0, 0, .35);
}
.fi-vid-tabs button svg { width: 18px; height: 18px; }
.fi-vid-tabs button[aria-selected="true"] { color: #fff; }
.fi-vid-tabs button[aria-selected="true"]::after { content: ""; position: absolute; left: 50%; bottom: 2px; width: 18px; height: 2px; margin-left: -9px; background: #fff; }

/* ---------- Shorts ---------- */
.fi-shorts { position: fixed; inset: 0; z-index: 50; background: #000; }
.fi-shorts[hidden] { display: none; }
.fi-shorts-feed { height: 100%; overflow-y: auto; scroll-snap-type: y mandatory; overscroll-behavior: contain; scrollbar-width: none; }
.fi-shorts-feed::-webkit-scrollbar { display: none; }
.fi-short { position: relative; height: 100dvh; scroll-snap-align: start; scroll-snap-stop: always; overflow: hidden; color: #fff; }
.fi-short-media { position: absolute; inset: 0; display: grid; place-items: center; background: #000; cursor: pointer; }
.fi-short-media img, .fi-short-media video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.fi-short-blocked { position: relative; z-index: 1; max-width: 240px; margin: 0; color: rgba(255, 255, 255, .7); font-size: 14px; line-height: 1.4; text-align: center; }
.is-blocked .fi-short-sound { display: none; }
.fi-short.is-playing .fi-short-poster { opacity: 0; transition: opacity .2s; }
.fi-short.is-paused .fi-short-media::after {
	content: ""; position: absolute; width: 72px; height: 72px; border-radius: 50%; background: rgba(0, 0, 0, .45)
	url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.5v13l11-6.5z' fill='%23fff'/%3E%3C/svg%3E") center / 36px no-repeat;
}
@media (min-width: 700px) { /* Desktop: Hochkant-Video mittig wie am Handy */
	.fi-short-media video, .fi-short-media img { object-fit: contain; }
}
.fi-short::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 45%; background: linear-gradient(transparent, rgba(0, 0, 0, .55)); pointer-events: none; }

.fi-short-more {
	position: absolute; top: calc(8px + env(safe-area-inset-top)); right: 8px; z-index: 61; display: grid; place-items: center;
	width: 44px; height: 44px; padding: 0; border: 0; background: none; color: #fff; cursor: pointer; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .5));
}
.fi-short-sound {
	position: absolute; top: calc(64px + env(safe-area-inset-top)); right: 12px; z-index: 3; display: grid; place-items: center;
	width: 40px; height: 40px; border: 0; border-radius: 50%; background: rgba(0, 0, 0, .35); color: #fff; cursor: pointer;
}

.fi-short-side { position: absolute; right: 8px; bottom: calc(96px + env(safe-area-inset-bottom)); z-index: 3; display: flex; flex-direction: column; align-items: center; gap: 14px; }
.fi-short-creator { position: relative; margin-bottom: 14px; }
.fi-short-plus { position: absolute; left: 50%; bottom: -9px; transform: translateX(-50%); display: grid; place-items: center; width: 22px; height: 22px; padding: 0; border: 1.5px solid #fff; border-radius: 50%; background: #e4002b; color: #fff; cursor: pointer; box-shadow: 0 1px 3px rgba(0, 0, 0, .35); }
.fi-short-plus[hidden] { display: none; }
.fi-short-plus:disabled { opacity: .6; }
.fi-short-avatar { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: 0; border-radius: 50%; background: #fff; overflow: hidden; box-shadow: 0 1px 4px rgba(0, 0, 0, .3); }
.fi-short-avatar img { width: 80%; height: auto; }
.fi-short-avatar.is-creator img { width: 100%; height: 100%; object-fit: cover; }
.fi-short-act { display: flex; flex-direction: column; align-items: center; gap: 2px; min-width: 48px; padding: 0; border: 0; background: none; color: #fff; cursor: pointer; filter: drop-shadow(0 1px 2px rgba(0, 0, 0, .45)); }
.fi-short-act b { font-size: 13px; font-weight: 700; }
.fi-short-act[aria-pressed="true"][data-act="like"] svg { color: #e6197a; }
.fi-short-act[aria-pressed="true"][data-act="save"] svg { color: #f5c518; }
.fi-short-act:active svg { transform: scale(.88); }

.fi-short-info { position: absolute; left: 15px; right: 76px; bottom: calc(26px + env(safe-area-inset-bottom)); z-index: 3; text-shadow: 0 1px 3px rgba(0, 0, 0, .5); }
.fi-short-info p { margin: 0; }
.fi-short-handle { color: inherit !important; text-decoration: none; display: inline-flex; max-width: 100%; align-items: center; gap: 5px; font-size: 16.5px; font-weight: 800; }
.fi-short-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 6px !important; font-size: 15px; line-height: 1.3; }
.fi-short-progress { position: absolute; left: 15px; right: 15px; bottom: calc(12px + env(safe-area-inset-bottom)); z-index: 3; height: 2px; background: rgba(255, 255, 255, .25); }
.fi-short-progress i { display: block; width: 0; height: 100%; background: #fff; }
.fi-shorts-empty { padding: 120px 20px; color: #888; text-align: center; }

/* ---------- Kommentare (Blatt von unten, wie in der App) ---------- */
.fi-sheet, .fi-action { position: fixed; inset: 0; z-index: 80; }
.fi-action { z-index: 85; }
.fi-sheet[hidden], .fi-action[hidden] { display: none; }
.fi-sheet-backdrop { position: absolute; inset: 0; background: rgba(0, 0, 0, .45); }
.fi-sheet-panel {
	position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; max-width: 640px; height: 68dvh; margin: 0 auto;
	padding-bottom: env(safe-area-inset-bottom); border-radius: 16px 16px 0 0; background: #fff; color: #111; animation: fi-sheet-in .22s ease-out;
}
@keyframes fi-sheet-in { from { transform: translateY(40px); } }
.fi-sheet-head { position: relative; display: flex; align-items: center; justify-content: center; gap: 4px; height: 52px; flex: none; border-bottom: 1px solid #e3e5e6; }
.fi-sheet-head h2 { margin: 0; font-size: 16.5px; font-weight: 600; letter-spacing: -.01em; }
.fi-sheet-sort { display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 0; background: none; color: #6b6f76; cursor: pointer; }
.fi-sheet-sort.is-top { color: #e6197a; }
.fi-sheet-close { position: absolute; right: 6px; top: 4px; display: grid; place-items: center; width: 44px; height: 44px; border: 0; background: none; color: #111; cursor: pointer; }

.fi-sheet-list { flex: 1; margin: 0; padding: 4px 0; overflow-y: auto; list-style: none; overscroll-behavior: contain; }
.fi-c { padding: 10px 15px 6px; -webkit-touch-callout: none; }
.fi-c-row { display: flex; gap: 12px; }
.fi-c-avatar img, .fi-c-avatar i { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; object-fit: cover; background: #e6197a; color: #fff; font-size: 15px; font-style: normal; font-weight: 800; }
.is-reply .fi-c-avatar img, .is-reply .fi-c-avatar i { width: 28px; height: 28px; font-size: 12px; }
.fi-c-main { flex: 1; min-width: 0; }
.fi-c-name { margin: 2px 0 3px; color: #6b6f76; font-size: 14px; }
.fi-c-text { margin: 0; color: #111; font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }
.fi-c-gif { display: block; max-width: 170px; margin-top: 2px; border-radius: 6px; }
.fi-c-foot { display: flex; align-items: center; gap: 18px; margin-top: 6px; color: #6b6f76; font-size: 13.5px; }
.fi-c-replybtn { padding: 0; border: 0; background: none; color: #6b6f76; cursor: pointer; font-family: inherit; font-size: 13.5px; font-weight: 600; }
.fi-c-acts { display: flex; align-items: center; gap: 14px; margin-left: auto; }
.fi-c-acts button { display: flex; align-items: center; gap: 4px; min-height: 32px; padding: 0; border: 0; background: none; color: #6b6f76; cursor: pointer; font-family: inherit; font-size: 13px; }
.fi-c-like[aria-pressed="true"] { color: #e6197a; }
.fi-c-dislike[aria-pressed="true"] { color: #111; }
.fi-c-more { align-self: flex-start; display: none; width: 28px; height: 28px; padding: 0; border: 0; background: none; color: #8a8d93; cursor: pointer; }
@media (hover: hover) { .fi-c-row:hover .fi-c-more { display: grid; place-items: center; } } /* Maus: "⋯" statt lange drücken */
.fi-c-replies { margin: 4px 0 0 48px; padding: 0; list-style: none; }
.fi-c-replies .fi-c { padding: 8px 0 2px; }
.fi-sheet-empty { padding: 34px 20px; color: #6b6f76; text-align: center; list-style: none; }

.fi-sheet-reply { display: flex; align-items: center; justify-content: space-between; flex: none; height: 38px; padding: 0 8px 0 15px; background: #f4f4f6; color: #6b6f76; font-size: 13.5px; }
.fi-sheet-reply[hidden] { display: none; }
.fi-sheet-reply b { color: #111; }
.fi-sheet-reply i { font-style: normal; }
.fi-sheet-reply button { display: grid; place-items: center; width: 34px; height: 34px; border: 0; background: none; color: #6b6f76; cursor: pointer; }
.fi-sheet-form { display: flex; align-items: center; gap: 12px; flex: none; padding: 10px 12px 10px 15px; border-top: 1px solid #e3e5e6; }
.fi-sheet-me { flex: none; display: grid; place-items: center; width: 34px; height: 34px; overflow: hidden; border-radius: 50%; background: #e3e4e7; color: #a3a6ab; }
.fi-sheet-me img { width: 100%; height: 100%; object-fit: cover; }
.fi-sheet-me i { display: grid; place-items: center; width: 100%; height: 100%; background: #e6197a; color: #fff; font-size: 14px; font-style: normal; font-weight: 800; }
.fi-sheet-form input { flex: 1; min-width: 0; height: 40px; padding: 0 16px; border: 0; border-radius: 20px; background: #e9e9ec; color: #111; font-family: inherit; font-size: 16px; }
.fi-sheet-form input::placeholder { color: #6b6f76; }
.fi-sheet-form input:focus { outline: 2px solid #e6197a; outline-offset: -2px; background: #fff; }
.fi-sheet-form button { display: grid; place-items: center; flex: none; width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%; background: none; color: #e6197a; cursor: pointer; }
.fi-sheet-form.is-saving { opacity: .5; pointer-events: none; }

/* Auswahl von unten */
.fi-action-panel {
	position: absolute; left: 0; right: 0; bottom: 0; max-width: 640px; margin: 0 auto; padding: 10px 0 calc(18px + env(safe-area-inset-bottom));
	border-radius: 16px 16px 0 0; background: #fff; color: #111; animation: fi-sheet-in .2s ease-out;
}
.fi-action-handle { display: block; width: 34px; height: 4px; margin: 0 auto 10px; border-radius: 2px; background: #d6d7da; }
.fi-opt { display: flex; align-items: center; gap: 20px; width: 100%; height: 56px; padding: 0 20px; border: 0; background: none; color: #111; cursor: pointer; font-family: inherit; font-size: 17px; text-align: left; }
.fi-opt.is-red { color: #e5364f; }
.fi-opt:hover { background: #f6f6f7; }
.fi-report-title { margin: 4px 20px 2px; font-size: 18px; font-weight: 800; text-align: center; }
.fi-report-sub { margin: 0 20px 10px; color: #6b6f76; font-size: 14px; text-align: center; }
.fi-report-list { max-height: 46dvh; overflow-y: auto; }
.fi-report-reason { display: flex; align-items: center; width: 100%; min-height: 48px; padding: 0 20px; border: 0; border-bottom: 1px solid #f0f1f1; background: none; color: #111; cursor: pointer; font-family: inherit; font-size: 15.5px; text-align: left; }
.fi-report-reason::after { content: ""; flex: none; width: 18px; height: 18px; margin-left: auto; border: 2px solid #c8cacd; border-radius: 50%; }
.fi-report-reason[aria-pressed="true"]::after { border: 6px solid #e6197a; }
.fi-report-note { margin: 12px 20px; color: #6b6f76; font-size: 12.5px; line-height: 1.4; text-align: center; }
.fi-report-send { display: block; width: calc(100% - 40px); height: 48px; margin: 0 20px; border: 0; border-radius: 24px; background: #e6197a; color: #fff; cursor: pointer; font-family: inherit; font-size: 15px; font-weight: 700; }
.fi-report-send:disabled { background: #e9e9ec; color: #9a9ca1; cursor: default; }

/* Anmelde-Fenster im Blatt (fi-login.js) */
.fi-action.is-login .fi-action-panel { padding-top: 10px; }
.fi-login { padding: 4px 20px 0; text-align: center; }
.fi-login.is-busy { opacity: .6; pointer-events: none; }
.fi-login-logo { display: block; width: 120px; height: auto; margin: 6px auto 12px; }
.fi-login-title { margin: 0; color: #111; font-size: 20px; font-weight: 800; letter-spacing: -.02em; }
.fi-login-sub { margin: 6px 0 18px; color: #6b6f76; font-size: 15px; }
.fi-login-main, .fi-login-mail { display: grid; gap: 10px; text-align: left; }
.fi-login-main[hidden], .fi-login-mail[hidden] { display: none; }
.fi-login-btn {
	position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; height: 50px; padding: 0 16px;
	border: 1px solid #dadce0; border-radius: 25px; background: #fff; color: #111; cursor: pointer; font-family: inherit; font-size: 16px; font-weight: 600;
}
.fi-login-btn svg { position: absolute; left: 18px; }
.fi-login-btn:hover { background: #f6f6f7; }
.fi-login-btn.is-apple { border-color: #000; background: #000; color: #fff; }
.fi-login-btn.is-apple:hover { background: #222; }
.fi-login-mail label { display: grid; gap: 5px; color: #3a3a40; font-size: 13px; font-weight: 600; }
.fi-login-mail input { height: 48px; padding: 0 14px; border: 1px solid #dadce0; border-radius: 12px; font-family: inherit; font-size: 16px; }
.fi-login-mail input:focus { outline: 2px solid #e6197a; outline-offset: -1px; border-color: transparent; }
.fi-login-submit { height: 50px; margin-top: 4px; border: 0; border-radius: 25px; background: #e6197a; color: #fff; cursor: pointer; font-family: inherit; font-size: 16px; font-weight: 700; }
.fi-login-links { display: flex; justify-content: space-between; gap: 10px; }
.fi-login-links button { padding: 6px 0; border: 0; background: none; color: #e6197a; cursor: pointer; font-family: inherit; font-size: 14px; font-weight: 600; }
.fi-login-msg { margin: 12px 0 0; padding: 10px 12px; border-radius: 10px; background: #fdecee; color: #b3261e; font-size: 14px; text-align: left; }
.fi-login-msg.is-ok { background: #e8f6ee; color: #1e7a45; }
.fi-login-msg[hidden] { display: none; }
.fi-login-fine { margin: 16px 0 0; color: #8a8d93; font-size: 12.5px; line-height: 1.4; }
.fi-login-fine a { color: #6b6f76; }

.fi-vid-toast {
	position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom)); z-index: 90; max-width: calc(100% - 32px); margin: 0; padding: 12px 16px;
	transform: translateX(-50%); background: #111; color: #fff; font-size: 14px; line-height: 1.35; box-shadow: 0 4px 16px rgba(0, 0, 0, .3);
}
.fi-vid-toast[hidden] { display: none; }
.fi-vid-toast a { color: #ff7bbd; font-weight: 700; }

/* ---------- TV ---------- */
.fi-tv { max-width: 640px; margin: 0 auto; padding-bottom: 90px; }
.fi-tvhero { background: #f4f4f6; }
.fi-tvhero-media { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; padding: 0; border: 0; background: #000; cursor: pointer; }
.fi-tvhero-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fi-tvhero-play { position: absolute; top: 50%; left: 50%; display: grid; place-items: center; width: 62px; height: 62px; margin: -31px 0 0 -31px; border-radius: 50%; background: #e6197a; color: #fff; padding-left: 3px; box-shadow: 0 2px 10px rgba(0, 0, 0, .3); }
.fi-tvhero-frame { display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; background: #000; }
.fi-tvhero-text { padding: 14px 15px 6px; }
.fi-tvhero-text h1 { margin: 0; color: #111; font-size: 20px; font-weight: 800; line-height: 1.2; letter-spacing: -.02em; }
.fi-tvhero-meta { margin: 8px 0 0; color: #6b6f76; font-size: 13.5px; }
.fi-tvhero-pills { display: flex; gap: 8px; margin: 12px 0 0; }
.fi-tvhero-pills span { display: flex; align-items: center; gap: 7px; height: 27px; padding: 0 12px; border-radius: 14px; background: #e6e6ea; color: #444; font-size: 14px; }
.fi-tvhero-pills svg { color: #444; }

.fi-tvrow { padding: 18px 0 4px; }
.fi-tvrow h2 { margin: 0 15px 10px; padding-left: 12px; border-left: 3px solid #e6197a; overflow: hidden; color: #111; font-size: 17px; font-weight: 800; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.fi-tvrow-track { display: flex; gap: 11px; padding: 0 15px; overflow-x: auto; scroll-snap-type: x mandatory; scroll-padding: 0 15px; scrollbar-width: none; }
.fi-tvrow-track::-webkit-scrollbar { display: none; }
.fi-tvcard { flex: 0 0 55%; max-width: 240px; padding: 0; border: 0; background: none; color: #111; cursor: pointer; font-family: inherit; text-align: left; scroll-snap-align: start; }
.fi-tvcard-img { position: relative; display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #ddd; }
.fi-tvcard-img img { width: 100%; height: 100%; object-fit: cover; }
.fi-tvcard-img small { position: absolute; right: 5px; bottom: 5px; padding: 2px 5px; background: rgba(0, 0, 0, .75); color: #fff; font-size: 11.5px; font-weight: 700; }
.fi-tvcard b { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; margin-top: 8px; font-size: 14.5px; font-weight: 800; line-height: 1.25; }
.fi-tvcard-meta { display: block; margin-top: 5px; color: #6b6f76; font-size: 12.5px; }
@media (hover: hover) { .fi-tvcard:hover b { color: #e6197a; } }

/* ======================= Video-Hub am Computer (ab 1024 px) – das Handy bleibt wie oben ======================= */
.fi-videopage .fi-apphead, .fi-videopage .fi-appsearch, .fi-vhub-head, .fi-vhub-shorts, .fi-vhub-new, .fi-theater-close { display: none; }
@media (min-width: 1024px) {
	.fi-videopage .fi-apphead { display: flex; }
	.fi-videopage, .fi-videopage.is-shorts, .fi-videopage .fi-main { overflow: auto; background: #fff; }
	.fi-videopage .fi-footer { display: block !important; }
	.fi-vid-top { display: none; }

	/* TV: großes Video links, „Neu auf FCBinside TV“ als Liste rechts, gleich hoch */
	.fi-tv { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr); gap: 0 var(--w-gap); align-items: stretch; max-width: var(--w-max); margin: 0 auto; padding: 0 var(--w-pad) 80px; box-sizing: border-box; }
	.fi-tv > * { grid-column: 1 / -1; }
	.fi-vhub-head { display: block; height: 28px; } /* nur Abstand; Seitentitel unsichtbar für Google/Screenreader */

	.fi-tv > .fi-tvhero { grid-column: 1; grid-row: 2; background: none; }
	.fi-tvhero-text { padding: 16px 0 0; }
	.fi-tvhero-text h1 { font-size: 26px; line-height: 1.2; }
	.fi-tvhero-play { width: 84px; height: 84px; margin: -42px 0 0 -42px; }
	.fi-tvrow--new { display: none; } /* am Computer ersetzt durch die Liste rechts */
	.fi-vhub-new { grid-column: 2; grid-row: 2; display: flex; flex-direction: column; height: 0; min-height: 100%; } /* so hoch wie das große Video */
	.fi-vhub-new h2 { margin: 0 0 12px; padding-left: 12px; border-left: 4px solid #e6197a; color: #121212; font-size: 20px; font-weight: 800; }
	.fi-vhub-new-list { flex: 1 1 0; min-height: 0; overflow-y: auto; border-top: 1px solid #e7e7e9; scrollbar-width: thin; }
	.fi-vhub-new .fi-tvcard { display: grid; grid-template-columns: 150px minmax(0, 1fr); grid-template-rows: auto 1fr; column-gap: 14px; width: 100%; max-width: none; padding: 12px 0; border-bottom: 1px solid #e7e7e9; }
	.fi-vhub-new .fi-tvcard-img { grid-row: 1 / span 2; }
	.fi-vhub-new .fi-tvcard b { margin-top: 0; font-size: 14.5px; -webkit-line-clamp: 3; }

	/* Reihen: Kopf mit Pfeilen, 4 Videos sichtbar */
	.fi-vhub-shorts, .fi-tv > .fi-tvrow:not(.fi-tvrow--new) { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; padding: 44px 0 0; }
	.fi-vhub-shorts { display: grid; }
	.fi-vhub-row-h { display: contents; }
	.fi-vhub-shorts h2, .fi-tvrow h2 { margin: 0 0 14px; padding-left: 12px; border-left: 4px solid #e6197a; color: #121212; font-size: 20px; font-weight: 800; letter-spacing: -.01em; }
	.fi-vhub-arrows { display: flex; gap: 6px; margin-bottom: 14px; }
	.fi-vhub-arrows button { display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border: 1px solid #e3e5e6; background: #fff; color: #121212; font-size: 24px; line-height: 1; cursor: pointer; transition: border-color .15s, color .15s; }
	.fi-vhub-arrows button:hover { border-color: #e6197a; color: #e6197a; }
	.fi-tv > .fi-tvrow .fi-tvrow-track, .fi-vhub-rail { grid-column: 1 / -1; gap: var(--w-gap); padding: 0; scroll-padding: 0; }
	.fi-tv > .fi-tvrow .fi-tvcard { flex: 0 0 calc((100% - 3 * var(--w-gap)) / 4); max-width: none; }
	.fi-tvcard b { font-size: 15.5px; }

	/* Shorts-Leiste: Hochkant-Karten, 6 sichtbar */
	.fi-vhub-rail { display: flex; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; }
	.fi-vhub-rail::-webkit-scrollbar { display: none; }
	.fi-vhub-short { flex: 0 0 calc((100% - 5 * var(--w-gap)) / 6); display: flex; flex-direction: column; gap: 6px; padding: 0; border: 0; background: none; color: #121212; font: inherit; text-align: left; cursor: pointer; scroll-snap-align: start; }
	.fi-vhub-short-img { position: relative; display: block; aspect-ratio: 9 / 16; overflow: hidden; background: #121212; }
	.fi-vhub-short-img img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
	.fi-vhub-short:hover .fi-vhub-short-img img { transform: scale(1.04); }
	.fi-vhub-play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: grid; place-items: center; width: 56px; height: 56px; box-sizing: border-box; border: 3px solid #fff; transition: transform .2s; border-radius: 50%; background: rgba(0, 0, 0, .25); color: #fff; padding-left: 3px; } /* durchsichtig wie in der Videothek */
	.fi-vhub-short b { display: -webkit-box; overflow: hidden; margin-top: 4px; font-size: 14px; font-weight: 800; line-height: 1.3; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
	.fi-vhub-short:hover b { color: #e6197a; }
	.fi-vhub-short:hover .fi-vhub-play { transform: translate(-50%, -50%) scale(1.08); }
	.fi-vhub-short small { display: flex; align-items: center; gap: 5px; overflow: hidden; color: #6b6b74; font-size: 12.5px; white-space: nowrap; text-overflow: ellipsis; }
	.fi-vhub-short small svg { flex: none; color: #e6197a; }

	/* Kino-Modus: Short mittig, Aktionen direkt daneben */
	.fi-shorts { z-index: 200; background: rgba(8, 8, 10, .96); }
	.fi-vid.is-theater .fi-theater-close { position: absolute; top: 18px; right: 22px; z-index: 5; display: grid; place-items: center; width: 48px; height: 48px; border: 0; border-radius: 50%; background: rgba(255, 255, 255, .12); color: #fff; cursor: pointer; }
	.fi-vid.is-theater .fi-theater-close:hover { background: rgba(255, 255, 255, .24); }
	.fi-shorts-feed { width: calc(100dvh * 9 / 16 + 96px); max-width: 100%; margin: 0 auto; }
	.fi-short-media { right: 96px; }
	.fi-short::after { right: 96px; }
	.fi-short-side { right: 18px; }
	.fi-short-more { top: 18px; right: 110px; }
}
