/*
Theme Name: Music Podcast
Theme URI: https://scintillawpthemes.com/product/music-podcast/
Author: scintillawpthemes
Author URI: https://scintillawpthemes.com/
Description: Music Podcast is a modern, responsive, and easy-to-use WordPress theme designed for podcasters, musicians, DJs, radio hosts, audio creators, music bloggers, and online entertainment platforms. With its clean layout, bold typography, and audio-focused design, the theme helps you create a professional website to showcase episodes, playlists, music, interviews, and other audio content. The theme provides a flexible homepage layout with dedicated sections for featured episodes, latest podcasts, music releases, hosts, playlists, blog posts, and calls to action. You can organize your content clearly and make it easy for visitors to discover and listen to your latest episodes. Music Podcast is built with a responsive design that adapts smoothly to desktops, tablets, and mobile devices. Its clean navigation and structured content layout provide a user-friendly browsing experience across different screen sizes. The theme is suitable for individual podcasters, podcast networks, music websites, radio shows, recording artists, audio production studios, entertainment blogs, and creative professionals. Whether you're launching a new podcast, building a music-focused website, or creating an online home for your audio content, Music Podcast provides a flexible foundation for presenting your episodes, music, and brand in a professional way.
Version: 1.1
Requires at least: 6.7
Requires PHP: 7.4
Tested up to: 7.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: music-podcast
Domain Path: /languages
Tags: blog, entertainment, two-columns, left-sidebar, custom-colors, custom-menu, custom-logo, custom-background, editor-style, featured-images, block-patterns, block-styles, full-site-editing, grid-layout, threaded-comments, translation-ready, wide-blocks
*/

/* ==========================================================================
   1. Design tokens
   ========================================================================== */
