/**
 * YouMind Testimonials (video / audio / text) — shared widget CSS.
 * Scope:      .mscore-widget-shell.mscore-yt-widget
 * Layout:     --ms-maxw / --ms-gutter (MindScale Theme Options → Layout)
 * Colors:     --ms-accent / --ms-heading / --ms-text / --ms-muted / --ms-background
 * Typography: theme classes (mindscale_heading_*, mindscale_body_*, mindscale_button_text)
 *             applied in PHP render(); see mscore-three-pillars.css for the convention.
 */

.mscore-widget-shell.mscore-yt-widget,
.mscore-widget-shell.mscore-yt-widget *,
.mscore-widget-shell.mscore-yt-widget *::before,
.mscore-widget-shell.mscore-yt-widget *::after {
	box-sizing: border-box;
}

.mscore-widget-shell.mscore-yt-widget {
	/* Palette tokens — fall back to MindScale theme tokens, allow per-widget overrides via Elementor */
	--mscore-yt-bg:           var(--ms-background, #031728);
	--mscore-yt-ink-1:        #0d1f24;
	--mscore-yt-ink-2:        #122a30;
	--mscore-yt-ink-3:        #173740;
	--mscore-yt-accent:       var(--ms-accent, #66fcf1);
	--mscore-yt-accent-soft:  #a8fdf7;
	--mscore-yt-button-text:  #031728;
	--mscore-yt-heading:      var(--ms-heading, #f0f8ff);
	--mscore-yt-highlight:    var(--ms-accent, #66fcf1);
	--mscore-yt-kicker:       var(--ms-accent, #66fcf1);
	--mscore-yt-body:         var(--ms-text, #e8eded);
	--mscore-yt-meta:         var(--ms-muted, #6b8084);
	--mscore-yt-name:         var(--ms-heading, #f0f8ff);
	--mscore-yt-role:         var(--ms-muted, #6b8084);
	--mscore-yt-accent-text:  var(--ms-accent, #66fcf1);
	--mscore-yt-nav-text:     var(--ms-heading, #f0f8ff);
	--mscore-yt-line:         rgba(232, 237, 237, 0.07);
	--mscore-yt-line-strong:  rgba(232, 237, 237, 0.15);
	--mscore-yt-line-accent:  rgba(102, 252, 241, 0.25);
	--mscore-yt-accent-faint: rgba(102, 252, 241, 0.08);
	--mscore-yt-radius-lg:    20px;
	--mscore-yt-radius-xl:    28px;
	--mscore-yt-pill:         999px;
	--mscore-yt-ease:         cubic-bezier(0.22, 1, 0.36, 1);
	--mscore-yt-shadow-lift:  0 30px 80px -30px rgba(0, 0, 0, 0.7);
	--mscore-yt-shadow-accent: 0 0 40px -8px rgba(102, 252, 241, 0.3);

	position: relative;
	isolation: isolate;
	overflow: hidden;
	padding-block: clamp(60px, 9vh, 110px);
	background: var(--mscore-yt-bg);
	color: var(--mscore-yt-body);
}

@supports (color: color-mix(in srgb, #ffffff 50%, transparent)) {
	.mscore-widget-shell.mscore-yt-widget {
		--mscore-yt-line-accent:   color-mix(in srgb, var(--mscore-yt-accent) 38%, transparent);
		--mscore-yt-accent-faint:  color-mix(in srgb, var(--mscore-yt-accent) 10%, transparent);
		--mscore-yt-shadow-accent: 0 0 40px -8px color-mix(in srgb, var(--mscore-yt-accent) 30%, transparent);
	}
}

.mscore-widget-shell.mscore-yt-widget.mscore-yt-no-bg {
	background: transparent;
}

.mscore-widget-shell.mscore-yt-widget::before {
	content: "";
	position: absolute;
	top: -35%;
	right: -12%;
	width: min(720px, 70vw);
	height: min(620px, 70vh);
	background: radial-gradient(ellipse at center, rgba(102, 252, 241, 0.10) 0%, rgba(102, 252, 241, 0.03) 38%, transparent 65%);
	pointer-events: none;
	z-index: -2;
}

@supports (color: color-mix(in srgb, #ffffff 50%, transparent)) {
	.mscore-widget-shell.mscore-yt-widget::before {
		background: radial-gradient(ellipse at center,
			color-mix(in srgb, var(--mscore-yt-accent) 14%, transparent) 0%,
			color-mix(in srgb, var(--mscore-yt-accent) 4%, transparent) 38%,
			transparent 65%);
	}
}

.mscore-widget-shell.mscore-yt-widget.mscore-yt-no-glow::before {
	display: none;
}

.mscore-widget-shell.mscore-yt-widget::after {
	content: "";
	position: absolute;
	top: 9%;
	left: -13%;
	width: min(720px, 62vw);
	height: min(520px, 62vh);
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 400' fill='none' stroke='%231a3a40' stroke-width='1.2'><path d='M0 380 L120 180 L200 280 L280 180 L400 380'/><path d='M80 380 L200 180 L280 280 L360 180 L480 380'/></svg>");
	background-repeat: no-repeat;
	background-size: contain;
	opacity: 0.5;
	pointer-events: none;
	z-index: -1;
}

.mscore-widget-shell.mscore-yt-widget.mscore-yt-no-pattern::after {
	display: none;
}

/* ─── Theme-aware wrap — follows MindScale layout container ──────────────── */
.mscore-widget-shell.mscore-yt-widget .mscore-yt-wrap {
	max-width: var(--ms-maxw, 1280px);
	margin-inline: auto;
	padding-inline: var(--ms-gutter, 32px);
}

/* ─── Section head ───────────────────────────────────────────────────────── */
.mscore-widget-shell.mscore-yt-widget .mscore-yt-section-head {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: end;
	gap: 32px;
	margin-bottom: clamp(36px, 6vh, 60px);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-kicker {
	display: inline-flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	margin-bottom: 18px;
	color: var(--mscore-yt-kicker);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.16em;
	line-height: 1.2;
	text-transform: uppercase;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-dot {
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: currentColor;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-section-title {
	display: block;
	max-width: 18ch;
	margin: 0;
	padding: 0;
	color: var(--mscore-yt-heading);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-section-title em {
	color: var(--mscore-yt-highlight);
	font-style: normal;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-count,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-slide-counter {
	color: var(--mscore-yt-meta);
	font-size: 13px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.05em;
	white-space: nowrap;
}

/* ─── Slider mechanics ───────────────────────────────────────────────────── */
.mscore-widget-shell.mscore-yt-widget .mscore-yt-slider-track {
	display: flex;
	gap: clamp(16px, 2vw, 28px);
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	padding: 8px 0 4px;
	-webkit-overflow-scrolling: touch;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-slider-track::-webkit-scrollbar {
	display: none;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-slide {
	flex: 0 0 100%;
	scroll-snap-align: center;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-slider-controls {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	margin-top: 28px;
	padding-top: 24px;
	border-top: 1px solid var(--mscore-yt-line);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-dots {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 10px;
	min-width: 80px;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-dot-btn {
	width: 22px;
	height: 2px;
	padding: 0;
	border: 0;
	border-radius: var(--mscore-yt-pill);
	background: var(--mscore-yt-line-strong);
	cursor: pointer;
	transition: width 0.5s var(--mscore-yt-ease), background 0.5s var(--mscore-yt-ease);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-dot-btn.is-active {
	width: 36px;
	background: var(--mscore-yt-accent);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-arrows {
	display: flex;
	gap: 8px;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	padding: 0;
	border: 1px solid var(--mscore-yt-line-strong);
	border-radius: var(--mscore-yt-pill);
	background: transparent;
	color: var(--mscore-yt-nav-text);
	cursor: pointer;
	transition: color 0.35s var(--mscore-yt-ease), border-color 0.35s var(--mscore-yt-ease),
		background 0.35s var(--mscore-yt-ease), transform 0.35s var(--mscore-yt-ease), opacity 0.35s var(--mscore-yt-ease);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-arrow:hover:not(:disabled) {
	border-color: var(--mscore-yt-accent);
	background: var(--mscore-yt-accent-faint);
	color: var(--mscore-yt-accent-text);
	transform: translateY(-1px);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-arrow:disabled {
	opacity: 0.3;
	cursor: not-allowed;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-arrow svg {
	width: 16px;
	height: 16px;
	stroke-width: 1.8;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-prev svg {
	transform: rotate(180deg);
}

/* ─── Video slide ────────────────────────────────────────────────────────── */
.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-slide {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	align-items: center;
	gap: clamp(20px, 4vw, 60px);
	min-height: 0;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-frame {
	position: relative;
	aspect-ratio: 1 / 1;
	overflow: hidden;
	border: 1px solid var(--mscore-yt-line-strong);
	border-radius: var(--mscore-yt-radius-lg);
	background: var(--mscore-yt-ink-1);
	box-shadow: var(--mscore-yt-shadow-lift);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-frame::before {
	content: "";
	position: absolute;
	inset: -40px;
	background-image: var(--mscore-yt-poster-blur);
	background-position: center;
	background-size: cover;
	filter: blur(50px) saturate(0.6);
	opacity: 0.4;
	z-index: -1;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-frame video {
	display: block;
	width: 100%;
	height: 100%;
	background: var(--mscore-yt-bg);
	object-fit: cover;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-live-tag {
	position: absolute;
	top: 16px;
	left: 16px;
	z-index: 2;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	max-width: calc(100% - 32px);
	padding: 8px 14px;
	border: 1px solid var(--mscore-yt-line-accent);
	border-radius: var(--mscore-yt-pill);
	background: rgba(3, 23, 40, 0.75);
	color: var(--mscore-yt-body);
	font-size: 10px;
	font-weight: 700;
	letter-spacing: 0.18em;
	line-height: 1.2;
	text-transform: uppercase;
	backdrop-filter: blur(10px);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-live-tag::before {
	content: "";
	flex: 0 0 auto;
	width: 6px;
	height: 6px;
	border-radius: 50%;
	background: var(--mscore-yt-accent);
	box-shadow: 0 0 10px var(--mscore-yt-accent);
	animation: mscoreYtPulse 2.4s ease-in-out infinite;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta {
	padding: 16px 0;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-slide-index {
	margin-bottom: 24px;
	color: var(--mscore-yt-accent-text);
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta .mscore-yt-video-name,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta h1,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta h2,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta h3,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta h4,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta h5,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta h6 {
	display: block;
	margin: 0 0 22px;
	padding: 0;
	color: var(--mscore-yt-name);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-meta p {
	max-width: 42ch;
	margin: 0 0 28px;
	color: var(--mscore-yt-body);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-hint {
	display: inline-flex;
	align-items: center;
	gap: 12px;
	color: var(--mscore-yt-meta);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-hint::before {
	content: "";
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--mscore-yt-accent);
	box-shadow: 0 0 12px var(--mscore-yt-accent);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-media-placeholder {
	display: grid;
	place-items: center;
	height: 100%;
	padding: 24px;
	color: var(--mscore-yt-meta);
	text-align: center;
}

/* ─── Audio card ─────────────────────────────────────────────────────────── */
.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-card {
	position: relative;
	display: grid;
	grid-template-columns: auto minmax(0, 1fr);
	align-items: center;
	gap: clamp(24px, 4vw, 56px);
	min-height: 320px;
	overflow: hidden;
	padding: clamp(28px, 4vw, 56px);
	border: 1px solid var(--mscore-yt-line);
	border-radius: var(--mscore-yt-radius-xl);
	background: linear-gradient(180deg, var(--mscore-yt-ink-2) 0%, var(--mscore-yt-ink-1) 100%);
	transition: border-color 0.5s var(--mscore-yt-ease), box-shadow 0.5s var(--mscore-yt-ease);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-card.is-playing {
	border-color: var(--mscore-yt-line-accent);
	box-shadow: var(--mscore-yt-shadow-accent);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-left {
	display: flex;
	flex-direction: column;
	gap: 14px;
	min-width: 0;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-name {
	display: block;
	margin: 0;
	padding: 0;
	color: var(--mscore-yt-name);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-name em {
	color: var(--mscore-yt-highlight);
	font-style: normal;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-tag {
	color: var(--mscore-yt-meta);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.18em;
	text-transform: uppercase;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-right {
	display: flex;
	flex-direction: column;
	gap: 22px;
	min-width: 0;
	width: 100%;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-prompt {
	margin: 0;
	color: var(--mscore-yt-body);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-visualizer {
	position: relative;
	width: 100%;
	max-width: 100%;
	height: 86px;
	overflow: hidden;
	border: 1px solid var(--mscore-yt-line);
	border-radius: 12px;
	background: var(--mscore-yt-bg);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-visualizer canvas {
	display: block;
	width: 100%;
	height: 100%;
	max-width: 100%;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-controls-row {
	display: grid;
	grid-template-columns: auto minmax(0, 1fr) auto;
	align-items: center;
	gap: 18px;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-play-btn {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 54px;
	height: 54px;
	padding: 0;
	border: 0;
	border-radius: var(--mscore-yt-pill);
	background: var(--mscore-yt-accent);
	color: var(--mscore-yt-button-text);
	cursor: pointer;
	transition: transform 0.35s var(--mscore-yt-ease), background 0.35s var(--mscore-yt-ease), opacity 0.35s var(--mscore-yt-ease);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-play-btn:hover:not(:disabled) {
	background: var(--mscore-yt-accent-soft);
	transform: scale(1.04);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-play-btn:disabled {
	opacity: 0.45;
	cursor: not-allowed;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-play-btn::after {
	content: "";
	position: absolute;
	inset: -6px;
	border: 1px solid var(--mscore-yt-accent);
	border-radius: var(--mscore-yt-pill);
	opacity: 0;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-card.is-playing .mscore-yt-play-btn::after {
	animation: mscoreYtRing 2.2s ease-in-out infinite;
	opacity: 0.5;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-icon-play,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-icon-pause {
	width: 18px;
	height: 18px;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-icon-pause,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-card.is-playing .mscore-yt-icon-play {
	display: none;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-card.is-playing .mscore-yt-icon-pause {
	display: block;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-progress-wrap {
	display: flex;
	align-items: center;
	gap: 14px;
	min-width: 0;
	color: var(--mscore-yt-meta);
	font-size: 12px;
	font-weight: 600;
	font-variant-numeric: tabular-nums;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-progress {
	position: relative;
	flex: 1;
	min-width: 48px;
	height: 2px;
	border-radius: var(--mscore-yt-pill);
	background: var(--mscore-yt-line-strong);
	cursor: pointer;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-progress-fill {
	position: absolute;
	inset: 0 auto 0 0;
	width: 0;
	border-radius: inherit;
	background: var(--mscore-yt-accent);
	transition: width 0.1s linear;
}

/* ─── Text grid ──────────────────────────────────────────────────────────── */
.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-grid {
	column-count: 3;
	column-gap: clamp(16px, 2vw, 24px);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card {
	position: relative;
	display: inline-block;
	width: 100%;
	margin-bottom: clamp(16px, 2vw, 24px);
	padding: clamp(22px, 2.5vw, 30px);
	break-inside: avoid;
	border: 1px solid var(--mscore-yt-card-border, var(--mscore-yt-line));
	border-radius: var(--mscore-yt-radius-lg);
	background: var(--mscore-yt-card-bg, var(--mscore-yt-ink-1));
	box-shadow: 0 0 0 transparent;
	animation: mscoreYtRise 0.75s var(--mscore-yt-ease) both;
	transition: background 0.5s var(--mscore-yt-ease), border-color 0.5s var(--mscore-yt-ease),
		transform 0.5s var(--mscore-yt-ease), box-shadow 0.5s var(--mscore-yt-ease);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card:hover,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card:focus-within {
	border-color: var(--mscore-yt-card-border-hover, var(--mscore-yt-accent));
	background: var(--mscore-yt-card-bg-hover, var(--mscore-yt-ink-2));
	box-shadow: var(--mscore-yt-shadow-accent);
	transform: translateY(-3px);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card.is-featured {
	border-color: var(--mscore-yt-card-border-featured, var(--mscore-yt-line-accent));
	background: var(--mscore-yt-card-bg-featured, linear-gradient(180deg, var(--mscore-yt-ink-2) 0%, var(--mscore-yt-ink-1) 100%));
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card.is-featured:hover,
.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card.is-featured:focus-within {
	border-color: var(--mscore-yt-card-border-hover, var(--mscore-yt-accent));
	box-shadow: var(--mscore-yt-shadow-accent);
	transform: translateY(-3px);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card[hidden] {
	display: none !important;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-quote-glyph {
	display: inline-block;
	margin-bottom: 18px;
	color: var(--mscore-yt-accent-text);
	font-size: 38px;
	font-weight: 700;
	line-height: 0.5;
	opacity: 0.9;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-body {
	margin: 0 0 18px;
	color: var(--mscore-yt-body);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-more-text {
	display: none;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card.is-expanded .mscore-yt-more-text {
	display: inline;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-card.is-expanded .mscore-yt-ellipsis {
	display: none;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-read-more {
	display: inline-block;
	margin-top: 8px;
	padding: 0;
	border: 0;
	border-bottom: 1px solid transparent;
	background: transparent;
	color: var(--mscore-yt-accent-text);
	cursor: pointer;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	transition: border-color 0.35s var(--mscore-yt-ease);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-read-more:hover {
	border-bottom-color: currentColor;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-signature {
	display: flex;
	align-items: center;
	gap: 12px;
	padding-top: 14px;
	border-top: 1px solid var(--mscore-yt-line);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-name {
	display: inline-block;
	margin: 0;
	padding: 0;
	color: var(--mscore-yt-name);
	font-size: 17px;
	font-style: normal;
	font-weight: 700;
	letter-spacing: -0.01em;
	line-height: 1.2;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-title {
	display: inline-block;
	margin: 0 0 0 auto;
	padding: 0;
	color: var(--mscore-yt-role);
	font-size: 10px;
	font-style: normal;
	font-weight: 700;
	letter-spacing: 0.16em;
	line-height: 1.35;
	text-align: right;
	text-transform: uppercase;
}

/* ─── Load more ──────────────────────────────────────────────────────────── */
.mscore-widget-shell.mscore-yt-widget .mscore-yt-load-more-wrap {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 16px;
	margin-top: clamp(36px, 6vh, 56px);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-load-more-status {
	color: var(--mscore-yt-meta);
	font-size: 12px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-load-more-btn {
	display: inline-flex;
	align-items: center;
	gap: 14px;
	padding: 16px 30px;
	border: 0;
	border-radius: var(--mscore-yt-pill);
	background: var(--mscore-yt-accent);
	color: var(--mscore-yt-button-text);
	cursor: pointer;
	font-size: 14px;
	font-weight: 700;
	letter-spacing: 0.01em;
	transition: background 0.35s var(--mscore-yt-ease), box-shadow 0.35s var(--mscore-yt-ease),
		color 0.35s var(--mscore-yt-ease), transform 0.35s var(--mscore-yt-ease);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-load-more-btn:hover:not(:disabled) {
	background: var(--mscore-yt-accent-soft);
	box-shadow: var(--mscore-yt-shadow-accent);
	transform: translateY(-1px);
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-load-more-btn:disabled {
	border: 1px solid var(--mscore-yt-line-strong);
	background: transparent;
	color: var(--mscore-yt-meta);
	cursor: not-allowed;
}

.mscore-widget-shell.mscore-yt-widget .mscore-yt-load-more-btn svg {
	width: 16px;
	height: 16px;
	fill: none;
	stroke: currentColor;
	stroke-width: 2;
}

/* ─── Keyframes ──────────────────────────────────────────────────────────── */
@keyframes mscoreYtPulse {
	0%, 100% { opacity: 1; }
	50%      { opacity: 0.4; }
}

@keyframes mscoreYtRing {
	0%, 100% { opacity: 0.5; transform: scale(1); }
	50%      { opacity: 0;   transform: scale(1.18); }
}

@keyframes mscoreYtRise {
	from { opacity: 0; transform: translateY(14px); }
	to   { opacity: 1; transform: translateY(0); }
}

/* ─── Responsive (matches source breakpoints) ────────────────────────────── */
@media (max-width: 980px) {
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-grid { column-count: 2; }
}

@media (max-width: 900px) {
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-video-slide { grid-template-columns: 1fr; }
}

@media (max-width: 820px) {
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-slider-controls {
		flex-wrap: wrap;
		justify-content: center;
		gap: 16px;
	}
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-dots {
		order: 1;
		flex-basis: 100%;
		justify-content: center;
	}
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-slide-counter { order: 2; }
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-arrows        { order: 3; }
}

@media (max-width: 720px) {
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-card {
		grid-template-columns: 1fr;
		text-align: left;
		min-height: 0;
	}
}

@media (max-width: 640px) {
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-section-head { display: block; }
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-count {
		display: inline-block;
		margin-top: 18px;
	}
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-controls-row {
		grid-template-columns: 1fr;
		gap: 14px;
	}
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-progress-wrap { width: 100%; }
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-text-grid           { column-count: 1; }
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-signature {
		flex-direction: column;
		align-items: flex-start;
		gap: 4px;
	}
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-title {
		margin-left: 0;
		text-align: left;
	}
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-load-more-btn {
		padding: 14px 24px;
		font-size: 13px;
	}
}

@media (max-width: 480px) {
	.mscore-widget-shell.mscore-yt-widget { padding-block: clamp(48px, 8vh, 80px); }
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-arrow { width: 42px; height: 42px; }
	.mscore-widget-shell.mscore-yt-widget .mscore-yt-audio-card { padding: 24px; }
}

@media (prefers-reduced-motion: reduce) {
	.mscore-widget-shell.mscore-yt-widget *,
	.mscore-widget-shell.mscore-yt-widget *::before,
	.mscore-widget-shell.mscore-yt-widget *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}