/* ============================================================
   BlueDrama — frontend stylesheet (full streaming-site theme)
   All selectors are bd- prefixed to coexist with WP/admin styles.
   ============================================================ */

:root {
	--bd-primary-50:  #eaf0ff;
	--bd-primary-100: #c4d2ff;
	--bd-primary-200: #95acff;
	--bd-primary-300: #5b7cff;
	--bd-primary-400: #3963ff;
	--bd-primary-500: #1a4cff;  /* core */
	--bd-primary-600: #0e3ad6;
	--bd-primary-700: #0a2ca3;
	--bd-primary-800: #061f78;
	--bd-primary-900: #04123f;

	--bd-accent: #00c2ff;
	--bd-pink:   #ff3d8c;
	--bd-gold:   #ffc857;

	--bd-bg:     #04060f;
	--bd-bg-1:   #080a1a;
	--bd-bg-2:   #10122a;
	--bd-bg-3:   #181c40;

	--bd-surface:        rgba(255,255,255,0.03);
	--bd-surface-2:      rgba(255,255,255,0.06);
	--bd-border:         rgba(255,255,255,0.08);
	--bd-border-strong:  rgba(255,255,255,0.16);

	--bd-text:        #f5f6ff;
	--bd-text-soft:   #c8ccdd;
	--bd-text-muted:  #8a90a6;

	--bd-font: "Albert Sans", system-ui, -apple-system, "Segoe UI", Helvetica, Arial, sans-serif;

	--bd-r-sm: 8px;
	--bd-r-md: 12px;
	--bd-r-lg: 18px;
	--bd-r-xl: 24px;
	--bd-r-2xl: 32px;
	--bd-r-pill: 999px;

	--bd-shadow-md: 0 8px 24px -8px rgba(0,0,0,.5);
	--bd-shadow-lg: 0 24px 60px -20px rgba(26,76,255,.5), 0 8px 24px -8px rgba(0,0,0,.6);

	--bd-max-w: 1280px;
	--bd-header-h: 72px;
}

body.bd-body {
	margin: 0;
	background: var(--bd-bg);
	color: var(--bd-text);
	font-family: var(--bd-font);
	-webkit-font-smoothing: antialiased;
	min-height: 100vh;
	overflow-x: hidden;
}
body.bd-body * { box-sizing: border-box; }

a { color: inherit; text-decoration: none; }
img, svg { max-width: 100%; display: block; }
button { font-family: inherit; }

.bd-container {
	width: 100%;
	max-width: var(--bd-max-w);
	margin: 0 auto;
	padding: 0 16px;
}
@media (min-width: 600px)  { .bd-container { padding: 0 22px; } }
@media (min-width: 1024px) { .bd-container { padding: 0 32px; } }

.bd-srOnly {
	position: absolute !important;
	width: 1px; height: 1px;
	padding: 0; margin: -1px;
	overflow: hidden;
	clip: rect(0,0,0,0);
	white-space: nowrap;
	border: 0;
}

.bd-skip {
	position: absolute;
	left: -9999px;
	top: auto;
}
.bd-skip:focus {
	left: 16px; top: 16px;
	background: var(--bd-primary-500); color: #fff;
	padding: 10px 16px; border-radius: 8px; z-index: 100;
}

.bd-grad-text {
	background: linear-gradient(120deg, #95acff 0%, #1a4cff 50%, #00c2ff 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* Eyebrow ---------------------------------------------------- */
.bd-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--bd-primary-200);
	padding: 6px 12px;
	border: 1px solid var(--bd-border-strong);
	border-radius: var(--bd-r-pill);
	background: linear-gradient(180deg, rgba(26,76,255,.18), rgba(26,76,255,.04));
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.bd-eyebrow__dot {
	width: 6px; height: 6px;
	background: var(--bd-primary-300);
	border-radius: 50%;
	box-shadow: 0 0 0 4px rgba(26,76,255,.22);
	animation: bd-pulse 2s ease-in-out infinite;
}
@keyframes bd-pulse {
	0%,100% { box-shadow: 0 0 0 4px rgba(26,76,255,.22); }
	50%     { box-shadow: 0 0 0 8px rgba(26,76,255,0); }
}

/* Buttons ---------------------------------------------------- */
.bd-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 12px 22px;
	border-radius: var(--bd-r-pill);
	font-weight: 600;
	font-size: 15px;
	letter-spacing: -.01em;
	border: 1px solid transparent;
	transition: transform .2s, box-shadow .2s, background .2s, color .2s, border-color .2s;
	cursor: pointer;
	color: inherit;
	white-space: nowrap;
}
.bd-btn--primary {
	background: linear-gradient(135deg, var(--bd-primary-300) 0%, var(--bd-primary-500) 100%);
	color: #fff;
	box-shadow: 0 8px 24px -8px rgba(26,76,255,.6);
}
.bd-btn--primary:hover { transform: translateY(-1px); box-shadow: 0 14px 30px -10px rgba(26,76,255,.8); }
.bd-btn--ghost {
	background: rgba(255,255,255,.04);
	border-color: var(--bd-border);
	color: var(--bd-text-soft);
}
.bd-btn--ghost:hover { background: rgba(255,255,255,.08); color: var(--bd-text); }
.bd-btn--lg { padding: 16px 28px; font-size: 16px; }
.bd-btn--sm { padding: 8px 16px; font-size: 14px; }
.bd-btn--block { display: flex; width: 100%; }

/* ============================================================
   HEADER
   ============================================================ */
.bd-header {
	position: sticky;
	top: 0;
	z-index: 60;
	background: rgba(4,6,15,.78);
	backdrop-filter: blur(16px) saturate(140%);
	-webkit-backdrop-filter: blur(16px) saturate(140%);
	border-bottom: 1px solid var(--bd-border);
}
.bd-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: var(--bd-header-h);
	gap: 24px;
}
.bd-brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-weight: 800;
	letter-spacing: -.02em;
	color: var(--bd-text);
	flex-shrink: 0;
}
.bd-brand__mark { width: 32px; height: 32px; }
.bd-brand__mark svg { width: 100%; height: 100%; filter: drop-shadow(0 4px 12px rgba(26,76,255,.6)); }
.bd-brand__name { font-size: 19px; }

.bd-nav {
	display: none;
	align-items: center;
	gap: 24px;
	flex: 1;
}
.bd-nav a, .bd-nav li > a {
	font-size: 15px;
	color: var(--bd-text-soft);
	font-weight: 500;
	position: relative;
	padding: 6px 0;
}
.bd-nav a:hover, .bd-nav li > a:hover { color: var(--bd-text); }
.bd-nav a::after, .bd-nav li > a::after {
	content: "";
	position: absolute;
	left: 0; right: 100%;
	bottom: 0;
	height: 2px;
	background: var(--bd-primary-300);
	border-radius: 2px;
	transition: right .25s ease;
}
.bd-nav a:hover::after, .bd-nav li > a:hover::after { right: 0; }
.bd-nav ul, .bd-nav li { display: contents; list-style: none; padding: 0; margin: 0; }

@media (min-width: 900px) { .bd-nav { display: flex; } }

.bd-header__actions { display: flex; align-items: center; gap: 10px; }
.bd-header__searchbtn {
	width: 38px; height: 38px;
	display: inline-flex;
	align-items: center; justify-content: center;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border);
	color: var(--bd-text-soft);
	border-radius: var(--bd-r-md);
	cursor: pointer;
}
.bd-header__searchbtn:hover { color: var(--bd-text); background: rgba(255,255,255,.08); }

.bd-header__search {
	border-top: 1px solid var(--bd-border);
	background: rgba(4,6,15,.95);
	padding: 16px 0 18px;
}
.bd-header__search[hidden] { display: none; }

/* Search input ----------------------------------------------- */
.bd-search { position: relative; }
.bd-search__icon {
	position: absolute;
	left: 14px;
	top: 50%; transform: translateY(-50%);
	color: var(--bd-text-muted);
	pointer-events: none;
}
.bd-search input[type="search"] {
	width: 100%;
	padding: 12px 14px 12px 42px;
	border-radius: var(--bd-r-md);
	background: rgba(255,255,255,.05);
	border: 1px solid var(--bd-border-strong);
	color: var(--bd-text);
	font-family: var(--bd-font);
	font-size: 15px;
	-webkit-appearance: none;
	appearance: none;
}
.bd-search input[type="search"]:focus {
	outline: none;
	border-color: var(--bd-primary-400);
	background: rgba(26,76,255,.08);
	box-shadow: 0 0 0 4px rgba(26,76,255,.18);
}
.bd-search input[type="search"]::placeholder { color: var(--bd-text-muted); }

.bd-search-large { margin-top: 24px; max-width: 560px; }

/* Hamburger — now lives to the LEFT of the logo and is visible on
   every viewport so it works as the primary entry point to the full
   homepage section list (VIP, Nouveautés, Tendance, etc.). */
.bd-hamburger {
	width: 40px; height: 40px;
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	gap: 4px;
	border: 1px solid var(--bd-border);
	border-radius: var(--bd-r-md);
	background: rgba(255,255,255,.04);
	color: inherit;
	cursor: pointer;
	margin-right: 4px;
	flex-shrink: 0;
}
.bd-hamburger:hover { background: rgba(91,124,255,.12); border-color: rgba(91,124,255,.32); }
.bd-hamburger span {
	display: block;
	width: 18px; height: 2px;
	background: var(--bd-text);
	border-radius: 2px;
	transition: transform .25s, opacity .25s;
}
.bd-hamburger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.bd-hamburger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.bd-hamburger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* Drawer menu — slides in from the LEFT. Closed by default, opens
   when .is-open is added by JS. NO reliance on the [hidden] attribute
   (which conflicts with the browser default display:none and was the
   root cause of the "drawer is empty" bug — the content was always
   there, but the [hidden] cascade kept it invisible). */
.bd-mobile-menu {
	position: fixed;
	top: 0;
	left: 0;
	bottom: 0;
	width: min(360px, 92vw);
	max-width: 360px;
	z-index: 70;
	display: flex;
	flex-direction: column;
	gap: 4px;
	padding: 14px 16px max(env(safe-area-inset-bottom), 24px);
	background: rgba(8,11,22,.98);
	-webkit-backdrop-filter: blur(20px) saturate(160%);
	backdrop-filter: blur(20px) saturate(160%);
	border-right: 1px solid var(--bd-border);
	box-shadow: 16px 0 40px -10px rgba(0,0,0,.55);
	overflow-y: auto;
	transform: translateX(-100%);
	transition: transform .28s cubic-bezier(.4,0,.2,1);
	visibility: hidden;
	pointer-events: none;
}
.bd-mobile-menu.is-open {
	transform: translateX(0);
	visibility: visible;
	pointer-events: auto;
}
/* Fallback: before site.js runs, the markup ships hidden=true. The
   :not([hidden]) selector keeps the no-JS behaviour (open by default
   on non-JS user agents) reasonable. */
.bd-mobile-menu[hidden] { display: none; }

.bd-mobile-menu__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 4px 4px 12px;
	margin: -2px -4px 8px;
	border-bottom: 1px solid var(--bd-border);
	position: sticky;
	top: -2px;
	background: rgba(8,11,22,.98);
	z-index: 2;
}
.bd-mobile-menu__brand {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 16px;
	font-weight: 800;
	letter-spacing: -.01em;
}
.bd-mobile-menu__close {
	width: 36px; height: 36px;
	background: transparent;
	border: 0;
	border-radius: 50%;
	color: var(--bd-text);
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.bd-mobile-menu__close:hover { background: rgba(255,255,255,.08); }

.bd-mobile-menu__section-label {
	display: block;
	margin: 14px 4px 6px;
	font-size: 10.5px;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--bd-text-muted);
}

.bd-mobile-menu a:not(.bd-mobile-menu__profile):not(.bd-mobile-menu__rail) {
	padding: 12px 14px;
	border-radius: var(--bd-r-md);
	font-weight: 500;
	font-size: 14.5px;
	color: var(--bd-text-soft);
	display: block;
}
.bd-mobile-menu a:not(.bd-mobile-menu__profile):not(.bd-mobile-menu__rail):hover {
	background: rgba(255,255,255,.06);
	color: var(--bd-text);
}
.bd-mobile-menu .bd-search { margin: 4px 0 8px; }
.bd-mobile-menu ul, .bd-mobile-menu li { display: block; list-style: none; padding: 0; margin: 0; }

