/* Playlist presentation, scoped to the module; uses the active MuzRe theme colours. */
.mzpl{--mzpl-accent:var(--accent,#ff7515);--mzpl-gap:24px;color:inherit;min-width:0;margin:28px 0 60px}
.mzpl h1{font-size:clamp(28px,3vw,40px);line-height:1.2;margin:0 0 24px;overflow-wrap:anywhere}
.mzpl-section-heading{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-bottom:30px;flex-wrap:wrap}
.mzpl-section-heading h1,.mzpl-section-heading h2{margin:0;font-size:clamp(24px,2.2vw,30px);line-height:1.25;font-weight:500;overflow-wrap:anywhere}
.mzpl-section-heading .mzpl-sort{margin:0}
.mzpl-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--mzpl-gap)}
.mzpl-card{display:block;position:relative;isolation:isolate;min-width:0;aspect-ratio:5/3;overflow:hidden;border-radius:12px;color:#fff!important;text-decoration:none;background:linear-gradient(120deg,#7961d9,#35afb6);box-shadow:0 4px 16px #14263412}
.mzpl-card .mzpl-cover{height:100%;aspect-ratio:auto;border-radius:0;transition:transform .35s ease}
.mzpl-card-caption{position:absolute;inset:0;display:flex;align-items:flex-end;padding:24px 22px 26px 40%;background:linear-gradient(180deg,transparent 25%,#10192315 45%,#101923a8 100%)}
.mzpl-card h2{font-size:clamp(14px,1.15vw,18px);line-height:1.35;font-weight:800;text-transform:uppercase;margin:0;color:#fff!important;text-shadow:0 2px 12px #0007;overflow-wrap:anywhere}
.mzpl-card .mzpl-cover-empty{font-size:clamp(68px,6vw,100px);background:linear-gradient(115deg,#7561df,#36b3b8 70%,#d9c968);color:#ffffffab;justify-content:start;padding-left:13%}
.mzpl-cover{display:block;width:100%;aspect-ratio:5/3;object-fit:cover;object-position:center;border-radius:12px;background:var(--bg-darker,#22313f)}
.mzpl-cover-empty{display:grid;place-items:center;background:linear-gradient(115deg,#7561df,#36b3b8 70%,#d9c968);color:#ffffffb3;font-size:90px}
.mzpl-all{display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:8px 16px;border-radius:6px;background:var(--bg-lighter,#47617a);color:var(--tt,#fff);font-size:12px;font-weight:700;text-transform:uppercase;text-decoration:none}
.mzpl-carousel{position:relative;min-width:0}
.mzpl-carousel-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 2 * var(--mzpl-gap))/3);gap:var(--mzpl-gap);overflow-x:auto;overscroll-behavior-inline:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:2px 0 6px}
.mzpl-carousel-track::-webkit-scrollbar{display:none}
.mzpl-carousel-track>.mzpl-card{scroll-snap-align:start}
.mzpl-carousel-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:3;display:grid;place-items:center;width:48px;min-width:0;height:48px;padding:0;border-radius:50%;border:1px solid var(--bdc-darker-1,#65778766);background:var(--bg,#2c3e50);color:var(--tt-icon,#b6c6d5);box-shadow:0 5px 16px #0003;font:inherit;font-size:29px;cursor:pointer;transition:background .2s,opacity .2s}
.mzpl-carousel-arrow[hidden]{display:none}
.mzpl-carousel-prev{left:0}.mzpl-carousel-next{right:0}
.mzpl-carousel-arrow:disabled{opacity:.4;cursor:default}
.mzpl-playlist{position:relative;isolation:isolate}
.mzpl-backdrop{position:absolute;z-index:-1;inset:-90px 0 auto;height:650px;overflow:hidden;pointer-events:none;opacity:.18;mask-image:linear-gradient(#000,transparent)}
.mzpl-backdrop>.mzpl-cover{width:100%;height:100%;object-fit:cover;filter:blur(70px);transform:scale(1.15)}
.mzpl-header{display:grid;grid-template-columns:minmax(240px,34%) minmax(0,1fr);align-items:start;gap:50px;margin:20px 0 56px}
.mzpl-label{color:var(--tt-icon,inherit);margin:0 0 16px;font-size:15px;font-weight:500}
.mzpl-summary{min-width:0}
.mzpl-header h1{font-weight:700;margin-bottom:30px}
.mzpl-description{line-height:1.7;overflow-wrap:anywhere;white-space:normal;margin-top:22px;color:var(--tt-fade,inherit)}
.mzpl-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:28px}
.mzpl-play{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-width:165px;min-height:50px;height:auto;background:var(--mzpl-accent);color:#fff!important;border:0;border-radius:15px;padding:15px 25px;font:inherit;font-size:15px;font-weight:600;cursor:pointer;box-shadow:none;line-height:1.3}
.mzpl-play::before{content:'';width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid currentColor;flex-shrink:0}
.mzpl-play:disabled{opacity:.6;cursor:wait}
.mzpl-play-status{flex-basis:100%;margin:0;font-size:14px}.mzpl-play-status:empty,.mzpl-share-status:empty{display:none}
.mzpl-share-menu{position:relative}
.mzpl-share-menu summary{display:grid;place-items:center;list-style:none;width:50px;height:50px;border:1px solid var(--bdc-darker-1,#65778766);border-radius:15px;background:var(--bg,#2c3e50);color:var(--tt-icon,inherit);font-size:22px;letter-spacing:3px;cursor:pointer}
.mzpl-share-menu summary::-webkit-details-marker{display:none}
.mzpl-share-menu[open] summary{background:var(--mzpl-accent);color:#fff}
.mzpl-share-dropdown{position:absolute;z-index:5;top:calc(100% + 8px);right:0;min-width:190px;padding:8px;border:1px solid var(--bdc-darker-1,#65778766);border-radius:12px;background:var(--bg,#2c3e50);box-shadow:0 8px 30px #0003}
.mzpl-share-dropdown button{width:100%;height:auto;min-height:42px;padding:10px 16px;border:0;border-radius:6px;background:transparent;color:inherit;font:inherit;text-align:left;cursor:pointer}
.mzpl-share-status{font-size:14px;margin-top:14px}
.mzpl-back{display:inline-block;color:var(--mzpl-accent);text-decoration:underline;font-size:15px}
.mzpl-count{margin:16px 0 0;color:var(--tt-fade,inherit);font-size:15px}
.mzpl-draft{padding:14px 18px;border:1px solid var(--mzpl-accent);border-radius:12px;margin:18px 0}
.mzpl-nav{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;margin:32px 0}
.mzpl-nav>a,.mzpl-nav-current{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;padding:8px 14px;border:1px solid #63738766;border-radius:10px;color:inherit;text-decoration:none}
.mzpl-nav-current{background:var(--mzpl-accent);color:#fff;border-color:transparent}
.mzpl-nav>a:hover{border-color:var(--mzpl-accent)}
.mzpl a:focus-visible,.mzpl button:focus-visible,.mzpl summary:focus-visible{outline:2px solid var(--mzpl-accent);outline-offset:4px}
.mzpl-card:focus-visible{outline-offset:-4px}
.mzpl-message,.mzpl-empty{padding:24px;overflow-wrap:anywhere}
.mzpl-tracks{min-width:0}
.mzpl-sort{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin:24px 0;font-size:13px}
.mzpl-sort label{display:flex;flex-wrap:wrap;align-items:center;gap:10px;min-width:0}
.mzpl-sort select{max-width:100%;width:auto;min-height:36px;height:auto;padding:8px 32px 8px 12px;border:1px solid #8292a455;border-radius:8px;background:var(--bg-darker,#22313f);color:inherit}
.mzpl-sort select:not([multiple]){background-repeat:no-repeat;background-position:right 12px center;background-size:14px 14px}
.mzpl-sort button{height:auto;min-height:36px;padding:8px 14px;border-radius:8px;font:inherit;line-height:1.4}
.mzpl-seo{line-height:1.7;overflow-wrap:anywhere;margin:20px 0}.mzpl-seo:empty{display:none}
.mzpl-seo p,.mzpl-seo ul,.mzpl-seo ol{margin:0 0 14px}.mzpl-seo ul,.mzpl-seo ol{padding-left:24px;list-style:revert}
.mzpl-news-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,220px));gap:20px}
.mzpl-news-card{min-width:0;display:grid;gap:10px;color:inherit}.mzpl-news-card span{overflow-wrap:anywhere}
.mzpl-news-card .mzpl-cover{aspect-ratio:1}
.mzpl-block{margin:24px 0}
@media(hover:hover) and (pointer:fine){.mzpl-card:hover .mzpl-cover{transform:scale(1.04)}.mzpl-carousel-arrow:not(:disabled):hover,.mzpl-share-dropdown button:hover{background:var(--mzpl-accent);color:#fff}.mzpl-all:hover{filter:brightness(1.1)}}
@media(max-width:1200px){.mzpl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.mzpl-header{gap:34px}.mzpl-card-caption{padding:20px 18px 22px 36%}}
@media(max-width:900px){.mzpl-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mzpl-carousel-track{grid-auto-columns:calc((100% - var(--mzpl-gap))/2)}.mzpl-header{grid-template-columns:minmax(220px,40%) minmax(0,1fr);gap:28px}.mzpl-card h2{font-size:16px}}
@media(max-width:600px){.mzpl{--mzpl-gap:18px;margin:20px 0 38px}.mzpl-grid{grid-template-columns:minmax(0,1fr)}.mzpl-section-heading{gap:16px;margin-bottom:22px}.mzpl-carousel-track{grid-auto-columns:88%}.mzpl-carousel-arrow{width:38px;height:38px;font-size:24px}.mzpl-card-caption{padding:20px 20px 24px 40%}.mzpl-card h2{font-size:17px}.mzpl-header{grid-template-columns:minmax(0,1fr);gap:26px;margin:16px 0 38px}.mzpl-header>.mzpl-cover{width:100%;max-width:480px;justify-self:center}.mzpl-header h1{font-size:28px;margin-bottom:24px}.mzpl-actions{gap:12px;margin-bottom:22px}.mzpl-sort label{gap:8px}.mzpl-description{font-size:14px}.mzpl-share-dropdown{right:0}.mzpl-backdrop{height:700px}.mzpl-news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(prefers-reduced-motion:reduce){.mzpl-card .mzpl-cover,.mzpl-carousel-arrow{transition:none}}
/* MuzRe's mobile shell otherwise uses 100vw, which includes the scrollbar. */
@media(max-width:760px){body:has(.mzpl),body:has(.mzpl) .wrapper,body:has(.mzpl) .mobile-menu{width:100%}body:has(.mzpl) .wrapper{min-width:0}}