:root,
body {
	/* Surfaces */
	--mp-bg: #08080a;
	--mp-surface-1: #121218;
	--mp-surface-2: #191921;
	--mp-surface-3: #22222d;
	--mp-slate: #2a3042;

	/* Brand */
	--mp-amber-1: #ffb23f;
	--mp-amber-2: #f0801a;
	--mp-ember: #ff5a1f;
	--mp-brand-grad: linear-gradient(135deg, #ffb23f 0%, #f0801a 58%, #ff5a1f 100%);
	--mp-brand-soft: rgba(255, 178, 63, .12);

	/* Support accents */
	--mp-live: #ff4d4d;
	--mp-mint: #4ed8a0;

	/* Ink */
	--mp-text: #f2efea;
	--mp-text-2: #c3c1cc;
	--mp-muted: #918f9e;
	--mp-on-brand: #1a1208;

	/* Lines and shadow */
	--mp-line: rgba(255, 255, 255, .08);
	--mp-line-2: rgba(255, 255, 255, .14);
	--mp-shadow-lift: 0 18px 40px -22px rgba(0, 0, 0, .9);
	--mp-shadow-brand: 0 14px 34px -16px rgba(240, 128, 26, .55);

	/* Type */
	--mp-font-display: Sora, "Segoe UI", Arial, sans-serif;
	--mp-font-ui: Manrope, "Segoe UI", Arial, sans-serif;

	--mp-fs-2xs: .6875rem;
	--mp-fs-xs: .75rem;
	--mp-fs-sm: .8125rem;
	--mp-fs-base: .9375rem;
	--mp-fs-md: 1.0625rem;
	--mp-fs-lg: 1.25rem;
	--mp-fs-xl: 1.5rem;
	--mp-fs-2xl: 1.875rem;

	/* Metrics */
	--mp-sidebar-w: 264px;
	--mp-r-sm: 8px;
	--mp-r-md: 14px;
	--mp-r-lg: 20px;
	--mp-r-pill: 999px;
	--mp-gutter: 28px;
	--mp-rail-gap: 16px;
	--mp-topbar-h: 74px;

	/* How far the admin bar pushes fixed chrome down. */
	--mp-admin-offset: 0px;
}

/* ==========================================================================
   2. Base
   ========================================================================== */
html {
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
	scroll-padding-top: calc(var(--mp-topbar-h) + 20px);
}

body {
	background: var(--mp-bg);
	color: var(--mp-text);
	font-family: var(--mp-font-ui);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: hidden;
}

body.admin-bar {
	--mp-admin-offset: 32px;
}

img {
	max-width: 100%;
	height: auto;
}

a {
	color: inherit;
}

a:where(:not(.wp-element-button)) {
	text-decoration: none;
}

:focus-visible {
	outline: 2px solid var(--mp-amber-1);
	outline-offset: 3px;
	border-radius: 4px;
}

.screen-reader-text {
	border: 0;
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.skip-link.screen-reader-text:focus {
	background: var(--mp-amber-1);
	border-radius: var(--mp-r-pill);
	clip-path: none;
	color: var(--mp-on-brand);
	display: block;
	font-size: var(--mp-fs-sm);
	font-weight: 800;
	height: auto;
	left: 12px;
	line-height: 1;
	padding: 14px 22px;
	text-decoration: none;
	top: calc(12px + var(--mp-admin-offset));
	width: auto;
	z-index: 200;
}

/* Hide the scrollbar on the shelves and chip rows only. */
.mp-sidebar__scroll,
.mp-rail {
	scrollbar-width: none;
	-ms-overflow-style: none;
}

.mp-sidebar__scroll::-webkit-scrollbar,
.mp-rail::-webkit-scrollbar {
	display: none;
}

/* ==========================================================================
   3. Icon helper
   The masked glyphs let core blocks stay plain text while still reading as
   the icon buttons the design calls for.
   ========================================================================== */
.mp-i::before {
	background-color: currentColor;
	content: "";
	display: block;
	flex: none;
	height: 20px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 20px;
}

.mp-i--sm::before {
	height: 16px;
	width: 16px;
}

.mp-i--lg::before {
	height: 24px;
	width: 24px;
}

.mp-ico-home { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5V20a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E"); }
.mp-ico-chart { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 17.5 9 11l4 4 8-8.5'/%3E%3Cpath d='M15 6.5h6v6'/%3E%3C/svg%3E"); }
.mp-ico-mic { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3M8.5 21h7'/%3E%3C/svg%3E"); }
.mp-ico-radio { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='2.4'/%3E%3Cpath d='M7.8 7.8a6 6 0 0 0 0 8.4M16.2 16.2a6 6 0 0 0 0-8.4M5 5a10 10 0 0 0 0 14M19 19a10 10 0 0 0 0-14'/%3E%3C/svg%3E"); }
.mp-ico-users { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9.5' cy='8' r='3.4'/%3E%3Cpath d='M3.5 20a6 6 0 0 1 12 0M16.2 5.3a3.4 3.4 0 0 1 0 5.4M17.8 14.4A6 6 0 0 1 21 20'/%3E%3C/svg%3E"); }
.mp-ico-disc { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='2.6'/%3E%3C/svg%3E"); }
.mp-ico-clock { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5.2l3.4 2'/%3E%3C/svg%3E"); }
.mp-ico-heart { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 20.4S3.6 14.9 3.6 9.2A4.7 4.7 0 0 1 12 6.6a4.7 4.7 0 0 1 8.4 2.6c0 5.7-8.4 11.2-8.4 11.2z'/%3E%3C/svg%3E"); }
.mp-ico-download { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5v11M7.5 10.5 12 15l4.5-4.5M4.5 20h15'/%3E%3C/svg%3E"); }
.mp-ico-play { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 5.2v13.6L19 12z' fill='%23000'/%3E%3C/svg%3E"); }
.mp-ico-pause { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='7' y='5' width='3.6' height='14' rx='1.4' fill='%23000'/%3E%3Crect x='13.4' y='5' width='3.6' height='14' rx='1.4' fill='%23000'/%3E%3C/svg%3E"); }
.mp-ico-prev { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M19 6v12L10 12z' fill='%23000'/%3E%3Cpath d='M6 6v12' stroke-linecap='round'/%3E%3C/svg%3E"); }
.mp-ico-next { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linejoin='round'%3E%3Cpath d='M5 6v12l9-6z' fill='%23000'/%3E%3Cpath d='M18 6v12' stroke-linecap='round'/%3E%3C/svg%3E"); }
.mp-ico-shuffle { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 3.5 20.5 8 16 12.5M16 11.5 20.5 16 16 20.5M20.5 8H17c-2.4 0-3.6 1.2-5.2 3.4C10 13.9 8.8 16 6.2 16H3.5M3.5 8h2.7c1.5 0 2.6.7 3.6 1.8M20.5 16H17c-1.5 0-2.6-.7-3.6-1.8'/%3E%3C/svg%3E"); }
.mp-ico-repeat { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16.5 2.5 20.5 6.5 16.5 10.5M3.5 12.5v-2a4 4 0 0 1 4-4h13M7.5 21.5 3.5 17.5 7.5 13.5M20.5 11.5v2a4 4 0 0 1-4 4h-13'/%3E%3C/svg%3E"); }
.mp-ico-vol { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 9.5h3.4L12 5.5v13L7.4 14.5H4z'/%3E%3Cpath d='M15.4 9.4a3.6 3.6 0 0 1 0 5.2M18 6.8a7.2 7.2 0 0 1 0 10.4'/%3E%3C/svg%3E"); }
.mp-ico-menu { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h16M4 17h16'/%3E%3C/svg%3E"); }
.mp-ico-close { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M6 6l12 12M18 6 6 18'/%3E%3C/svg%3E"); }
.mp-ico-bell { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 8.5a6 6 0 1 0-12 0c0 6.5-2.5 6.5-2.5 8.5h17c0-2-2.5-2-2.5-8.5z'/%3E%3Cpath d='M10.2 20.5a2.2 2.2 0 0 0 3.6 0'/%3E%3C/svg%3E"); }
.mp-ico-grid { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Crect x='4' y='4' width='7' height='7' rx='2'/%3E%3Crect x='13' y='4' width='7' height='7' rx='2'/%3E%3Crect x='4' y='13' width='7' height='7' rx='2'/%3E%3Crect x='13' y='13' width='7' height='7' rx='2'/%3E%3C/svg%3E"); }
.mp-ico-pin { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5s7-6.4 7-11.2A7 7 0 1 0 5 10.3c0 4.8 7 11.2 7 11.2z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); }
.mp-ico-mail { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='3'/%3E%3Cpath d='m4 7.5 8 5.5 8-5.5'/%3E%3C/svg%3E"); }
.mp-ico-phone { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3.5h2.6l1.6 4-2 1.4a12 12 0 0 0 5.9 5.9l1.4-2 4 1.6V17a3.5 3.5 0 0 1-3.8 3.5A16.5 16.5 0 0 1 3.5 7.3 3.5 3.5 0 0 1 7 3.5z'/%3E%3C/svg%3E"); }
.mp-ico-ticket { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linejoin='round'%3E%3Cpath d='M3.5 9V7a2 2 0 0 1 2-2h13a2 2 0 0 1 2 2v2a2.6 2.6 0 0 0 0 6v2a2 2 0 0 1-2 2h-13a2 2 0 0 1-2-2v-2a2.6 2.6 0 0 0 0-6z'/%3E%3Cpath d='M13.5 5v14'/%3E%3C/svg%3E"); }
.mp-ico-sort { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Cpath d='M4 7h16M4 12h10M4 17h5'/%3E%3C/svg%3E"); }
.mp-ico-down { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9.5 6 6 6-6'/%3E%3C/svg%3E"); }
.mp-ico-mobile { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='6.5' y='2.5' width='11' height='19' rx='2.6'/%3E%3Cpath d='M10.5 18.5h3'/%3E%3C/svg%3E"); }
.mp-ico-desktop { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='2.5' y='4' width='19' height='12.5' rx='2.4'/%3E%3Cpath d='M12 16.5v4M8 20.5h8'/%3E%3C/svg%3E"); }
.mp-ico-facebook { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M14.5 8.5h2.3V5.4c-.4-.06-1.7-.2-3.2-.2-3.2 0-5.3 1.9-5.3 5.4v2.6H5.6v3.5h2.7v8.8h3.3v-8.8h2.8l.4-3.5h-3.2v-2.2c0-1 .3-1.7 1.9-1.7z' fill='%23000'/%3E%3C/svg%3E"); }
.mp-ico-x { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M17.4 3h3.1l-6.8 7.8L21.8 21h-6.2l-4.9-6.4L5.1 21H2l7.3-8.3L2.2 3h6.3l4.4 5.8zM16.3 19.1h1.7L7.8 4.8H6z' fill='%23000'/%3E%3C/svg%3E"); }
.mp-ico-instagram { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Crect x='3.5' y='3.5' width='17' height='17' rx='5'/%3E%3Ccircle cx='12' cy='12' r='3.8'/%3E%3Ccircle cx='17' cy='7' r='1' fill='%23000' stroke='none'/%3E%3C/svg%3E"); }
.mp-ico-youtube { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Crect x='2.5' y='5.5' width='19' height='13' rx='4'/%3E%3Cpath d='M10.5 9.5 15 12l-4.5 2.5z' fill='%23000'/%3E%3C/svg%3E"); }

/* ==========================================================================
   4. Application shell
   ========================================================================== */
.mp-app {
	display: grid;
	grid-template-columns: var(--mp-sidebar-w) minmax(0, 1fr);
	min-height: 100vh;
}

.mp-shell {
	min-width: 0;
}

.mp-main {
	min-width: 0;
	padding-bottom: 40px;
	padding-inline: var(--mp-gutter);
}

.mp-main > .wp-block-group,
.mp-main > .wp-block-columns {
	max-width: 1404px;
	margin-inline: auto;
}

/* ==========================================================================
   5. Brand mark
   ========================================================================== */
.mp-brand {
	align-items: center;
	display: flex;
	gap: 11px;
}

.mp-brand .wp-block-site-logo {
	margin: 0;
}

/* An uploaded logo keeps its own aspect ratio. */
.mp-brand .wp-block-site-logo img {
	display: block;
	height: 34px;
	width: auto;
}

.mp-brand .wp-block-site-title {
	color: var(--mp-text);
	font-family: var(--mp-font-display);
	font-size: 1.25rem;
	font-weight: 800;
	letter-spacing: -.01em;
	line-height: 1.1;
	margin: 0;
	white-space: nowrap;
}

.mp-brand .wp-block-site-title a {
	color: inherit;
	text-decoration: none;
}

.mp-brand .wp-block-site-title a:hover {
	color: var(--mp-text);
}

/* ==========================================================================
   6. Sidebar
   ========================================================================== */
.mp-sidebar {
	align-self: start;
	background: var(--mp-surface-1);
	border-right: 1px solid var(--mp-line);
	display: flex;
	flex-direction: column;
	height: 100vh;
	position: sticky;
	top: 0;
	z-index: 60;
}

.mp-sidebar__head {
	align-items: center;
	display: flex;
	flex: none;
	gap: 10px;
	height: var(--mp-topbar-h);
	padding: 0 20px;
}

.mp-sidebar__scroll {
	display: flex;
	flex: 1;
	flex-direction: column;
	gap: 22px;
	overflow-y: auto;
	padding: 10px 14px 24px;
}

.mp-navgroup + .mp-navgroup {
	margin-top: 18px;
}

.mp-navgroup__label {
	color: var(--mp-muted);
	font-size: var(--mp-fs-2xs);
	font-weight: 700;
	letter-spacing: .06em;
	padding: 0 12px 8px;
	text-transform: uppercase;
}

/* The sidebar navigation and the library list share one link treatment. */
.mp-sidebar .wp-block-navigation__container,
.mp-sidebar .mp-navlist {
	display: block;
	gap: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}

.mp-sidebar .wp-block-navigation-item,
.mp-sidebar .mp-navlist li {
	display: block;
	width: 100%;
}

.mp-sidebar .wp-block-navigation-item__content,
.mp-sidebar .mp-navlist a {
	align-items: center;
	border-radius: 10px;
	color: var(--mp-text-2);
	display: flex;
	font-size: var(--mp-fs-sm);
	font-weight: 600;
	gap: 12px;
	padding: 11px 13px;
	transition: background-color .16s ease, color .16s ease;
}

.mp-sidebar .wp-block-navigation-item__content:hover,
.mp-sidebar .mp-navlist a:hover {
	background: rgba(255, 255, 255, .05);
	color: var(--mp-text);
}

.mp-sidebar .wp-block-navigation-item__content::before,
.mp-sidebar .mp-navlist a::before {
	background-color: currentColor;
	content: "";
	flex: none;
	height: 20px;
	-webkit-mask: var(--mp-icon, none) center/contain no-repeat;
	mask: var(--mp-icon, none) center/contain no-repeat;
	width: 20px;
}

/*
 * Menu glyphs. The Navigation block cannot carry a class per item, so its
 * links are matched on their anchor; the library list sets its own icon
 * class per list item and simply inherits it down to the link.
 */
.mp-sidebar__scroll { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Ccircle cx='12' cy='12' r='2.6'/%3E%3C/svg%3E"); }
.mp-sidebar .wp-block-navigation-item__content[href$="#main"] { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 10.5 12 3l9 7.5V20a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E"); }
.mp-sidebar .wp-block-navigation-item__content[href$="#live"] { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='2.4'/%3E%3Cpath d='M7.8 7.8a6 6 0 0 0 0 8.4M16.2 16.2a6 6 0 0 0 0-8.4M5 5a10 10 0 0 0 0 14M19 19a10 10 0 0 0 0-14'/%3E%3C/svg%3E"); }
.mp-sidebar .wp-block-navigation-item__content[href$="#charts"] { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 17.5 9 11l4 4 8-8.5'/%3E%3Cpath d='M15 6.5h6v6'/%3E%3C/svg%3E"); }
.mp-sidebar .wp-block-navigation-item__content[href$="#podcasts"] { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='9' y='3' width='6' height='11' rx='3'/%3E%3Cpath d='M5 11a7 7 0 0 0 14 0M12 18v3M8.5 21h7'/%3E%3C/svg%3E"); }
.mp-sidebar .wp-block-navigation-item__content[href$="#artists"] { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='9.5' cy='8' r='3.4'/%3E%3Cpath d='M3.5 20a6 6 0 0 1 12 0M16.2 5.3a3.4 3.4 0 0 1 0 5.4M17.8 14.4A6 6 0 0 1 21 20'/%3E%3C/svg%3E"); }
.mp-sidebar .wp-block-navigation-item__content[href$="#app"] { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 3.5v11M7.5 10.5 12 15l4.5-4.5M4.5 20h15'/%3E%3C/svg%3E"); }

.mp-sidebar .wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.mp-sidebar .mp-navlist a[aria-current="page"],
.mp-sidebar .mp-navlist .is-current > a {
	background: var(--mp-brand-grad);
	box-shadow: var(--mp-shadow-brand);
	color: var(--mp-on-brand);
	font-weight: 800;
}

.mp-sidebar .mp-sidebar__close {
	display: none;
	margin-left: auto;
}

/* The scrim only exists while the drawer is open on small screens. */
.mp-scrim {
	display: none;
}

/* ==========================================================================
   7. Top bar
   ========================================================================== */
.mp-topbar {
	align-items: center;
	backdrop-filter: blur(14px);
	background: rgba(8, 8, 10, .86);
	border-bottom: 1px solid var(--mp-line);
	display: flex;
	gap: 14px;
	height: var(--mp-topbar-h);
	padding-inline: var(--mp-gutter);
	position: sticky;
	top: var(--mp-admin-offset);
	z-index: 50;
}

.mp-topbar .mp-topbar__menu,
.mp-topbar .mp-topbar__brand {
	display: none;
}

.mp-topbar__right {
	align-items: center;
	display: flex;
	gap: 10px;
	margin-left: auto;
}

/* Search ------------------------------------------------------------------ */
.mp-search {
	flex: 1;
	margin: 0;
	max-width: 420px;
}

.mp-search .wp-block-search__inside-wrapper {
	align-items: center;
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: var(--mp-r-pill);
	display: flex;
	gap: 6px;
	height: 44px;
	padding: 0 6px 0 0;
	position: relative;
}

.mp-search .wp-block-search__input {
	background: transparent;
	border: 0;
	color: var(--mp-text);
	font-size: var(--mp-fs-sm);
	height: 100%;
	padding: 0 0 0 44px;
}

.mp-search .wp-block-search__input::placeholder {
	color: var(--mp-muted);
}

.mp-search .wp-block-search__input:focus {
	outline: none;
}

.mp-search .wp-block-search__inside-wrapper::before {
	background-color: var(--mp-muted);
	content: "";
	height: 18px;
	left: 15px;
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M16.5 16.5 21 21'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M16.5 16.5 21 21'/%3E%3C/svg%3E") center/contain no-repeat;
	pointer-events: none;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 18px;
}

/* A round submit button, centred in the pill and inset from its edge. */
.mp-search .wp-block-search__button {
	align-items: center;
	background: var(--mp-brand-grad);
	border: 0;
	border-radius: 50%;
	box-shadow: var(--mp-shadow-brand);
	color: var(--mp-on-brand);
	display: flex;
	flex: none;
	height: 32px;
	justify-content: center;
	margin: 0;
	min-width: 0;
	padding: 0;
	width: 32px;
}

.mp-search .wp-block-search__button svg {
	fill: currentColor;
	height: 18px;
	width: 18px;
}

/* Buttons ----------------------------------------------------------------- */
.mp-btn .wp-block-button__link,
.wp-block-button.mp-btn > .wp-block-button__link {
	align-items: center;
	display: inline-flex;
	gap: 8px;
	height: 42px;
	justify-content: center;
	line-height: 1;
	padding: 0 20px;
	transition: filter .14s ease, background-color .14s ease, transform .14s ease;
	white-space: nowrap;
}

.wp-block-button .wp-block-button__link:active {
	transform: translateY(1px);
}

/* Ghost outline block style */
.wp-block-button.is-style-mp-ghost > .wp-block-button__link {
	background: none;
	border: 1px solid var(--mp-line-2);
	box-shadow: none;
	color: var(--mp-text-2);
}

.wp-block-button.is-style-mp-ghost > .wp-block-button__link:hover {
	background: rgba(255, 255, 255, .05);
	color: var(--mp-text);
}

/* Solid light block style */
.wp-block-button.is-style-mp-solid > .wp-block-button__link {
	background: var(--mp-text);
	color: #101014;
}

.wp-block-button.is-style-mp-solid > .wp-block-button__link:hover {
	background: #fff;
	color: #101014;
}

/* Icon only buttons keep their label in the markup for assistive tech. */
.mp-iconbtn > .wp-block-button__link,
a.mp-iconbtn,
.mp-iconbtn.wp-block-button__link {
	align-items: center;
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: 12px;
	color: var(--mp-text-2);
	display: inline-flex;
	font-size: 0;
	height: 42px;
	justify-content: center;
	padding: 0;
	transition: color .15s ease, border-color .15s ease;
	width: 42px;
}

.mp-iconbtn > .wp-block-button__link:hover,
a.mp-iconbtn:hover {
	border-color: var(--mp-line-2);
	color: var(--mp-text);
}

.mp-iconbtn > .wp-block-button__link::before,
a.mp-iconbtn::before {
	background-color: currentColor;
	content: "";
	height: 20px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 20px;
}

.mp-bell > .wp-block-button__link {
	position: relative;
}

.mp-bell > .wp-block-button__link::after {
	background: var(--mp-ember);
	border: 2px solid var(--mp-surface-2);
	border-radius: 50%;
	content: "";
	height: 7px;
	position: absolute;
	right: 9px;
	top: 8px;
	width: 7px;
}

/* Buttons that show a glyph before their label. */
.mp-btn-i > .wp-block-button__link::before {
	background-color: currentColor;
	content: "";
	flex: none;
	height: 16px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 16px;
}

/* Location chip ----------------------------------------------------------- */
.mp-selectish {
	align-items: center;
	color: var(--mp-text-2);
	display: flex;
	font-size: var(--mp-fs-sm);
	font-weight: 600;
	gap: 8px;
	height: 42px;
	padding: 0 12px;
}

.mp-selectish:hover {
	color: var(--mp-text);
}

.mp-selectish::before,
.mp-selectish::after {
	background-color: currentColor;
	content: "";
	flex: none;
	height: 16px;
	width: 16px;
}

.mp-selectish::before {
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5s7-6.4 7-11.2A7 7 0 1 0 5 10.3c0 4.8 7 11.2 7 11.2z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5s7-6.4 7-11.2A7 7 0 1 0 5 10.3c0 4.8 7 11.2 7 11.2z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E") center/contain no-repeat;
}

.mp-selectish::after {
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9.5 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9.5 6 6 6-6'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Account chip ------------------------------------------------------------ */
.mp-account {
	align-items: center;
	border: 1px solid var(--mp-line);
	border-radius: var(--mp-r-pill);
	display: flex;
	gap: 10px;
	padding: 4px 14px 4px 4px;
}

.mp-account:hover {
	border-color: var(--mp-line-2);
}

.mp-account .wp-block-image,
.mp-account figure {
	flex: none;
	margin: 0;
}

.mp-account img {
	border-radius: 50%;
	height: 34px;
	object-fit: cover;
	width: 34px;
}

.mp-account p {
	font-size: var(--mp-fs-sm);
	font-weight: 700;
	margin: 0;
}

/* ==========================================================================
   8. Welcome row
   ========================================================================== */
.mp-welcome {
	align-items: flex-end;
	display: flex;
	gap: 20px;
	padding: 30px 0 18px;
}

.mp-welcome h1 {
	font-size: var(--mp-fs-2xl);
}

.mp-welcome p {
	color: var(--mp-muted);
	font-size: var(--mp-fs-sm);
	margin: 6px 0 0;
}

.mp-welcome__nav {
	display: flex;
	gap: 10px;
	margin-left: auto;
}

/* ==========================================================================
   9. Sections and shelves
   ========================================================================== */
.mp-sec {
	padding-block: 30px;
	scroll-margin-top: calc(var(--mp-topbar-h) + var(--mp-admin-offset) + 12px);
}

.mp-sec--tight {
	padding-block: 20px;
}

.mp-sec__head {
	align-items: center;
	display: flex;
	gap: 16px;
	margin-bottom: 18px;
}

.mp-sec__head h2 {
	font-size: var(--mp-fs-xl);
}

.mp-sec__head p {
	color: var(--mp-muted);
	font-size: var(--mp-fs-sm);
	margin: 4px 0 0;
}

.mp-sec__tools {
	align-items: center;
	display: flex;
	gap: 10px;
	margin-left: auto;
}

.mp-link-more {
	border-bottom: 1px solid transparent;
	color: var(--mp-amber-1);
	font-size: var(--mp-fs-sm);
	font-weight: 700;
}

.mp-link-more:hover {
	border-bottom-color: currentColor;
	color: var(--mp-amber-1);
}

/* Round shelf arrows ------------------------------------------------------ */
.mp-railbtn,
.mp-railnav .owl-prev,
.mp-railnav .owl-next {
	align-items: center;
	background: none;
	border: 1px solid var(--mp-line-2);
	border-radius: 50%;
	color: var(--mp-text-2);
	cursor: pointer;
	display: inline-flex;
	flex: none;
	height: 38px;
	justify-content: center;
	padding: 0;
	width: 38px;
}

.mp-railbtn:hover,
.mp-railnav .owl-prev:hover,
.mp-railnav .owl-next:hover {
	background: rgba(255, 255, 255, .06);
	color: var(--mp-text);
}

.mp-railbtn::before,
.mp-railnav .owl-prev::before,
.mp-railnav .owl-next::before {
	background-color: currentColor;
	content: "";
	height: 16px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 16px;
}

.mp-railnav .owl-prev {
	--mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m14.5 6-6 6 6 6'/%3E%3C/svg%3E");
}

.mp-railnav .owl-next {
	--mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m9.5 6 6 6-6 6'/%3E%3C/svg%3E");
}

.mp-railbtn--brand {
	background: var(--mp-brand-grad);
	border-color: transparent;
	color: var(--mp-on-brand);
}

.mp-railbtn--brand:hover {
	background: var(--mp-brand-grad);
	color: var(--mp-on-brand);
	filter: brightness(1.07);
}

/* The section arrows live in the heading row and drive the carousel below. */
.mp-railnav {
	display: flex;
	gap: 10px;
}

.mp-railnav .owl-prev,
.mp-railnav .owl-next {
	background: none;
	height: 38px;
	margin: 0;
	padding: 0;
	position: static;
	width: 38px;
}

.mp-railnav .owl-prev.disabled,
.mp-railnav .owl-next.disabled {
	opacity: .35;
	pointer-events: none;
}

/* ==========================================================================
   10. Owl Carousel shelves
   ========================================================================== */
.mp-rail {
	overflow: hidden;
	padding-bottom: 4px;
}

/*
 * Owl hides a carousel until it has booted. The shelves stay visible so the
 * cards still read as a scrollable row when scripts do not run.
 */
.mp-rail.owl-carousel {
	display: block;
}

.mp-rail .owl-stage {
	align-items: stretch;
	display: flex;
}

.mp-rail .owl-item {
	display: flex;
	float: none;
}

.mp-rail .owl-item > * {
	margin-block: 0;
	width: 100%;
}

/* Graceful layout before Owl boots, and if scripts never run. */
.mp-rail:not(.owl-loaded) {
	display: flex;
	gap: var(--mp-rail-gap);
	overflow-x: auto;
	scroll-snap-type: x proximity;
}

.mp-rail:not(.owl-loaded) > * {
	margin-block: 0;
	scroll-snap-align: start;
}

.mp-rail--2:not(.owl-loaded) > * { flex: 0 0 calc((100% - 1 * var(--mp-rail-gap)) / 2); }
.mp-rail--4:not(.owl-loaded) > * { flex: 0 0 calc((100% - 3 * var(--mp-rail-gap)) / 4); }
.mp-rail--5:not(.owl-loaded) > * { flex: 0 0 calc((100% - 4 * var(--mp-rail-gap)) / 5); }
.mp-rail--8:not(.owl-loaded) > * { flex: 0 0 calc((100% - 7 * var(--mp-rail-gap)) / 8); }

/* Owl's own drag cursor and image guards are not wanted here. */
.mp-rail.owl-carousel .owl-item img {
	transform-style: flat;
	width: 100%;
}

.mp-rail.owl-drag .owl-item {
	-webkit-user-select: auto;
	user-select: auto;
}

 /*11. Live cards
   ========================================================================== */
.mp-hero.wp-block-cover {
	border-radius: var(--mp-r-lg);
	justify-content: flex-end;
	min-height: 268px;
	padding: 26px;
}

.mp-hero .wp-block-cover__inner-container {
	text-align: left;
	width: 100%;
}

.mp-hero h3 {
	font-size: var(--mp-fs-xl);
	margin: 0 0 8px;
}

.mp-hero p {
	color: var(--mp-text-2);
	font-size: var(--mp-fs-sm);
	margin: 0 0 18px;
	max-width: 46ch;
}

.mp-hero .wp-block-buttons {
	justify-content: flex-start;
}

.mp-pill {
	align-items: center;
	backdrop-filter: blur(6px);
	background: rgba(10, 10, 12, .6);
	border: 1px solid var(--mp-line-2);
	border-radius: var(--mp-r-pill);
	display: inline-flex;
	font-size: var(--mp-fs-xs);
	font-weight: 700;
	gap: 8px;
	margin: 0 0 14px;
	padding: 6px 13px;
}

.mp-pill::before {
	animation: mp-pulse 1.8s ease-in-out infinite;
	background: var(--mp-live);
	border-radius: 50%;
	content: "";
	height: 7px;
	width: 7px;
}

.mp-pill--mint::before {
	background: var(--mp-mint);
}

@keyframes mp-pulse {
	0%, 100% { opacity: 1; transform: scale(1); }
	50% { opacity: .35; transform: scale(.72); }
}

/* ==========================================================================
   12. Media tiles
   ========================================================================== */
.mp-tile {
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: var(--mp-r-md);
	padding: 14px;
	transition: background-color .18s ease, border-color .18s ease;
}

.mp-tile:hover {
	background: var(--mp-surface-3);
	border-color: var(--mp-line-2);
}

.mp-tile--feature {
	background: var(--mp-brand-grad);
	border-color: transparent;
	box-shadow: var(--mp-shadow-brand);
}

.mp-tile--feature:hover {
	background: var(--mp-brand-grad);
	filter: brightness(1.05);
}

.mp-tile--feature .mp-tile__title {
	color: var(--mp-on-brand);
}

.mp-tile--feature .mp-tile__meta {
	color: rgba(26, 18, 8, .66);
}

.mp-cover {
	background: var(--mp-slate);
	border-radius: 10px;
	overflow: hidden;
	position: relative;
}

.mp-cover .wp-block-image,
.mp-cover figure {
	margin: 0;
}

.mp-cover img {
	aspect-ratio: 1 / 1;
	display: block;
	object-fit: cover;
	width: 100%;
}

.mp-cover__tag {
	backdrop-filter: blur(4px);
	background: rgba(8, 8, 10, .72);
	border-radius: var(--mp-r-pill);
	font-size: var(--mp-fs-2xs);
	font-weight: 700;
	left: 8px;
	margin: 0;
	padding: 4px 9px;
	position: absolute;
	top: 8px;
}

.mp-cover__play {
	bottom: 10px;
	position: absolute;
	right: 10px;
}

.mp-cover__play .wp-block-button__link {
	align-items: center;
	background: var(--mp-brand-grad);
	border: 0;
	border-radius: 50%;
	box-shadow: var(--mp-shadow-brand);
	color: var(--mp-on-brand);
	display: grid;
	font-size: 0;
	height: 40px;
	opacity: 0;
	padding: 0;
	place-items: center;
	transform: translateY(8px);
	transition: opacity .18s ease, transform .18s ease;
	width: 40px;
}

.mp-cover__play .wp-block-button__link::before {
	background-color: currentColor;
	content: "";
	height: 16px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 16px;
}

.mp-tile:hover .mp-cover__play .wp-block-button__link,
.mp-cover__play .wp-block-button__link:focus-visible {
	opacity: 1;
	transform: translateY(0);
}

.mp-tile__title {
	display: block;
	font-family: var(--mp-font-display);
	font-size: var(--mp-fs-base);
	font-weight: 700;
	letter-spacing: -.015em;
	margin: 12px 0 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mp-tile__meta {
	color: var(--mp-muted);
	display: block;
	font-size: var(--mp-fs-xs);
	margin: 3px 0 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* ==========================================================================
   14. Podcast episode cards
   ========================================================================== */
.mp-eps {
	display: grid;
	gap: var(--mp-rail-gap);
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.mp-ep {
	align-items: start;
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: var(--mp-r-md);
	display: grid;
	gap: 16px;
	grid-template-columns: 96px minmax(0, 1fr);
	padding: 16px;
	transition: background-color .18s ease, border-color .18s ease;
}

.mp-ep:hover {
	background: var(--mp-surface-3);
	border-color: var(--mp-line-2);
}

.mp-ep__art {
	margin: 0;
}

.mp-ep__art img {
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	display: block;
	object-fit: cover;
	width: 100%;
}

.mp-ep__show {
	color: var(--mp-amber-1);
	font-size: var(--mp-fs-xs);
	font-weight: 700;
	margin: 0;
}

.mp-ep__title {
	font-family: var(--mp-font-display);
	font-size: var(--mp-fs-base);
	font-weight: 700;
	margin: 4px 0 6px;
}

.mp-ep__desc {
	color: var(--mp-muted);
	font-size: var(--mp-fs-xs);
	margin: 0;
}

.mp-ep__foot {
	align-items: center;
	display: flex;
	gap: 12px;
	margin-top: 12px;
}

.mp-ep__time {
	color: var(--mp-muted);
	font-size: var(--mp-fs-xs);
	font-variant-numeric: tabular-nums;
	margin: 0;
}

.mp-ep__bar {
	background: var(--mp-surface-3);
	border-radius: 2px;
	flex: 1;
	height: 4px;
	overflow: hidden;
}

.mp-ep__fill.wp-block-spacer {
	background: var(--mp-brand-grad);
	height: 4px;
	margin: 0;
}

.is-progress-15 { width: 15%; }
.is-progress-35 { width: 35%; }
.is-progress-58 { width: 58%; }
.is-progress-72 { width: 72%; }
.is-progress-90 { width: 90%; }

.mp-ep__play .wp-block-button__link {
	align-items: center;
	background: none;
	border: 1px solid var(--mp-line-2);
	border-radius: 50%;
	color: var(--mp-text);
	display: grid;
	font-size: 0;
	height: 34px;
	padding: 0;
	place-items: center;
	width: 34px;
}

.mp-ep__play .wp-block-button__link::before {
	background-color: currentColor;
	content: "";
	height: 15px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 15px;
}

.mp-ep__play .wp-block-button__link:hover {
	background: var(--mp-brand-grad);
	border-color: transparent;
	color: var(--mp-on-brand);
}

/* ==========================================================================
   17. Artists
   ========================================================================== */
.mp-artist {
	align-items: center;
	border-radius: var(--mp-r-md);
	display: flex;
	flex-direction: column;
	gap: 10px;
	padding: 8px;
	text-align: center;
}

.mp-artist:hover {
	background: var(--mp-surface-2);
}

.mp-artist__ph {
	margin: 0;
	width: 100%;
}

.mp-artist__ph img {
	aspect-ratio: 1 / 1;
	border: 2px solid transparent;
	border-radius: 50%;
	display: block;
	object-fit: cover;
	transition: border-color .18s ease;
	width: 100%;
}

.mp-artist:hover .mp-artist__ph img {
	border-color: var(--mp-amber-1);
}

.mp-artist h3 {
	font-size: var(--mp-fs-sm);
	font-weight: 700;
	margin: 0;
	min-height: 2.4em;
}

.mp-artist p {
	color: var(--mp-muted);
	font-size: var(--mp-fs-xs);
	font-weight: 600;
	margin: 0;
}

/* ==========================================================================
   21. App download call to action
   ========================================================================== */
.mp-appcta {
	align-items: center;
	background: var(--mp-brand-grad);
	border-radius: var(--mp-r-lg);
	color: var(--mp-on-brand);
	display: grid;
	gap: 20px;
	grid-template-columns: minmax(0, 1fr) 420px;
	isolation: isolate;
	overflow: hidden;
	padding: 52px 52px 52px 56px;
	position: relative;
}

.mp-appcta::before {
	background: rgba(255, 255, 255, .14);
	border-radius: 50%;
	content: "";
	height: 520px;
	position: absolute;
	right: -80px;
	top: -120px;
	width: 520px;
	z-index: -1;
}

.mp-appcta h2 {
	color: var(--mp-on-brand);
	font-size: clamp(28px, 3.4vw, 38px);
	max-width: 16ch;
}

.mp-appcta p:not(.mp-store) {
	color: rgba(26, 18, 8, .72);
	font-size: var(--mp-fs-base);
	font-weight: 600;
	margin: 16px 0 26px;
	max-width: 52ch;
}

.mp-stores {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

.mp-store {
	align-items: center;
	background: #111015;
	border-radius: 12px;
	color: #fff;
	display: inline-flex;
	gap: 10px;
	padding: 10px 20px 10px 16px;
	transition: transform .15s ease;
}

.mp-store:hover {
	color: #fff;
	transform: translateY(-2px);
}

.mp-store::before {
	background-color: currentColor;
	content: "";
	flex: none;
	height: 24px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 24px;
}

.mp-store a {
	color: #b9b7c4;
	display: block;
	font-size: var(--mp-fs-2xs);
	line-height: 1.25;
}

.mp-store a:hover {
	color: #b9b7c4;
}

.mp-store strong {
	color: #fff;
	display: block;
	font-family: var(--mp-font-display);
	font-size: var(--mp-fs-base);
	font-weight: 700;
}

/* Phone mock -------------------------------------------------------------- */
.mp-phones {
	align-items: flex-end;
	display: flex;
	height: 330px;
	justify-content: center;
	position: relative;
}

.mp-phone {
	background: #0d0d11;
	border: 5px solid #17171d;
	border-radius: 26px;
	box-shadow: 0 30px 60px -22px rgba(0, 0, 0, .6);
	height: 330px;
	overflow: hidden;
	padding: 26px 14px 14px;
	position: absolute;
	width: 168px;
}

.mp-phone::before {
	background: #26262f;
	border-radius: 3px;
	content: "";
	height: 6px;
	left: 50%;
	position: absolute;
	top: 8px;
	transform: translateX(-50%);
	width: 56px;
}

.mp-phone--back {
	filter: brightness(.7);
	transform: translateX(-96px) rotate(-8deg) scale(.92);
}

.mp-phone--front {
	transform: translateX(48px);
}

.mp-phone .wp-block-image,
.mp-phone figure {
	margin: 0 0 10px;
}

.mp-phone img {
	aspect-ratio: 1 / 1;
	border-radius: 12px;
	display: block;
	object-fit: cover;
	width: 100%;
}

.mp-phone__line.wp-block-spacer {
	background: #23232c;
	border-radius: 4px;
	height: 8px;
	margin: 0 0 10px;
}

.mp-phone__line--short {
	width: 55%;
}

.mp-phone__bars {
	align-items: flex-end;
	display: flex;
	gap: 4px;
	height: 34px;
	margin-top: 4px;
}

.mp-phone__bar.wp-block-spacer {
	animation: mp-eq 1.1s ease-in-out infinite;
	background: linear-gradient(180deg, var(--mp-amber-1), var(--mp-ember));
	border-radius: 2px;
	flex: 1;
	height: 30%;
	margin: 0;
	min-height: 0;
}

.mp-phone__bar:nth-child(2) { animation-delay: .15s; }
.mp-phone__bar:nth-child(3) { animation-delay: .3s; }
.mp-phone__bar:nth-child(4) { animation-delay: .45s; }
.mp-phone__bar:nth-child(5) { animation-delay: .6s; }
.mp-phone__bar:nth-child(6) { animation-delay: .75s; }
.mp-phone__bar:nth-child(7) { animation-delay: .9s; }

@keyframes mp-eq {
	0%, 100% { height: 30%; }
	50% { height: 100%; }
}

/* ==========================================================================
   22. Persistent player
   ========================================================================== */
/*
 * The player is a card inside the library rail. It is pushed to the foot of
 * the rail by the auto margin, and scrolls with it rather than floating.
 */
.mp-player {
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: var(--mp-r-md);
	margin-top: auto;
	padding: 14px;
	position: relative;
}

.mp-player__head {
	align-items: center;
	color: var(--mp-muted);
	display: flex;
	font-size: var(--mp-fs-xs);
	font-weight: 700;
	justify-content: space-between;
	margin-bottom: 12px;
}

.mp-player__head p {
	margin: 0;
}

.mp-player__art {
	margin: 0 0 12px;
}

.mp-player__art img {
	aspect-ratio: 1 / 1;
	border-radius: 10px;
	display: block;
	object-fit: cover;
	width: 100%;
}

.mp-player__meta {
	margin-bottom: 10px;
	text-align: center;
}

.mp-player__title {
	font-family: var(--mp-font-display);
	font-size: var(--mp-fs-base);
	font-weight: 700;
	margin: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.mp-player__by {
	color: var(--mp-muted);
	font-size: var(--mp-fs-xs);
	margin: 0;
}

.mp-seek {
	align-items: center;
	color: var(--mp-muted);
	display: flex;
	font-size: var(--mp-fs-2xs);
	font-variant-numeric: tabular-nums;
	gap: 8px;
}

.mp-seek p {
	margin: 0;
}

.mp-seek__track {
	background: var(--mp-surface-3);
	border-radius: 2px;
	flex: 1;
	height: 4px;
	overflow: hidden;
}

.mp-seek__fill.wp-block-spacer {
	background: var(--mp-amber-1);
	height: 4px;
	margin: 0;
	position: relative;
}

.mp-seek__fill::after {
	background: var(--mp-text);
	border-radius: 50%;
	content: "";
	height: 10px;
	position: absolute;
	right: -2px;
	top: -3px;
	width: 10px;
}

.mp-player__controls {
	align-items: center;
	display: flex;
	flex-wrap: nowrap;
	gap: 2px;
	justify-content: space-between;
	margin-top: 12px;
}

.mp-pbtn .wp-block-button__link {
	align-items: center;
	background: none;
	border: 0;
	border-radius: 50%;
	box-shadow: none;
	color: var(--mp-text-2);
	display: grid;
	font-size: 0;
	height: 34px;
	padding: 0;
	place-items: center;
	width: 34px;
}

.mp-pbtn .wp-block-button__link::before {
	background-color: currentColor;
	content: "";
	height: 18px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 18px;
}

.mp-pbtn .wp-block-button__link:hover {
	background: rgba(255, 255, 255, .07);
	color: var(--mp-text);
}

.mp-pbtn--main .wp-block-button__link {
	background: var(--mp-brand-grad);
	box-shadow: var(--mp-shadow-brand);
	color: var(--mp-on-brand);
	height: 46px;
	width: 46px;
}

.mp-pbtn--main .wp-block-button__link:hover {
	background: var(--mp-brand-grad);
	color: var(--mp-on-brand);
	filter: brightness(1.06);
}

.mp-player__extra {
	align-items: center;
	border-top: 1px solid var(--mp-line);
	display: flex;
	gap: 10px;
	justify-content: center;
	margin-top: 10px;
	padding-top: 10px;
}

.mp-player__extra .mp-i {
	color: var(--mp-muted);
	display: flex;
	font-size: 0;
}

.mp-vol {
	background: var(--mp-surface-3);
	border-radius: 2px;
	flex: 1;
	height: 4px;
	overflow: hidden;
}

.mp-vol__fill.wp-block-spacer {
	background: var(--mp-amber-1);
	height: 4px;
	margin: 0;
	width: 70%;
}

/* ==========================================================================
   23. Footer
   ========================================================================== */
.mp-footer {
	background: var(--mp-surface-1);
	border-top: 1px solid var(--mp-line);
	margin-top: 40px;
	padding: 56px var(--mp-gutter) 0;
}

.mp-footer__inner {
	margin-inline: auto;
	max-width: 1404px;
}

.mp-footer__grid {
	display: grid;
	gap: 32px;
	grid-template-columns: repeat(5, minmax(0, 1fr)) 1.4fr;
	padding-bottom: 44px;
}

.mp-footer h2,
.mp-footer h4 {
	font-size: var(--mp-fs-md);
	margin: 0 0 16px;
}

.mp-footer .mp-navlist,
.mp-footer .wp-block-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.mp-footer .wp-block-list li + li {
	margin-top: 9px;
}

.mp-footer .wp-block-list a,
.mp-footer__contact span {
	color: var(--mp-muted);
	font-size: var(--mp-fs-sm);
}

.mp-footer .wp-block-list a:hover {
	color: var(--mp-amber-1);
}

.mp-footer__contact li {
	align-items: flex-start;
	color: var(--mp-muted);
	display: flex;
	gap: 10px;
}

.mp-footer__contact li::before {
	background-color: var(--mp-amber-1);
	content: "";
	flex: none;
	height: 16px;
	margin-top: 3px;
	-webkit-mask: var(--mp-icon) center/contain no-repeat;
	mask: var(--mp-icon) center/contain no-repeat;
	width: 16px;
}

.mp-footer__contact li:nth-child(1) { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='14' rx='3'/%3E%3Cpath d='m4 7.5 8 5.5 8-5.5'/%3E%3C/svg%3E"); }
.mp-footer__contact li:nth-child(2) { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M7 3.5h2.6l1.6 4-2 1.4a12 12 0 0 0 5.9 5.9l1.4-2 4 1.6V17a3.5 3.5 0 0 1-3.8 3.5A16.5 16.5 0 0 1 3.5 7.3 3.5 3.5 0 0 1 7 3.5z'/%3E%3C/svg%3E"); }
.mp-footer__contact li:nth-child(3) { --mp-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='1.7' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 21.5s7-6.4 7-11.2A7 7 0 1 0 5 10.3c0 4.8 7 11.2 7 11.2z'/%3E%3Ccircle cx='12' cy='10' r='2.5'/%3E%3C/svg%3E"); }

.mp-subscribe p {
	color: var(--mp-muted);
	font-size: var(--mp-fs-sm);
	margin: 0 0 14px;
}

.mp-subscribe .wp-block-search__inside-wrapper {
	gap: 8px;
}

.mp-subscribe .wp-block-search__input {
	background: var(--mp-surface-3);
	border: 1px solid var(--mp-line);
	border-radius: 10px;
	color: var(--mp-text);
	font-size: var(--mp-fs-sm);
	height: 44px;
	padding: 0 16px;
}

.mp-subscribe .wp-block-search__input::placeholder {
	color: var(--mp-muted);
}

.mp-subscribe .wp-block-search__button {
	background: var(--mp-brand-grad);
	border: 0;
	border-radius: var(--mp-r-pill);
	box-shadow: var(--mp-shadow-brand);
	color: var(--mp-on-brand);
	font-size: var(--mp-fs-sm);
	font-weight: 700;
	height: 44px;
	margin: 0;
	padding: 0 20px;
}

.mp-footer__bar {
	align-items: center;
	border-top: 1px solid var(--mp-line);
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	padding-block: 22px;
}

.mp-footer__bar p,
.mp-footer__bar a {
	color: var(--mp-muted);
	font-size: var(--mp-fs-xs);
	margin: 0;
}

.mp-footer__bar .wp-block-site-logo img {
	height: 28px;
	width: auto;
}

.mp-copyright {
	align-items: center;
	gap: 5px;
}

.mp-copyright .wp-block-site-title {
	color: var(--mp-muted);
	font-size: var(--mp-fs-xs);
	font-weight: 400;
	margin: 0;
}

.mp-copyright p +.wp-block-site-title + p::before {
	content: "·";
	margin-inline-end: 5px;
}

.mp-footer__legal .wp-block-navigation__container {
	gap: 18px;
}

.mp-footer__legal a:hover {
	color: var(--mp-text);
}

.mp-social.wp-block-social-links {
	gap: 8px;
	margin-left: auto;
}

.mp-social .wp-block-social-link {
	margin: 0;
	padding: 0;
}

.mp-social.is-style-logos-only .wp-block-social-link .wp-block-social-link-anchor {
	color: var(--mp-text-2);
}

.mp-social.is-style-logos-only .wp-block-social-link:hover .wp-block-social-link-anchor {
	color: var(--mp-amber-1);
}

.mp-social .wp-block-social-link-anchor {
	align-items: center;
	border: 1px solid var(--mp-line);
	border-radius: 10px;
	color: var(--mp-text-2);
	display: flex;
	height: 36px;
	justify-content: center;
	padding: 0;
	width: 36px;
}

.mp-social .wp-block-social-link-anchor svg {
	fill: currentColor;
	height: 16px;
	width: 16px;
}

.mp-social .wp-block-social-link:hover .wp-block-social-link-anchor {
	border-color: rgba(255, 178, 63, .35);
	color: var(--mp-amber-1);
	transform: none;
}

/* ==========================================================================
   24. Editorial templates
   ========================================================================== */
.mp-banner .wp-block-cover__inner-container {
	text-align: left;
	width: 100%;
}

.mp-banner.wp-block-cover {
	border-radius: var(--mp-r-lg);
	margin-top: 26px;
	min-height: 260px;
	padding: 40px;
}

.mp-banner h1,
.mp-banner h2 {
	font-size: var(--mp-fs-2xl);
	margin: 0;
}

.mp-banner p {
	color: var(--mp-text-2);
	font-size: var(--mp-fs-sm);
	margin: 8px 0 0;
}

.mp-banner .wp-block-breadcrumbs,
.mp-eyebrow {
	color: var(--mp-amber-1);
	font-size: var(--mp-fs-xs);
	font-weight: 700;
	letter-spacing: .08em;
	margin: 0 0 10px;
	text-transform: uppercase;
}

.mp-posts .wp-block-post-template {
	display: grid;
	gap: var(--mp-rail-gap);
	grid-template-columns: repeat(3, minmax(0, 1fr));
	list-style: none;
	margin: 0;
	padding: 0;
}

.mp-posts .wp-block-post-template > li {
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: var(--mp-r-md);
	overflow: hidden;
	transition: background-color .18s ease, border-color .18s ease;
}

.mp-posts .wp-block-post-template > li:hover {
	background: var(--mp-surface-3);
	border-color: var(--mp-line-2);
}

.mp-posts .wp-block-post-featured-image {
	margin: 0;
}

.mp-posts .wp-block-post-featured-image img {
	aspect-ratio: 16 / 10;
	object-fit: cover;
	width: 100%;
}

.mp-post-card__body {
	padding: 18px;
}

.mp-posts .wp-block-post-title {
	font-size: var(--mp-fs-md);
	margin: 6px 0 8px;
}

.mp-posts .wp-block-post-excerpt__excerpt {
	color: var(--mp-muted);
	font-size: var(--mp-fs-sm);
	margin: 0;
}

.mp-posts .wp-block-post-date,
.mp-posts .wp-block-post-terms {
	color: var(--mp-amber-1);
	font-size: var(--mp-fs-xs);
	font-weight: 700;
}

.mp-posts .wp-block-post-excerpt__more-link {
	color: var(--mp-amber-1);
	display: inline-block;
	font-size: var(--mp-fs-sm);
	font-weight: 700;
	margin-top: 12px;
}

.mp-pagination {
	display: flex;
	gap: 10px;
	justify-content: center;
	margin-top: 34px;
}

.mp-pagination .wp-block-query-pagination-numbers .page-numbers,
.mp-pagination .wp-block-query-pagination-previous,
.mp-pagination .wp-block-query-pagination-next {
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: 10px;
	color: var(--mp-text-2);
	display: inline-block;
	font-size: var(--mp-fs-sm);
	font-weight: 700;
	margin: 0 4px;
	padding: 9px 15px;
}

.mp-pagination .page-numbers.current {
	background: var(--mp-brand-grad);
	border-color: transparent;
	color: var(--mp-on-brand);
}

.mp-article {
	background: var(--mp-surface-1);
	border: 1px solid var(--mp-line);
	border-radius: var(--mp-r-lg);
	margin-top: 26px;
	padding: clamp(22px, 3vw, 46px);
}

.mp-article .wp-block-post-content {
	color: var(--mp-text-2);
	font-size: var(--mp-fs-md);
	line-height: 1.75;
}

.mp-article .wp-block-post-content > * {
	margin-block: 0 22px;
}

.mp-article .wp-block-post-content h2,
.mp-article .wp-block-post-content h3,
.mp-article .wp-block-post-content h4 {
	margin-block: 34px 14px;
}

.mp-article .wp-block-post-content img {
	border-radius: var(--mp-r-md);
}

.mp-meta {
	align-items: center;
	color: var(--mp-muted);
	display: flex;
	flex-wrap: wrap;
	font-size: var(--mp-fs-sm);
	gap: 8px 18px;
}

.mp-comments {
	background: var(--mp-surface-1);
	border: 1px solid var(--mp-line);
	border-radius: var(--mp-r-lg);
	margin-top: 26px;
	padding: clamp(22px, 3vw, 40px);
}

.mp-comments .wp-block-comment-author-name,
.mp-comments .wp-block-comment-date {
	font-size: var(--mp-fs-sm);
}

.mp-comments .wp-block-comment-content {
	color: var(--mp-text-2);
	font-size: var(--mp-fs-sm);
}

.mp-comments input:where([type="text"], [type="email"], [type="url"]),
.mp-comments textarea {
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: 10px;
	color: var(--mp-text);
	font-family: var(--mp-font-ui);
	font-size: var(--mp-fs-sm);
	padding: 12px 14px;
	width: 100%;
}

.mp-404 {
	padding-block: clamp(50px, 8vw, 110px);
	text-align: center;
}

.mp-404 h1 {
	background: var(--mp-brand-grad);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
	font-size: clamp(66px, 12vw, 132px);
	line-height: 1;
}

/* Generic form controls in the editorial templates. */
.wp-block-search__input,
.wp-block-post-comments-form input,
.wp-block-post-comments-form textarea {
	background: var(--mp-surface-2);
	border: 1px solid var(--mp-line);
	border-radius: 10px;
	color: var(--mp-text);
}

/* ==========================================================================
   25. Responsive
   ========================================================================== */
@media (max-width: 1280px) {
	.mp-footer__grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.mp-appcta { grid-template-columns: minmax(0, 1fr) 320px; padding: 44px; }
	.mp-posts .wp-block-post-template { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 1100px) {
	:root,
	body {
		--mp-gutter: 20px;
		--mp-topbar-h: 66px;
	}

	.mp-app { grid-template-columns: minmax(0, 1fr); }

	.mp-sidebar {
		bottom: 0;
		height: 100vh;
		height: 100dvh;
		left: 0;
		position: fixed;
		top: 0;
		transform: translateX(-102%);
		transition: transform .26s cubic-bezier(.2, .8, .2, 1);
		width: 280px;
		z-index: 120;
	}

	.mp-sidebar.is-open { transform: translateX(0); }

	.mp-sidebar .mp-sidebar__close { display: block; }

	.mp-scrim {
		background: rgba(4, 4, 6, .72);
		display: block;
		inset: 0;
		opacity: 0;
		pointer-events: none;
		position: fixed;
		transition: opacity .26s ease;
		z-index: 110;
	}

	.mp-scrim.is-on {
		opacity: 1;
		pointer-events: auto;
	}

	.mp-topbar .mp-topbar__menu,
	.mp-topbar .mp-topbar__brand { display: flex; }

	/*
	 * Inside the drawer the player follows the library list rather than
	 * being pushed to the foot of a tall panel, and its artwork is cropped
	 * to a strip so the whole card is in view on a short screen.
	 */
	.mp-player {
		margin-top: 24px;
	}

	.mp-player__art img {
		aspect-ratio: 16 / 10;
	}

	.mp-appcta { grid-template-columns: minmax(0, 1fr); }
	.mp-phones { display: none; }
}

@media (max-width: 860px) {
	.mp-topbar .mp-hide-sm,
	.mp-topbar .mp-selectish,
	.mp-account p { display: none; }

	.mp-account { border: 0; padding: 0; }

	.mp-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.mp-eps { grid-template-columns: minmax(0, 1fr); }
	.mp-posts .wp-block-post-template { grid-template-columns: minmax(0, 1fr); }

	.mp-welcome h1 { font-size: var(--mp-fs-xl); }
	.mp-sec__head h2 { font-size: var(--mp-fs-lg); }
	.mp-appcta { padding: 30px 24px; }
	.mp-appcta h2 { font-size: var(--mp-fs-xl); }

	.mp-hero.wp-block-cover { min-height: 240px; padding: 20px; }
	.mp-hero h3 { font-size: var(--mp-fs-lg); }

	.mp-rail--5:not(.owl-loaded) > *,
	.mp-rail--4:not(.owl-loaded) > * { flex: 0 0 calc((100% - 1.5 * var(--mp-rail-gap)) / 2.4); }
	.mp-rail--2:not(.owl-loaded) > * { flex: 0 0 88%; }
	.mp-rail--8:not(.owl-loaded) > * { flex: 0 0 calc((100% - 2.5 * var(--mp-rail-gap)) / 3.4); }
}

@media (max-width: 660px) {
	.mp-sec__head { align-items: flex-start; flex-direction: column; gap: 10px; }
	.mp-sec__tools { margin-left: 0; }
}

@media (max-width: 560px) {
	.mp-welcome { align-items: flex-start; flex-direction: column; gap: 12px; }
	.mp-welcome__nav { margin-left: 0; }
	.mp-footer__grid { gap: 26px; grid-template-columns: minmax(0, 1fr); }
	.mp-social { margin-left: 0; }
	.mp-ep { grid-template-columns: 72px minmax(0, 1fr); }
	.mp-subscribe .wp-block-search__inside-wrapper { flex-direction: column; }
	.mp-subscribe .wp-block-search__button { width: 100%; }
	.mp-footer__bar { flex-direction: column; align-items: flex-start; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }

	*,
	*::before,
	*::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
	}
}

/* ==========================================================================
   26. WordPress core helpers
   ========================================================================== */
.alignleft {
	float: left;
	margin-right: 1.5em;
	margin-bottom: 1em;
}

.alignright {
	float: right;
	margin-left: 1.5em;
	margin-bottom: 1em;
}

.aligncenter {
	clear: both;
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.sticky,
.gallery-caption,
.bypostauthor {
	display: block;
}

.wp-caption {
	max-width: 100%;
}

.wp-caption-text,
.wp-element-caption {
	color: var(--mp-muted);
	font-size: var(--mp-fs-xs);
	text-align: center;
}

/* ==========================================================================
   27. Small refinements
   ========================================================================== */
.mp-postnav {
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
	justify-content: space-between;
}

.mp-postnav a {
	color: var(--mp-text-2);
	font-size: var(--mp-fs-sm);
	font-weight: 700;
}

.mp-postnav a:hover {
	color: var(--mp-amber-1);
}

.mp-footer__legal .wp-block-navigation__container {
	gap: 18px;
}

.mp-tile__title a:hover,
.mp-artist h3 a:hover,
.mp-ep__title a:hover {
	color: var(--mp-amber-1);
}

.mp-comments .wp-block-columns {
	border-top: 1px solid var(--mp-line);
	gap: 16px;
	margin-top: 20px;
	padding-top: 20px;
}

.mp-comments .wp-block-comments-title,
.mp-comments .comment-reply-title {
	font-family: var(--mp-font-display);
	font-size: var(--mp-fs-lg);
	font-weight: 700;
	margin-bottom: 18px;
}

.mp-comments .wp-block-comment-reply-link a {
	color: var(--mp-amber-1);
	font-size: var(--mp-fs-xs);
	font-weight: 700;
}

.mp-comments .wp-block-post-comments-form .form-submit {
	margin-top: 16px;
}

.mp-comments .wp-block-post-comments-form label {
	color: var(--mp-muted);
	display: block;
	font-size: var(--mp-fs-xs);
	margin-bottom: 6px;
}

.mp-comments .wp-block-post-comments-form p {
	margin-bottom: 14px;
}

.mp-comments .wp-block-post-comments-form .wp-block-button__link,
.mp-comments .wp-block-post-comments-form input[type="submit"] {
	background: var(--mp-brand-grad);
	border: 0;
	border-radius: var(--mp-r-pill);
	color: var(--mp-on-brand);
	cursor: pointer;
	font-family: var(--mp-font-ui);
	font-size: var(--mp-fs-sm);
	font-weight: 700;
	padding: 14px 24px;
}

.mp-banner .wp-block-post-terms a,
.mp-banner .wp-block-post-terms {
	color: var(--mp-amber-1);
}

.mp-article .wp-block-post-content a {
	color: var(--mp-amber-1);
	text-decoration: underline;
}

/*
 * A cover with a custom content position is given an auto width inner
 * container by core, which centres short card copy. These cards are always
 * full bleed and left aligned. Core's rule carries the same specificity and
 * can be printed after the theme stylesheet, so the override is forced.
 */
.mp-hero > .wp-block-cover__inner-container,
.mp-banner > .wp-block-cover__inner-container {
	margin: 0 !important;
	text-align: left;
	width: 100% !important;
}

/* ==========================================================================
   28. Overflow guards
   Flex and grid children default to a content based minimum width, which
   lets long titles and the search field push the shell wider than a phone.
   ========================================================================== */
.mp-topbar > *,
.mp-welcome > *,
.mp-sec__head > *,
.mp-ep > *,
.mp-footer__bar > * {
	min-width: 0;
}

.mp-search .wp-block-search__input {
	min-width: 0;
	width: 100%;
}

.mp-sec__head h2,
.mp-welcome h1,
.mp-ep__title {
	overflow-wrap: break-word;
}

@media (max-width: 560px) {
	/* The brand already sits at the head of the drawer on this size. */
	.mp-topbar .mp-topbar__brand {
		display: none;
	}

	.mp-search {
		min-width: 110px;
	}
}

/* ==========================================================================
   29. Editorial refinements
   ========================================================================== */

/* A post without a featured image still needs a panel to sit on. */
.mp-banner.wp-block-cover {
	background-color: var(--mp-surface-1);
}

.mp-banner .wp-block-search,
.mp-404 .wp-block-search {
	margin-inline: auto;
	max-width: 520px;
}

.mp-banner .wp-block-search {
	margin-top: 16px;
	margin-inline: 0;
}

.mp-404 > * {
	margin-bottom: 18px;
}

.mp-404 h2 {
	margin-top: 10px;
}

.mp-404 p {
	color: var(--mp-text-2);
	margin-inline: auto;
	max-width: 56ch;
}

/* Hide the comment and post navigation panels while they have nothing in them. */
.mp-comments:not(:has(form, ol, .wp-block-comments-title)),
.mp-postnav:not(:has(a)) {
	display: none;
}

.mp-post-card__meta {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 6px 12px;
}

.mp-post-card__meta .wp-block-post-date {
	color: var(--mp-muted);
	font-weight: 600;
}