/* Section rail list — VIP, Nouveautés, Tendance, Meilleures Choix... */
.bd-mobile-menu__rails {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.bd-mobile-menu__rail {
	display: flex !important;
	align-items: center;
	gap: 11px;
	padding: 10px 12px !important;
	border-radius: 12px !important;
	background: rgba(255,255,255,.03);
	border: 1px solid transparent;
	color: var(--bd-text) !important;
	font-weight: 600 !important;
	text-decoration: none;
	transition: background .15s, border-color .15s, transform .15s;
}
.bd-mobile-menu__rail:hover,
.bd-mobile-menu__rail:active {
	background: rgba(91,124,255,.08) !important;
	border-color: rgba(91,124,255,.3);
	transform: translateX(2px);
}
.bd-mobile-menu__rail-icon {
	width: 34px; height: 34px;
	border-radius: 9px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	background: rgba(255,255,255,.06);
	color: var(--bd-text-soft);
}
.bd-mobile-menu__rail-name {
	flex: 1;
	font-size: 14.5px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bd-mobile-menu__rail-chev {
	color: var(--bd-text-muted);
	flex-shrink: 0;
	opacity: .6;
}
.bd-mobile-menu__rail-badge {
	display: inline-flex;
	align-items: center;
	padding: 3px 8px;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .08em;
	border-radius: 999px;
	color: #fff;
	flex-shrink: 0;
}

/* Per-row themed icon swatches */
.bd-mobile-menu__rail.is-vip     .bd-mobile-menu__rail-icon { background: linear-gradient(135deg, rgba(255,215,106,.25), rgba(255,154,60,.12)); color: #ffd76a; }
.bd-mobile-menu__rail.is-new     .bd-mobile-menu__rail-icon { background: linear-gradient(135deg, rgba(0,224,164,.22),  rgba(0,176,122,.1));  color: #00e0a4; }
.bd-mobile-menu__rail.is-hot     .bd-mobile-menu__rail-icon { background: linear-gradient(135deg, rgba(255,107,107,.22), rgba(255,138,60,.1)); color: #ff8585; }
.bd-mobile-menu__rail.is-top     .bd-mobile-menu__rail-icon { background: linear-gradient(135deg, rgba(91,124,255,.22),  rgba(26,76,255,.1));  color: #8ba4ff; }
.bd-mobile-menu__rail.is-choice  .bd-mobile-menu__rail-icon { background: linear-gradient(135deg, rgba(0,194,255,.22),   rgba(26,76,255,.1));  color: #5ed4ff; }
.bd-mobile-menu__rail.is-resume  .bd-mobile-menu__rail-icon { background: rgba(91,124,255,.18); color: #c4d2ff; }
.bd-mobile-menu__rail.is-rank    .bd-mobile-menu__rail-icon { background: rgba(255,255,255,.08); color: #fff; }
.bd-mobile-menu__rail.is-game    .bd-mobile-menu__rail-icon { background: linear-gradient(135deg, rgba(255,95,109,.22),  rgba(255,195,113,.12)); color: #ffaa6f; }
.bd-mobile-menu__rail.is-romance .bd-mobile-menu__rail-icon { background: rgba(255,107,140,.18); color: #ff7a9a; }
.bd-mobile-menu__rail.is-mystery .bd-mobile-menu__rail-icon { background: rgba(170,140,255,.18); color: #b39aff; }
.bd-mobile-menu__rail.is-school  .bd-mobile-menu__rail-icon { background: rgba(255,215,106,.16); color: #ffd76a; }
.bd-mobile-menu__rail.is-asia    .bd-mobile-menu__rail-icon { background: rgba(0,224,164,.16);   color: #00e0a4; }
.bd-mobile-menu__rail.is-pop     .bd-mobile-menu__rail-icon { background: rgba(255,215,106,.16); color: #ffd76a; }
.bd-mobile-menu__rail.is-cat     .bd-mobile-menu__rail-icon { background: rgba(255,255,255,.06); color: var(--bd-text-muted); }
.bd-mobile-menu__rail.is-all     .bd-mobile-menu__rail-icon { background: rgba(91,124,255,.16);  color: #c4d2ff; }

/* Badges in the same palette as the icons */
.bd-mobile-menu__rail-badge.is-vip { background: linear-gradient(135deg, #ffd76a, #ff9a3c); color: #1a0c00; }
.bd-mobile-menu__rail-badge.is-new { background: linear-gradient(135deg, #00e0a4, #00b07a); }
.bd-mobile-menu__rail-badge.is-hot { background: linear-gradient(135deg, #ff6b6b, #ff8a3c); }

/* Category / Genre chips inside the drawer */
.bd-mobile-menu__chips {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	padding: 0 4px;
}
.bd-mobile-menu__chip {
	display: inline-flex !important;
	align-items: center;
	gap: 6px;
	padding: 8px 12px !important;
	border-radius: 999px !important;
	background: rgba(255,255,255,.05) !important;
	border: 1px solid rgba(255,255,255,.08);
	font-size: 12.5px !important;
	font-weight: 600 !important;
	color: var(--bd-text-soft) !important;
	text-decoration: none;
	white-space: nowrap;
	transition: background .15s, border-color .15s, color .15s;
}
.bd-mobile-menu__chip:hover {
	background: rgba(91,124,255,.16) !important;
	border-color: rgba(91,124,255,.42);
	color: #fff !important;
}
.bd-mobile-menu__chip span {
	font-size: 10.5px;
	font-weight: 800;
	color: var(--bd-text-muted);
	background: rgba(255,255,255,.06);
	padding: 1px 6px;
	border-radius: 999px;
}
.bd-mobile-menu__chip--genre {
	background: linear-gradient(135deg, rgba(255,107,140,.12), rgba(170,140,255,.08)) !important;
	border-color: rgba(170,140,255,.2);
}
.bd-mobile-menu__chip--genre:hover {
	background: linear-gradient(135deg, rgba(255,107,140,.2), rgba(170,140,255,.14)) !important;
	border-color: rgba(170,140,255,.4);
}

/* Visual poster grid (recent series) */
.bd-mobile-menu__posters {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	padding: 0 4px;
}
.bd-mobile-menu__poster {
	display: block !important;
	position: relative;
	aspect-ratio: 2/3;
	border-radius: 10px !important;
	overflow: hidden;
	background: var(--bd-bg-2);
	border: 1px solid var(--bd-border);
	padding: 0 !important;
	transition: transform .2s, border-color .2s;
}
.bd-mobile-menu__poster:hover {
	transform: translateY(-2px);
	border-color: rgba(91,124,255,.4);
}
.bd-mobile-menu__poster img {
	width: 100%; height: 100%; object-fit: cover;
	display: block;
}
.bd-mobile-menu__poster .bd-poster-fallback {
	display: flex;
	width: 100%; height: 100%;
	align-items: center; justify-content: center;
	font-size: 22px; font-weight: 800;
	color: rgba(255,255,255,.55);
}
.bd-mobile-menu__poster-title {
	position: absolute;
	bottom: 0; left: 0; right: 0;
	padding: 18px 6px 5px;
	font-size: 10.5px;
	font-weight: 700;
	color: #fff;
	background: linear-gradient(to top, rgba(0,0,0,.85), transparent);
	line-height: 1.2;
	overflow: hidden;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	text-overflow: ellipsis;
}

/* Backdrop behind the drawer when open */
.bd-mobile-backdrop {
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.55);
	z-index: 69;
	opacity: 0;
	pointer-events: none;
	transition: opacity .25s ease;
}
.bd-mobile-backdrop.is-visible {
	opacity: 1;
	pointer-events: auto;
}

/* Player-mode body class — minimize header decoration */
.bd-body--player .bd-header { background: rgba(4,6,15,.6); }

/* ============================================================
   HERO ROTATOR (homepage)
   ============================================================ */
.bd-hero {
	position: relative;
	overflow: hidden;
	isolation: isolate;
	height: 56vh;
	min-height: 420px;
	max-height: 720px;
}
.bd-hero__track {
	position: absolute;
	inset: 0;
}
.bd-hero__slide {
	position: absolute;
	inset: 0;
	opacity: 0;
	transition: opacity .55s ease;
	pointer-events: none;
}
.bd-hero__slide.is-active { opacity: 1; pointer-events: auto; z-index: 1; }
.bd-hero__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	transform: scale(1.05);
}
.bd-hero__overlay {
	position: absolute;
	inset: 0;
	background:
		linear-gradient(90deg, rgba(4,6,15,.95) 0%, rgba(4,6,15,.55) 35%, rgba(4,6,15,.1) 60%),
		linear-gradient(180deg, rgba(4,6,15,.2) 0%, rgba(4,6,15,.95) 100%);
}
.bd-hero__inner {
	position: relative;
	z-index: 2;
	height: 100%;
	display: flex;
	align-items: flex-end;
	padding-bottom: 56px;
}
.bd-hero__copy { max-width: 580px; }
.bd-hero__title {
	margin: 18px 0 14px;
	font-size: clamp(32px, 5vw, 56px);
	font-weight: 800;
	line-height: 1.05;
	letter-spacing: -.025em;
	text-shadow: 0 2px 16px rgba(0,0,0,.6);
}
.bd-hero__lede {
	font-size: clamp(15px, 1.4vw, 18px);
	color: var(--bd-text-soft);
	line-height: 1.55;
	margin: 0 0 16px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.bd-hero__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 10px 16px;
	list-style: none;
	padding: 0;
	margin: 0 0 22px;
	font-size: 13.5px;
	color: var(--bd-text-soft);
}
.bd-hero__meta li {
	padding: 3px 10px;
	border-radius: var(--bd-r-pill);
	background: var(--bd-surface);
	border: 1px solid var(--bd-border);
}
.bd-hero__cta { display: flex; flex-wrap: wrap; gap: 10px; }

.bd-hero__nav {
	position: absolute;
	z-index: 3;
	top: 50%; transform: translateY(-50%);
	width: 44px; height: 44px;
	border-radius: 50%;
	background: rgba(0,0,0,.45);
	border: 1px solid var(--bd-border-strong);
	color: #fff;
	display: none;
	align-items: center; justify-content: center;
	cursor: pointer;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.bd-hero__nav:hover { background: rgba(0,0,0,.7); }
.bd-hero__nav--prev { left: 16px; }
.bd-hero__nav--next { right: 16px; }
@media (min-width: 1024px) { .bd-hero__nav { display: inline-flex; } }

.bd-hero__dots {
	position: absolute;
	z-index: 3;
	left: 50%; transform: translateX(-50%);
	bottom: 18px;
	display: flex;
	gap: 8px;
}
.bd-hero__dot {
	width: 24px; height: 4px;
	border-radius: 2px;
	background: rgba(255,255,255,.35);
	border: 0;
	cursor: pointer;
	transition: background .2s, width .25s;
}
.bd-hero__dot.is-active { background: #fff; width: 36px; }

/* ============================================================
   SECTIONS
   ============================================================ */
.bd-section { padding: 56px 0; }
.bd-section--tight { padding: 28px 0 48px; }
.bd-section--rail  { padding: 32px 0; }

@media (min-width: 1024px) {
	.bd-section { padding: 80px 0; }
	.bd-section--tight { padding: 40px 0 64px; }
	.bd-section--rail  { padding: 40px 0; }
}

.bd-section__head {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: 12px;
	margin-bottom: 24px;
}
.bd-section__head--center { align-items: center; text-align: center; }
.bd-section__title-wrap { display: flex; flex-direction: column; gap: 6px; }
.bd-section__title {
	font-size: clamp(22px, 2.5vw, 28px);
	font-weight: 800;
	letter-spacing: -.025em;
	line-height: 1.15;
	margin: 0;
}
.bd-section__lede {
	font-size: 14.5px;
	color: var(--bd-text-soft);
	margin: 0;
}
.bd-section__more {
	color: var(--bd-text-soft);
	font-size: 14px;
	font-weight: 500;
}
.bd-section__more:hover { color: var(--bd-primary-200); }

@media (min-width: 768px) {
	.bd-section__head {
		flex-direction: row;
		justify-content: space-between;
		align-items: flex-end;
		gap: 32px;
	}
}

/* ============================================================
   RAIL (horizontal show carousel)
   ============================================================ */
.bd-rail-wrap { position: relative; }
.bd-rail {
	display: flex;
	gap: 16px;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	scroll-padding: 0 24px;
	padding: 4px 4px 24px;
	scrollbar-width: thin;
	scrollbar-color: var(--bd-primary-500) transparent;
	-webkit-overflow-scrolling: touch;
}
.bd-rail::-webkit-scrollbar { height: 8px; }
.bd-rail::-webkit-scrollbar-thumb { background: var(--bd-primary-600); border-radius: 4px; }

.bd-rail__btn {
	position: absolute;
	top: 38%;
	width: 44px; height: 44px;
	border-radius: 50%;
	background: rgba(20,16,40,.85);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid var(--bd-border-strong);
	color: var(--bd-text);
	z-index: 4;
	display: none;
	align-items: center; justify-content: center;
	transition: background .15s, transform .15s;
	cursor: pointer;
}
.bd-rail__btn:hover { background: var(--bd-primary-500); transform: translateY(-2px); }
.bd-rail__btn--prev { left: -16px; }
.bd-rail__btn--next { right: -16px; }
@media (min-width: 1024px) { .bd-rail__btn { display: inline-flex; } }

/* Show card -------------------------------------------------- */
.bd-show {
	flex: 0 0 auto;
	width: 168px;
	scroll-snap-align: start;
	color: inherit;
}
@media (min-width: 768px)  { .bd-show { width: 188px; } }
@media (min-width: 1024px) { .bd-show { width: 208px; } }

.bd-grid {
	display: grid;
	gap: 18px;
	grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 540px)  { .bd-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 800px)  { .bd-grid { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1100px) { .bd-grid { grid-template-columns: repeat(5, 1fr); } }
@media (min-width: 1400px) { .bd-grid { grid-template-columns: repeat(6, 1fr); } }
.bd-grid .bd-show { width: auto; }

.bd-show__poster {
	position: relative;
	aspect-ratio: 2 / 3;
	border-radius: var(--bd-r-lg);
	overflow: hidden;
	background: var(--bd-bg-2);
	margin-bottom: 12px;
	transition: transform .25s, box-shadow .25s, border-color .25s;
	border: 1px solid var(--bd-border);
}
.bd-show:hover .bd-show__poster {
	transform: translateY(-4px);
	box-shadow: 0 18px 40px -16px rgba(26,76,255,.7);
	border-color: rgba(91,124,255,.45);
}
.bd-show__poster img { width: 100%; height: 100%; object-fit: cover; }
.bd-show__rank {
	position: absolute;
	top: 10px; left: 10px;
	background: linear-gradient(135deg, var(--bd-primary-500), var(--bd-accent));
	color: #fff;
	font-size: 11px;
	font-weight: 800;
	padding: 4px 10px;
	border-radius: var(--bd-r-pill);
	box-shadow: 0 6px 14px -6px rgba(26,76,255,.7);
}
.bd-show__play {
	position: absolute;
	bottom: 10px; right: 10px;
	width: 36px; height: 36px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center; justify-content: center;
	background: rgba(0,0,0,.55);
	border: 1px solid rgba(255,255,255,.18);
	color: #fff;
	opacity: 0;
	transform: translateY(8px);
	transition: opacity .25s, transform .25s, background .15s;
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
.bd-show:hover .bd-show__play { opacity: 1; transform: translateY(0); }
.bd-show__play:hover { background: var(--bd-primary-500); }
.bd-show__title {
	font-size: 14.5px;
	font-weight: 600;
	margin: 0 0 4px;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.bd-show__meta { font-size: 12px; color: var(--bd-text-muted); margin: 0; }

.bd-poster-fallback {
	width: 100%; height: 100%;
	display: flex; align-items: center; justify-content: center;
	font-size: 64px; font-weight: 800;
	color: var(--bd-primary-300);
	background: linear-gradient(135deg, var(--bd-bg-2), var(--bd-bg-3));
}

/* ============================================================
   GENRES (tile grid)
   ============================================================ */
.bd-genres {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 14px;
}
@media (min-width: 640px)  { .bd-genres { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1024px) { .bd-genres { grid-template-columns: repeat(8, 1fr); gap: 16px; } }
.bd-genre {
	position: relative;
	aspect-ratio: 1 / 1.1;
	border-radius: var(--bd-r-lg);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	padding: 14px;
	border: 1px solid var(--bd-border);
	isolation: isolate;
	transition: transform .25s, border-color .25s;
}
.bd-genre::before {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(135deg, hsl(var(--bd-hue, 220) 70% 35%), hsl(var(--bd-hue, 220) 80% 50%));
	opacity: .85;
	z-index: -2;
	transition: transform .35s, opacity .25s;
}
.bd-genre[data-bd-hue] { --bd-hue: 220; }
.bd-genre::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 30% 30%, rgba(255,255,255,.18), transparent 50%),
		linear-gradient(180deg, transparent 50%, rgba(0,0,0,.55));
	z-index: -1;
}
.bd-genre:hover { transform: translateY(-3px); border-color: rgba(255,255,255,.25); }
.bd-genre:hover::before { transform: scale(1.06); opacity: 1; }
.bd-genre__name { font-size: 14px; font-weight: 700; color: #fff; text-shadow: 0 2px 6px rgba(0,0,0,.5); }
.bd-genre__count { font-size: 11px; font-weight: 500; color: rgba(255,255,255,.85); margin-top: 2px; }

/* ============================================================
   PRICING CARD CTA
   ============================================================ */
.bd-pricing-card {
	position: relative;
	border-radius: var(--bd-r-2xl);
	padding: 56px 32px;
	text-align: center;
	background: linear-gradient(135deg, rgba(26,76,255,.7) 0%, rgba(0,194,255,.55) 100%), var(--bd-bg-2);
	overflow: hidden;
	isolation: isolate;
	border: 1px solid rgba(255,255,255,.12);
}
.bd-pricing-card__title {
	font-size: clamp(24px, 3.6vw, 36px);
	font-weight: 800;
	letter-spacing: -.025em;
	margin: 0 0 12px;
}
.bd-pricing-card__sub {
	font-size: clamp(15px, 1.4vw, 17px);
	color: rgba(255,255,255,.92);
	max-width: 540px;
	margin: 0 auto 24px;
}

/* ============================================================
   ARCHIVE / TAXONOMY HERO
   ============================================================ */
.bd-archive-hero {
	position: relative;
	padding: 56px 0 32px;
	border-bottom: 1px solid var(--bd-border);
	background:
		radial-gradient(ellipse at top, rgba(26,76,255,.18), transparent 60%),
		var(--bd-bg);
}
.bd-archive-hero__title {
	font-size: clamp(28px, 4vw, 44px);
	font-weight: 800;
	letter-spacing: -.025em;
	margin: 12px 0 8px;
}
.bd-archive-hero__desc {
	color: var(--bd-text-soft);
	max-width: 720px;
	margin: 0 0 24px;
	line-height: 1.55;
}

/* Filter chips ---------------------------------------------- */
.bd-chiprow {
	display: flex;
	gap: 8px;
	overflow-x: auto;
	margin: 0 -24px;
	padding: 16px 24px;
	scrollbar-width: none;
}
.bd-chiprow::-webkit-scrollbar { display: none; }
.bd-chip {
	flex-shrink: 0;
	padding: 8px 14px;
	border-radius: var(--bd-r-pill);
	background: var(--bd-surface);
	border: 1px solid var(--bd-border-strong);
	color: var(--bd-text-soft);
	font-size: 13.5px;
	font-weight: 500;
}
.bd-chip:hover { color: var(--bd-text); border-color: var(--bd-primary-300); }
.bd-chip.is-active { background: var(--bd-primary-500); color: #fff; border-color: var(--bd-primary-500); }

/* Pagination ------------------------------------------------- */
.bd-pagination {
	display: flex;
	gap: 6px;
	justify-content: center;
	margin-top: 32px;
	flex-wrap: wrap;
}
.bd-pagination .page-numbers,
.bd-pagination a, .bd-pagination span {
	display: inline-flex;
	align-items: center; justify-content: center;
	min-width: 38px;
	height: 38px;
	padding: 0 10px;
	border-radius: var(--bd-r-md);
	background: var(--bd-surface);
	border: 1px solid var(--bd-border);
	color: var(--bd-text-soft);
	font-weight: 600;
	font-size: 14px;
}
.bd-pagination .current { background: var(--bd-primary-500); color: #fff; border-color: var(--bd-primary-500); }

.bd-empty { text-align: center; color: var(--bd-text-muted); padding: 48px 0; }
.bd-empty-cta { text-align: center; padding: 48px 0; }

/* Search results --------------------------------------------- */
.bd-results { list-style: none; padding: 0; margin: 24px 0 0; display: flex; flex-direction: column; gap: 16px; }
.bd-result { padding: 18px 20px; border: 1px solid var(--bd-border); border-radius: var(--bd-r-md); background: var(--bd-surface); }
.bd-result__title { display: block; font-size: 17px; font-weight: 700; margin-bottom: 4px; }
.bd-result__excerpt { font-size: 14px; color: var(--bd-text-soft); margin: 0 0 4px; line-height: 1.5; }
.bd-result__url { font-size: 12px; color: var(--bd-text-muted); margin: 0; word-break: break-all; }

/* Warn box --------------------------------------------------- */
.bd-warn {
	margin: 12px auto;
	padding: 12px 16px;
	border: 1px solid rgba(255,193,7,.4);
	background: rgba(255,193,7,.08);
	color: #fff;
	border-radius: var(--bd-r-md);
}

/* 404 -------------------------------------------------------- */
.bd-404 { padding: 80px 0 64px; }
.bd-404__inner { max-width: 720px; margin: 0 auto; text-align: center; }
.bd-404__art {
	font-size: clamp(96px, 18vw, 200px);
	font-weight: 900;
	line-height: 1;
	letter-spacing: -.05em;
	background: linear-gradient(135deg, var(--bd-primary-300), var(--bd-accent));
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	margin-bottom: 12px;
}
.bd-404__title { font-size: clamp(28px, 4vw, 40px); font-weight: 800; letter-spacing: -.02em; margin: 0 0 8px; }
.bd-404__lede  { color: var(--bd-text-soft); margin: 0 0 28px; }
.bd-404__cta   { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-bottom: 28px; }
.bd-404__search { max-width: 480px; margin: 0 auto; }

/* Static pages ----------------------------------------------- */
.bd-page { max-width: 800px; }
.bd-page__content { color: var(--bd-text-soft); line-height: 1.7; font-size: 16px; }
.bd-page__content h2 { color: var(--bd-text); margin: 32px 0 12px; font-size: 24px; }
.bd-page__content h3 { color: var(--bd-text); margin: 24px 0 10px; font-size: 19px; }
.bd-page__content a { color: var(--bd-primary-200); }
.bd-page__content a:hover { color: var(--bd-text); }

/* ============================================================
   SERIES DETAIL PAGE
   ============================================================ */
.bd-series-hero {
	position: relative;
	padding: 56px 0 48px;
	overflow: hidden;
	isolation: isolate;
}
.bd-series-hero__bg {
	position: absolute; inset: 0;
	background-size: cover; background-position: center;
	filter: blur(36px) brightness(.4);
	transform: scale(1.15);
	z-index: -2;
}
.bd-series-hero__overlay {
	position: absolute; inset: 0;
	background: linear-gradient(180deg, rgba(4,6,15,.7), var(--bd-bg) 90%);
	z-index: -1;
}
.bd-series-hero__inner {
	display: grid;
	grid-template-columns: 1fr;
	gap: 28px;
	align-items: flex-end;
}
@media (min-width: 768px) {
	.bd-series-hero { padding: 88px 0 64px; }
	.bd-series-hero__inner { grid-template-columns: 240px 1fr; gap: 40px; }
}
.bd-series-hero__poster {
	width: 200px;
	aspect-ratio: 2 / 3;
	border-radius: var(--bd-r-xl);
	overflow: hidden;
	background: var(--bd-bg-2);
	border: 1px solid var(--bd-border-strong);
	box-shadow: var(--bd-shadow-lg);
}
@media (min-width: 768px) { .bd-series-hero__poster { width: 240px; } }
.bd-series-hero__poster img { width: 100%; height: 100%; object-fit: cover; }
.bd-series-hero__title {
	font-size: clamp(28px, 4.5vw, 48px);
	font-weight: 800;
	letter-spacing: -.025em;
	line-height: 1.1;
	margin: 12px 0 12px;
}
.bd-series-hero__meta {
	display: flex; flex-wrap: wrap; gap: 12px;
	margin: 0 0 18px; padding: 0;
	list-style: none;
	color: var(--bd-text-soft);
	font-size: 13.5px;
}
.bd-series-hero__meta li {
	padding: 4px 12px;
	border-radius: var(--bd-r-pill);
	background: var(--bd-surface);
	border: 1px solid var(--bd-border);
}
.bd-series-hero__lede { color: var(--bd-text-soft); max-width: 620px; line-height: 1.55; margin: 0 0 24px; font-size: 15.5px; }
.bd-series-hero__cta { display: flex; flex-wrap: wrap; gap: 12px; }

/* Overview --------------------------------------------------- */
.bd-overview { max-width: 880px; }
.bd-overview__copy {
	color: var(--bd-text-soft);
	line-height: 1.7;
	font-size: 16px;
}
.bd-overview__copy p { margin: 0 0 12px; }

/* Episode list (series detail page) -------------------------- */
.bd-eplist {
	display: grid;
	gap: 14px;
	grid-template-columns: repeat(2, 1fr);
}
@media (min-width: 540px)  { .bd-eplist { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 768px)  { .bd-eplist { grid-template-columns: repeat(4, 1fr); } }
@media (min-width: 1024px) { .bd-eplist { grid-template-columns: repeat(6, 1fr); } }
@media (min-width: 1280px) { .bd-eplist { grid-template-columns: repeat(8, 1fr); } }

.bd-epcard {
	color: inherit;
	cursor: pointer;
}
.bd-epcard__poster {
	position: relative;
	aspect-ratio: 2 / 3;
	border-radius: var(--bd-r-md);
	overflow: hidden;
	border: 1px solid var(--bd-border);
	margin-bottom: 8px;
	background: var(--bd-bg-2);
	transition: transform .25s, box-shadow .25s, border-color .25s;
}
.bd-epcard:hover .bd-epcard__poster {
	transform: translateY(-2px);
	border-color: rgba(91,124,255,.5);
	box-shadow: 0 12px 30px -12px rgba(26,76,255,.6);
}
.bd-epcard__poster img { width: 100%; height: 100%; object-fit: cover; opacity: .85; }
.bd-epcard.is-locked .bd-epcard__poster img { opacity: .35; }
.bd-epcard.is-locked .bd-epcard__poster { background: linear-gradient(135deg, var(--bd-bg-2), var(--bd-bg-3)); }

.bd-epcard__num {
	position: absolute;
	left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	font-size: 38px;
	font-weight: 900;
	color: #fff;
	text-shadow: 0 2px 12px rgba(0,0,0,.7);
	letter-spacing: -.04em;
}
.bd-epcard.is-locked .bd-epcard__num { color: rgba(255,255,255,.7); }

.bd-epcard__lock,
.bd-epcard__free {
	position: absolute;
	bottom: 8px; left: 8px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 4px 8px;
	border-radius: var(--bd-r-sm);
	background: rgba(0,0,0,.65);
	color: #fff;
	display: inline-flex;
	align-items: center;
	gap: 4px;
}
.bd-epcard__free { background: var(--bd-primary-500); }
.bd-epcard__lock svg { width: 12px; height: 12px; }
.bd-epcard__title { font-size: 13px; font-weight: 600; }

/* ============================================================
   PLAYER PAGE — split layout
   ============================================================ */
.bd-watch { background: #000; min-height: calc(100vh - var(--bd-header-h)); }
.bd-watch__topbar {
	background: rgba(4,6,15,.88);
	border-bottom: 1px solid var(--bd-border);
	padding: 12px 0;
	position: sticky;
	top: var(--bd-header-h);
	z-index: 30;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.bd-watch__topbar-inner {
	display: flex;
	align-items: center;
	gap: 16px;
	flex-wrap: wrap;
}
.bd-watch__back {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: var(--bd-text-soft);
	font-weight: 600;
	font-size: 14px;
	padding: 8px 14px;
	border-radius: var(--bd-r-pill);
	background: var(--bd-surface);
	border: 1px solid var(--bd-border);
}
.bd-watch__back:hover { color: var(--bd-text); background: var(--bd-surface-2); }
.bd-watch__crumbs {
	display: none;
	flex: 1;
	font-size: 13.5px;
	color: var(--bd-text-muted);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.bd-watch__crumbs a { color: var(--bd-text-soft); }
.bd-watch__crumbs a:hover { color: var(--bd-text); }
.bd-watch__crumbs span { padding: 0 6px; color: var(--bd-text-muted); }
@media (min-width: 768px) { .bd-watch__crumbs { display: flex; align-items: center; } }

.bd-watch__epnav { display: flex; gap: 8px; }
.bd-watch__epnav-btn {
	width: 36px; height: 36px;
	display: inline-flex;
	align-items: center; justify-content: center;
	border-radius: 50%;
	background: var(--bd-surface);
	border: 1px solid var(--bd-border);
	color: var(--bd-text);
}
.bd-watch__epnav-btn:hover { background: var(--bd-primary-500); border-color: var(--bd-primary-500); }

.bd-watch__stage { padding: 24px 0 56px; }
.bd-watch__layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 32px;
	align-items: start;
	width: 100%;
	max-width: var(--bd-max-w);
	margin: 0 auto;
	padding: 0 24px;
}
@media (min-width: 1024px) {
	.bd-watch__layout {
		grid-template-columns: minmax(320px, 420px) 1fr;
		gap: 48px;
		padding: 0 32px;
	}
}

/* ============================================================
   PLAYER (vertical phone)
   ============================================================ */
.bd-player {
	width: 100%;
	max-width: 420px;
	margin: 0 auto;
}
.bd-player__phone {
	position: relative;
	width: 100%;
	aspect-ratio: 9 / 19.5;
	background: #000;
	border-radius: 44px;
	border: 8px solid #18162a;
	box-shadow:
		0 0 0 1.5px rgba(255,255,255,.08),
		0 32px 80px -16px rgba(26,76,255,.55),
		0 18px 40px -10px rgba(0,0,0,.7);
	overflow: hidden;
	isolation: isolate;
}
.bd-player__notch {
	position: absolute;
	top: 12px; left: 50%; transform: translateX(-50%);
	width: 100px; height: 24px;
	background: #000;
	border-radius: 14px;
	z-index: 6;
}
.bd-player__inner {
	position: relative;
	width: 100%; height: 100%;
	background: #000;
	overflow: hidden;
}
.bd-player__video {
	position: absolute;
	inset: 0;
	width: 100%; height: 100%;
	object-fit: cover;
	background: #000;
}
.bd-player__bigplay {
	position: absolute;
	left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	width: 80px; height: 80px;
	border-radius: 50%;
	background: rgba(255,255,255,.16);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255,255,255,.2);
	color: #fff;
	display: inline-flex;
	align-items: center; justify-content: center;
	z-index: 4;
	cursor: pointer;
	transition: opacity .25s, transform .25s, background .15s;
}
.bd-player__bigplay:hover { background: rgba(255,255,255,.28); }
.bd-player.is-playing .bd-player__bigplay { opacity: 0; transform: translate(-50%, -50%) scale(.85); pointer-events: none; }

/* Loading spinner ------------------------------------------- */
.bd-player__loading {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center; justify-content: center;
	background: rgba(0,0,0,.4);
	z-index: 3;
}
.bd-spinner {
	width: 36px; height: 36px;
	border: 3px solid rgba(255,255,255,.25);
	border-top-color: #fff;
	border-radius: 50%;
	animation: bd-spin .9s linear infinite;
}
@keyframes bd-spin { to { transform: rotate(360deg); } }

/* Locked overlay -------------------------------------------- */
.bd-player__locked {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(4,6,15,.5), rgba(4,6,15,.92));
	color: #fff;
	z-index: 5;
	display: flex;
	flex-direction: column;
	align-items: center; justify-content: center;
	text-align: center;
	padding: 24px 18px;
	gap: 10px;
}
.bd-locked__icon {
	width: 72px; height: 72px;
	border-radius: 50%;
	display: inline-flex;
	align-items: center; justify-content: center;
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.18);
	color: var(--bd-primary-200);
	margin-bottom: 8px;
}
.bd-locked__title { font-size: 18px; font-weight: 700; margin: 0; }
.bd-locked__sub { font-size: 13px; color: var(--bd-text-soft); margin: 0 0 12px; max-width: 260px; line-height: 1.4; }

/* Side rail (icons) ----------------------------------------- */
.bd-player__rail {
	position: absolute;
	right: 10px;
	bottom: 110px;
	display: flex;
	flex-direction: column;
	gap: 16px;
	z-index: 4;
}
.bd-railbtn {
	width: 44px;
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	color: #fff;
	background: transparent;
	border: 0;
	cursor: pointer;
}
.bd-railbtn svg {
	width: 28px; height: 28px;
	background: rgba(0,0,0,.45);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	padding: 8px;
	border-radius: 50%;
	box-sizing: content-box;
	transition: background .15s, transform .15s;
}
.bd-railbtn:hover svg { background: rgba(0,0,0,.7); transform: scale(1.05); }
.bd-railbtn.is-active svg { color: var(--bd-pink); }
.bd-railbtn__label {
	font-size: 11px; font-weight: 600;
	color: #fff;
	text-shadow: 0 1px 3px rgba(0,0,0,.6);
}

/* Bottom controls ------------------------------------------- */
.bd-player__bottom {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 14px 16px 18px;
	z-index: 4;
	background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.85) 100%);
	color: #fff;
}
.bd-player__title { margin-bottom: 10px; }
.bd-player__eyebrow { font-size: 10px; font-weight: 700; letter-spacing: .18em; color: var(--bd-primary-200); margin: 0 0 4px; }
.bd-player__title h3 { font-size: 16px; font-weight: 700; margin: 0; line-height: 1.2; text-shadow: 0 2px 6px rgba(0,0,0,.6); }
.bd-player__seek { display: flex; align-items: center; gap: 8px; }
.bd-player__playpause,
.bd-player__mute,
.bd-player__fullscreen {
	width: 32px; height: 32px;
	display: inline-flex;
	align-items: center; justify-content: center;
	color: #fff;
	background: transparent;
	border: 0;
	cursor: pointer;
}
.bd-player__time {
	font-size: 11px;
	color: rgba(255,255,255,.85);
	font-variant-numeric: tabular-nums;
	min-width: 70px;
	text-align: right;
}
.bd-player__progress {
	flex: 1;
	height: 16px;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	cursor: pointer;
	min-width: 0;
}
.bd-player__progress::-webkit-slider-runnable-track {
	height: 4px;
	background: linear-gradient(to right, #fff var(--bd-played, 0%), rgba(255,255,255,.25) var(--bd-played, 0%));
	border-radius: 2px;
}
.bd-player__progress::-moz-range-track    { height: 4px; background: rgba(255,255,255,.25); border-radius: 2px; }
.bd-player__progress::-moz-range-progress { height: 4px; background: #fff; border-radius: 2px; }
.bd-player__progress::-webkit-slider-thumb {
	-webkit-appearance: none; appearance: none;
	width: 12px; height: 12px;
	background: #fff;
	border-radius: 50%;
	margin-top: -4px;
	box-shadow: 0 0 0 4px rgba(26,76,255,.35);
}
.bd-player__progress::-moz-range-thumb {
	width: 12px; height: 12px;
	background: #fff;
	border: none;
	border-radius: 50%;
}

/* Popovers (subs / eps) ------------------------------------- */
.bd-popover {
	position: absolute;
	right: 10px;
	bottom: 110px;
	width: 200px;
	max-height: 320px;
	overflow-y: auto;
	background: rgba(8,10,26,.94);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	border: 1px solid var(--bd-border-strong);
	border-radius: var(--bd-r-md);
	z-index: 6;
	box-shadow: var(--bd-shadow-md);
}
.bd-popover header {
	font-size: 11px; font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--bd-text-muted);
	padding: 12px 14px 6px;
	border-bottom: 1px solid var(--bd-border);
}
.bd-popover ul { list-style: none; margin: 0; padding: 6px 0; }
.bd-popover li button {
	display: flex; width: 100%;
	align-items: center; justify-content: space-between;
	padding: 10px 14px;
	background: transparent;
	border: 0;
	color: inherit;
	cursor: pointer;
	font-size: 14px;
	text-align: left;
	font-family: var(--bd-font);
}
.bd-popover li button:hover { background: rgba(255,255,255,.06); }
.bd-popover li button.is-active { color: var(--bd-primary-200); font-weight: 600; }
.bd-popover li button.is-active::after { content: "✓"; }
.bd-popover--eps { width: 240px; }
.bd-popover__grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	gap: 6px;
	padding: 10px 14px;
}
.bd-popover__grid button {
	aspect-ratio: 1 / 1;
	border-radius: 8px;
	background: rgba(255,255,255,.06);
	border: 1px solid transparent;
	color: var(--bd-text);
	font-size: 12px;
	font-weight: 700;
	cursor: pointer;
	font-family: var(--bd-font);
	position: relative;
}
.bd-popover__grid button.is-locked { color: var(--bd-text-muted); background: rgba(255,255,255,.025); }
.bd-popover__grid button.is-current {
	background: var(--bd-primary-500);
	color: #fff;
	border-color: var(--bd-primary-300);
}
.bd-popover__grid button:hover { border-color: var(--bd-border-strong); }

/* Watch page sidebar (right column) ------------------------- */
.bd-watch__sidebar {
	background: var(--bd-bg-1);
	border: 1px solid var(--bd-border);
	border-radius: var(--bd-r-xl);
	padding: 24px;
	color: var(--bd-text);
}
.bd-watch__sidebar-head { padding-bottom: 18px; border-bottom: 1px solid var(--bd-border); margin-bottom: 16px; }
.bd-watch__sidebar-title { font-size: 22px; font-weight: 800; letter-spacing: -.02em; margin: 0 0 6px; }
.bd-watch__sidebar-meta { color: var(--bd-primary-200); font-size: 12px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; margin: 0 0 8px; }
.bd-watch__sidebar-desc { color: var(--bd-text-soft); font-size: 14.5px; line-height: 1.55; margin: 0; }

.bd-watch__epbar { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 12px; }
.bd-watch__epbar-title { font-size: 14px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--bd-text-soft); margin: 0; display: inline-flex; align-items: center; gap: 8px; }
.bd-watch__epbar-count { background: var(--bd-surface-2); color: var(--bd-text); font-size: 11px; padding: 2px 8px; border-radius: var(--bd-r-pill); }

.bd-watch__eplist {
	list-style: none;
	margin: 0; padding: 0;
	display: flex; flex-direction: column;
	gap: 8px;
	max-height: 460px;
	overflow-y: auto;
	padding-right: 4px;
}
.bd-watch__eplist::-webkit-scrollbar { width: 6px; }
.bd-watch__eplist::-webkit-scrollbar-thumb { background: var(--bd-border-strong); border-radius: 4px; }

.bd-watch__epitem {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px;
	border-radius: var(--bd-r-md);
	background: rgba(255,255,255,.025);
	border: 1px solid transparent;
	color: inherit;
	transition: background .15s, border-color .15s, transform .15s;
}
.bd-watch__epitem:hover { background: rgba(255,255,255,.05); border-color: var(--bd-border-strong); }
.bd-watch__epitem.is-current {
	background: rgba(26,76,255,.12);
	border-color: var(--bd-primary-400);
}
.bd-watch__epitem-thumb {
	position: relative;
	flex: 0 0 auto;
	width: 56px; aspect-ratio: 2 / 3;
	border-radius: var(--bd-r-sm);
	overflow: hidden;
	background: var(--bd-bg-2);
	border: 1px solid var(--bd-border);
}
.bd-watch__epitem-thumb img { width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.bd-watch__epitem.is-locked .bd-watch__epitem-thumb img { opacity: .45; }
.bd-watch__epitem-num {
	position: absolute;
	left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	font-size: 18px; font-weight: 900;
	color: #fff;
	text-shadow: 0 1px 3px rgba(0,0,0,.7);
}
.bd-watch__epitem-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bd-watch__epitem-title { font-size: 14px; font-weight: 600; color: var(--bd-text); }
.bd-watch__epitem-tag {
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--bd-text-muted);
}
.bd-watch__epitem.is-current .bd-watch__epitem-tag { color: var(--bd-primary-200); }
.bd-watch__epitem.is-free .bd-watch__epitem-tag { color: var(--bd-primary-300); }
.bd-watch__epitem.is-locked .bd-watch__epitem-tag { color: var(--bd-text-muted); }
.bd-watch__epitem-icon { color: var(--bd-text-muted); }

.bd-watch__sidebar-cta { margin-top: 16px; padding-top: 16px; border-top: 1px solid var(--bd-border); }

/* ============================================================
   FOOTER
   ============================================================ */
.bd-footer {
	border-top: 1px solid var(--bd-border);
	background: linear-gradient(180deg, var(--bd-bg) 0%, #08081a 100%);
}
.bd-footer__inner {
	padding: 56px 24px 32px;
	display: grid;
	gap: 40px;
	grid-template-columns: 1fr;
}
@media (min-width: 900px) { .bd-footer__inner { grid-template-columns: 1.1fr 2fr; gap: 56px; padding: 72px 32px 32px; } }
.bd-footer__tag { color: var(--bd-text-muted); margin: 16px 0 16px; max-width: 320px; line-height: 1.55; }
.bd-socials { display: flex; gap: 10px; }
.bd-socials a {
	width: 36px; height: 36px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 50%;
	border: 1px solid var(--bd-border);
	color: var(--bd-text-soft);
	background: rgba(255,255,255,.02);
	transition: background .15s, color .15s, border-color .15s;
}
.bd-socials a:hover { background: var(--bd-primary-500); color: #fff; border-color: var(--bd-primary-500); }

.bd-footer__cols {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 32px;
}
@media (min-width: 640px) { .bd-footer__cols { grid-template-columns: repeat(4, 1fr); } }
.bd-footer__cols h4 {
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	margin: 0 0 14px;
}
.bd-footer__cols div { display: flex; flex-direction: column; gap: 10px; }
.bd-footer__cols a { color: var(--bd-text-muted); font-size: 14px; }
.bd-footer__cols a:hover { color: var(--bd-text); }
.bd-footer__cols .bd-footer__menu { display: contents; list-style: none; padding: 0; margin: 0; }

.bd-footer__bottom {
	border-top: 1px solid var(--bd-border);
	font-size: 13px;
	color: var(--bd-text-muted);
}
.bd-footer__bottom-inner {
	display: flex; flex-wrap: wrap; gap: 12px;
	justify-content: space-between;
	align-items: center;
	padding: 22px 24px;
}

/* ============================================================
   MODAL — email gate + pricing
   ============================================================ */
.bd-modal {
	position: fixed;
	inset: 0;
	z-index: 1000;
	display: flex;
	align-items: center; justify-content: center;
	padding: 16px;
}
.bd-modal[hidden] { display: none; }
.bd-modal__backdrop {
	position: absolute;
	inset: 0;
	background: rgba(4,6,15,.85);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
}
.bd-modal__panel {
	position: relative;
	width: 100%;
	max-width: 460px;
	background: linear-gradient(180deg, var(--bd-bg-1), var(--bd-bg-2));
	border: 1px solid var(--bd-border-strong);
	border-radius: var(--bd-r-2xl);
	box-shadow: var(--bd-shadow-lg);
	padding: 36px 28px 28px;
	color: var(--bd-text);
	max-height: calc(100vh - 32px);
	overflow-y: auto;
}
.bd-modal[data-bd-step="pricing"] .bd-modal__panel { max-width: 520px; }
.bd-modal__close {
	position: absolute;
	top: 14px; right: 14px;
	width: 36px; height: 36px;
	border-radius: 50%;
	background: rgba(255,255,255,.06);
	border: 1px solid var(--bd-border);
	color: var(--bd-text-soft);
	display: inline-flex;
	align-items: center; justify-content: center;
	cursor: pointer;
}
.bd-modal__close:hover { background: rgba(255,255,255,.12); color: var(--bd-text); }
.bd-modal__title {
	font-size: 24px;
	font-weight: 800;
	margin: 0 0 8px;
	letter-spacing: -.02em;
}
.bd-modal__sub {
	color: var(--bd-text-soft);
	font-size: 15px;
	margin: 0 0 22px;
	line-height: 1.5;
}

.bd-emailform { display: flex; flex-direction: column; gap: 12px; }
.bd-emailform input[type="email"] {
	width: 100%;
	padding: 14px 16px;
	border-radius: var(--bd-r-md);
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border-strong);
	color: var(--bd-text);
	font-size: 16px;
	font-family: var(--bd-font);
	transition: border-color .15s, background .15s;
}
.bd-emailform input[type="email"]::placeholder { color: var(--bd-text-muted); }
.bd-emailform input[type="email"]:focus {
	outline: none;
	border-color: var(--bd-primary-400);
	background: rgba(26,76,255,.08);
	box-shadow: 0 0 0 4px rgba(26,76,255,.15);
}
.bd-emailform__error { color: #ff6b6b; font-size: 13px; margin: 0; }
.bd-emailform__legal { font-size: 12px; color: var(--bd-text-muted); margin: 8px 0 0; }

/* Plans ------------------------------------------------------ */
.bd-plans {
	display: grid;
	gap: 12px;
	margin-bottom: 8px;
}
.bd-plan {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 18px 18px;
	border: 1px solid var(--bd-border-strong);
	border-radius: var(--bd-r-lg);
	background: rgba(255,255,255,.03);
	cursor: pointer;
	transition: border-color .2s, background .2s;
	font-family: var(--bd-font);
	color: inherit;
	text-align: left;
}
.bd-plan:hover { border-color: var(--bd-primary-400); }
.bd-plan.is-popular { border-color: var(--bd-primary-400); background: linear-gradient(135deg, rgba(26,76,255,.16), rgba(0,194,255,.08)); }
.bd-plan.is-best    { border-color: var(--bd-accent);      background: linear-gradient(135deg, rgba(0,194,255,.18), rgba(26,76,255,.1)); }
.bd-plan__radio {
	width: 18px; height: 18px;
	border-radius: 50%;
	border: 2px solid var(--bd-border-strong);
	display: inline-block;
	flex-shrink: 0;
	position: relative;
}
.bd-plan.is-selected .bd-plan__radio { border-color: var(--bd-primary-400); }
.bd-plan.is-selected .bd-plan__radio::after {
	content: "";
	position: absolute;
	inset: 3px;
	border-radius: 50%;
	background: var(--bd-primary-400);
}
.bd-plan__main { flex: 1; display: flex; flex-direction: column; gap: 2px; }
.bd-plan__name {
	font-size: 16px; font-weight: 700;
	display: inline-flex; align-items: center; gap: 8px;
}
.bd-plan__badge {
	display: inline-block;
	font-size: 10px; font-weight: 700;
	letter-spacing: .12em;
	text-transform: uppercase;
	padding: 2px 8px;
	border-radius: var(--bd-r-pill);
	background: var(--bd-primary-500);
	color: #fff;
}
.bd-plan.is-best .bd-plan__badge { background: var(--bd-accent); color: #04060f; }
.bd-plan__note { font-size: 12px; color: var(--bd-text-muted); }
.bd-plan__price { text-align: right; display: flex; flex-direction: column; align-items: flex-end; }
.bd-plan__price strong { font-size: 18px; font-weight: 800; letter-spacing: -.01em; }
.bd-plan__price span   { font-size: 11px; color: var(--bd-text-muted); }
.bd-plan__cta {
	margin-top: 12px;
	width: 100%;
	padding: 14px;
	font-size: 16px;
}
.bd-plans__legal { font-size: 12px; color: var(--bd-text-muted); margin: 12px 0 0; text-align: center; }

/* ============================================================
   ADMIN META BOX
   ============================================================ */
.bd-meta { padding: 8px 0; }
.bd-meta__intro {
	margin: 0 0 12px;
	color: #555;
	font-size: 13px;
	line-height: 1.5;
	background: #f0f6ff;
	border-left: 4px solid #1a4cff;
	padding: 10px 14px;
	border-radius: 4px;
}
.bd-meta__table th { width: 220px; }
.bd-meta__langs { display: flex; flex-wrap: wrap; gap: 12px 18px; }
.bd-meta__langs label { display: inline-flex; align-items: center; gap: 6px; }
.bd-meta__preview {
	margin-top: 16px;
	padding: 12px 14px;
	background: #0e1430;
	color: #cfd6ff;
	border-radius: 6px;
	font-size: 12px;
	overflow-x: auto;
}
.bd-meta__preview h4 { color: #fff; margin: 0 0 8px; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; }
.bd-meta__preview pre { margin: 0; font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; white-space: pre-wrap; word-break: break-all; }

/* (Poster marquee removed — replaced by cleaner full-bleed hero) */

/* ============================================================
   HERO VIP CHIP + RAIL VARIANT
   ============================================================ */
.bd-hero__vip {
	background: linear-gradient(135deg, #ffd76a, #ff9a3c) !important;
	color: #1a0c00 !important;
	font-weight: 800 !important;
	border-color: rgba(255,215,106,.5) !important;
	letter-spacing: .12em;
	text-transform: uppercase;
	font-size: 11px !important;
	padding: 3px 10px !important;
}

.bd-section--vip .bd-section__title::before {
	content: "★";
	color: var(--bd-gold);
	margin-right: 6px;
}

.bd-show__vip {
	position: absolute;
	top: 10px; right: 10px;
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	color: #1a0c00;
	font-size: 10px;
	font-weight: 800;
	padding: 3px 8px;
	border-radius: var(--bd-r-pill);
	letter-spacing: .1em;
}
.bd-show__rank + .bd-show__vip { top: 40px; }
.bd-show__badge {
	position: absolute;
	bottom: 10px; left: 10px;
	background: rgba(0,0,0,.7);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: var(--bd-r-sm);
	letter-spacing: .12em;
	text-transform: uppercase;
}

/* ============================================================
   CONTINUE WATCHING
   ============================================================ */
.bd-show--continue .bd-show__poster { border-color: rgba(91,124,255,.35); }
.bd-show__continue-bar {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 4px;
	background: rgba(255,255,255,.18);
	display: block;
}
.bd-show__continue-bar > span {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, var(--bd-primary-300), var(--bd-accent));
}
.bd-show__continue-pill {
	position: absolute;
	top: 10px; left: 10px;
	background: rgba(0,0,0,.65);
	color: #fff;
	font-size: 10px;
	font-weight: 800;
	padding: 4px 8px;
	border-radius: var(--bd-r-pill);
	letter-spacing: .1em;
	text-transform: uppercase;
}
.bd-section__more--btn {
	background: transparent;
	border: 0;
	cursor: pointer;
	padding: 0;
}

/* ============================================================
   PRICING MODAL — redesigned
   ============================================================ */
.bd-modal__brand {
	display: flex;
	justify-content: center;
	margin-bottom: 16px;
}
.bd-modal__brand .bd-brand__mark { width: 40px; height: 40px; }

.bd-modal__benefits {
	list-style: none;
	margin: 0 0 22px;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 8px;
	font-size: 14px;
	color: var(--bd-text-soft);
}
@media (min-width: 460px) { .bd-modal__benefits { grid-template-columns: 1fr 1fr; } }
.bd-modal__benefits li {
	position: relative;
	padding-left: 24px;
}
.bd-modal__benefits li::before {
	content: "";
	position: absolute;
	left: 0; top: 4px;
	width: 16px; height: 16px;
	border-radius: 50%;
	background: linear-gradient(135deg, var(--bd-primary-300), var(--bd-primary-500));
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"),
		linear-gradient(135deg, var(--bd-primary-300), var(--bd-primary-500));
	background-size: 12px 12px, cover;
	background-position: center, center;
	background-repeat: no-repeat, no-repeat;
}

/* Pricing-step modal panel can be wider */
.bd-modal[data-bd-step="pricing"] .bd-modal__panel { max-width: 540px; padding-top: 28px; }

.bd-pricing-head { text-align: center; margin-bottom: 8px; }
.bd-pricing-head__eyebrow {
	display: inline-block;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #fff;
	background: linear-gradient(135deg, var(--bd-primary-500), var(--bd-accent));
	padding: 4px 12px;
	border-radius: var(--bd-r-pill);
	margin: 0 auto 12px;
	box-shadow: 0 6px 18px -8px rgba(26,76,255,.65);
}
.bd-pricing-head .bd-modal__title { margin-bottom: 8px; font-size: 26px; }

.bd-pricing-bullets {
	list-style: none;
	margin: 16px 0 18px;
	padding: 14px 16px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--bd-border);
	border-radius: var(--bd-r-md);
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 10px 14px;
	font-size: 13.5px;
	color: var(--bd-text-soft);
}
.bd-pricing-bullets li {
	position: relative;
	padding-left: 22px;
}
.bd-pricing-bullets li::before {
	content: "";
	position: absolute;
	left: 0; top: 2px;
	width: 14px; height: 14px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2395acff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
}

/* Plan cards */
.bd-plans { gap: 10px; }
.bd-plan {
	position: relative;
	padding: 18px 20px;
}
.bd-plan__topbadge {
	position: absolute;
	top: -10px; right: 16px;
	background: linear-gradient(135deg, var(--bd-primary-500), var(--bd-accent));
	color: #fff;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: 4px 10px;
	border-radius: var(--bd-r-pill);
	box-shadow: 0 6px 16px -6px rgba(26,76,255,.7);
}
.bd-plan.is-best .bd-plan__topbadge {
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	color: #1a0c00;
	box-shadow: 0 6px 16px -6px rgba(255,154,60,.7);
}
.bd-plan.is-easy {
	border-color: rgba(0,194,255,.35);
	background: linear-gradient(135deg, rgba(0,194,255,.10), rgba(26,76,255,.05));
}
.bd-plan.is-easy .bd-plan__topbadge {
	background: linear-gradient(135deg, #00c2ff, #5b7cff);
	color: #04060f;
}
.bd-plan__main { gap: 4px; }
.bd-plan__name { font-size: 17px; font-weight: 800; letter-spacing: -.01em; }
.bd-plan__note { font-size: 12.5px; color: var(--bd-text-muted); }
.bd-plan__perday {
	font-size: 12px;
	color: var(--bd-primary-200);
	font-weight: 600;
	letter-spacing: .02em;
}
.bd-plan__price { gap: 2px; }
.bd-plan__price strong { font-size: 22px; font-weight: 900; letter-spacing: -.02em; }
.bd-plan__period { font-size: 11px; color: var(--bd-text-muted); }
.bd-plan__savings {
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .1em;
	text-transform: uppercase;
	color: #1a0c00;
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	padding: 2px 8px;
	border-radius: var(--bd-r-pill);
	margin-top: 4px;
}
.bd-plan__cta {
	margin-top: 16px;
	width: 100%;
	padding: 16px 18px;
	font-size: 17px;
	font-weight: 800;
	letter-spacing: .01em;
}
.bd-plan__cta svg { transition: transform .15s; }
.bd-plan__cta:hover svg { transform: translateX(2px); }

/* ============================================================
   ADMIN — banner picker preview
   ============================================================ */
.bd-banner-wrap { margin-top: 4px; }
.bd-banner-preview {
	display: block;
	width: 100%;
	min-height: 80px;
	aspect-ratio: 16 / 9;
	background: #0e1430;
	border: 1px dashed rgba(91,124,255,.4);
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.bd-banner-preview img { width: 100%; height: 100%; object-fit: cover; }
.bd-banner-placeholder { color: #9aa1c0; font-size: 12px; text-align: center; padding: 0 12px; }
.bd-meta__h { margin: 22px 0 8px; font-size: 14px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: #1a4cff; }
.bd-meta--side { padding: 6px 0; }
.bd-meta--side hr { border: 0; border-top: 1px solid #e2e6f0; margin: 14px 0; }

/* ============================================================
   AWARDS / RECOGNITION PAGE
   ============================================================ */
.bd-awards-hero {
	position: relative;
	padding: 64px 0 40px;
	border-bottom: 1px solid var(--bd-border);
	background:
		radial-gradient(ellipse at top, rgba(26,76,255,.22), transparent 60%),
		radial-gradient(ellipse at bottom right, rgba(0,194,255,.18), transparent 50%),
		var(--bd-bg);
}
.bd-awards-hero__title {
	font-size: clamp(32px, 5vw, 52px);
	font-weight: 800;
	letter-spacing: -.025em;
	margin: 12px 0 12px;
	background: linear-gradient(120deg, #fff 0%, #c4d2ff 60%, #00c2ff 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.bd-awards-hero__desc { color: var(--bd-text-soft); max-width: 720px; line-height: 1.55; font-size: 16px; margin: 0; }

.bd-awards-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 18px;
}
@media (min-width: 720px)  { .bd-awards-grid { grid-template-columns: 1fr 1fr; } }
@media (min-width: 1100px) { .bd-awards-grid { grid-template-columns: 1fr 1fr; gap: 24px; } }

.bd-award-card {
	padding: 28px 28px 32px;
	border-radius: var(--bd-r-xl);
	border: 1px solid var(--bd-border);
	background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
	position: relative;
	overflow: hidden;
}
.bd-award-card::before {
	content: "";
	position: absolute;
	top: -40%; right: -20%;
	width: 280px; height: 280px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(0,194,255,.18), transparent 60%);
	filter: blur(30px);
	pointer-events: none;
}
.bd-award-card__icon {
	font-size: 32px;
	margin-bottom: 8px;
}
.bd-award-card__tag {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--bd-primary-200);
	margin: 0 0 6px;
}
.bd-award-card__title {
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0 0 12px;
	line-height: 1.2;
}
.bd-award-card__body {
	color: var(--bd-text-soft);
	line-height: 1.6;
	font-size: 14.5px;
	margin: 0;
}

/* ============================================================
   FAQ ACCORDION
   ============================================================ */
.bd-faq {
	max-width: 820px;
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.bd-faq__item {
	border: 1px solid var(--bd-border);
	border-radius: var(--bd-r-md);
	background: rgba(255,255,255,.025);
	overflow: hidden;
	transition: border-color .25s, background .25s;
}
.bd-faq__item[open] {
	border-color: rgba(91,124,255,.45);
	background: linear-gradient(180deg, rgba(26,76,255,.08), rgba(255,255,255,.01));
}
.bd-faq__item summary {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	padding: 18px 22px;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: -.01em;
	cursor: pointer;
	list-style: none;
	color: var(--bd-text);
}
.bd-faq__item summary::-webkit-details-marker { display: none; }
.bd-faq__item summary::after {
	content: "";
	width: 22px; height: 22px;
	flex-shrink: 0;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='12' y1='5' x2='12' y2='19'/%3E%3Cline x1='5' y1='12' x2='19' y2='12'/%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
	transition: transform .25s ease;
}
.bd-faq__item[open] summary::after { transform: rotate(45deg); }
.bd-faq__answer {
	padding: 0 22px 22px;
	color: var(--bd-text-soft);
	line-height: 1.65;
	font-size: 15px;
}
.bd-faq__answer a { color: var(--bd-primary-200); }
.bd-faq__answer a:hover { color: var(--bd-text); }

/* ============================================================
   CONTACT FORM
   ============================================================ */
.bd-contact {
	max-width: 640px;
	display: flex;
	flex-direction: column;
	gap: 18px;
	padding: 28px;
	border: 1px solid var(--bd-border);
	border-radius: var(--bd-r-xl);
	background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.01));
}
.bd-contact__row { display: flex; flex-direction: column; gap: 6px; }
.bd-contact__row label {
	font-size: 13px;
	font-weight: 600;
	color: var(--bd-text-soft);
	letter-spacing: .02em;
}
.bd-contact__row input,
.bd-contact__row textarea {
	width: 100%;
	padding: 12px 14px;
	border-radius: var(--bd-r-md);
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border-strong);
	color: var(--bd-text);
	font-family: var(--bd-font);
	font-size: 15px;
	resize: vertical;
}
.bd-contact__row textarea { min-height: 140px; }
.bd-contact__row input:focus,
.bd-contact__row textarea:focus {
	outline: none;
	border-color: var(--bd-primary-400);
	background: rgba(26,76,255,.08);
	box-shadow: 0 0 0 4px rgba(26,76,255,.15);
}
.bd-contact__error { color: #ff6b6b; font-size: 13px; margin: 0; }
.bd-contact__success {
	background: rgba(0,194,255,.1);
	color: var(--bd-accent);
	padding: 10px 14px;
	border-radius: var(--bd-r-md);
	border: 1px solid rgba(0,194,255,.3);
	font-size: 14px;
	margin: 0;
}
.bd-contact__actions { display: flex; gap: 10px; flex-wrap: wrap; }

/* ============================================================
   WHAT'S NEW TIMELINE
   ============================================================ */
.bd-timeline {
	display: flex;
	flex-direction: column;
	gap: 56px;
}
.bd-timeline__era-head {
	border-bottom: 1px solid var(--bd-border);
	padding-bottom: 12px;
	margin-bottom: 24px;
}
.bd-timeline__era-date {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--bd-primary-200);
	margin: 0 0 6px;
}
.bd-timeline__era-title {
	font-size: clamp(24px, 3vw, 32px);
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0;
}
.bd-timeline__items {
	list-style: none;
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}
@media (min-width: 720px)  { .bd-timeline__items { grid-template-columns: 1fr 1fr; gap: 18px; } }
@media (min-width: 1100px) { .bd-timeline__items { grid-template-columns: 1fr 1fr 1fr; gap: 20px; } }
.bd-timeline__items li {
	padding: 22px;
	border-radius: var(--bd-r-lg);
	border: 1px solid var(--bd-border);
	background: rgba(255,255,255,.025);
}
.bd-timeline__items h4 { font-size: 16px; font-weight: 700; margin: 0 0 8px; letter-spacing: -.01em; }
.bd-timeline__items p  { font-size: 14px; line-height: 1.55; color: var(--bd-text-soft); margin: 0; }

/* ============================================================
   MONEY-BACK GUARANTEE (modal)
   ============================================================ */
.bd-pricing-money-back {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	border-radius: var(--bd-r-md);
	background: rgba(0,194,255,.08);
	border: 1px solid rgba(0,194,255,.3);
	margin: 16px 0 12px;
}
.bd-pricing-money-back__icon {
	width: 36px; height: 36px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center; justify-content: center;
	border-radius: 50%;
	background: rgba(0,194,255,.18);
	color: var(--bd-accent);
}
.bd-pricing-money-back > div { display: flex; flex-direction: column; gap: 2px; }
.bd-pricing-money-back strong { font-size: 14px; }
.bd-pricing-money-back span    { font-size: 12.5px; color: var(--bd-text-soft); }

/* ============================================================
   HERO AWARD CHIP
   ============================================================ */
.bd-hero__award {
	background: linear-gradient(135deg, rgba(0,194,255,.6), rgba(26,76,255,.45)) !important;
	color: #fff !important;
	border-color: rgba(0,194,255,.5) !important;
	font-weight: 700 !important;
	letter-spacing: .04em;
}

/* Award badge variant on the show card */
.bd-show__badge { z-index: 2; }

/* Continue Watching clear button styling */
.bd-section__more--btn { color: var(--bd-text-soft); }
.bd-section__more--btn:hover { color: var(--bd-text); }

/* ============================================================
   HEADER 3-ZONE LAYOUT + DROPDOWN
   ============================================================ */
.bd-header__inner { gap: 16px; }
.bd-header__left  { display: flex; align-items: center; gap: 24px; }
.bd-header__right { display: flex; align-items: center; gap: 12px; }
.bd-nav--secondary { display: none; }
@media (min-width: 1100px) { .bd-nav--secondary { display: inline-flex; gap: 18px; } }

.bd-header__awards {
	display: none;
	align-items: center;
	gap: 10px;
	padding: 6px 14px 6px 6px;
	border-radius: var(--bd-r-pill);
	background: linear-gradient(135deg, rgba(255,215,106,.18), rgba(255,154,60,.12));
	border: 1px solid rgba(255,215,106,.35);
	color: #fff;
}
@media (min-width: 1180px) { .bd-header__awards { display: inline-flex; } }
.bd-header__awards-icon {
	width: 28px; height: 28px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 50%;
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	color: #1a0c00;
}
.bd-header__awards-text { display: flex; flex-direction: column; line-height: 1.1; }
.bd-header__awards-text small { font-size: 10px; color: rgba(255,255,255,.78); letter-spacing: .04em; }
.bd-header__awards-text strong { font-size: 12.5px; font-weight: 700; }

.bd-iconbtn {
	width: 36px; height: 36px;
	display: inline-flex; align-items: center; justify-content: center;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border);
	color: var(--bd-text-soft);
	border-radius: var(--bd-r-md);
	cursor: pointer;
}
.bd-iconbtn:hover { color: var(--bd-text); background: rgba(255,255,255,.08); }

/* Dropdown */
.bd-nav__group { position: relative; }
.bd-nav__trigger {
	display: inline-flex; align-items: center; gap: 6px;
	background: transparent; border: 0;
	color: var(--bd-text-soft);
	font-family: inherit; font-size: 15px; font-weight: 500;
	cursor: pointer; padding: 6px 0;
}
.bd-nav__trigger:hover { color: var(--bd-text); }
.bd-nav__dropdown {
	position: absolute;
	top: calc(100% + 14px);
	left: -16px;
	background: rgba(8,10,26,.98);
	border: 1px solid var(--bd-border-strong);
	border-radius: var(--bd-r-lg);
	padding: 12px;
	display: none;
	flex-direction: column;
	gap: 4px;
	min-width: 240px;
	z-index: 60;
	box-shadow: 0 24px 60px -20px rgba(0,0,0,.65);
}
.bd-nav__dropdown a {
	display: block;
	padding: 8px 12px;
	border-radius: var(--bd-r-sm);
	font-size: 14px;
	color: var(--bd-text-soft);
}
.bd-nav__dropdown a:hover { background: rgba(255,255,255,.05); color: var(--bd-text); }
.bd-nav__group:hover .bd-nav__dropdown,
.bd-nav__trigger[aria-expanded="true"] + .bd-nav__dropdown { display: flex; }

/* ============================================================
   HEROX — single source of truth. The full-bleed mobile-first
   rules live further down (search "HEROX — FULL-BLEED BACKDROP").
   ============================================================ */
.bd-chip {
	font-size: 12px; font-weight: 600;
	color: var(--bd-text);
	background: rgba(255,255,255,.08);
	border: 1px solid var(--bd-border);
	padding: 4px 10px;
	border-radius: var(--bd-r-pill);
}
.bd-chip--rate { background: rgba(255,215,106,.16); border-color: rgba(255,215,106,.45); color: #ffd76a; }

/* ============================================================
   RANKED SECTION (Sélection dans Belgique)
   ============================================================ */
.bd-ranked {
	display: grid;
	grid-template-columns: 1fr;
	gap: 16px;
}
@media (min-width: 720px)  { .bd-ranked { grid-template-columns: 1fr 1fr; gap: 18px; } }
@media (min-width: 1100px) { .bd-ranked { grid-template-columns: 1fr 1fr; gap: 24px; } }
.bd-ranked__card {
	display: flex;
	gap: 16px;
	align-items: center;
	padding: 16px;
	border-radius: var(--bd-r-lg);
	background: rgba(255,255,255,.03);
	border: 1px solid var(--bd-border);
	color: inherit;
	transition: background .2s, border-color .2s, transform .2s;
}
.bd-ranked__card:hover { background: rgba(255,255,255,.06); border-color: rgba(91,124,255,.4); transform: translateY(-2px); }
.bd-ranked__num {
	flex: 0 0 auto;
	font-size: clamp(56px, 7vw, 84px);
	font-weight: 900;
	line-height: 1;
	letter-spacing: -.06em;
	background: linear-gradient(180deg, #fff 0%, #5b7cff 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	min-width: 64px;
	text-align: center;
}
.bd-ranked__poster {
	flex: 0 0 80px;
	width: 80px;
	aspect-ratio: 2/3;
	border-radius: var(--bd-r-md);
	overflow: hidden;
	background: var(--bd-bg-2);
	border: 1px solid var(--bd-border);
}
.bd-ranked__poster img { width: 100%; height: 100%; object-fit: cover; }
.bd-ranked__body { min-width: 0; }
.bd-ranked__title {
	font-size: 16px; font-weight: 700;
	margin: 0 0 4px;
	letter-spacing: -.01em;
	color: var(--bd-text);
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.bd-ranked__cats { font-size: 12px; color: var(--bd-text-muted); margin: 0 0 4px; }
.bd-ranked__likes { font-size: 13px; color: var(--bd-pink); margin: 0; }

/* ============================================================
   PREMIUM BANNER
   ============================================================ */
.bd-premium-banner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 28px 32px;
	border-radius: var(--bd-r-2xl);
	background: linear-gradient(135deg, #1a4cff 0%, #5b7cff 50%, #00c2ff 100%);
	color: #fff;
	box-shadow: 0 32px 80px -20px rgba(26,76,255,.55);
	transition: transform .2s;
}
.bd-premium-banner:hover { transform: translateY(-2px); }
.bd-premium-banner__eyebrow {
	font-size: 12px;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	margin: 0 0 6px;
	opacity: .85;
}
.bd-premium-banner__title {
	font-size: clamp(22px, 3vw, 30px);
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0 0 8px;
}
.bd-premium-banner__cta {
	font-size: 14px;
	font-weight: 700;
	color: #fff;
	border-bottom: 2px solid #fff;
	padding-bottom: 1px;
}
.bd-premium-banner__art {
	flex: 0 0 auto;
	width: 96px; height: 96px;
	border-radius: 50%;
	background: rgba(255,255,255,.18);
	display: flex; align-items: center; justify-content: center;
	color: #fff;
}

/* ============================================================
   TINDER (Trouve ton style)
   ============================================================ */
.bd-tinder { position: relative; padding: 56px 0; background: #100b1f; }
.bd-tinder__bar { height: 6px; background: linear-gradient(90deg, #ff8a3c 0%, #ff5f6d 100%); }
.bd-tinder__bar--top    { position: absolute; top: 0;    left: 0; right: 0; }
.bd-tinder__bar--bottom { position: absolute; bottom: 0; left: 0; right: 0; }
.bd-tinder__deck {
	position: relative;
	width: 100%;
	max-width: 340px;
	margin: 24px auto 0;
	aspect-ratio: 2/3;
}
.bd-tinder__card {
	position: absolute;
	inset: 0;
	border-radius: var(--bd-r-2xl);
	overflow: hidden;
	background: var(--bd-bg-2);
	border: 1px solid var(--bd-border);
	box-shadow: 0 24px 60px -20px rgba(0,0,0,.6);
	transform-origin: center bottom;
	transition: transform .35s cubic-bezier(.4,0,.2,1), opacity .35s ease;
	will-change: transform;
	z-index: var(--bd-tinder-z, 1);
	pointer-events: none;
}
.bd-tinder__card.is-top { pointer-events: auto; }
.bd-tinder__card:not(.is-top) {
	transform: scale(.94) translateY(14px);
	opacity: .55;
}
.bd-tinder__card.is-swiped-like {
	transform: translateX(140%) rotate(18deg);
	opacity: 0;
	pointer-events: none;
}
.bd-tinder__card.is-swiped-dislike {
	transform: translateX(-140%) rotate(-18deg);
	opacity: 0;
	pointer-events: none;
}
.bd-tinder__poster {
	display: block;
	width: 100%; height: 100%;
	position: relative;
	color: inherit;
	user-select: none;
	-webkit-user-drag: none;
}
.bd-tinder__poster img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
	pointer-events: none;
}
.bd-tinder__stamp {
	position: absolute;
	top: 28px;
	font-size: 28px;
	font-weight: 900;
	letter-spacing: .05em;
	padding: 6px 16px;
	border: 4px solid currentColor;
	border-radius: 10px;
	text-transform: uppercase;
	opacity: 0;
	transition: opacity .15s;
}
.bd-tinder__stamp--like {
	right: 22px;
	color: #00e0a4;
	transform: rotate(15deg);
}
.bd-tinder__stamp--nope {
	left: 22px;
	color: #ff6b6b;
	transform: rotate(-15deg);
}
.bd-tinder__card.is-hint-like .bd-tinder__stamp--like,
.bd-tinder__card.is-hint-dislike .bd-tinder__stamp--nope { opacity: 1; }

.bd-tinder__overlay {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	padding: 28px 20px 20px;
	background: linear-gradient(180deg, transparent 0%, rgba(0,0,0,.9) 100%);
	color: #fff;
}
.bd-tinder__overlay h3 { font-size: 22px; font-weight: 800; margin: 0 0 4px; letter-spacing: -.02em; }
.bd-tinder__overlay p  { font-size: 12.5px; color: rgba(255,255,255,.85); margin: 0; }

.bd-tinder__done {
	position: absolute;
	inset: 0;
	display: none;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: linear-gradient(135deg, #1a4cff 0%, #5b7cff 100%);
	color: #fff;
	border-radius: var(--bd-r-2xl);
	text-align: center;
	padding: 24px;
	z-index: 20;
}
.bd-tinder__done[hidden] { display: none; }
.bd-tinder__done:not([hidden]) { display: flex; }
.bd-tinder__done h3 { margin: 6px 0 4px; font-size: 22px; font-weight: 800; }
.bd-tinder__done p  { margin: 0 0 14px; font-size: 14px; opacity: .9; }

.bd-tinder__actions { display: flex; max-width: 340px; margin: 18px auto 0; gap: 12px; }
.bd-tinder__btn {
	flex: 1;
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	padding: 14px;
	border-radius: var(--bd-r-pill);
	font-weight: 700; font-size: 14px;
	cursor: pointer;
	font-family: var(--bd-font);
	border: 0;
	transition: transform .15s, background .2s;
}
.bd-tinder__btn--no  { background: rgba(255,107,107,.12); color: #ff6b6b; border: 1px solid rgba(255,107,107,.35); }
.bd-tinder__btn--no:hover  { background: rgba(255,107,107,.22); transform: scale(1.04); }
.bd-tinder__btn--yes { background: linear-gradient(135deg, var(--bd-primary-300), var(--bd-primary-500)); color: #fff; box-shadow: 0 8px 20px -8px rgba(26,76,255,.6); }
.bd-tinder__btn--yes:hover { transform: scale(1.04); }
.bd-tinder__btn:active { transform: scale(.98); }

/* ============================================================
   LARGE-CARD RAIL VARIANT (Incontournables / Meilleures Choix)
   ============================================================ */
.bd-show--lg { width: 240px; }
@media (min-width: 768px)  { .bd-show--lg { width: 280px; } }
@media (min-width: 1024px) { .bd-show--lg { width: 320px; } }
.bd-show--lg .bd-show__poster { aspect-ratio: 16 / 11; }
.bd-show--lg .bd-show__title  { font-size: 16px; }

/* Watch top bar tweaks */
.bd-watch__title {
	flex: 1;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: -.01em;
	color: var(--bd-text);
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.bd-watch__back {
	width: 38px; height: 38px;
	padding: 0;
	display: inline-flex; align-items: center; justify-content: center;
	background: var(--bd-surface);
	border: 1px solid var(--bd-border);
	color: var(--bd-text);
	border-radius: 50%;
}
.bd-watch__topactions { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
.bd-watch__epchip {
	display: inline-flex; align-items: center; gap: 4px;
	padding: 6px 12px;
	border-radius: var(--bd-r-pill);
	background: rgba(26,76,255,.18);
	border: 1px solid rgba(91,124,255,.4);
	color: var(--bd-text);
	font-size: 13px;
	font-weight: 600;
}
.bd-watch__epchip strong { color: var(--bd-primary-200); }
.bd-watch__nextlink {
	display: inline-flex; align-items: center; gap: 4px;
	padding: 6px 14px;
	border-radius: var(--bd-r-pill);
	background: linear-gradient(135deg, var(--bd-primary-300), var(--bd-primary-500));
	color: #fff;
	font-size: 13px;
	font-weight: 700;
}
.bd-watch__nextlink:hover { transform: translateY(-1px); }

/* ============================================================
   PRICING CARDS — new structure (old/new prices, daily, savings)
   ============================================================ */
.bd-plans { display: flex; flex-direction: column; gap: 12px; margin: 14px 0 14px; }
.bd-plan {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 14px;
	padding: 16px 18px;
	border: 2px solid var(--bd-border-strong);
	border-radius: var(--bd-r-lg);
	background: rgba(255,255,255,.03);
	cursor: pointer;
	transition: border-color .2s, background .2s;
	font-family: var(--bd-font);
	color: inherit;
	text-align: left;
	position: relative;
}
.bd-plan.is-popular { border-color: var(--bd-primary-400); background: linear-gradient(135deg, rgba(26,76,255,.16), rgba(0,194,255,.08)); }
.bd-plan.is-best    { border-color: rgba(255,215,106,.6);  background: linear-gradient(135deg, rgba(255,215,106,.08), rgba(26,76,255,.04)); }
.bd-plan.is-selected { box-shadow: 0 0 0 3px rgba(91,124,255,.35); }
.bd-plan__topbadge {
	position: absolute;
	top: -10px; left: 14px;
	background: linear-gradient(135deg, var(--bd-primary-500), var(--bd-accent));
	color: #fff;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	padding: 4px 10px;
	border-radius: var(--bd-r-pill);
	box-shadow: 0 6px 16px -6px rgba(26,76,255,.7);
}
.bd-plan.is-best .bd-plan__topbadge {
	background: linear-gradient(135deg, #ffd76a, #ff9a3c); color: #1a0c00;
	box-shadow: 0 6px 16px -6px rgba(255,154,60,.7);
}
.bd-plan__main { display: flex; flex-direction: column; gap: 4px; min-width: 0; flex: 1; }
.bd-plan__name { font-size: 16px; font-weight: 800; letter-spacing: -.01em; }
.bd-plan__sub  { font-size: 12px; color: var(--bd-text-muted); font-weight: 600; }
.bd-plan__savings {
	display: inline-block;
	margin-top: 2px;
	font-size: 10.5px; font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: #1a0c00;
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	padding: 3px 9px;
	border-radius: var(--bd-r-pill);
	width: fit-content;
}
.bd-plan__price { display: flex; flex-direction: column; align-items: flex-end; text-align: right; gap: 2px; flex-shrink: 0; }
.bd-plan__price-old { color: var(--bd-text-muted); font-size: 13px; text-decoration: line-through; }
.bd-plan__price-new { font-size: 22px; font-weight: 900; letter-spacing: -.02em; color: var(--bd-text); }
.bd-plan__daily { font-size: 11px; color: var(--bd-text-muted); }
.bd-plan__daily s { opacity: .6; margin-right: 4px; }

.bd-plans__cta {
	margin-top: 6px;
	font-size: 17px;
	font-weight: 800;
	letter-spacing: .01em;
}
.bd-pricing-secure {
	margin: 12px auto 14px;
	display: inline-flex;
	align-items: center;
	gap: 6px;
	background: rgba(34,197,94,.12);
	border: 1px solid rgba(34,197,94,.4);
	color: #22c55e;
	padding: 6px 14px;
	border-radius: var(--bd-r-pill);
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .04em;
}
.bd-pricing-head { text-align: center; margin-bottom: 14px; }
.bd-pricing-head__eyebrow {
	display: inline-block;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: #fff;
	background: linear-gradient(135deg, var(--bd-primary-500), var(--bd-accent));
	padding: 4px 12px;
	border-radius: var(--bd-r-pill);
	margin: 0 auto 10px;
}
.bd-pricing-head .bd-modal__title { margin: 0 0 6px; font-size: 26px; }

.bd-pricing-money-back {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 14px 16px;
	border-radius: var(--bd-r-md);
	background: rgba(0,194,255,.08);
	border: 1px solid rgba(0,194,255,.3);
	margin: 14px 0 12px;
}
.bd-pricing-money-back__icon {
	width: 36px; height: 36px;
	flex-shrink: 0;
	display: inline-flex;
	align-items: center; justify-content: center;
	border-radius: 50%;
	background: rgba(0,194,255,.18);
	color: var(--bd-accent);
}
.bd-pricing-money-back > div { display: flex; flex-direction: column; gap: 2px; }
.bd-pricing-money-back strong { font-size: 14px; }
.bd-pricing-money-back span    { font-size: 12.5px; color: var(--bd-text-soft); }

.bd-modal__benefits {
	list-style: none; margin: 0 0 22px; padding: 0;
	display: grid; grid-template-columns: 1fr; gap: 8px;
	font-size: 14px; color: var(--bd-text-soft);
}
@media (min-width: 460px) { .bd-modal__benefits { grid-template-columns: 1fr 1fr; } }
.bd-modal__benefits li { position: relative; padding-left: 24px; }
.bd-modal__benefits li::before {
	content: "";
	position: absolute;
	left: 0; top: 4px;
	width: 16px; height: 16px;
	border-radius: 50%;
	background-image:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E"),
		linear-gradient(135deg, var(--bd-primary-300), var(--bd-primary-500));
	background-size: 12px 12px, cover;
	background-position: center, center;
	background-repeat: no-repeat, no-repeat;
}

/* ============================================================
   SERIES BADGES (Show card)
   ============================================================ */
.bd-show__vip {
	position: absolute;
	top: 10px; right: 10px;
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	color: #1a0c00;
	font-size: 10px;
	font-weight: 800;
	padding: 3px 8px;
	border-radius: var(--bd-r-pill);
	letter-spacing: .1em;
}
.bd-show__rank + .bd-show__vip { top: 40px; }
.bd-show__badge {
	position: absolute;
	bottom: 10px; left: 10px;
	background: rgba(0,0,0,.7);
	color: #fff;
	font-size: 10px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: var(--bd-r-sm);
	letter-spacing: .12em;
	text-transform: uppercase;
}

.bd-show--continue .bd-show__poster { border-color: rgba(91,124,255,.35); }
.bd-show__continue-bar {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	height: 4px;
	background: rgba(255,255,255,.18);
	display: block;
}
.bd-show__continue-bar > span {
	display: block; height: 100%;
	background: linear-gradient(90deg, var(--bd-primary-300), var(--bd-accent));
}
.bd-show__continue-pill {
	position: absolute;
	top: 10px; left: 10px;
	background: rgba(0,0,0,.7);
	color: #fff;
	font-size: 10px;
	font-weight: 800;
	padding: 4px 8px;
	border-radius: var(--bd-r-pill);
	letter-spacing: .1em;
	text-transform: uppercase;
}

.bd-section__more--btn {
	background: transparent;
	border: 0;
	cursor: pointer;
	padding: 0;
	color: var(--bd-text-soft);
}
.bd-section__more--btn:hover { color: var(--bd-text); }

/* ============================================================
   PLACEHOLDER CARDS (rendered when a row has no real series yet)
   ============================================================ */
.bd-show--placeholder { cursor: default; pointer-events: none; }
.bd-show--placeholder .bd-show__poster {
	background:
		linear-gradient(135deg,
			hsl(var(--bd-ph-hue, 220) 60% 18%) 0%,
			hsl(calc(var(--bd-ph-hue, 220) + 30) 70% 30%) 100%);
	border-color: rgba(255,255,255,.06);
	display: flex;
	align-items: center;
	justify-content: center;
}
.bd-show__placeholder-art {
	color: rgba(255,255,255,.35);
	display: flex;
	align-items: center;
	justify-content: center;
}
.bd-show__placeholder-tag {
	position: absolute;
	bottom: 10px; left: 10px;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(255,255,255,.7);
	background: rgba(0,0,0,.45);
	padding: 4px 8px;
	border-radius: var(--bd-r-sm);
}
.bd-show--placeholder .bd-show__title {
	color: var(--bd-text-muted);
	font-style: italic;
}
.bd-show--placeholder .bd-show__meta { color: var(--bd-text-muted); }

.bd-ranked__card--placeholder {
	cursor: default;
	pointer-events: none;
	opacity: .8;
}
.bd-ranked__card--placeholder .bd-ranked__title { color: var(--bd-text-muted); font-style: italic; }
.bd-poster-fallback--lg { font-size: 96px; }

/* ============================================================
   HEROX — FULL-BLEED BACKDROP with crossfade + slow ken-burns
   (the only herox ruleset; clean replacement for the old duplicate)
   ============================================================ */
.bd-herox {
	position: relative;
	overflow: hidden;
	min-height: 560px;
	padding: 0 0 56px;
	border-bottom: 1px solid var(--bd-border);
	isolation: isolate;
	background: #04060f;
}
.bd-herox--placeholder { background: linear-gradient(135deg, #0e1430 0%, #1a4cff 65%, #00c2ff 100%); }

.bd-herox__shell { position: relative; min-height: 560px; padding-top: 80px; }
.bd-herox__track {
	position: absolute;
	inset: 0;
	display: grid;
}
.bd-herox__slide {
	grid-area: 1/1;
	position: relative;
	opacity: 0;
	pointer-events: none;
	transition: opacity 1s cubic-bezier(.4,0,.2,1);
}
.bd-herox__slide.is-active { opacity: 1; pointer-events: auto; z-index: 1; }

/* Backdrop — ken-burns slow zoom on the active slide */
.bd-herox__fullbg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	z-index: 0;
	transform: scale(1.02);
}
.bd-herox__slide.is-active .bd-herox__fullbg {
	animation: bd-herox-kenburns 14s ease-out forwards;
}
@keyframes bd-herox-kenburns {
	0%   { transform: scale(1.02); }
	100% { transform: scale(1.12); }
}
@media (prefers-reduced-motion: reduce) {
	.bd-herox__slide.is-active .bd-herox__fullbg { animation: none; }
	.bd-herox__slide { transition: opacity .25s linear; }
}

/* Overlay — dark left side for copy legibility, fade-to-bg at the bottom */
.bd-herox__overlay {
	position: absolute;
	inset: 0;
	z-index: 1;
	background:
		linear-gradient(90deg, rgba(4,6,15,.92) 0%, rgba(4,6,15,.55) 42%, rgba(4,6,15,.05) 78%),
		linear-gradient(180deg, rgba(4,6,15,.0) 0%, rgba(4,6,15,.55) 72%, var(--bd-bg) 100%);
}

/* Inner layout — copy left, optional poster card right (desktop only) */
.bd-herox__inner {
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: 1fr;
	gap: 40px;
	align-items: end;
	min-height: 560px;
}
@media (min-width: 980px) {
	.bd-herox__inner {
		grid-template-columns: 1fr 340px;
		align-items: center;
	}
}

/* Copy column */
.bd-herox__copy {
	max-width: 560px;
	padding: 220px 0 56px;
}
@media (min-width: 980px) {
	.bd-herox__copy { padding: 100px 0; }
}
.bd-herox__badge {
	display: inline-block;
	font-size: 10px;
	font-weight: 800;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: #1a0c00;
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	padding: 5px 12px;
	border-radius: var(--bd-r-pill);
	margin-bottom: 14px;
}
.bd-herox__chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.bd-herox__chips .bd-chip {
	background: rgba(0,0,0,.55);
	border-color: rgba(255,255,255,.18);
	color: #fff;
}
.bd-herox__title {
	font-size: clamp(34px, 6.4vw, 64px);
	font-weight: 800;
	letter-spacing: -.025em;
	line-height: 1.02;
	margin: 0 0 14px;
	color: #fff;
	text-shadow: 0 6px 24px rgba(0,0,0,.6);
}
.bd-herox__lede {
	max-width: 480px;
	color: rgba(255,255,255,.88);
	line-height: 1.55;
	margin: 0 0 24px;
	font-size: 15px;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.bd-herox__cta { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.bd-herox__cta-btn {
	font-weight: 800 !important;
	padding: 16px 32px !important;
	font-size: 15.5px !important;
	box-shadow: 0 14px 36px -10px rgba(26,76,255,.7), 0 0 0 1px rgba(255,255,255,.08) inset !important;
	transform: translateZ(0);
	transition: transform .2s, box-shadow .2s !important;
}
.bd-herox__cta-btn:hover {
	transform: translateY(-2px);
	box-shadow: 0 20px 48px -12px rgba(26,76,255,.85), 0 0 0 1px rgba(255,255,255,.12) inset !important;
}
.bd-herox__info {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 14px 22px;
	border-radius: 999px;
	background: rgba(255,255,255,.08);
	border: 1px solid rgba(255,255,255,.15);
	color: #fff;
	font-weight: 600;
	font-size: 14px;
	text-decoration: none;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	transition: background .2s;
}
.bd-herox__info:hover { background: rgba(255,255,255,.16); }

/* Vertical poster card — desktop only feature */
.bd-herox__poster-card {
	display: none;
	position: relative;
	aspect-ratio: 2/3;
	border-radius: 24px;
	overflow: hidden;
	border: 1px solid rgba(255,255,255,.14);
	box-shadow: 0 30px 70px -20px rgba(0,0,0,.85), 0 0 0 1px rgba(255,255,255,.05) inset;
	transform: rotate(2deg);
	transition: transform .3s cubic-bezier(.4,0,.2,1), box-shadow .3s;
	max-height: 480px;
	margin: 0 0 0 auto;
	cursor: pointer;
	width: 100%;
}
@media (min-width: 980px) { .bd-herox__poster-card { display: block; } }
.bd-herox__poster-card:hover {
	transform: rotate(0deg) translateY(-4px);
	box-shadow: 0 40px 90px -20px rgba(26,76,255,.6), 0 0 0 1px rgba(255,255,255,.12) inset;
}
.bd-herox__poster-card img {
	width: 100%; height: 100%;
	object-fit: cover;
	display: block;
}
.bd-herox__poster-play {
	position: absolute;
	bottom: 18px; right: 18px;
	width: 52px; height: 52px;
	border-radius: 50%;
	background: rgba(255,255,255,.96);
	color: #1a4cff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0 16px 30px -10px rgba(0,0,0,.6);
}
.bd-herox__poster-card.is-active-side { transform: rotate(0deg); }

/* Dots — bottom-center indicator, animates between slides */
.bd-herox__dots {
	position: absolute;
	bottom: 22px;
	left: 50%;
	transform: translateX(-50%);
	z-index: 3;
	display: flex;
	gap: 8px;
	background: rgba(0,0,0,.32);
	padding: 7px 12px;
	border-radius: 999px;
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
}
.bd-herox__dot {
	width: 8px; height: 8px;
	border-radius: 50%;
	background: rgba(255,255,255,.32);
	border: 0;
	cursor: pointer;
	transition: background .25s, width .35s cubic-bezier(.4,0,.2,1);
	padding: 0;
}
.bd-herox__dot.is-active { background: #fff; width: 26px; border-radius: 4px; }

/* Mobile — backdrop sits behind, copy stacks at bottom */
@media (max-width: 720px) {
	.bd-herox { min-height: 580px; padding-bottom: 60px; }
	.bd-herox__shell { min-height: 580px; padding-top: 0; }
	.bd-herox__overlay {
		background:
			linear-gradient(180deg, rgba(4,6,15,.0) 0%, rgba(4,6,15,.3) 35%, rgba(4,6,15,.92) 85%, var(--bd-bg) 100%);
	}
	.bd-herox__copy {
		padding: 280px 0 24px;
		max-width: 100%;
	}
	.bd-herox__title { font-size: 30px; }
	.bd-herox__lede { font-size: 14px; }
	.bd-herox__cta-btn { width: 100%; justify-content: center; }
	.bd-herox__info { width: 100%; justify-content: center; }
}
@media (min-width: 721px) {
	.bd-herox__fullbg { background-position: center 25%; }
}

/* ============================================================
   PLAYER — show cover backdrop + setup card so it never looks empty
   ============================================================ */
.bd-player__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	filter: blur(28px) brightness(.55);
	transform: scale(1.15);
	z-index: 0;
}
.bd-player__video { position: relative; z-index: 1; }
.bd-player__bigplay,
.bd-player__locked,
.bd-player__loading,
.bd-player__rail,
.bd-player__bottom,
.bd-popover,
.bd-player__setup { z-index: 4; }

.bd-player__setup {
	position: absolute;
	inset: 0;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
	background: linear-gradient(180deg, rgba(4,6,15,.5), rgba(4,6,15,.92));
}
.bd-player__setup-card {
	max-width: 280px;
	text-align: center;
	color: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 10px;
}
.bd-player__setup-card svg { color: #ffd76a; }
.bd-player__setup-card h4 { font-size: 17px; font-weight: 800; margin: 0; }
.bd-player__setup-card p  { font-size: 13px; color: var(--bd-text-soft); margin: 0; line-height: 1.5; }
.bd-player__setup-card code {
	background: rgba(255,255,255,.1);
	padding: 1px 6px;
	border-radius: 4px;
	font-size: 12px;
}
.bd-player__setup-card .bd-btn { margin-top: 4px; }

/* ============================================================
   FULL-VIEWPORT PLAYER
   ============================================================ */
/* Hide the site chrome completely while watching — matches the
   my-drama mobile feel. */
body.bd-body--player .bd-header,
body.bd-body--player .bd-postermarq,
body.bd-body--player .bd-footer { display: none !important; }
body.bd-body--player { background: #000; }
body.bd-body--player .bd-page-main,
body.bd-body--player .bd-main-wrap,
body.bd-body--player #bd-main { background: #000; padding: 0; margin: 0; }

.bd-watch--full {
	background: #000;
	min-height: 100vh;
	min-height: 100dvh;
	padding: 0;
	margin: 0;
}
.bd-player--full {
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100vh;             /* fallback */
	height: 100dvh;            /* mobile-aware */
	min-height: 100vh;
	min-height: 100dvh;
	max-width: none;
	margin: 0;
	background: #000;
	overflow: hidden;
	isolation: isolate;
}
.bd-player--full .bd-player__bg {
	position: absolute;
	inset: 0;
	background-size: cover;
	background-position: center;
	filter: blur(36px) brightness(.55);
	transform: scale(1.15);
	z-index: 0;
}
.bd-player--full .bd-player__video {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;        /* fill the screen vertically */
	z-index: 1;
	background: transparent;
}
.bd-player--full .bd-player__bigplay {
	position: absolute;
	left: 50%; top: 50%;
	transform: translate(-50%, -50%);
	width: 96px; height: 96px;
	border-radius: 50%;
	background: rgba(255,255,255,.16);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	border: 1px solid rgba(255,255,255,.22);
	color: #fff;
	display: inline-flex;
	align-items: center; justify-content: center;
	z-index: 4;
	cursor: pointer;
	transition: opacity .25s, transform .25s, background .15s;
}
.bd-player--full.is-playing .bd-player__bigplay {
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -50%) scale(.8);
}

.bd-player__topbar {
	position: absolute;
	top: 0; left: 0; right: 0;
	z-index: 5;
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 16px 18px;
	background: linear-gradient(180deg, rgba(0,0,0,.6) 0%, transparent 100%);
}
.bd-player__back {
	width: 40px; height: 40px;
	display: inline-flex; align-items: center; justify-content: center;
	background: rgba(0,0,0,.45);
	border: 1px solid rgba(255,255,255,.18);
	color: #fff;
	border-radius: 50%;
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.bd-player__title-top {
	flex: 1;
	font-size: 16px;
	font-weight: 700;
	color: #fff;
	margin: 0;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	letter-spacing: -.01em;
}
.bd-player__epchip {
	display: inline-flex;
	align-items: center;
	padding: 6px 14px;
	border-radius: var(--bd-r-pill);
	background: rgba(0,0,0,.55);
	border: 1px solid rgba(255,255,255,.2);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
	color: #fff;
	font-size: 13px;
	font-weight: 600;
	letter-spacing: .01em;
}
.bd-player__epchip strong { font-weight: 800; }

.bd-player__controls {
	position: absolute;
	left: 0; right: 0; bottom: 0;
	z-index: 5;
	background: linear-gradient(0deg, rgba(0,0,0,.7) 0%, transparent 100%);
	padding: 18px 18px 24px;
}
.bd-player__progress {
	width: 100%;
	height: 14px;
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	cursor: pointer;
	margin-bottom: 8px;
}
.bd-player__progress::-webkit-slider-runnable-track {
	height: 3px;
	background: linear-gradient(to right, var(--bd-primary-300) var(--bd-played, 0%), rgba(255,255,255,.25) var(--bd-played, 0%));
	border-radius: 2px;
}
.bd-player__progress::-moz-range-track    { height: 3px; background: rgba(255,255,255,.25); border-radius: 2px; }
.bd-player__progress::-moz-range-progress { height: 3px; background: var(--bd-primary-300); border-radius: 2px; }
.bd-player__progress::-webkit-slider-thumb {
	-webkit-appearance: none; appearance: none;
	width: 12px; height: 12px;
	background: #fff; border-radius: 50%; margin-top: -4px;
	box-shadow: 0 0 0 4px rgba(91,124,255,.35);
}
.bd-player__progress::-moz-range-thumb { width: 12px; height: 12px; background: #fff; border: none; border-radius: 50%; }

.bd-player__controlrow {
	display: flex;
	align-items: center;
	gap: 12px;
	color: #fff;
}
.bd-player__btn {
	width: 36px; height: 36px;
	display: inline-flex; align-items: center; justify-content: center;
	background: transparent;
	border: 0;
	color: #fff;
	cursor: pointer;
	border-radius: 50%;
}
.bd-player__btn:hover { background: rgba(255,255,255,.08); }
.bd-player__time {
	font-size: 13px;
	font-variant-numeric: tabular-nums;
	color: rgba(255,255,255,.85);
	margin-left: 4px;
}
.bd-player__spacer { flex: 1; }

/* Hide the previous side rail / bottom title — they're replaced by the
   new full-viewport overlay. */
.bd-player--full .bd-player__rail,
.bd-player--full .bd-player__bottom,
.bd-player--full .bd-player__phone,
.bd-player--full .bd-popover { display: none; }

/* Locked overlay tuned for full viewport */
.bd-player--full .bd-player__locked {
	z-index: 6;
	gap: 12px;
}

/* DRAWER (episodes / settings) ----------------------------- */
.bd-drawer {
	position: absolute;
	left: 0; right: 0; bottom: 0; top: 0;
	z-index: 10;
	background: rgba(8,10,26,.95);
	backdrop-filter: blur(14px);
	-webkit-backdrop-filter: blur(14px);
	display: flex;
	flex-direction: column;
	color: var(--bd-text);
}
.bd-drawer[hidden] { display: none; }
.bd-drawer__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 18px 20px;
	border-bottom: 1px solid var(--bd-border);
}
.bd-drawer__head h3 { margin: 0; font-size: 18px; font-weight: 800; letter-spacing: -.01em; }
.bd-drawer__close {
	width: 36px; height: 36px;
	display: inline-flex; align-items: center; justify-content: center;
	background: rgba(255,255,255,.06);
	border: 1px solid var(--bd-border);
	border-radius: 50%;
	color: var(--bd-text);
	cursor: pointer;
}
.bd-drawer__body { flex: 1; overflow-y: auto; padding: 16px 20px 24px; }
.bd-drawer__body .bd-popover__grid { display: grid; grid-template-columns: repeat(8, 1fr); gap: 8px; margin: 0 0 24px; }
@media (max-width: 600px) { .bd-drawer__body .bd-popover__grid { grid-template-columns: repeat(5, 1fr); } }
.bd-drawer__body .bd-popover__grid button {
	aspect-ratio: 1 / 1;
	border-radius: 8px;
	background: rgba(255,255,255,.06);
	border: 1px solid transparent;
	color: var(--bd-text);
	font-size: 13px;
	font-weight: 700;
	cursor: pointer;
	font-family: var(--bd-font);
	position: relative;
}
.bd-drawer__body .bd-popover__grid button.is-locked { color: var(--bd-text-muted); background: rgba(255,255,255,.025); }
.bd-drawer__body .bd-popover__grid button.is-current { background: var(--bd-primary-500); color: #fff; border-color: var(--bd-primary-300); }

.bd-settings-row { margin-bottom: 16px; }
.bd-settings-row__btn {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 14px 16px;
	border-radius: var(--bd-r-md);
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border);
	color: var(--bd-text);
	font-family: var(--bd-font);
	font-size: 15px;
	font-weight: 600;
	cursor: pointer;
}
.bd-settings-row__btn:hover { background: rgba(255,255,255,.08); }
.bd-settings-section {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--bd-text-muted);
	margin: 16px 0 8px;
}
.bd-settings-list { list-style: none; margin: 0; padding: 0; }
.bd-settings-list li button {
	display: flex; width: 100%;
	align-items: center; justify-content: space-between;
	padding: 12px 14px;
	background: transparent;
	border: 0;
	color: var(--bd-text);
	font-family: var(--bd-font);
	font-size: 15px;
	cursor: pointer;
	border-radius: var(--bd-r-md);
}
.bd-settings-list li button:hover { background: rgba(255,255,255,.06); }
.bd-settings-list li button.is-active { color: var(--bd-primary-200); font-weight: 700; }
.bd-settings-list li button.is-active::after { content: "✓"; }

.bd-watch__eplist {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-direction: column; gap: 8px;
}
.bd-watch__epitem {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px;
	border-radius: var(--bd-r-md);
	background: rgba(255,255,255,.025);
	border: 1px solid transparent;
	color: inherit;
	transition: background .15s, border-color .15s;
}
.bd-watch__epitem:hover { background: rgba(255,255,255,.05); border-color: var(--bd-border-strong); }
.bd-watch__epitem.is-current { background: rgba(26,76,255,.14); border-color: var(--bd-primary-400); }
.bd-watch__epitem-thumb {
	position: relative;
	flex: 0 0 auto;
	width: 56px; aspect-ratio: 2 / 3;
	border-radius: var(--bd-r-sm);
	overflow: hidden;
	background: var(--bd-bg-2);
	border: 1px solid var(--bd-border);
}
.bd-watch__epitem-thumb img { width: 100%; height: 100%; object-fit: cover; opacity: .9; }
.bd-watch__epitem.is-locked .bd-watch__epitem-thumb img { opacity: .45; }
.bd-watch__epitem-num {
	position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);
	font-size: 18px; font-weight: 900; color: #fff;
	text-shadow: 0 1px 3px rgba(0,0,0,.7);
}
.bd-watch__epitem-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.bd-watch__epitem-title { font-size: 14px; font-weight: 600; }
.bd-watch__epitem-tag {
	font-size: 11px; font-weight: 700;
	letter-spacing: .08em; text-transform: uppercase;
	color: var(--bd-text-muted);
}
.bd-watch__epitem.is-current .bd-watch__epitem-tag { color: var(--bd-primary-200); }
.bd-watch__epitem.is-free    .bd-watch__epitem-tag { color: var(--bd-primary-300); }
.bd-watch__epitem-icon { color: var(--bd-text-muted); }

/* ============================================================
   PRICING — Features card / Award block / Reviews
   ============================================================ */
.bd-pricing-extras {
	margin-top: 24px;
	padding-top: 24px;
	border-top: 1px solid var(--bd-border);
}
.bd-pricing-extras__head { text-align: center; margin-bottom: 16px; }
.bd-pricing-extras__head h3 {
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0 0 8px;
}
.bd-pricing-extras__exclusive {
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: #ffd76a;
	margin: 0;
}
.bd-pricing-features {
	background: linear-gradient(135deg, rgba(91,124,255,.18), rgba(91,124,255,.08));
	border: 1px solid rgba(91,124,255,.35);
	border-radius: var(--bd-r-xl);
	padding: 22px 22px 18px;
	margin-bottom: 28px;
}
.bd-pricing-features h4 {
	font-size: 16px;
	font-weight: 800;
	margin: 0 0 14px;
	color: #fff;
	letter-spacing: -.01em;
	line-height: 1.3;
}
.bd-pricing-features ul { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 10px; }
.bd-pricing-features li {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	font-size: 13.5px;
	color: var(--bd-text-soft);
	line-height: 1.45;
}
.bd-pricing-features__star { color: #ffd76a; font-size: 14px; line-height: 1; padding-top: 1px; }

.bd-pricing-award {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	color: #ffd76a;
	margin: 8px 0 4px;
}
.bd-pricing-award__core { text-align: center; padding: 0 6px; }
.bd-pricing-award__num {
	font-size: 28px;
	font-weight: 800;
	color: #fff;
	margin: 0;
	line-height: 1;
	letter-spacing: -.02em;
}
.bd-pricing-award__num strong { font-size: 36px; color: #ffd76a; }
.bd-pricing-award__title {
	font-family: serif;
	font-style: italic;
	font-size: 18px;
	font-weight: 700;
	color: #fff;
	margin: 4px 0 0;
	line-height: 1.15;
}
.bd-pricing-award__caption {
	text-align: center;
	font-size: 14px;
	font-weight: 600;
	color: var(--bd-text);
	margin: 14px 0 18px;
}
.bd-pricing-award__caption small {
	display: block;
	font-size: 11px;
	color: var(--bd-text-muted);
	font-weight: 500;
	margin-top: 4px;
	letter-spacing: .04em;
}

.bd-pricing-reviews { margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--bd-border); }
.bd-pricing-reviews__head { text-align: center; margin-bottom: 18px; }
.bd-pricing-reviews__head h3 {
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0 0 6px;
}
.bd-pricing-reviews__head p { color: #22c55e; font-size: 14px; font-weight: 600; margin: 0; }

.bd-review {
	background: #fff;
	color: #1a1a1a;
	border-radius: var(--bd-r-xl);
	padding: 16px 18px 18px;
	margin-bottom: 14px;
	box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
.bd-review__head { display: flex; align-items: center; gap: 12px; margin-bottom: 10px; }
.bd-review__avatar {
	width: 36px; height: 36px;
	display: inline-flex; align-items: center; justify-content: center;
	border-radius: 50%;
	background: linear-gradient(135deg, #1a4cff, #5b7cff);
	color: #fff;
	font-weight: 800;
	font-size: 16px;
}
.bd-review__name { display: block; font-size: 14.5px; color: #1a1a1a; }
.bd-review__date { display: block; font-size: 12px; color: #666; }
.bd-review__stars { display: inline-flex; gap: 1px; padding: 4px 6px; background: #00b67a; border-radius: 3px; margin-bottom: 10px; }
.bd-review__star { color: #fff; font-size: 14px; line-height: 1; }
.bd-review__text {
	font-size: 13.5px;
	color: #2a2a2a;
	line-height: 1.55;
	margin: 0;
}

/* ============================================================
   ADMIN DEBUG PANEL on player page
   ============================================================ */
.bd-debug--lock { color: #ff6b6b !important; font-weight: 800; }
.bd-debug--free { color: #22c55e !important; font-weight: 800; }
.bd-debug__url { word-break: break-all; max-width: 360px; display: inline-block; }
.bd-debug {
	position: fixed;
	top: 90px; right: 12px;
	z-index: 9999;
	max-width: 420px;
	background: rgba(0, 0, 0, .94);
	border: 2px solid rgba(255, 215, 106, .75);
	color: #fff;
	font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	font-size: 12px;
	padding: 12px 14px;
	border-radius: 10px;
	display: flex;
	flex-direction: column;
	gap: 4px;
	box-shadow: 0 12px 36px -8px rgba(0, 0, 0, .7);
	pointer-events: auto;
}
.bd-debug strong {
	color: #ffd76a;
	font-size: 11px;
	letter-spacing: .14em;
	text-transform: uppercase;
	font-family: var(--bd-font);
	margin-bottom: 4px;
}
.bd-debug code {
	background: rgba(255, 255, 255, .08);
	color: #95acff;
	padding: 1px 6px;
	border-radius: 4px;
	font-size: 11.5px;
	word-break: break-all;
}
.bd-debug a { color: #95acff; font-size: 11px; margin-top: 4px; }

/* ============================================================
   PRICING CARD LAYOUT v2 — BIG daily right, small totals left
   ============================================================ */
.bd-plan {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 18px 20px 20px;
	border: 2px solid var(--bd-border-strong);
	border-radius: var(--bd-r-lg);
	background: rgba(255,255,255,.03);
	cursor: pointer;
	transition: border-color .2s, background .2s;
	color: inherit;
	text-align: left;
	font-family: var(--bd-font);
	position: relative;
	min-height: 96px;
}
.bd-plan.is-popular {
	border-color: var(--bd-primary-400);
	background: linear-gradient(135deg, rgba(91,124,255,.30), rgba(26,76,255,.18));
}
.bd-plan.is-best {
	border-color: rgba(91,124,255,.45);
	background: rgba(255,255,255,.04);
}
.bd-plan.is-selected { box-shadow: 0 0 0 3px rgba(91,124,255,.45); }
.bd-plan__topbadge {
	position: absolute;
	top: -11px; left: 50%; transform: translateX(-50%);
	background: linear-gradient(135deg, #ff3d8c, #b324ff);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .04em;
	padding: 4px 14px;
	border-radius: var(--bd-r-pill);
	box-shadow: 0 6px 16px -6px rgba(255,61,140,.55);
	white-space: nowrap;
}
.bd-plan.is-best .bd-plan__topbadge {
	background: rgba(255,255,255,.18);
	color: #fff;
	font-weight: 600;
	letter-spacing: .02em;
	box-shadow: none;
}
.bd-plan__radio {
	flex: 0 0 auto;
	width: 20px; height: 20px;
	border-radius: 50%;
	border: 2px solid rgba(255,255,255,.35);
	background: transparent;
	position: relative;
}
.bd-plan.is-selected .bd-plan__radio {
	border-color: #fff;
	background: #fff;
}
.bd-plan.is-selected .bd-plan__radio::after {
	content: "";
	position: absolute;
	left: 50%; top: 50%;
	width: 7px; height: 4px;
	border-left: 2px solid var(--bd-primary-500);
	border-bottom: 2px solid var(--bd-primary-500);
	transform: translate(-50%, -65%) rotate(-45deg);
}

/* LEFT side — name + sub + savings + tiny totals */
.bd-plan__main {
	flex: 1;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.bd-plan__name {
	font-size: 15px;
	font-weight: 700;
	color: #fff;
	letter-spacing: .02em;
	line-height: 1.2;
}
.bd-plan__sub {
	font-size: 11.5px;
	font-weight: 600;
	color: var(--bd-primary-200);
	letter-spacing: .04em;
}
.bd-plan__savings {
	display: inline-flex;
	align-items: center;
	width: fit-content;
	font-size: 10px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--bd-primary-200);
	background: transparent;
	padding: 0;
	border-radius: 0;
	margin-top: 2px;
}
.bd-plan__totals {
	margin-top: 6px;
	font-size: 13.5px;
	color: var(--bd-text-muted);
	display: flex;
	align-items: baseline;
	gap: 8px;
}
.bd-plan__totals s        { color: var(--bd-text-muted); opacity: .6; font-weight: 500; }
.bd-plan__totals strong   { color: #fff; font-weight: 700; }

/* RIGHT side — BIG daily amount */
.bd-plan__price {
	flex: 0 0 auto;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	text-align: right;
	gap: 2px;
}
.bd-plan__price-old {
	font-size: 12.5px;
	color: var(--bd-text-muted);
	text-decoration: line-through;
	opacity: .65;
	margin-bottom: 0;
	line-height: 1.1;
}
.bd-plan__price-new {
	font-size: 30px;
	font-weight: 900;
	color: #fff;
	letter-spacing: -.025em;
	line-height: 1;
	margin: 2px 0 0;
}
.bd-plan.is-popular .bd-plan__price-new { color: #fff; }
.bd-plan__daily-label {
	font-size: 11px;
	color: var(--bd-text-muted);
	font-weight: 500;
	letter-spacing: .02em;
	margin-top: 2px;
}

/* ============================================================
   ACCESS-STATE OVERRIDE
   When updateAccessState() decides the episode is playable, it adds
   .bd-can-play to <body>. This CSS hides the locked overlay with
   maximum specificity so no leftover style or stale attribute can
   ever leave the overlay visible.
   ============================================================ */
body.bd-can-play .bd-player__locked,
body.bd-can-play [data-bd-locked-overlay] {
	display: none !important;
	opacity: 0 !important;
	pointer-events: none !important;
	visibility: hidden !important;
}

body.bd-is-locked .bd-player__locked,
body.bd-is-locked [data-bd-locked-overlay] {
	display: flex !important;
	opacity: 1 !important;
	pointer-events: auto !important;
	visibility: visible !important;
}

/* Reduce motion */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .01ms !important;
	}
}

/* ============================================================
   CONNECT BUTTON + ACCOUNT DROPDOWN
   The [hidden] attribute is enforced ONLY on these specific elements
   so it doesn't override the mobile-menu drawer's slide animation,
   which intentionally keeps display:flex while hidden=true.
   ============================================================ */
.bd-account[hidden], .bd-connect-btn[hidden],
[data-bd-show-when][hidden] { display: none !important; }

.bd-connect-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	white-space: nowrap;
	padding: 6px 12px 6px 10px !important;
	font-size: 12.5px !important;
	height: 34px;
	border-radius: 999px !important;
}
.bd-connect-btn svg { flex-shrink: 0; width: 12px; height: 12px; }
@media (max-width: 540px) {
	.bd-connect-btn { padding: 0 !important; width: 34px; justify-content: center; }
	.bd-connect-btn span { display: none; }
}

.bd-account { position: relative; }
.bd-account:not([hidden]) { display: inline-block; }
.bd-account__btn {
	width: 40px; height: 40px;
	background: transparent;
	border: 0;
	padding: 0;
	cursor: pointer;
	border-radius: 50%;
	transition: transform .15s;
}
.bd-account__btn:hover { transform: scale(1.06); }
.bd-account__avatar {
	display: inline-flex;
	width: 38px; height: 38px;
	border-radius: 50%;
	background: linear-gradient(135deg, #5B7CFF 0%, #1A4CFF 100%);
	color: #fff;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .02em;
	box-shadow: 0 4px 14px -4px rgba(26,76,255,.6);
	border: 2px solid rgba(255,255,255,.12);
}

.bd-account__menu {
	position: absolute;
	right: 0;
	top: calc(100% + 10px);
	width: 260px;
	background: rgba(8,11,22,.98);
	border: 1px solid var(--bd-border-strong);
	border-radius: 14px;
	-webkit-backdrop-filter: blur(20px) saturate(160%);
	backdrop-filter: blur(20px) saturate(160%);
	box-shadow: 0 24px 50px -14px rgba(0,0,0,.7);
	padding: 8px;
	z-index: 65;
	animation: bd-account-pop .18s ease;
}
@keyframes bd-account-pop {
	from { opacity: 0; transform: translateY(-6px); }
	to   { opacity: 1; transform: translateY(0); }
}
.bd-account__menu[hidden] { display: none; }
.bd-account__head {
	padding: 12px 12px 14px;
	border-bottom: 1px solid var(--bd-border);
	margin-bottom: 6px;
}
.bd-account__email {
	display: block;
	font-size: 13px;
	font-weight: 600;
	color: var(--bd-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bd-account__plan {
	display: inline-block;
	margin-top: 4px;
	font-size: 10.5px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: rgba(255,255,255,.6);
}
.bd-account__plan.is-vip {
	color: #1a0c00;
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	padding: 3px 8px;
	border-radius: 999px;
}
.bd-account__item {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 10px 12px;
	border: 0;
	background: transparent;
	color: var(--bd-text-soft);
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
	border-radius: 8px;
	text-decoration: none;
	font-family: inherit;
}
.bd-account__item:hover { background: rgba(255,255,255,.06); color: var(--bd-text); }
.bd-account__item svg { flex-shrink: 0; opacity: .85; }
.bd-account__item--upgrade {
	color: #ffd76a;
	margin: 6px 0;
	background: linear-gradient(135deg, rgba(255,215,106,.1), rgba(255,154,60,.06));
	border: 1px solid rgba(255,215,106,.2);
}
.bd-account__item--upgrade:hover { background: linear-gradient(135deg, rgba(255,215,106,.18), rgba(255,154,60,.1)); }
.bd-account__item--logout {
	margin-top: 6px;
	border-top: 1px solid var(--bd-border);
	padding-top: 12px;
	color: #ff6b6b;
	border-radius: 0 0 8px 8px;
}
.bd-account__item--logout:hover {
	background: rgba(255,107,107,.1);
	color: #ff8585;
}

/* Mobile menu mirrors */
.bd-mobile-menu__connect {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	padding: 13px 16px;
	background: linear-gradient(135deg, #5B7CFF, #1A4CFF);
	border: 0;
	border-radius: 12px;
	color: #fff;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
	margin-bottom: 8px;
	box-shadow: 0 8px 22px -8px rgba(26,76,255,.6);
}
.bd-mobile-menu__profile {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 10px 14px !important;
	border-radius: 12px !important;
	background: rgba(91,124,255,.08);
	border: 1px solid rgba(91,124,255,.18);
	margin-bottom: 8px;
}
.bd-mobile-menu__profile small {
	display: block;
	font-size: 11.5px;
	color: rgba(255,255,255,.55);
	margin-bottom: 2px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	max-width: 200px;
}
.bd-mobile-menu__profile strong {
	font-size: 14px;
	color: var(--bd-text);
	font-weight: 700;
}
.bd-langs {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 6px;
	padding: 0 4px;
}
.bd-langs button {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 10px 12px;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border);
	border-radius: 10px;
	color: var(--bd-text-soft);
	font-family: inherit;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	text-align: left;
}
.bd-langs button:hover { background: rgba(91,124,255,.12); color: #fff; border-color: rgba(91,124,255,.35); }
.bd-langs button.is-active {
	background: linear-gradient(135deg, rgba(91,124,255,.22), rgba(26,76,255,.08));
	border-color: var(--bd-primary-400);
	color: #fff;
}

/* RTL support — hand back the right padding/margin pairs */
html[dir="rtl"] {
	direction: rtl;
}
html[dir="rtl"] .bd-mobile-menu {
	left: auto;
	right: 0;
	border-right: 0;
	border-left: 1px solid var(--bd-border);
	box-shadow: -16px 0 40px -10px rgba(0,0,0,.55);
	transform: translateX(100%);
}
html[dir="rtl"] .bd-mobile-menu.is-open { transform: translateX(0); }
html[dir="rtl"] .bd-account__menu { right: auto; left: 0; }
html[dir="rtl"] .bd-show__heart { right: auto; left: 8px; }
html[dir="rtl"] .bd-mobile-menu__rail:hover  { transform: translateX(-2px); }
html[dir="rtl"] .bd-hamburger { margin-right: 0; margin-left: 4px; }

.bd-mobile-menu__logout {
	display: flex;
	align-items: center;
	gap: 10px;
	width: 100%;
	margin-top: 12px;
	padding: 13px 14px;
	background: rgba(255,107,107,.08);
	border: 1px solid rgba(255,107,107,.22);
	border-radius: 12px;
	color: #ff7a7a;
	font-size: 14px;
	font-weight: 700;
	cursor: pointer;
}
.bd-mobile-menu__logout:hover { background: rgba(255,107,107,.16); }

/* ============================================================
   AUTH MODAL — email-only sign-in
   ============================================================ */
.bd-auth {
	position: fixed;
	inset: 0;
	z-index: 320;
	display: flex;
	align-items: center;
	justify-content: center;
}
.bd-auth[hidden] { display: none; }
.bd-auth__back {
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,.72);
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}
.bd-auth__panel {
	position: relative;
	width: min(440px, calc(100vw - 32px));
	max-height: calc(100vh - 32px);
	overflow: auto;
	background: linear-gradient(180deg, #0f1428 0%, #0a0e1e 100%);
	color: #fff;
	border: 1px solid rgba(255,255,255,.08);
	border-radius: 22px;
	padding: 32px 28px 24px;
	text-align: center;
	box-shadow: 0 30px 80px -10px rgba(0,0,0,.7);
	animation: bd-auth-pop .25s cubic-bezier(.4,0,.2,1);
}
@keyframes bd-auth-pop {
	from { opacity: 0; transform: scale(.95) translateY(10px); }
	to   { opacity: 1; transform: scale(1) translateY(0); }
}
.bd-auth__close {
	position: absolute;
	top: 14px; right: 14px;
	width: 34px; height: 34px;
	background: rgba(255,255,255,.06);
	border: 0;
	border-radius: 50%;
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	z-index: 2;
}
.bd-auth__close:hover { background: rgba(255,255,255,.14); }
.bd-auth__brand {
	display: flex;
	justify-content: center;
	margin-bottom: 14px;
}
.bd-auth__brand svg { filter: drop-shadow(0 8px 24px rgba(26,76,255,.6)); }
.bd-auth__title {
	margin: 0 0 8px;
	font-size: 24px;
	font-weight: 800;
	letter-spacing: -.01em;
	color: #fff;
}
.bd-auth__sub {
	margin: 0 0 22px;
	font-size: 14px;
	line-height: 1.55;
	color: rgba(255,255,255,.7);
}
.bd-auth__form {
	display: flex;
	flex-direction: column;
	gap: 10px;
	text-align: left;
}
.bd-auth__form input[type="email"] {
	width: 100%;
	height: 52px;
	padding: 0 16px;
	background: rgba(255,255,255,.06);
	border: 1px solid rgba(255,255,255,.12);
	border-radius: 12px;
	color: #fff;
	font-size: 15px;
	font-family: inherit;
	outline: none;
	transition: border-color .15s, background .15s;
}
.bd-auth__form input[type="email"]::placeholder { color: rgba(255,255,255,.4); }
.bd-auth__form input[type="email"]:focus {
	border-color: #5B7CFF;
	background: rgba(91,124,255,.08);
	box-shadow: 0 0 0 4px rgba(91,124,255,.16);
}
.bd-auth__submit {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	height: 52px;
	background: linear-gradient(135deg, #5B7CFF 0%, #1A4CFF 100%);
	color: #fff;
	border: 0;
	border-radius: 12px;
	font-size: 15px;
	font-weight: 800;
	cursor: pointer;
	box-shadow: 0 10px 28px -8px rgba(26,76,255,.6);
	transition: transform .15s, box-shadow .15s;
}
.bd-auth__submit:hover {
	transform: translateY(-1px);
	box-shadow: 0 14px 34px -8px rgba(26,76,255,.7);
}
.bd-auth__error {
	color: #ff6b6b;
	font-size: 13px;
	margin: 0;
	padding: 0 4px;
}
.bd-auth__perks {
	list-style: none;
	margin: 22px 0 14px;
	padding: 14px 16px;
	background: rgba(91,124,255,.07);
	border: 1px solid rgba(91,124,255,.18);
	border-radius: 12px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	text-align: left;
}
.bd-auth__perks li {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 13.5px;
	color: rgba(255,255,255,.85);
}
.bd-auth__perks svg {
	color: #5B7CFF;
	background: rgba(91,124,255,.15);
	width: 22px; height: 22px;
	border-radius: 50%;
	padding: 4px;
	flex-shrink: 0;
}
.bd-auth__legal {
	font-size: 11.5px;
	color: rgba(255,255,255,.45);
	margin: 0;
}
body.bd-auth-open { overflow: hidden; }

/* ============================================================
   INTRO SPLASH — Netflix-style 2-second spinning ring around logo
   ============================================================ */
.bd-splash {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #04060f;
	overflow: hidden;
	transition: opacity .4s ease;
}
.bd-splash.is-done { opacity: 0; pointer-events: none; }
.bd-splash[hidden] { display: none; }
.bd-splash__bg {
	position: absolute;
	inset: 0;
	background:
		radial-gradient(circle at 50% 50%, rgba(26,76,255,.35), transparent 55%),
		radial-gradient(circle at 50% 50%, rgba(91,124,255,.15), transparent 70%);
}
.bd-splash__center {
	position: relative;
	z-index: 2;
	width: 120px; height: 120px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.bd-splash__ring {
	position: absolute;
	inset: 0;
	border-radius: 50%;
	border: 3px solid rgba(91,124,255,.18);
	border-top-color: #5B7CFF;
	border-right-color: #1A4CFF;
	animation: bd-splash-spin 1.1s linear infinite;
	box-shadow: 0 0 60px rgba(26,76,255,.5);
}
@keyframes bd-splash-spin {
	to { transform: rotate(360deg); }
}
.bd-splash__logo svg {
	filter: drop-shadow(0 8px 24px rgba(26,76,255,.6));
	animation: bd-splash-pulse 1.4s ease-in-out infinite;
}
@keyframes bd-splash-pulse {
	0%, 100% { transform: scale(1);    opacity: 1; }
	50%      { transform: scale(.92);  opacity: .8; }
}

/* ============================================================
   FANDOM — archive grid + single article
   ============================================================ */
.bd-fandom-hero {
	padding: 60px 0 36px;
	text-align: center;
	background: radial-gradient(ellipse at top, rgba(26,76,255,.18), transparent 60%), var(--bd-bg);
	border-bottom: 1px solid var(--bd-border);
}
.bd-fandom-hero__title {
	font-size: clamp(28px, 4vw, 42px);
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 8px 0 10px;
	background: linear-gradient(120deg, #fff 0%, #c4d2ff 65%, #5B7CFF 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.bd-fandom-hero__lede {
	max-width: 540px;
	margin: 0 auto;
	color: var(--bd-text-soft);
	font-size: 14.5px;
	line-height: 1.55;
}

.bd-fandom-grid {
	display: grid;
	gap: 20px;
	grid-template-columns: 1fr;
}
@media (min-width: 540px)  { .bd-fandom-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 900px)  { .bd-fandom-grid { grid-template-columns: repeat(3, 1fr); } }
@media (min-width: 1280px) { .bd-fandom-grid { grid-template-columns: repeat(4, 1fr); } }
.bd-fandom-grid--compact { gap: 14px; }

.bd-fandom-card {
	background: var(--bd-bg-2);
	border: 1px solid var(--bd-border);
	border-radius: 16px;
	overflow: hidden;
	transition: transform .2s, border-color .2s, box-shadow .2s;
}
.bd-fandom-card:hover {
	transform: translateY(-3px);
	border-color: rgba(91,124,255,.4);
	box-shadow: 0 18px 36px -16px rgba(26,76,255,.5);
}
.bd-fandom-card__link {
	display: block;
	color: inherit;
	text-decoration: none;
}
.bd-fandom-card__poster {
	position: relative;
	aspect-ratio: 16 / 11;
	background: var(--bd-bg);
	overflow: hidden;
}
.bd-fandom-card__poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bd-fandom-card__cta {
	position: absolute;
	top: 12px; right: 12px;
	width: 32px; height: 32px;
	border-radius: 50%;
	background: rgba(0,0,0,.65);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.bd-fandom-card__body { padding: 14px 16px 16px; }
.bd-fandom-card__date {
	display: block;
	font-size: 11px;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--bd-text-muted);
	margin-bottom: 4px;
}
.bd-fandom-card__title {
	font-size: 16px;
	font-weight: 700;
	margin: 0 0 4px;
	line-height: 1.25;
	color: var(--bd-text);
	letter-spacing: -.005em;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.bd-fandom-card__series { font-size: 12.5px; color: var(--bd-text-muted); margin: 0; }

.bd-fandom-pagination {
	display: flex;
	gap: 6px;
	justify-content: center;
	margin-top: 32px;
}
.bd-fandom-pagination a, .bd-fandom-pagination span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 36px;
	height: 36px;
	padding: 0 12px;
	border-radius: 8px;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border);
	color: var(--bd-text-soft);
	font-weight: 600;
	font-size: 13px;
	text-decoration: none;
}
.bd-fandom-pagination .current { background: var(--bd-primary-500); border-color: var(--bd-primary-500); color: #fff; }
.bd-fandom-pagination a:hover { background: rgba(91,124,255,.16); color: #fff; }

/* Single fandom post */
.bd-fandom-post__hero {
	position: relative;
	padding: 90px 0 56px;
	background: center / cover no-repeat var(--bd-bg);
	min-height: 320px;
	display: flex;
	align-items: flex-end;
}
.bd-fandom-post__hero-overlay {
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(4,6,15,.4) 0%, rgba(4,6,15,.85) 80%, var(--bd-bg) 100%);
}
.bd-fandom-post__hero-inner { position: relative; z-index: 1; width: 100%; }
.bd-fandom-post__title {
	font-size: clamp(28px, 5vw, 48px);
	font-weight: 800;
	letter-spacing: -.025em;
	color: #fff;
	margin: 6px 0 10px;
	max-width: 820px;
	line-height: 1.05;
	text-shadow: 0 4px 24px rgba(0,0,0,.6);
}
.bd-fandom-post__meta {
	color: rgba(255,255,255,.78);
	font-size: 13px;
	margin: 0;
}
.bd-fandom-post__meta a { color: var(--bd-primary-300); }

.bd-fandom-post__grid {
	display: grid;
	gap: 28px;
	grid-template-columns: 1fr;
}
@media (min-width: 980px) {
	.bd-fandom-post__grid { grid-template-columns: minmax(0, 1fr) 300px; gap: 36px; }
}
.bd-fandom-post__body {
	font-size: 16px;
	line-height: 1.7;
	color: var(--bd-text-soft);
}
.bd-fandom-post__body p { margin: 0 0 16px; }
.bd-fandom-post__body h2, .bd-fandom-post__body h3 {
	color: var(--bd-text);
	font-weight: 800;
	letter-spacing: -.01em;
	margin: 28px 0 12px;
}
.bd-fandom-post__body h2 { font-size: 22px; }
.bd-fandom-post__body h3 { font-size: 18px; }
.bd-fandom-post__body img, .bd-fandom-post__body figure {
	max-width: 100%;
	height: auto;
	border-radius: 14px;
	margin: 16px 0;
}
.bd-fandom-post__body a { color: var(--bd-primary-300); text-decoration: underline; text-underline-offset: 3px; }

/* Inline CTA at the bottom of the article */
.bd-fandom-cta {
	margin: 32px 0 0;
	padding: 20px 22px;
	background: linear-gradient(135deg, rgba(91,124,255,.14), rgba(26,76,255,.06));
	border: 1px solid rgba(91,124,255,.3);
	border-radius: 16px;
	display: flex;
	flex-wrap: wrap;
	gap: 14px;
	align-items: center;
	justify-content: space-between;
}
.bd-fandom-cta__copy { flex: 1; min-width: 220px; }
.bd-fandom-cta__copy strong { display: block; font-size: 16px; color: var(--bd-text); margin-bottom: 2px; }
.bd-fandom-cta__copy span  { font-size: 13.5px; color: var(--bd-text-muted); }

/* Sticky sidebar card */
.bd-fandom-post__aside { align-self: start; }
@media (min-width: 980px) { .bd-fandom-post__aside { position: sticky; top: 92px; } }
.bd-fandom-aside-card {
	padding: 16px;
	background: var(--bd-bg-2);
	border: 1px solid var(--bd-border);
	border-radius: 16px;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.bd-fandom-aside-card__poster {
	display: block;
	aspect-ratio: 2/3;
	border-radius: 12px;
	overflow: hidden;
	background: var(--bd-bg);
}
.bd-fandom-aside-card__poster img { width: 100%; height: 100%; object-fit: cover; }
.bd-fandom-aside-card__title { margin: 4px 0 0; font-size: 18px; font-weight: 800; letter-spacing: -.01em; color: var(--bd-text); }
.bd-fandom-aside-card__meta  { font-size: 12.5px; color: var(--bd-text-muted); margin: 0; }
.bd-fandom-aside-card__excerpt {
	font-size: 13.5px;
	color: var(--bd-text-soft);
	line-height: 1.55;
	margin: 4px 0 6px;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.bd-fandom-aside-related {
	margin-top: 18px;
	padding: 14px 16px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--bd-border);
	border-radius: 14px;
}
.bd-fandom-aside-related h4 {
	margin: 0 0 8px;
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--bd-text-muted);
}
.bd-fandom-aside-related ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 6px; }
.bd-fandom-aside-related a {
	font-size: 13px;
	color: var(--bd-text-soft);
	text-decoration: none;
	line-height: 1.4;
	display: block;
}
.bd-fandom-aside-related a:hover { color: var(--bd-text); }

/* ============================================================
   EMBED DIALOG — "Copy embed code" UI on series detail pages
   ============================================================ */
.bd-embed-dialog {
	position: fixed;
	inset: 0;
	z-index: 320;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0,0,0,.65);
	-webkit-backdrop-filter: blur(3px);
	backdrop-filter: blur(3px);
}
.bd-embed-dialog[hidden] { display: none; }
.bd-embed-dialog__panel {
	position: relative;
	width: min(480px, calc(100vw - 32px));
	background: linear-gradient(180deg, #0e1428 0%, #0a0e1e 100%);
	border: 1px solid var(--bd-border-strong);
	border-radius: 18px;
	padding: 28px 24px 22px;
	color: #fff;
	box-shadow: 0 30px 70px -10px rgba(0,0,0,.75);
	animation: bd-embed-pop .22s cubic-bezier(.34,1.56,.64,1);
}
@keyframes bd-embed-pop {
	from { opacity: 0; transform: scale(.94); }
	to   { opacity: 1; transform: scale(1); }
}
.bd-embed-dialog__close {
	position: absolute;
	top: 12px; right: 12px;
	width: 34px; height: 34px;
	border: 0; border-radius: 50%;
	background: rgba(255,255,255,.06);
	color: #fff;
	cursor: pointer;
	display: inline-flex; align-items: center; justify-content: center;
}
.bd-embed-dialog__close:hover { background: rgba(255,255,255,.14); }
.bd-embed-dialog h3 { margin: 0 0 6px; font-size: 18px; font-weight: 800; letter-spacing: -.01em; }
.bd-embed-dialog p {
	margin: 0 0 16px;
	font-size: 13.5px;
	color: var(--bd-text-soft);
	line-height: 1.55;
}
.bd-embed-dialog__code {
	width: 100%;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border-strong);
	border-radius: 10px;
	padding: 12px;
	color: #c4d2ff;
	font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
	font-size: 12px;
	line-height: 1.5;
	resize: none;
	min-height: 76px;
}
.bd-embed-dialog__code:focus { outline: none; border-color: var(--bd-primary-400); }
.bd-embed-dialog__row {
	display: flex;
	gap: 8px;
	margin-top: 14px;
	flex-wrap: wrap;
}
body.bd-embed-open { overflow: hidden; }

/* ============================================================
   QUICK ANSWER — AI Overview / Speakable target on series pages
   ============================================================ */
.bd-quick {
	padding: 28px 24px;
	background: linear-gradient(135deg, rgba(91,124,255,.08), rgba(26,76,255,.03));
	border: 1px solid rgba(91,124,255,.18);
	border-radius: 18px;
}
.bd-quick__title {
	font-size: 18px;
	font-weight: 800;
	letter-spacing: -.01em;
	margin: 0 0 18px;
	color: var(--bd-text);
}
.bd-quick__list {
	margin: 0;
	display: grid;
	gap: 14px;
}
@media (min-width: 720px) {
	.bd-quick__list { grid-template-columns: 1fr 1fr; }
}
.bd-quick__item dt {
	font-size: 13px;
	font-weight: 700;
	color: var(--bd-text);
	margin: 0 0 4px;
	letter-spacing: -.005em;
}
.bd-quick__item dd {
	margin: 0;
	font-size: 13.5px;
	line-height: 1.55;
	color: var(--bd-text-soft);
}

/* PWA install button (revealed by site.js when beforeinstallprompt fires) */
.bd-install {
	position: fixed;
	bottom: 22px;
	right: 22px;
	z-index: 60;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 11px 18px 11px 14px;
	background: linear-gradient(135deg, #5B7CFF 0%, #1A4CFF 100%);
	color: #fff;
	border: 0;
	border-radius: 999px;
	font-family: inherit;
	font-size: 13.5px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 16px 32px -10px rgba(26,76,255,.7);
	animation: bd-install-pop .35s cubic-bezier(.34,1.56,.64,1);
}
.bd-install:hover { transform: translateY(-2px); box-shadow: 0 22px 40px -12px rgba(26,76,255,.85); }
@keyframes bd-install-pop {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}
@media (max-width: 480px) {
	.bd-install {
		left: 16px; right: 16px;
		justify-content: center;
		bottom: 16px;
	}
}

/* ============================================================
   MON COMPTE — profile page
   ============================================================ */
.bd-account-page { padding: 40px 0 80px; min-height: 60vh; }
.bd-account-page__guest {
	max-width: 540px;
	margin: 40px auto;
}
.bd-account-page__guest-card {
	background: linear-gradient(180deg, #0f1428 0%, #0a0e1e 100%);
	border: 1px solid rgba(91,124,255,.2);
	border-radius: 22px;
	padding: 44px 32px;
	text-align: center;
	box-shadow: 0 30px 60px -20px rgba(26,76,255,.4);
}
.bd-account-page__guest-logo svg { filter: drop-shadow(0 12px 32px rgba(26,76,255,.5)); }
.bd-account-page__guest h1 {
	margin: 16px 0 8px;
	font-size: 24px;
	font-weight: 800;
	letter-spacing: -.01em;
}
.bd-account-page__guest p {
	color: var(--bd-text-soft);
	margin: 0 0 22px;
	font-size: 14.5px;
	line-height: 1.55;
}

.bd-account-page__head {
	display: flex;
	flex-wrap: wrap;
	gap: 18px;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 28px;
	padding: 24px;
	background: linear-gradient(135deg, rgba(91,124,255,.1), rgba(26,76,255,.04));
	border: 1px solid rgba(91,124,255,.16);
	border-radius: 20px;
}
.bd-account-page__identity {
	display: flex;
	align-items: center;
	gap: 16px;
}
.bd-account__avatar--lg {
	width: 60px; height: 60px;
	font-size: 20px;
}
.bd-account-page__head h1 {
	margin: 0;
	font-size: 22px;
	font-weight: 800;
	letter-spacing: -.01em;
}
.bd-account-page__head p {
	margin: 4px 0 0;
	font-size: 13px;
	color: var(--bd-text-muted);
}
.bd-account-page__plan {
	display: flex;
	align-items: center;
	gap: 12px;
}

.bd-account-stats {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 14px;
	margin-bottom: 32px;
}
@media (min-width: 720px) {
	.bd-account-stats { grid-template-columns: repeat(4, 1fr); }
}
.bd-account-stat {
	padding: 18px 16px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--bd-border);
	border-radius: 14px;
	text-align: center;
}
.bd-account-stat__num {
	display: block;
	font-size: 28px;
	font-weight: 900;
	letter-spacing: -.02em;
	background: linear-gradient(180deg, #fff 0%, #5B7CFF 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	margin-bottom: 4px;
}
.bd-account-stat__lbl {
	font-size: 11.5px;
	font-weight: 600;
	letter-spacing: .04em;
	color: var(--bd-text-muted);
	text-transform: uppercase;
}

.bd-account-section { margin-bottom: 36px; }
.bd-account-section__head {
	display: flex;
	align-items: baseline;
	gap: 16px;
	margin-bottom: 18px;
}
.bd-account-section__head h2 {
	margin: 0;
	font-size: 20px;
	font-weight: 800;
	letter-spacing: -.01em;
}
.bd-account-section__head p {
	margin: 0;
	color: var(--bd-text-muted);
	font-size: 13.5px;
}

.bd-account-grid {
	display: grid;
	gap: 16px;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
}
.bd-account-empty {
	grid-column: 1 / -1;
	padding: 22px 18px;
	background: rgba(255,255,255,.03);
	border: 1px dashed var(--bd-border);
	border-radius: 14px;
	font-size: 14px;
	color: var(--bd-text-muted);
	text-align: center;
}
.bd-account-empty a { color: var(--bd-primary-300); font-weight: 600; }
.bd-account-empty a:hover { text-decoration: underline; }

.bd-account-card {
	display: block;
	color: inherit;
	text-decoration: none;
}
.bd-account-card__poster {
	position: relative;
	aspect-ratio: 2/3;
	border-radius: 12px;
	overflow: hidden;
	background: var(--bd-bg-2);
	margin-bottom: 10px;
	border: 1px solid var(--bd-border);
	transition: transform .2s, border-color .2s;
}
.bd-account-card:hover .bd-account-card__poster {
	transform: translateY(-3px);
	border-color: rgba(91,124,255,.45);
}
.bd-account-card__poster img { width: 100%; height: 100%; object-fit: cover; }
.bd-account-card__progress {
	position: absolute;
	bottom: 0; left: 0; right: 0;
	height: 4px;
	background: rgba(255,255,255,.18);
}
.bd-account-card__progress span {
	display: block;
	height: 100%;
	background: linear-gradient(90deg, #5B7CFF, #00C2FF);
}
.bd-account-card__pill {
	position: absolute;
	top: 8px; left: 8px;
	background: rgba(0,0,0,.65);
	color: #fff;
	font-size: 10.5px;
	font-weight: 800;
	padding: 4px 8px;
	border-radius: 999px;
	letter-spacing: .04em;
}
.bd-account-card__title {
	font-size: 14px;
	font-weight: 700;
	margin: 0 0 2px;
	line-height: 1.3;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.bd-account-card__meta {
	font-size: 12px;
	color: var(--bd-text-muted);
	margin: 0;
}

.bd-account-card__unfav {
	position: absolute;
	top: 8px; right: 8px;
	width: 32px; height: 32px;
	border: 0;
	border-radius: 50%;
	background: rgba(0,0,0,.6);
	color: #ff5e5e;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	justify-content: center;
}
.bd-account-card__unfav:hover { background: rgba(0,0,0,.85); }

.bd-account-votes {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
	gap: 12px;
}
.bd-account-vote {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--bd-border);
	border-radius: 12px;
	color: inherit;
	text-decoration: none;
	transition: background .2s, border-color .2s;
}
.bd-account-vote:hover { background: rgba(255,255,255,.06); border-color: rgba(91,124,255,.35); }
.bd-account-vote__poster {
	width: 44px;
	aspect-ratio: 2/3;
	border-radius: 8px;
	overflow: hidden;
	background: var(--bd-bg-2);
	flex-shrink: 0;
}
.bd-account-vote__poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
.bd-account-vote__title {
	flex: 1;
	font-size: 13.5px;
	font-weight: 600;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bd-account-vote__tag {
	font-size: 11px;
	font-weight: 800;
	padding: 4px 8px;
	border-radius: 999px;
	letter-spacing: .06em;
	text-transform: uppercase;
	flex-shrink: 0;
}
.bd-account-vote__tag--like     { background: rgba(0,224,164,.16); color: #00e0a4; }
.bd-account-vote__tag--dislike  { background: rgba(255,107,107,.16); color: #ff8585; }

/* Logout zone — red, at bottom as requested */
.bd-account-page__danger {
	margin-top: 40px;
	padding: 24px;
	background: rgba(255,107,107,.04);
	border: 1px solid rgba(255,107,107,.18);
	border-radius: 16px;
	text-align: center;
}
.bd-account-page__logout {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 12px 24px;
	background: linear-gradient(135deg, #ff5e5e, #d04040);
	color: #fff;
	border: 0;
	border-radius: 12px;
	font-size: 14.5px;
	font-weight: 700;
	cursor: pointer;
	box-shadow: 0 10px 22px -8px rgba(208,64,64,.5);
	transition: transform .15s, box-shadow .15s;
	font-family: inherit;
}
.bd-account-page__logout:hover {
	transform: translateY(-1px);
	box-shadow: 0 14px 28px -8px rgba(208,64,64,.65);
}
.bd-account-page__danger p {
	margin: 12px 0 0;
	font-size: 12px;
	color: var(--bd-text-muted);
}

/* Hide upgrade button if VIP */
[data-bd-show-when-vip="off"].is-vip { display: none; }

/* ============================================================
   RATING BLOCK — prominent on series detail page (drives Google
   star rich result + matches my-drama.com hero layout)
   ============================================================ */
.bd-rating-block {
	display: inline-flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 14px;
	padding: 10px 16px;
	margin: 6px 0 14px;
	background: rgba(0,0,0,.4);
	-webkit-backdrop-filter: blur(10px);
	backdrop-filter: blur(10px);
	border: 1px solid rgba(255,215,106,.22);
	border-radius: 999px;
}
.bd-rating-block__score {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #ffd76a;
}
.bd-rating-block__score strong {
	font-size: 22px;
	font-weight: 900;
	font-variant-numeric: tabular-nums;
	letter-spacing: -.02em;
	color: #fff;
}
.bd-rating-block__score small {
	font-size: 11px;
	color: rgba(255,255,255,.55);
	margin-left: -2px;
}
.bd-rating-block__stars {
	display: inline-flex;
	gap: 1px;
	color: rgba(255,255,255,.16);
	font-size: 14px;
	line-height: 1;
}
.bd-rating-block__star--full  { color: #ffd76a; }
.bd-rating-block__star--half  {
	background: linear-gradient(90deg, #ffd76a 50%, rgba(255,255,255,.16) 50%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}
.bd-rating-block__likes {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 13px;
	color: rgba(255,255,255,.85);
	padding-left: 14px;
	border-left: 1px solid rgba(255,255,255,.12);
}
.bd-rating-block__likes svg { color: #ff6b8a; }
.bd-rating-block__likes strong { font-weight: 800; color: #fff; font-variant-numeric: tabular-nums; }

/* Rating chip — top-left of poster, mirrors my-drama.com layout */
.bd-show__rating {
	position: absolute;
	top: 8px; left: 8px;
	z-index: 3;
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 4px 8px;
	background: rgba(0,0,0,.62);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border: 1px solid rgba(255,215,106,.3);
	border-radius: 999px;
	color: #ffd76a;
	font-size: 11px;
	font-weight: 800;
	letter-spacing: .02em;
	font-variant-numeric: tabular-nums;
}
.bd-show__rating svg { color: #ffd76a; }

/* Heart button — always visible (no hover-only) + count next to it */
.bd-show__heart {
	position: absolute;
	top: 8px; right: 8px;
	min-width: 32px; height: 32px;
	padding: 0 8px;
	border: 0;
	border-radius: 999px;
	background: rgba(0,0,0,.62);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	color: #fff;
	cursor: pointer;
	display: inline-flex;
	align-items: center;
	gap: 5px;
	justify-content: center;
	transition: background .2s, color .2s, transform .15s;
	z-index: 3;
	font-family: inherit;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .02em;
}
.bd-show__heart:hover { background: rgba(255,107,107,.85); transform: scale(1.04); }
.bd-show__heart.is-fav {
	background: rgba(255,80,80,.95);
	color: #fff;
}
.bd-show__heart.is-fav svg { fill: currentColor; }
.bd-show__heart.is-fav:hover { background: rgba(220,60,60,1); }
.bd-show__heart-count {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
@media (max-width: 480px) {
	.bd-show__heart-count { display: none; }
}
.bd-show__heart.is-pulse {
	animation: bd-heart-pulse .35s cubic-bezier(.34,1.56,.64,1);
}
@keyframes bd-heart-pulse {
	0%   { transform: scale(1); }
	50%  { transform: scale(1.35); }
	100% { transform: scale(1); }
}

/* ============================================================
   CHECKOUT PAGE — professional layout with client info + trust
   ============================================================ */
.bd-checkout-hero {
	padding: 80px 0 24px;
	background: radial-gradient(ellipse at top, rgba(26,76,255,.18), transparent 60%), var(--bd-bg);
	text-align: center;
	border-bottom: 1px solid var(--bd-border);
}
.bd-checkout-hero .bd-eyebrow {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	font-size: 11.5px;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: rgba(255,255,255,.7);
	margin-bottom: 10px;
}
.bd-eyebrow__dot {
	width: 6px; height: 6px;
	border-radius: 50%;
	background: var(--bd-primary-300);
	box-shadow: 0 0 0 4px rgba(91,124,255,.18);
}
.bd-checkout-hero .bd-archive-hero__title {
	font-size: clamp(28px, 4vw, 42px);
	font-weight: 800;
	letter-spacing: -.02em;
	margin: 0;
	background: linear-gradient(120deg, #fff 0%, #c4d2ff 65%, #5B7CFF 100%);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

.bd-checkout {
	max-width: 980px;
	margin: 0 auto;
}

.bd-checkout__steps {
	display: flex;
	gap: 8px;
	list-style: none;
	padding: 0;
	margin: 0 0 28px;
	justify-content: center;
}
.bd-checkout__steps li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 14px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--bd-border);
	border-radius: 999px;
	font-size: 12.5px;
	color: var(--bd-text-muted);
	font-weight: 600;
}
.bd-checkout__steps li span {
	width: 22px; height: 22px;
	border-radius: 50%;
	background: var(--bd-border);
	color: var(--bd-text-muted);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 11px;
	font-weight: 800;
}
.bd-checkout__steps li.is-done {
	background: rgba(0,224,164,.08);
	border-color: rgba(0,224,164,.32);
	color: #00e0a4;
}
.bd-checkout__steps li.is-done span {
	background: #00e0a4;
	color: #04150f;
}
.bd-checkout__steps li.is-current {
	background: linear-gradient(135deg, rgba(91,124,255,.16), rgba(26,76,255,.06));
	border-color: rgba(91,124,255,.5);
	color: var(--bd-text);
}
.bd-checkout__steps li.is-current span {
	background: var(--bd-primary-500);
	color: #fff;
	box-shadow: 0 0 0 4px rgba(91,124,255,.18);
}

.bd-checkout__grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 22px;
	align-items: start;
}
@media (min-width: 860px) {
	.bd-checkout__grid {
		grid-template-columns: 1fr 1.1fr;
		gap: 28px;
	}
}

/* Left — summary */
.bd-checkout__summary {
	background: linear-gradient(180deg, #0e1428 0%, #0a0e1e 100%);
	border: 1px solid var(--bd-border-strong);
	border-radius: 20px;
	padding: 22px;
	position: sticky;
	top: 92px;
}
@media (max-width: 859px) { .bd-checkout__summary { position: static; } }

.bd-checkout__client {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 12px;
	background: rgba(91,124,255,.07);
	border: 1px solid rgba(91,124,255,.18);
	border-radius: 14px;
	margin-bottom: 20px;
}
.bd-checkout__avatar {
	width: 40px; height: 40px;
	border-radius: 50%;
	background: linear-gradient(135deg, #5B7CFF 0%, #1A4CFF 100%);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 800;
	flex-shrink: 0;
}
.bd-checkout__client-text { flex: 1; min-width: 0; }
.bd-checkout__client-text small {
	display: block;
	font-size: 10.5px;
	letter-spacing: .08em;
	color: var(--bd-text-muted);
	text-transform: uppercase;
	margin-bottom: 2px;
}
.bd-checkout__client-text strong {
	display: block;
	font-size: 13.5px;
	color: var(--bd-text);
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.bd-checkout__edit {
	font-size: 12.5px;
	color: var(--bd-primary-300);
	font-weight: 600;
	flex-shrink: 0;
}
.bd-checkout__edit:hover { text-decoration: underline; }

.bd-checkout__h {
	font-size: 13px;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--bd-text-muted);
	margin: 0 0 14px;
}

.bd-checkout__plan-card {
	padding: 16px;
	background: linear-gradient(135deg, rgba(26,76,255,.12), rgba(0,194,255,.05));
	border: 1px solid rgba(91,124,255,.3);
	border-radius: 14px;
	margin-bottom: 16px;
}
.bd-checkout__plan-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 6px;
}
.bd-checkout__plan-name {
	font-size: 16px;
	font-weight: 800;
	color: #fff;
	letter-spacing: -.01em;
}
.bd-checkout__plan-save {
	font-size: 10.5px;
	font-weight: 800;
	letter-spacing: .08em;
	text-transform: uppercase;
	padding: 3px 8px;
	border-radius: 999px;
	background: linear-gradient(135deg, #ffd76a, #ff9a3c);
	color: #1a0c00;
}
.bd-checkout__plan-price {
	display: flex;
	align-items: baseline;
	gap: 8px;
	font-variant-numeric: tabular-nums;
}
.bd-checkout__plan-price s {
	font-size: 13px;
	color: rgba(255,255,255,.5);
	font-weight: 600;
}
.bd-checkout__plan-price strong {
	font-size: 28px;
	font-weight: 900;
	color: #fff;
	letter-spacing: -.02em;
}
.bd-checkout__plan-price small {
	font-size: 12px;
	color: rgba(255,255,255,.65);
}

.bd-checkout__rows {
	margin: 0 0 14px;
	padding: 14px 0;
	border-top: 1px solid var(--bd-border);
	border-bottom: 1px solid var(--bd-border);
}
.bd-checkout__row {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 6px 0;
}
.bd-checkout__row dt {
	margin: 0;
	font-size: 13px;
	color: var(--bd-text-muted);
}
.bd-checkout__row dd {
	margin: 0;
	font-size: 13.5px;
	color: var(--bd-text);
	font-weight: 600;
}
.bd-checkout__row--total dt { font-weight: 700; color: var(--bd-text); }
.bd-checkout__row--total dd strong {
	font-size: 18px;
	color: #fff;
	font-weight: 900;
}

.bd-checkout__benefits {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.bd-checkout__benefits li {
	position: relative;
	padding-left: 26px;
	font-size: 13px;
	color: rgba(255,255,255,.82);
	line-height: 1.5;
}
.bd-checkout__benefits li::before {
	content: '';
	position: absolute;
	left: 0; top: 4px;
	width: 16px; height: 16px;
	border-radius: 50%;
	background:
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='20 6 9 17 4 12'/%3E%3C/svg%3E") center / 11px no-repeat,
		linear-gradient(135deg, #5B7CFF, #1A4CFF);
}

/* Right — payment form */
.bd-checkout__pay {
	background: #0a0e1e;
	border: 1px solid var(--bd-border-strong);
	border-radius: 20px;
	padding: 24px;
}
.bd-checkout__sub {
	font-size: 13.5px;
	color: var(--bd-text-muted);
	margin: 0 0 18px;
	line-height: 1.5;
}

.bd-checkout__methods {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	margin-bottom: 18px;
}
.bd-checkout__method {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 14px 8px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--bd-border);
	border-radius: 12px;
	color: var(--bd-text-muted);
	cursor: pointer;
	font-family: inherit;
	font-size: 12px;
	font-weight: 600;
	transition: background .15s, border-color .15s, color .15s;
}
.bd-checkout__method:hover { color: var(--bd-text); border-color: rgba(91,124,255,.3); }
.bd-checkout__method.is-active {
	background: linear-gradient(135deg, rgba(91,124,255,.16), rgba(26,76,255,.06));
	border-color: rgba(91,124,255,.5);
	color: var(--bd-text);
}

.bd-checkout__fields {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-bottom: 20px;
}
.bd-checkout__field {
	display: flex;
	flex-direction: column;
	gap: 6px;
}
.bd-checkout__field > span {
	font-size: 11.5px;
	font-weight: 700;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: var(--bd-text-muted);
}
.bd-checkout__field input {
	width: 100%;
	height: 46px;
	padding: 0 14px;
	background: rgba(255,255,255,.04);
	border: 1px solid var(--bd-border-strong);
	border-radius: 12px;
	color: var(--bd-text);
	font-family: inherit;
	font-size: 14.5px;
	outline: none;
	transition: border-color .15s, background .15s;
}
.bd-checkout__field input:focus {
	border-color: var(--bd-primary-400);
	background: rgba(91,124,255,.08);
	box-shadow: 0 0 0 4px rgba(91,124,255,.15);
}
.bd-checkout__field-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

.bd-checkout__submit {
	margin-bottom: 14px;
}
.bd-checkout__error {
	color: #ff6b6b;
	font-size: 13px;
	margin: 0 0 14px;
}

.bd-checkout__trust {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 8px;
	padding: 14px 10px;
	background: rgba(255,255,255,.03);
	border: 1px solid var(--bd-border);
	border-radius: 12px;
	margin-bottom: 14px;
}
.bd-checkout__trust-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	font-size: 11px;
	font-weight: 600;
	color: var(--bd-text-muted);
	text-align: center;
}
.bd-checkout__trust-item svg { color: var(--bd-primary-300); }

.bd-checkout__legal {
	font-size: 11.5px;
	color: var(--bd-text-muted);
	line-height: 1.55;
	margin: 0 0 14px;
}
.bd-checkout__legal a { color: var(--bd-primary-300); text-decoration: underline; }
.bd-checkout__cancel {
	display: block;
	text-align: center;
	font-size: 13px;
	color: var(--bd-text-muted);
	padding: 8px;
}
.bd-checkout__cancel:hover { color: var(--bd-text); }

/* Notice (error / paid states) */
.bd-checkout__notice {
	padding: 32px 24px;
	background: linear-gradient(180deg, #0e1428 0%, #0a0e1e 100%);
	border: 1px solid var(--bd-border-strong);
	border-radius: 18px;
	text-align: center;
	max-width: 480px;
	margin: 24px auto;
}
.bd-checkout__notice h2 {
	margin: 0 0 8px;
	font-size: 22px;
	font-weight: 800;
}
.bd-checkout__notice p {
	margin: 0 0 22px;
	color: var(--bd-text-soft);
	font-size: 14px;
	line-height: 1.55;
}
.bd-checkout__notice--error { border-color: rgba(255,107,107,.32); background: linear-gradient(180deg, rgba(255,107,107,.05) 0%, #0a0e1e 100%); }
.bd-checkout__notice--ok    { border-color: rgba(0,224,164,.32);   background: linear-gradient(180deg, rgba(0,224,164,.05)  0%, #0a0e1e 100%); }
