/* Movino Series Hub — دکمه‌ی شناور + پنل سریال‌ها (RTL، تیره، مدرن) */

.msh-root {
	--msh-accent: #22c55e;
	--msh-accent-rgb: 34, 197, 94;
	--msh-bg: #0c0d12;
	--msh-surface: #15171e;
	--msh-surface-2: #1d2029;
	--msh-line: rgba(255, 255, 255, .09);
	--msh-text: #eef0f5;
	--msh-muted: #9aa1b2;
	font-family: inherit;
	line-height: 1.5;
	direction: rtl;
	text-align: right;
	-webkit-text-size-adjust: 100%;
}
.msh-root *,
.msh-root *::before,
.msh-root *::after { box-sizing: border-box; }
.msh-root button,
.msh-root input,
.msh-root a { font-family: inherit; }
.msh-root [hidden] { display: none !important; }
.msh-root svg { display: block; flex: 0 0 auto; }

/* ---------------------------------------------------------------- دکمه‌ی شناور */
.msh-root .msh-fab {
	position: fixed;
	bottom: calc(var(--msh-bottom-d, 24px) + env(safe-area-inset-bottom, 0px));
	z-index: 99990;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	height: 42px;
	min-width: 42px;
	margin: 0;
	padding: 0 13px;
	border-radius: 999px;
	border: 1px solid rgba(255, 255, 255, .14);
	background: rgba(18, 20, 27, .84);
	-webkit-backdrop-filter: blur(14px);
	backdrop-filter: blur(14px);
	color: var(--msh-text);
	font-size: 12px;
	font-weight: 700;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0 10px 30px rgba(0, 0, 0, .45), 0 0 0 4px rgba(var(--msh-accent-rgb), .0);
	transition: width .22s ease, min-width .22s ease, padding .22s ease, gap .22s ease, transform .22s ease, border-color .22s ease, box-shadow .22s ease, background .22s ease;
	animation: msh-fab-float 3.6s ease-in-out infinite;
	-webkit-tap-highlight-color: transparent;
}
.msh-root .msh-fab--left { left: calc(16px + env(safe-area-inset-left, 0px)); }
.msh-root .msh-fab--right { right: calc(16px + env(safe-area-inset-right, 0px)); }
.msh-root .msh-fab:hover,
.msh-root .msh-fab:focus-visible {
	transform: translateY(-2px);
	border-color: rgba(var(--msh-accent-rgb), .7);
	box-shadow: 0 14px 34px rgba(0, 0, 0, .5), 0 0 0 4px rgba(var(--msh-accent-rgb), .16);
	color: #fff;
	outline: none;
}
.msh-root .msh-fab__icon { color: var(--msh-accent); width: 18px; height: 18px; transition: transform .28s ease; }
.msh-root .msh-fab__label {
	display: inline-block;
	max-width: 180px;
	overflow: hidden;
	white-space: nowrap;
	transition: max-width .28s ease, opacity .2s ease, margin .28s ease;
}
.msh-root .msh-fab.msh-fab--collapsed {
	width: 42px;
	min-width: 42px;
	padding-inline: 11px;
	gap: 0;
	justify-content: center;
	border-color: rgba(var(--msh-accent-rgb), .4);
}
.msh-root .msh-fab.msh-fab--collapsed .msh-fab__label {
	max-width: 0;
	opacity: 0;
	margin: 0;
}
.msh-root .msh-fab.msh-fab--collapsed .msh-fab__icon { transform: scale(.96); }
.msh-root .msh-fab.msh-fab--collapsed .msh-fab__icon::after {
	content: "";
	position: absolute;
	inset: -5px;
	border: 2px solid var(--msh-accent);
	border-radius: 50%;
	pointer-events: none;
	animation: msh-fab-pulse 2.4s ease-out infinite;
}
.msh-root .msh-fab__icon { position: relative; }
.msh-root .msh-fab:focus-visible .msh-fab__label { max-width: 180px; opacity: 1; }
@keyframes msh-fab-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-4px); } }
@keyframes msh-fab-pulse { 0% { transform: scale(.9); opacity: .6; } 100% { transform: scale(1.45); opacity: 0; } }

@media (max-width: 991px) {
	.msh-root .msh-fab { bottom: calc(var(--msh-bottom-m, 126px) + env(safe-area-inset-bottom, 0px)); }
}

/* ---------------------------------------------------------------- پوشش و پنل */
.msh-root .msh-overlay {
	position: fixed;
	top: 0; right: 0; bottom: 0; left: 0;
	z-index: 99999;
	display: flex;
	align-items: flex-end;
	justify-content: center;
	background: rgba(5, 6, 9, .68);
	-webkit-backdrop-filter: blur(6px);
	backdrop-filter: blur(6px);
	animation: msh-fade .18s ease both;
}
.msh-root .msh-panel {
	position: relative;
	display: flex;
	flex-direction: column;
	width: 100%;
	max-width: 1100px;
	height: 94vh;
	height: 94dvh;
	background: var(--msh-bg);
	color: var(--msh-text);
	border: 1px solid var(--msh-line);
	border-bottom: 0;
	border-radius: 22px 22px 0 0;
	box-shadow: 0 -20px 60px rgba(0, 0, 0, .5);
	overflow: hidden;
	animation: msh-rise .24s cubic-bezier(.2, .8, .2, 1) both;
}
@media (min-width: 760px) {
	.msh-root .msh-overlay { align-items: center; padding: 24px; }
	.msh-root .msh-panel {
		height: min(86vh, 860px);
		border-bottom: 1px solid var(--msh-line);
		border-radius: 22px;
	}
}

/* حالت صفحه‌ی کامل (شورت‌کد) */
.msh-root--inline { width: 100%; }
.msh-root--inline .msh-panel {
	height: auto;
	max-width: none;
	border: 1px solid var(--msh-line);
	border-radius: 20px;
	animation: none;
	overflow: visible;
}
.msh-root--inline .msh-head { position: static; border-radius: 20px 20px 0 0; }
.msh-root--inline .msh-body { overflow: visible; }

@keyframes msh-fade { from { opacity: 0; } to { opacity: 1; } }
@keyframes msh-rise { from { opacity: 0; transform: translateY(22px); } to { opacity: 1; transform: none; } }

/* ---------------------------------------------------------------- سربرگ */
.msh-root .msh-head {
	position: relative;
	z-index: 2;
	flex: 0 0 auto;
	padding: 16px 16px 12px;
	background: linear-gradient(180deg, rgba(var(--msh-accent-rgb), .10), rgba(12, 13, 18, 0) 90%), var(--msh-bg);
	border-bottom: 1px solid var(--msh-line);
}
.msh-root .msh-head__row {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-bottom: 12px;
}
.msh-root .msh-title {
	margin: 0;
	padding: 0;
	font-size: 18px;
	font-weight: 900;
	line-height: 1.4;
	color: var(--msh-text);
}
.msh-root .msh-count {
	display: block;
	margin-top: 2px;
	font-size: 12px;
	font-weight: 600;
	color: var(--msh-muted);
}
.msh-root .msh-iconbtn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	width: 38px;
	height: 38px;
	margin: 0;
	padding: 0;
	border-radius: 12px;
	border: 1px solid var(--msh-line);
	background: var(--msh-surface);
	color: var(--msh-text);
	cursor: pointer;
	transition: background .15s ease, border-color .15s ease;
}
.msh-root .msh-iconbtn:hover,
.msh-root .msh-iconbtn:focus-visible { background: var(--msh-surface-2); border-color: rgba(255, 255, 255, .25); outline: none; }

.msh-root .msh-tools { display: flex; flex-direction: column; gap: 10px; }
.msh-root .msh-search {
	display: flex;
	align-items: center;
	gap: 10px;
	height: 46px;
	padding: 0 14px;
	border-radius: 14px;
	border: 1px solid var(--msh-line);
	background: var(--msh-surface);
	color: var(--msh-muted);
	transition: border-color .15s ease, box-shadow .15s ease;
}
.msh-root .msh-search:focus-within {
	border-color: rgba(var(--msh-accent-rgb), .75);
	box-shadow: 0 0 0 3px rgba(var(--msh-accent-rgb), .16);
}
.msh-root .msh-search input {
	flex: 1 1 auto;
	min-width: 0;
	height: 100%;
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	background: transparent;
	box-shadow: none;
	color: var(--msh-text);
	font-size: 15px;
	-webkit-appearance: none;
	appearance: none;
}
.msh-root .msh-search input::placeholder { color: var(--msh-muted); opacity: 1; }
.msh-root .msh-search input::-webkit-search-cancel-button { -webkit-appearance: none; }

.msh-root .msh-sorts { display: flex; gap: 8px; }
.msh-root .msh-chip {
	margin: 0;
	padding: 7px 14px;
	border-radius: 999px;
	border: 1px solid var(--msh-line);
	background: transparent;
	color: var(--msh-muted);
	font-size: 12.5px;
	font-weight: 800;
	line-height: 1.2;
	cursor: pointer;
	transition: background .15s ease, color .15s ease, border-color .15s ease;
}
.msh-root .msh-chip:hover,
.msh-root .msh-chip:focus-visible { color: var(--msh-text); border-color: rgba(255, 255, 255, .25); outline: none; }
.msh-root .msh-chip.is-on {
	background: rgba(var(--msh-accent-rgb), .16);
	border-color: rgba(var(--msh-accent-rgb), .6);
	color: var(--msh-accent);
}

/* ---------------------------------------------------------------- بدنه */
.msh-root .msh-body {
	position: relative;
	flex: 1 1 auto;
	min-height: 0;
	padding: 16px 14px calc(22px + env(safe-area-inset-bottom, 0px));
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
	overscroll-behavior: contain;
}
.msh-root .msh-status {
	margin: 40px 0;
	text-align: center;
	color: var(--msh-muted);
	font-size: 14px;
}
.msh-root .msh-more {
	display: block;
	margin: 18px auto 0;
	padding: 11px 26px;
	border-radius: 999px;
	border: 1px solid var(--msh-line);
	background: var(--msh-surface);
	color: var(--msh-text);
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
}
.msh-root .msh-more:hover,
.msh-root .msh-more:focus-visible { border-color: rgba(var(--msh-accent-rgb), .6); outline: none; }

/* ---------------------------------------------------------------- شبکه‌ی سریال‌ها */
.msh-root .msh-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 0;
	padding: 0;
}
@media (min-width: 640px) { .msh-root .msh-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; } }
@media (min-width: 940px) { .msh-root .msh-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

.msh-root .msh-item {
	display: flex;
	flex-direction: column;
	min-width: 0;
	margin: 0;
	background: var(--msh-surface);
	border: 1px solid var(--msh-line);
	border-radius: 16px;
	overflow: hidden;
	transition: border-color .18s ease, transform .18s ease;
}
.msh-root .msh-item:hover { border-color: rgba(var(--msh-accent-rgb), .45); }

.msh-root .msh-card {
	position: relative;
	display: block;
	color: inherit;
	text-decoration: none;
	outline: none;
}
.msh-root .msh-card__pic {
	position: relative;
	display: block;
	width: 100%;
	padding-top: 56.25%;
	background: linear-gradient(135deg, #1b1e27, #11131a);
	overflow: hidden;
}
.msh-root .msh-card__pic img {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	width: 100%;
	height: 100%;
	max-width: none;
	margin: 0;
	object-fit: cover;
	border: 0;
	border-radius: 0;
	transition: transform .35s ease;
}
.msh-root .msh-item:hover .msh-card__pic img { transform: scale(1.05); }
.msh-root .msh-card__pic::after {
	content: "";
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	background: linear-gradient(180deg, rgba(0, 0, 0, 0) 38%, rgba(0, 0, 0, .86) 100%);
	pointer-events: none;
}
.msh-root .msh-card__ph {
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 34px;
	font-weight: 900;
	color: rgba(255, 255, 255, .18);
}
.msh-root .msh-badge {
	position: absolute;
	top: 8px;
	left: 8px;
	z-index: 1;
	padding: 4px 9px;
	border-radius: 9px;
	background: var(--msh-accent);
	color: #04130a;
	font-size: 11.5px;
	font-weight: 900;
	line-height: 1.3;
	direction: rtl;
	box-shadow: 0 4px 12px rgba(0, 0, 0, .4);
}
.msh-root .msh-card__title {
	position: absolute;
	right: 10px;
	left: 10px;
	bottom: 8px;
	z-index: 1;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 14px;
	font-weight: 900;
	line-height: 1.45;
	color: #fff;
	text-shadow: 0 2px 10px rgba(0, 0, 0, .7);
}
.msh-root .msh-card:focus-visible .msh-card__pic { box-shadow: inset 0 0 0 3px var(--msh-accent); }

.msh-root .msh-foot {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	padding: 9px 10px 10px;
}
.msh-root .msh-mini {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 30px;
	height: 26px;
	margin: 0;
	padding: 0 8px;
	border-radius: 8px;
	border: 1px solid var(--msh-line);
	background: var(--msh-surface-2);
	color: var(--msh-text);
	font-size: 12px;
	font-weight: 800;
	line-height: 1;
	text-decoration: none;
	direction: ltr;
	cursor: pointer;
	transition: border-color .15s ease, color .15s ease;
}
.msh-root .msh-mini:hover,
.msh-root .msh-mini:focus-visible { border-color: rgba(var(--msh-accent-rgb), .7); color: var(--msh-accent); outline: none; }
.msh-root .msh-mini--all {
	margin-right: auto;
	direction: rtl;
	color: var(--msh-accent);
	border-color: rgba(var(--msh-accent-rgb), .35);
	background: transparent;
}

/* ---------------------------------------------------------------- نمای همه‌ی قسمت‌های یک سریال */
.msh-root .msh-back {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin: 0 0 14px;
	padding: 8px 14px 8px 12px;
	border-radius: 999px;
	border: 1px solid var(--msh-line);
	background: var(--msh-surface);
	color: var(--msh-text);
	font-size: 13px;
	font-weight: 800;
	cursor: pointer;
}
.msh-root .msh-back:hover,
.msh-root .msh-back:focus-visible { border-color: rgba(255, 255, 255, .28); outline: none; }

.msh-root .msh-series-title {
	margin: 0 0 4px;
	padding: 0;
	font-size: 20px;
	font-weight: 900;
	line-height: 1.5;
	color: var(--msh-text);
}
.msh-root .msh-series-sub { margin: 0 0 14px; font-size: 13px; color: var(--msh-muted); }

.msh-root .msh-play {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	width: 100%;
	height: 52px;
	margin: 0 0 20px;
	border-radius: 16px;
	background: var(--msh-accent);
	color: #04130a;
	font-size: 15px;
	font-weight: 900;
	text-decoration: none;
	box-shadow: 0 10px 26px rgba(var(--msh-accent-rgb), .28);
	transition: transform .15s ease, box-shadow .15s ease;
}
.msh-root .msh-play:hover,
.msh-root .msh-play:focus-visible { transform: translateY(-1px); box-shadow: 0 14px 30px rgba(var(--msh-accent-rgb), .38); outline: none; color: #04130a; }
@media (min-width: 640px) { .msh-root .msh-play { display: inline-flex; width: auto; min-width: 300px; padding: 0 28px; } }

.msh-root .msh-eps {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(66px, 1fr));
	gap: 8px;
	margin: 0;
	padding: 0;
	direction: rtl;
}
.msh-root .msh-ep {
	direction: ltr;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 46px;
	border-radius: 12px;
	border: 1px solid var(--msh-line);
	background: var(--msh-surface);
	color: var(--msh-text);
	font-size: 15px;
	font-weight: 800;
	text-decoration: none;
	transition: border-color .15s ease, background .15s ease, color .15s ease;
}
.msh-root .msh-ep:hover,
.msh-root .msh-ep:focus-visible { border-color: rgba(var(--msh-accent-rgb), .75); background: var(--msh-surface-2); color: #fff; outline: none; }
.msh-root .msh-ep.is-latest {
	background: rgba(var(--msh-accent-rgb), .16);
	border-color: rgba(var(--msh-accent-rgb), .7);
	color: var(--msh-accent);
}
.msh-root .msh-ep.is-latest::after {
	content: "";
	position: absolute;
	top: 6px;
	right: 6px;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--msh-accent);
}

/* قفل اسکرول صفحه‌ی زیرین وقتی پنل باز است */
html.msh-lock,
html.msh-lock body { overflow: hidden !important; }

@media (prefers-reduced-motion: reduce) {
	.msh-root .msh-overlay,
	.msh-root .msh-panel { animation: none; }
	.msh-root .msh-fab,
	.msh-root .msh-card__pic img { transition: none; }
	.msh-root .msh-fab,
	.msh-root .msh-fab.msh-fab--collapsed .msh-fab__icon::after { animation: none; }
}
@media (max-width: 380px) {
	.msh-root .msh-fab { padding-inline: 11px; }
}


/* دسته‌بندی زبان: دوبله نارنجی برند فیلمونا، زیرنویس آبی */
.msh-root .msh-chip--dub.is-on { color: #fff; background: rgba(255, 153, 0, .16); border-color: #ff9900; box-shadow: 0 0 0 1px rgba(255,153,0,.12) inset; }
.msh-root .msh-chip--sub.is-on { color: #fff; background: rgba(45, 140, 255, .16); border-color: #2d8cff; box-shadow: 0 0 0 1px rgba(45,140,255,.12) inset; }
.msh-root .msh-chip { transition: color .22s ease, background .22s ease, border-color .22s ease, transform .22s ease, box-shadow .22s ease; }
.msh-root .msh-chip:active { transform: scale(.96); }

/* تب «قسمت‌های جدید» همیشه همه‌ی سریال‌ها را بر اساس آخرین انتشار نشان می‌دهد. */
.msh-root .msh-chip--all.is-on { color: #fff; background: rgba(40, 199, 111, .16); border-color: #28c76f; box-shadow: 0 0 0 1px rgba(40, 199, 111, .12) inset; }
.msh-root .msh-chip--all { order: -1; }