/* =========================================================
   THE HEADSTREAM — SITEWIDE STYLES  (consolidated 2026-10-18 · mobile pass 2026-10-21 · list-page cards 2026-10-21)
   Lives in Appearance → Customize → Additional CSS.
   Source of truth for all .hs- styling; pages and posts carry content only.
   Fonts (Jost, Source Sans 3) are loaded by the SEO snippet, not from here.
   Edit here once; every page updates.

   CONTENTS
    0. Design tokens (fonts, colours, album-art frame)
    1. Theme overrides
    2. Type roles: page titles, artist names, captions
    3. Roster grid (label pages + Artists page)
    4. A–Z artist index
    5. Artist pop-up panel (label pages)
    6. Roster heading link
    7. Linked photos: hover shade
    8. Artist Catalog (artist pages; built by the content-hub script)
    9. Filter tabs (Artist Catalog + weekly genres)
   10. Flip-through motion
   11. Weekly release post
   12. Streaming-icon colours
   13. Album post
   14. Release-post chrome (hidden blog furniture)
   15. Home page, archives, search: post cards
   16. Card hover: ripple and category word
   17. Album-art frame (all album art)
   18. Feel: transitions, fades, links, focus
   19. Touch screens and the home-screen app
   20. Album covers on list pages: the weekly card

   About !important: used only where this file must beat the theme's own CSS or the
   built-in <style> blocks on label/artist pages published before generator v5.
   ========================================================= */


/* ---------- 0. Design tokens ---------- */
:root{
  --hs-font-display:"Playfair Display",Georgia,serif;          /* headings, artist names */
  --hs-font-label:'Jost','Futura','Century Gothic',sans-serif;  /* words on images, tabs, small labels */
  --hs-font-text:'Source Sans 3',system-ui,sans-serif;          /* album titles, details */
  --hs-ink:#1a1a1a;
  --hs-muted:#555;
  --hs-faint:#888;
  --hs-art-radius:4.5%;                 /* corner = 4.5% of the artwork width, matching Apple Music / Spotify */
  --hs-art-edge:1px solid rgba(0,0,0,.09);
  --hs-art-shadow:0 1px 2px rgba(0,0,0,.08),0 3px 8px rgba(0,0,0,.06);
  --hs-on-image-shadow:0 1px 3px rgba(0,0,0,.45);
}


/* ---------- 1. Theme overrides ---------- */
.single-post .entry-featured.entry-thumbnail{display:none}
/* Artist and label pages: no featured-image banner (the photo or logo already shows on the page) */
body:is(.parent-pageid-8993,.parent-pageid-6132) :is(.entry-featured,.entry-thumbnail.entry-featured,.post-thumbnail),
body.hs-page-artist :is(.entry-featured,.post-thumbnail){display:none !important}
.single-post .entry-content::before{display:none !important}
/* The logo already spells out the name: hide the text Site Title in the header (kept for screen readers
   and search engines). The tagline line underneath stays. */
.site-header .site-title:not(:has(img)),.site-branding .site-title:not(:has(img)){position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Label pages: the logo banner is the visual header, so the page title is hidden on screen
   but stays in the page as its main heading for search engines, AI agents and screen readers. */
body.parent-pageid-6132 :is(.entry-header .entry-title,h1.entry-title){position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}


/* Footer menu (Home · Label Directory · Artists · About): centred across the full width, Jost Light */
.site-footer{text-align:center}
.site-footer div:has(> nav),.site-footer nav,.site-footer .menu,.site-footer .nav-menu,.nav--footer,#menu-side-panel,#menu-footer{
  float:none !important;width:100% !important;max-width:none !important;margin-left:auto !important;margin-right:auto !important;
  text-align:center !important;justify-content:center !important;
}
.site-footer .menu > li,.nav--footer > li,#menu-side-panel > li,#menu-footer > li{float:none !important;display:inline-block}
.site-footer .menu a,.nav--footer a,#menu-side-panel a,#menu-footer a{font-family:var(--hs-font-label) !important;font-weight:300 !important;font-style:normal !important;letter-spacing:.04em}


/* ---------- 2. Type roles ---------- */
/* Artist and label page titles: Playfair semibold, upright — the same look as artist names on album posts.
   Newer pages are recognised by their identity block, older ones by the class the content-hub script adds. */
body:has(.hs-page-data[data-page-type="artist"]) .entry-title,
body:has(.hs-page-data[data-page-type="label"]) .entry-title,
body.hs-page-artist .entry-title,
body.hs-page-label .entry-title{
  font-family:var(--hs-font-display) !important;font-style:normal !important;font-weight:600 !important;
  color:var(--hs-ink);text-align:center;letter-spacing:0;
}
/* Label Directory names (gallery captions): Jost Light caps on the image */
.wp-block-gallery.has-nested-images figure.wp-block-image figcaption.wp-element-caption{
  font-family:var(--hs-font-label) !important;font-style:normal !important;font-weight:300 !important;
  font-size:13px !important;line-height:1.35;letter-spacing:.14em;text-transform:uppercase;
  text-shadow:var(--hs-on-image-shadow);
}
/* Artist pages: the label name under the round photo, in Jost Regular */
body:has(.hs-page-data[data-page-type="artist"]) figure.wp-block-image figcaption.wp-element-caption,
body:has(.hs-page-data[data-page-type="artist"]) figure.wp-block-image figcaption.wp-element-caption a,
body.hs-page-artist figure.wp-block-image figcaption.wp-element-caption,
body.hs-page-artist figure.wp-block-image figcaption.wp-element-caption a,
div.wp-block-image > figure > figcaption:has(a[href*="/label-directory/"]),
div.wp-block-image > figure > figcaption:has(a[href*="/label-directory/"]) a{
  font-family:var(--hs-font-label) !important;font-weight:400 !important;font-style:normal !important;
  font-size:15px;letter-spacing:.03em;
}


/* ---------- 3. Roster grid ---------- */
.hs-roster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}
.hs-roster-item{display:block;position:relative;text-decoration:none;color:inherit;overflow:hidden}
.hs-roster-item img{display:block;width:100%;aspect-ratio:1;object-fit:cover}
/* Artist names on the photos: Jost Light, as entered (no forced caps). !important beats older pages' built-in styles. */
.hs-roster-caption{
  position:absolute;left:0;right:0;bottom:0;display:block;text-align:center;
  padding:24px 8px 10px;color:#fff;
  background:linear-gradient(to top,rgba(0,0,0,.75),rgba(0,0,0,0));
  text-shadow:var(--hs-on-image-shadow);
}
.hs-roster-grid .hs-roster-caption,.hs-roster-item .hs-roster-caption{
  font-family:var(--hs-font-label) !important;font-style:normal !important;font-weight:300 !important;
  font-size:15px !important;line-height:1.3 !important;letter-spacing:.03em !important;text-transform:none !important;
}
@media (max-width:640px){
  .hs-roster-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .hs-roster-caption{padding:18px 6px 8px}
  .hs-roster-grid .hs-roster-caption,.hs-roster-item .hs-roster-caption{font-size:12px !important}
}


/* ---------- 4. A–Z artist index ---------- */
.hs-az-row{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:6px;max-width:640px;margin:0 auto 6px}
.hs-az-pill{font-family:var(--hs-font-display);font-style:italic;font-size:13px;text-align:center;padding:5px 0;border-radius:14px;text-decoration:none;background:#d9cfb4;color:#3a362c;border-bottom:2px solid #a89a72}
.hs-az-pill:hover{background:#cabf9c}
.hs-az-muted{background:transparent;color:#b8b2a2;border-bottom:2px solid transparent}
.hs-az-list{list-style:none;margin:0 0 24px;padding:0}
.hs-az-list li{margin:0 0 6px}
.hs-az-list a{text-decoration:none}
.hs-az-list a:hover{text-decoration:underline}


/* Artists page: self-updating A–Z index (SEO snippet shortcode) */
.hs-artist-index{max-width:900px;margin:0 auto;container-type:inline-size}
/* The filter: a keyboard. QWERTY in three staggered rows; minimal floating keys on the page background. */
.hs-artist-index .hs-keyboard{--key:min(42px,calc((100vw - 48px) / 10.9));--key:min(42px,calc((100cqw - 4px) / 11.9));--gap:calc(var(--key) * .2);
  width:calc(var(--key) * 10 + var(--gap) * 9);margin:0 auto 36px}
.hs-artist-index .hs-key-row{display:flex;gap:var(--gap);margin:0 0 var(--gap);max-width:none}
.hs-artist-index .hs-key-row:last-child{margin-bottom:0}
.hs-artist-index .hs-key-row--2{padding-left:calc(var(--key) * .5)}
.hs-artist-index .hs-key-row--3{padding-left:calc(var(--key) * 1.1)}
/* Keys: Jost Bold on the page colour, a hairline edge and a soft lift; ink-filled on hover */
.hs-artist-index .hs-az-pill{
  flex:0 0 var(--key);width:var(--key);height:var(--key);box-sizing:border-box;display:flex;align-items:center;justify-content:center;padding:0;
  font-family:var(--hs-font-label);font-style:normal;font-weight:700;font-size:calc(var(--key) * .34);letter-spacing:.02em;text-transform:uppercase;text-decoration:none;color:var(--hs-ink);
  background:transparent;border:1px solid rgba(0,0,0,.16);border-radius:calc(var(--key) * .2);
  box-shadow:0 1px 2px rgba(0,0,0,.06),0 2px 6px rgba(0,0,0,.04);
  transition:background .15s ease,color .15s ease,border-color .15s ease,transform .1s ease,box-shadow .15s ease;
}
/* Hover: the key gently swells and lifts (like the photo previews, but quieter); press: it settles back */
.hs-artist-index a.hs-az-pill{position:relative;transition:transform .32s cubic-bezier(.2,.9,.3,1.25),box-shadow .25s ease,border-color .2s ease,background .2s ease}
.hs-artist-index a.hs-az-pill:hover,.hs-artist-index a.hs-az-pill:focus-visible{z-index:1;transform:translateY(-2px) scale(1.16);border-color:rgba(0,0,0,.45);background:#fff;box-shadow:0 6px 14px rgba(0,0,0,.12),0 1px 2px rgba(0,0,0,.08)}
.hs-artist-index a.hs-az-pill:active{transform:scale(1.04);transition-duration:.08s;box-shadow:0 1px 3px rgba(0,0,0,.1)}
@media (prefers-reduced-motion:reduce){.hs-artist-index a.hs-az-pill{transition:none}}
.hs-artist-index a.hs-az-pill:focus-visible{outline:2px solid var(--hs-ink);outline-offset:3px}
.hs-artist-index .hs-az-pill.hs-az-muted{color:rgba(0,0,0,.2);border-color:rgba(0,0,0,.07);box-shadow:none;cursor:default}
/* Letter headings: the artist-page title style (Playfair semibold, upright) */
.hs-artist-index .hs-az-letter{font-family:var(--hs-font-display) !important;font-weight:600 !important;font-style:normal !important;font-size:30px;line-height:1.2;color:var(--hs-ink);text-align:center;letter-spacing:0;text-transform:none;margin:40px 0 14px;padding-bottom:8px;border-bottom:1px solid rgba(0,0,0,.12);scroll-margin-top:80px}
/* Artist names: Jost Regular */
.hs-artist-index .hs-az-list{columns:3 200px;column-gap:32px;margin:0 0 8px;padding:0;list-style:none}
.hs-artist-index .hs-az-list li{break-inside:avoid;margin:0 0 8px;font-family:var(--hs-font-label);font-weight:400;font-size:16px;letter-spacing:.02em}
.hs-artist-index .hs-az-list a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:2px 10px 2px 0;color:var(--hs-ink);text-decoration:none}
.hs-artist-index .hs-az-name{min-width:0;overflow-wrap:anywhere}   /* long names like "Yorkston/Thorne/Khan" wrap instead of running off the screen */
.hs-artist-index .hs-az-list a:hover .hs-az-name{text-decoration:underline;text-underline-offset:3px}
/* Small round artist photo beside each name */
/* Larger photo that follows the cursor (content-hub script; mouse/trackpad only) */
.hs-az-preview{position:fixed;top:0;left:0;z-index:60;width:180px;height:180px;border-radius:50%;overflow:hidden;pointer-events:none;
  visibility:hidden;transform-origin:50% 50%;box-shadow:0 0 0 1px rgba(0,0,0,.08),0 10px 30px rgba(0,0,0,.22);background:#eee;will-change:transform}
.hs-az-preview.hs-show{visibility:visible}
.hs-az-preview img{display:block;width:100%;height:100%;object-fit:cover}
.hs-artist-index .hs-az-thumb{flex:0 0 30px;width:30px;height:30px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(0,0,0,.08);background:#eee}
@media (max-width:640px){.hs-artist-index .hs-az-list{columns:2 140px;column-gap:18px}}
/* Phones: photo first, then the name (like a contacts list), so long names wrap neatly beside their photo. */
@container (max-width:560px){
  .hs-artist-index .hs-az-list a{flex-direction:row-reverse;justify-content:flex-end;gap:10px;padding:3px 0}
  .hs-artist-index .hs-az-list li{font-size:15px;line-height:1.25;margin:0;padding-bottom:10px}
  .hs-artist-index .hs-az-letter{font-size:26px;margin:32px 0 12px}
}
/* Search box under the keyboard (releases script): narrows the list as you type */
.hs-az-search{position:relative;width:min(100%,460px);margin:-14px auto 30px}
.hs-az-search svg{position:absolute;left:14px;top:50%;width:17px;height:17px;transform:translateY(-50%);fill:none;stroke:var(--hs-muted);stroke-width:1.8;stroke-linecap:round;pointer-events:none}
.hs-az-search input{display:block;width:100%;box-sizing:border-box;height:44px;padding:0 40px 0 40px;border:1px solid rgba(0,0,0,.16);border-radius:22px;background:transparent;
  font-family:var(--hs-font-label);font-size:16px;font-weight:400;letter-spacing:.02em;color:var(--hs-ink);-webkit-appearance:none;appearance:none;box-shadow:0 1px 2px rgba(0,0,0,.05);transition:border-color .2s ease,box-shadow .2s ease}
.hs-az-search input::placeholder{color:rgba(0,0,0,.38)}
.hs-az-search input:focus{outline:none;border-color:rgba(0,0,0,.45);box-shadow:0 4px 12px rgba(0,0,0,.08)}
.hs-az-search input::-webkit-search-cancel-button{-webkit-appearance:none;display:none}
.hs-az-clear{position:absolute;right:8px;top:50%;transform:translateY(-50%);width:28px;height:28px;padding:0;border:0;border-radius:50%;background:rgba(0,0,0,.06);color:var(--hs-muted);font-size:11px;line-height:1;cursor:pointer}
.hs-az-clear[hidden],.hs-artist-index [hidden]{display:none !important}
.hs-az-none{text-align:center;font-family:var(--hs-font-text);font-style:italic;color:var(--hs-muted);margin:10px 0 40px}
.hs-artist-index.hs-az-filtering .hs-az-letter{margin-top:22px}
/* While searching: results in one centred column, photo then name */
.hs-artist-index.hs-az-filtering .hs-az-list{columns:auto !important;display:flex;flex-direction:column;align-items:center}
.hs-artist-index.hs-az-filtering .hs-az-list li{width:min(100%,260px);margin:0;padding-bottom:10px}
.hs-artist-index.hs-az-filtering .hs-az-list a{flex-direction:row-reverse;justify-content:flex-end;gap:12px;padding:3px 0}
/* "A–Z" button: appears once the keyboard scrolls out of view, and brings it back with one tap (releases script). */
.hs-az-jump{position:fixed;right:max(16px,env(safe-area-inset-right));bottom:calc(16px + env(safe-area-inset-bottom));z-index:55;height:44px;min-width:44px;padding:0 14px;border-radius:22px;border:1px solid rgba(0,0,0,.14);
  background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 4px 14px rgba(0,0,0,.12);
  font-family:var(--hs-font-label);font-weight:700;font-size:13px;letter-spacing:.08em;color:var(--hs-ink);cursor:pointer;
  opacity:0;transform:translateY(10px);pointer-events:none;transition:opacity .25s ease,transform .25s ease}
.hs-az-jump.hs-show{opacity:1;transform:none;pointer-events:auto}


/* ---------- 5. Artist pop-up panel ---------- */
.hs-panel-overlay{position:fixed;inset:0;background:rgba(10,10,10,.5);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);opacity:0;pointer-events:none;transition:opacity .35s ease;z-index:9998}
.hs-panel-overlay.hs-open{opacity:1;pointer-events:auto}
.hs-panel{
  position:fixed;top:50%;left:50%;width:min(420px,90vw);aspect-ratio:1;box-sizing:border-box;overflow:hidden;
  padding:clamp(14px,5.7cqw,24px);background:#fafaf7;border:1px solid rgba(0,0,0,.08);border-radius:6px;
  box-shadow:0 20px 60px rgba(0,0,0,.22);font-family:var(--hs-font-display);container-type:inline-size;
  transform:translate(-50%,-50%) scale(.97);opacity:0;pointer-events:none;z-index:9999;
  transition:transform .35s cubic-bezier(.16,1,.3,1),opacity .3s ease;
}
.hs-panel.hs-open{transform:translate(-50%,-50%) scale(1);opacity:1;pointer-events:auto}
#hs-panel-body{display:flex;flex-direction:column;height:100%;min-height:0}
.hs-panel-close{position:absolute;top:14px;right:14px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:none;border:1px solid rgba(0,0,0,.15);border-radius:50%;font-family:Georgia,serif;font-size:15px;line-height:1;color:var(--hs-muted);cursor:pointer;transition:background .15s ease,border-color .15s ease,color .15s ease}
.hs-panel-close:hover{background:rgba(0,0,0,.05);border-color:rgba(0,0,0,.3);color:#000}
/* Headstream icon linking to the artist page (appears once the panel has loaded) */
.hs-panel-artist-link{position:absolute;top:10px;left:12px;z-index:1;display:block;opacity:0;pointer-events:none;transition:opacity .15s ease}
.hs-panel.hs-loaded .hs-panel-artist-link{opacity:1;pointer-events:auto}
.hs-panel.hs-loaded .hs-panel-artist-link:hover{opacity:.75}
.hs-panel-artist-link img{display:block;height:clamp(38px,13.81cqw,58px);width:auto}
.hs-panel-artist-tip{position:absolute;top:100%;left:0;margin-top:6px;white-space:nowrap;font-family:Georgia,serif;font-style:italic;font-size:11px;color:var(--hs-muted);background:#fff;border:1px solid rgba(0,0,0,.1);padding:3px 9px;border-radius:3px;box-shadow:0 2px 6px rgba(0,0,0,.08);opacity:0;transform:translateY(-4px);pointer-events:none;transition:opacity .15s ease,transform .15s ease}
.hs-panel-artist-link:hover .hs-panel-artist-tip{opacity:1;transform:translateY(0)}
/* Name: Playfair semibold, like album posts (!important beats older pages' built-in italic) */
.hs-panel-name{flex:0 0 auto;font-size:clamp(16px,5.6cqw,24px);line-height:1.25;margin:0 0 clamp(5px,2.4cqw,10px);padding:0 8px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hs-panel .hs-panel-name,.hs-panel .hs-panel-name a{font-family:var(--hs-font-display) !important;font-style:normal !important;font-weight:600 !important;color:var(--hs-ink) !important}
.hs-panel-name a{text-decoration:none}
.hs-panel-name a:hover{text-decoration:underline}
.hs-panel-photo-wrap{flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;overflow:hidden}
.hs-panel-image-link,.hs-panel-photo-wrap > .hs-panel-image{display:block;height:92%;aspect-ratio:1/1;transition:opacity .15s ease}
.hs-panel-image-link:hover{opacity:.85}
.hs-panel-image{display:block;object-fit:cover;border:1px solid #ddd;border-radius:50%}
.hs-panel-image-link .hs-panel-image{width:100%;height:100%}
.hs-panel-socials{flex:0 0 auto;display:flex;flex-wrap:wrap;justify-content:space-evenly;gap:8px;width:100%;margin-top:20px}
.hs-panel-socials a{display:flex;align-items:center;justify-content:center;padding:6px}
.hs-panel-socials img{width:26px;height:26px;opacity:.75;transition:opacity .15s ease}
.hs-panel-socials img[src*="x-bw"]{border-radius:50%}
.hs-panel-socials a:hover img{opacity:1}
.hs-panel-loading{font-style:italic;color:var(--hs-faint);text-align:center;margin:auto}
/* Loading skeleton */
.hs-skeleton{display:block;margin:0 auto;background:#e8e6df;border-radius:4px;animation:hs-pulse 1.1s ease-in-out infinite}
.hs-skeleton-name{flex:0 0 auto;width:140px;height:22px;margin:0 auto clamp(5px,2.4cqw,10px)}
.hs-skeleton-photo{height:92%;aspect-ratio:1/1;border-radius:50%}
.hs-skeleton-socials{flex:0 0 auto;display:flex;justify-content:space-evenly;width:100%;gap:8px;margin-top:20px}
.hs-skeleton-icon{width:26px;height:26px;border-radius:50%}
.hs-skeleton-artist-icon{position:absolute;top:10px;left:12px;z-index:1;width:clamp(30px,10.95cqw,46px);height:clamp(38px,13.81cqw,58px);border-radius:4px}
.hs-panel.hs-loaded .hs-skeleton-artist-icon{display:none}
@keyframes hs-pulse{0%,100%{opacity:.6}50%{opacity:1}}


/* ---------- 6. Roster heading → label's official roster page ---------- */
/* Same look as the "Artist Catalog" heading on artist pages: centred, display face, 28px */
h2#current-artist-roster{font-family:var(--hs-font-display) !important;font-style:normal;font-weight:600;font-size:28px !important;line-height:1.2;color:var(--hs-ink);text-align:center !important;margin-left:auto;margin-right:auto;letter-spacing:normal;text-transform:none}
h2#current-artist-roster strong{font-weight:inherit}
#current-artist-roster a{color:inherit;text-decoration:none}
#current-artist-roster a:hover{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:6px}


/* Verification line under the roster (written by the page generator), e.g. "Roster verified against Sub Pop's official artist page" */
.hs-verified{max-width:640px;margin:28px auto 8px;text-align:center;font-family:var(--hs-font-text);font-style:italic;font-size:13px;line-height:1.5;color:var(--hs-faint)}
.hs-verified a{color:inherit;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.hs-verified a:hover{color:var(--hs-ink)}


/* ---------- 7. Linked photos: hover shade ---------- */
/* Any linked photo in page content (roster grids, Label Directory, artist and label photos, the pop-up)
   dims slightly on hover. Album art has its own hover and is left out. */
.entry-content a img:not(.hs-hub-cover):not(.wp-post-image):not(.hs-release-cover),
.hs-panel a img{transition:filter .3s ease}
.entry-content a:hover img:not(.hs-hub-cover):not(.wp-post-image):not(.hs-release-cover),
.entry-content a:focus-visible img:not(.hs-hub-cover):not(.wp-post-image):not(.hs-release-cover),
.hs-panel a:hover img{filter:brightness(.88)}
/* Linked block images hug their picture (round photos stay round) */
.wp-block-gallery figure.wp-block-image{overflow:hidden}
.entry-content figure.wp-block-image > a{display:inline-block;overflow:hidden;line-height:0;vertical-align:top}
.entry-content figure.wp-block-image.is-style-rounded > a{border-radius:9999px}


/* ---------- 8. Artist Catalog (artist pages) ---------- */
.hs-hub{max-width:940px;margin:48px auto 24px;font-family:var(--hs-font-text)}
.hs-hub-heading{font-family:var(--hs-font-display);font-style:normal;font-weight:600;font-size:28px;line-height:1.2;color:var(--hs-ink);text-align:center;margin:0 0 18px}
.hs-hub-filters{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin:0 0 28px}
.hs-hub-grid{display:grid;grid-template-columns:repeat(auto-fit,210px);justify-content:center;gap:24px 20px}
.hs-hub-card{display:block;text-decoration:none;color:inherit;text-align:center}
.hs-hub-card[hidden]{display:none}
.hs-hub-cover{display:block;width:100%;aspect-ratio:1;object-fit:cover;transition:transform .25s ease}
.hs-hub-card:hover .hs-hub-cover{transform:translateY(-2px)}
.hs-hub-card--nocover{padding-top:12px;border-top:1px solid rgba(0,0,0,.15)}
.hs-hub-title{display:block;margin-top:10px;line-height:1.3;font-family:var(--hs-font-text);font-style:italic;font-weight:400;font-size:15px;color:var(--hs-muted)}
.hs-hub-card:hover .hs-hub-title{text-decoration:underline;text-underline-offset:3px}
.hs-hub-meta{display:block;margin-top:3px;font-size:12px;letter-spacing:.02em;color:var(--hs-faint)}
@media (max-width:640px){
  .hs-hub-grid{grid-template-columns:repeat(2,1fr);gap:16px 12px}
  .hs-hub-title{font-size:14px}
}


/* Plain release list written into artist pages for search engines and AI agents (SEO snippet).
   The content-hub script replaces it with the visual catalog; it is hidden while that loads. */
.hs-catalog-static{max-width:940px;margin:48px auto 24px;text-align:center;font-family:var(--hs-font-text)}
.hs-catalog-static ul{list-style:none;margin:0;padding:0}
.hs-catalog-static li{margin:0 0 6px;font-size:15px;color:var(--hs-muted)}
.hs-catalog-static a{font-style:italic;color:inherit}
.hs-catalog-static span{font-size:12px;color:var(--hs-faint)}
body.hs-hub-loading .hs-catalog-static{display:none}


/* Page note at the end of label and artist pages (written in a synced pattern; added by the SEO snippet) */
.hs-page-note{max-width:560px;margin:48px auto 8px;padding-top:20px;border-top:1px solid rgba(0,0,0,.12);text-align:center;font-family:var(--hs-font-text);font-style:italic;font-size:15px;line-height:1.6;color:var(--hs-muted)}
.hs-page-note p{margin:0 0 6px}
.hs-page-note a{color:var(--hs-ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}


/* ---------- 9. Filter tabs ---------- */
/* Record-bin dividers: card-stock tabs with a dark base, Jost Extra Bold caps with a light letterpress
   shadow, and a slight hand-placed tilt that straightens on hover or when selected. */
.hs-filter-btn{
  position:relative;padding:9px 18px 7px;border:none;border-radius:8px 8px 0 0;cursor:pointer;
  background:linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,0) 45%,rgba(0,0,0,.07) 100%),#d4cfc4;
  color:var(--hs-ink);font-family:var(--hs-font-label);font-style:normal;font-weight:800;font-size:14px;line-height:1.2;
  letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;-webkit-font-smoothing:antialiased;
  text-shadow:0 1px 0 rgba(255,255,255,.55),0 -1px 0 rgba(0,0,0,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(0,0,0,.05),0 1px 2px rgba(0,0,0,.1);
  transition:all .2s ease;
}
.hs-filter-btn::before{content:'';position:absolute;inset:0;border-radius:8px 8px 0 0;background:url("data:image/svg+xml,%3Csvg viewBox='0 0 100 100' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E");opacity:.03;pointer-events:none}
.hs-filter-btn::after{content:'';position:absolute;bottom:-4px;left:10%;width:80%;height:4px;background:linear-gradient(to bottom,#1a1a1a 0%,#333 100%);border-radius:0 0 2px 2px;transition:all .2s ease}
.hs-filter-btn:nth-child(odd){transform:rotate(-1deg)}
.hs-filter-btn:nth-child(even){transform:rotate(.8deg)}
.hs-filter-btn:hover{
  background:linear-gradient(180deg,rgba(255,255,255,.4) 0%,rgba(255,255,255,0) 50%,rgba(0,0,0,.02) 100%),#ded9ce;
  transform:rotate(0) translateY(-2px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -1px 0 rgba(0,0,0,.05),0 4px 8px rgba(0,0,0,.12);
}
.hs-filter-btn:hover::after{bottom:-6px;height:6px}
.hs-filter-btn.hs-active{
  background:linear-gradient(180deg,rgba(255,255,255,.12) 0%,rgba(255,255,255,0) 45%,rgba(0,0,0,.25) 100%),#2a2a2a;
  color:#f0ebe0;transform:rotate(0);
  text-shadow:0 -1px 0 rgba(0,0,0,.7),0 1px 0 rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.1),inset 0 -1px 0 rgba(0,0,0,.2),0 2px 6px rgba(0,0,0,.2);
}
.hs-filter-btn.hs-active::after{background:linear-gradient(to bottom,#444 0%,#555 100%)}
.hs-filter-btn.hs-active:hover{background:linear-gradient(180deg,rgba(255,255,255,.1) 0%,rgba(255,255,255,0) 50%,rgba(0,0,0,.1) 100%),#333}
.hs-filter-btn:focus{outline:none}
.hs-filter-btn:focus-visible{outline:2px solid #2a2a2a;outline-offset:3px}
/* Sub-genre row (shown when genre detail is switched on) */
.hs-subgenre-row .hs-filter-btn{padding:8px 16px 6px;border-radius:6px 6px 0 0;font-size:12px;font-weight:700;letter-spacing:.04em;background:linear-gradient(180deg,rgba(255,255,255,.4) 0%,rgba(255,255,255,0) 50%,rgba(0,0,0,.02) 100%),#e8e4db}
.hs-subgenre-row .hs-filter-btn::after{bottom:-3px;height:3px;left:12%;width:76%}
.hs-subgenre-row .hs-filter-btn:hover{background:linear-gradient(180deg,rgba(255,255,255,.5) 0%,rgba(255,255,255,0) 50%,rgba(0,0,0,.01) 100%),#f0ece3}
.hs-subgenre-row .hs-filter-btn:hover::after{bottom:-5px;height:5px}
.hs-subgenre-row .hs-filter-btn.hs-active{background:linear-gradient(180deg,rgba(255,255,255,.06) 0%,rgba(255,255,255,0) 50%,rgba(0,0,0,.1) 100%),#444;color:#e8e4db}
@media (max-width:480px){
  .hs-filter-btn{font-size:12px;padding:7px 12px 5px}
  .hs-subgenre-row .hs-filter-btn{padding:5px 10px 4px}
}


/* ---------- 10. Flip-through motion (when a filter tab is clicked) ---------- */
@keyframes hs-flip-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.hs-flip{animation:hs-flip-in .32s cubic-bezier(.2,.7,.2,1) backwards;animation-delay:calc(var(--hs-i,0) * 40ms)}


/* ---------- 11. Weekly release post ---------- */
.hs-weekly{max-width:1120px;margin:0 auto;font-family:var(--hs-font-text)}
.hs-weekly .hs-intro{text-align:center;margin-bottom:24px}
.hs-weekly .hs-intro p{font-family:var(--hs-font-text);font-style:italic;font-size:15px;line-height:1.6;color:var(--hs-muted);max-width:640px;margin:0 auto}
.hs-weekly .hs-divider{border:none;border-top:1px solid #ddd;margin:24px auto 28px;max-width:200px}
.hs-weekly .hs-filter-bar{margin-bottom:32px;text-align:center}
.hs-weekly .hs-filter-row{display:flex;flex-wrap:wrap;justify-content:center;gap:14px;margin-bottom:20px}
.hs-weekly .hs-filter-row:last-child{margin-bottom:0}
.hs-weekly .hs-filter-row:empty{display:none;margin-bottom:0}
.hs-weekly .hs-subgenre-row{margin-top:8px}
.hs-weekly .hs-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.hs-weekly .hs-card-container{width:100%}
.hs-weekly .hs-card-container.hs-hidden{display:none}
.hs-weekly .hs-card{position:relative;width:100%;aspect-ratio:1/1;overflow:hidden;background:#f5f5f5;cursor:pointer;border-radius:4px;box-shadow:0 1px 3px rgba(0,0,0,.08);transition:box-shadow .3s ease,transform .3s ease}
.hs-weekly .hs-card:hover{box-shadow:0 8px 24px rgba(0,0,0,.12);transform:translateY(-3px)}
.hs-weekly .hs-card:focus-visible{outline:2px solid #2a2a2a;outline-offset:3px}
.hs-weekly .hs-card-image{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s ease,filter .3s ease}
.hs-weekly .hs-card:hover .hs-card-image{transform:scale(1.03)}
.hs-weekly .hs-card.hs-expanded .hs-card-image{transform:scale(1.08);filter:brightness(.25)}
.hs-weekly .hs-card-nocover{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;padding:16px;text-align:center;font-family:var(--hs-font-display);font-style:italic;color:#777}
.hs-weekly .hs-card.hs-expanded .hs-card-nocover{opacity:0}
.hs-weekly .hs-card-overlay{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;opacity:0;pointer-events:none;transition:opacity .3s ease}
.hs-weekly .hs-card.hs-expanded .hs-card-overlay{opacity:1;pointer-events:auto}
.hs-weekly .hs-overlay-genre{text-transform:uppercase;font-size:10px;letter-spacing:.08em;color:rgba(255,255,255,.6);text-align:center}
.hs-weekly .hs-overlay-genre:empty{display:none}
.hs-weekly .hs-overlay-label{font-size:12px;letter-spacing:.02em;color:rgba(255,255,255,.85);text-align:center;text-decoration:none}
.hs-weekly a.hs-overlay-label:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.hs-weekly .hs-icon-links{display:flex;flex-direction:column;align-items:center;gap:14px}
.hs-weekly .hs-icon-row{display:flex;justify-content:center;align-items:center;gap:22px}
.hs-weekly .hs-icon-links a{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;text-decoration:none;transition:transform .2s ease,opacity .2s ease}
.hs-weekly .hs-icon-links a:hover{transform:scale(1.1);opacity:.85}
.hs-weekly .hs-icon-links svg{width:32px;height:32px}
.hs-weekly .hs-meta{margin-top:12px;text-align:center}
.hs-weekly .hs-artist{font-family:var(--hs-font-display);font-size:15px;font-weight:600;color:var(--hs-ink)}
.hs-weekly .hs-artist a{color:inherit;text-decoration:none}
.hs-weekly .hs-album-title{display:block;margin-top:2px;font-size:14px;font-style:italic;color:var(--hs-muted);text-decoration:none}
.hs-weekly .hs-meta a:hover{text-decoration:underline;text-underline-offset:3px}
.hs-weekly .hs-no-results{display:none;text-align:center;padding:40px 20px;color:#999;font-size:14px;font-style:italic}
.hs-weekly .hs-no-results.hs-visible{display:block}
/* Close button: weekly card overlay and album-post cover overlay */
.hs-weekly .hs-overlay-close,.hs-release-overlay .hs-overlay-close{position:absolute;top:10px;right:10px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;padding:0;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.4);border-radius:50%;color:rgba(255,255,255,.9);font-size:12px;line-height:1;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.hs-weekly .hs-overlay-close:hover,.hs-release-overlay .hs-overlay-close:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.75)}
/* Columns follow the space the post actually gets (not the screen), so phones, tablets and the home-screen app
   all pack covers densely: 2 across on a phone, 3 on a tablet in portrait or a phone on its side, 4 on wide screens. */
.hs-weekly{container-type:inline-size;container-name:hs-weekly}
@container hs-weekly (min-width:1000px){.hs-weekly .hs-grid{grid-template-columns:repeat(4,1fr)}}
@container hs-weekly (max-width:620px){.hs-weekly .hs-grid{gap:20px 14px}}
/* Phones: each row of tabs stays on one line and swipes sideways (centered when they all fit), instead of
   stacking three or four rows deep above the covers. The edges fade to hint there is more. */
@container hs-weekly (max-width:620px){
  .hs-weekly .hs-filter-row{flex-wrap:nowrap;justify-content:flex-start;gap:10px;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;padding:8px 18px 12px;margin-bottom:10px;scroll-padding-inline:18px;
    -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 18px,#000 calc(100% - 18px),transparent 100%)}
  .hs-weekly .hs-filter-row::-webkit-scrollbar{display:none}
  .hs-weekly .hs-filter-row .hs-filter-btn{flex:0 0 auto}
  .hs-weekly .hs-filter-row .hs-filter-btn:first-child{margin-left:auto}
  .hs-weekly .hs-filter-row .hs-filter-btn:last-child{margin-right:auto}
  .hs-weekly .hs-filter-bar{margin-bottom:22px}
}
@container hs-weekly (max-width:520px){
  .hs-weekly .hs-grid{grid-template-columns:repeat(2,1fr);gap:22px 12px}
  .hs-weekly .hs-meta{margin-top:8px}
  .hs-weekly .hs-artist{font-size:14px;line-height:1.25}
  .hs-weekly .hs-album-title{font-size:13px;line-height:1.3}
}
/* Small covers: the opened card shrinks its icons and spacing so everything fits on a phone-sized square. */
.hs-weekly .hs-card{container-type:inline-size}
@container (max-width:230px){
  .hs-weekly .hs-card-overlay{gap:8px;padding:8px}
  .hs-weekly .hs-icon-links{gap:10px}
  .hs-weekly .hs-icon-row{gap:14px}
  .hs-weekly .hs-icon-links svg{width:25px;height:25px}
  .hs-weekly .hs-overlay-genre{font-size:9px}
  .hs-weekly .hs-overlay-label{font-size:11px}
  .hs-weekly .hs-overlay-close{top:6px;right:6px;width:24px;height:24px}
}
@container (max-width:150px){
  .hs-weekly .hs-icon-row{gap:10px}
  .hs-weekly .hs-icon-links svg{width:22px;height:22px}
  .hs-weekly .hs-overlay-genre{display:none}
}


/* ---------- 12. Streaming-icon colours ---------- */
/* Icons are drawn by the releases script. Brand colours hold on hover/focus (the theme's link-hover
   colour would otherwise turn them grey); the hover cue is the gentle scale-up and fade. */
.hs-ic-spotify,.hs-ic-spotify:hover,.hs-ic-spotify:focus{color:#1DB954 !important}
.hs-ic-bandcamp,.hs-ic-bandcamp:hover,.hs-ic-bandcamp:focus{color:#1da0c3 !important}
.hs-ic-youtube,.hs-ic-youtube:hover,.hs-ic-youtube:focus{color:#FF0000 !important}
.hs-ic-apple,.hs-ic-apple:hover,.hs-ic-apple:focus{color:#fff !important}
.hs-ic-headstream,.hs-ic-headstream:hover,.hs-ic-headstream:focus{color:#fff !important}
.hs-release .hs-ic-apple,.hs-release .hs-ic-apple:hover,.hs-release .hs-ic-apple:focus{color:var(--hs-ink) !important}


/* ---------- 13. Album post ---------- */
.hs-release{max-width:560px;margin:0 auto;text-align:center;font-family:var(--hs-font-text)}
.hs-release-head{margin:0 0 18px}
.hs-release-artist{font-family:var(--hs-font-display);font-size:24px;font-weight:600;line-height:1.25;color:var(--hs-ink)}
.hs-release-artist a{color:inherit;text-decoration:none}
.hs-release-artist a:hover{text-decoration:underline;text-underline-offset:4px}
.hs-release-album{margin-top:4px;font-size:19px;font-style:italic;color:var(--hs-muted)}
/* Cover: click to reveal release details */
.hs-release-art{position:relative;max-width:420px;margin:0 auto;aspect-ratio:1/1;overflow:hidden;background:#f5f5f5;cursor:pointer}
.hs-release-art:focus-visible{outline:2px solid #2a2a2a;outline-offset:3px}
.hs-release-cover{display:block;width:100%;height:100%;object-fit:cover;transition:transform .4s ease,filter .3s ease}
.hs-release-art:hover .hs-release-cover{transform:scale(1.02)}
.hs-release-art.hs-expanded .hs-release-cover{transform:scale(1.06);filter:brightness(.25)}
.hs-release-overlay{position:absolute;inset:0;box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:10px;padding:28px 24px;opacity:0;pointer-events:none;transition:opacity .3s ease}
.hs-release-art.hs-expanded .hs-release-overlay{opacity:1;pointer-events:auto}
.hs-release-overlay .hs-release-facts{max-width:80%;font-size:14px;line-height:1.5;letter-spacing:.02em;color:rgba(255,255,255,.85)}
.hs-release-overlay .hs-release-label{color:#fff;font-weight:600;text-decoration:none}
.hs-release-overlay a.hs-release-label:hover{text-decoration:underline;text-underline-offset:3px}
.hs-release-overlay .hs-overlay-genre{text-transform:uppercase;font-size:11px;letter-spacing:.08em;color:rgba(255,255,255,.6)}
.hs-release-overlay .hs-overlay-genre:empty{display:none}
.hs-genre-link{color:inherit;text-decoration:none}
.hs-genre-link:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.hs-release-facts-plain{display:flex;flex-direction:column;gap:4px;margin:0 0 16px;font-size:13px;color:#777}
/* Streaming links under the cover */
.hs-release-links{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:22px;margin:20px 0 8px}
.hs-release-links a{display:inline-flex;transition:transform .2s ease,opacity .2s ease}
.hs-release-links a:hover{transform:scale(1.1);opacity:.85}
.hs-release-links svg{width:34px;height:34px}
.hs-release-overlay .hs-release-label{white-space:nowrap}
/* Phone on its side: cover on the left, name and streaming links beside it, so nothing falls below the fold. */
@media (orientation:landscape) and (max-height:500px){
  .hs-release{max-width:760px;display:grid;grid-template-columns:min(300px,calc(100svh - 70px)) 1fr;grid-template-areas:"art head" "art links";align-items:center;column-gap:36px;text-align:left}
  .hs-release > .hs-page-data{display:none}
  .hs-release-head{grid-area:head;align-self:end;margin:0}
  .hs-release-art{grid-area:art;width:100%;max-width:none;margin:0}
  .hs-release-links{grid-area:links;align-self:start;justify-content:flex-start;margin:18px 0 0;gap:20px}
  .hs-release-links svg{width:30px;height:30px}
  .hs-release-overlay{padding:20px 16px;text-align:center}
}


/* ---------- 14. Release-post chrome ---------- */
/* On the release post itself only (body.single). The "Artist – Album" title is hidden from view but kept
   for screen readers and agents; blog furniture and the doubled featured image are removed. */
body.single article:is(.category-albums,.category-singles-and-eps) .entry-title{position:absolute !important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
body.single article:is(.category-albums,.category-singles-and-eps) :is(.entry-meta,.entry-footer,.byline,.post-thumbnail,.entry-image,.featured-image,.wp-post-image),
body.single:has(article:is(.category-albums,.category-singles-and-eps)) :is(#comments,.comments-area,#respond,.comment-respond,.sharedaddy,#jp-relatedposts,.post-navigation){display:none !important}


/* ---------- 15. Home page, archives, search: post cards ---------- */
/* Every post is the same compact card: centred title, 220px image, date line close underneath.
   Four per row on wide screens (the theme's masonry sizes its columns from the first card). */
body:is(.blog,.archive,.search) article.post{text-align:center}
body:is(.blog,.archive,.search) article.post .entry-header{margin-top:0;padding-top:0}
body:is(.blog,.archive,.search) article.post .entry-title{font-size:26px !important;line-height:1.2;text-align:center;margin:12px 0 8px !important;padding-top:0 !important}
body:is(.blog,.archive,.search) article.post .entry-title a{color:inherit;text-decoration:none}
/* Release titles, split by the releases script into artist over album */
.hs-release-title a{color:inherit;text-decoration:none}
.hs-release-title .hs-t-artist{display:block;font-family:var(--hs-font-display);font-weight:600;color:var(--hs-ink)}
.hs-release-title .hs-t-sep{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
.hs-release-title .hs-t-album{display:block;margin-top:4px;font-family:var(--hs-font-text);font-style:italic;font-weight:400;font-size:.72em;color:var(--hs-muted)}
.hs-release-title a:hover .hs-t-album{text-decoration:underline;text-underline-offset:3px}
/* Image box: 220px, centred, lifts gently on hover */
body:is(.blog,.archive,.search) article.post .entry-thumbnail{position:relative;width:220px;max-width:100%;margin:0 auto !important;overflow:hidden;transition:transform .25s ease}
body:is(.blog,.archive,.search) article.post .entry-thumbnail:hover{transform:translateY(-2px)}
body:is(.blog,.archive,.search) article.post :is(.entry-thumbnail img,.post-thumbnail img,img.wp-post-image){display:block;width:220px !important;max-width:100%;height:auto !important;aspect-ratio:1/1;object-fit:cover;margin:0 auto !important;box-shadow:none !important}
body:is(.blog,.archive,.search) article.post .hover__handler{padding-bottom:0 !important;margin-bottom:0 !important}
/* Text preview: hidden on posts with an image; text-only posts keep three lines */
body:is(.blog,.archive,.search) article:is(.has-post-thumbnail,.category-albums,.category-singles-and-eps) :is(.entry-summary,.entry-content){display:none}
body:is(.blog,.archive,.search) article.post:not(.has-post-thumbnail) :is(.entry-summary,.entry-content){max-width:300px;margin:0 auto;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
/* Date line: date only — the genre lives in the cover details on the post (the theme's "/" goes too) */
body:is(.blog,.archive,.search) article.post .entry-meta .cat-links{display:none !important}
body:is(.blog,.archive,.search) article.post .entry-meta .posted-on::after{content:none !important}
body:is(.blog,.archive,.search) article.post :is(.entry-meta,.entry-footer){text-align:center;margin-top:8px}
body:is(.blog,.archive,.search) article:is(.has-post-thumbnail,.category-albums,.category-singles-and-eps) .entry-footer{margin-top:10px !important;padding-top:0 !important}
body:is(.blog,.archive,.search) article.post .entry-footer .entry-meta{margin-top:0 !important;padding-top:0 !important}
/* Date line: one clean hairline running underneath the date, the same on every screen. The theme's own
   rules beside the date (which break up differently on phones) are switched off. */
body:is(.blog,.archive,.search) article.post :is(.entry-footer,.entry-meta,.entry-meta *){border:0 !important;background-image:none !important}
body:is(.blog,.archive,.search) article.post :is(.entry-footer,.entry-meta)::before,
body:is(.blog,.archive,.search) article.post :is(.entry-footer,.entry-meta)::after,
body:is(.blog,.archive,.search) article.post .entry-meta *::before{content:none !important;display:none !important}
body:is(.blog,.archive,.search) article.post .entry-footer hr{display:none !important}
body:is(.blog,.archive,.search) article.post .entry-footer .entry-meta{display:block !important;width:min(100%,320px);margin-left:auto !important;margin-right:auto !important;padding-bottom:9px !important;border-bottom:1px solid rgba(0,0,0,.18) !important;white-space:nowrap}
/* Admin-only "Edit" link (visitors never see it) */
body:is(.blog,.archive,.search) article.post .edit-link{display:none !important}
/* Single posts (weekly releases): the heading block is centred to match everything below it, and the
   theme's blue category link takes the site's muted ink. */
body.single article.post .entry-header{text-align:center}
body.single article.post .entry-header :is(.entry-meta,.entry-title){text-align:center}
body.single article.post .entry-header .entry-meta a{color:var(--hs-muted) !important;text-decoration:none}
body.single article.post .entry-header .entry-meta a:hover{color:var(--hs-ink) !important}

/* Share and Like blocks (Jetpack) under posts: centred, with a small Jost label and hairline buttons. */
.sharedaddy{text-align:center}
.sharedaddy .sd-title,.sharedaddy h3.sd-title{display:block;width:100%;text-align:center;font-family:var(--hs-font-label) !important;font-weight:600 !important;font-size:12px !important;letter-spacing:.14em;text-transform:uppercase;color:var(--hs-muted)}
/* Dividers: Jetpack's and the theme's own lines are switched off (they sit off-centre), and one short
   hairline is drawn centred above each label instead, the same as the line under each card's date. */
:is(#jp-post-flair,.sharedaddy,.sharedaddy .sd-block,.sharedaddy .sd-like,#jp-relatedposts){border:0 !important;box-shadow:none !important}
:is(#jp-post-flair,.sharedaddy,.sharedaddy .sd-block,.sharedaddy .sd-like,#jp-relatedposts)::before,
:is(#jp-post-flair,.sharedaddy,.sharedaddy .sd-block,.sharedaddy .sd-like,#jp-relatedposts)::after,
.sharedaddy .sd-title::before,.sharedaddy .sd-title::after{content:none !important;display:none !important;border:0 !important}
.sharedaddy .sd-title{padding-top:22px !important;margin-top:18px !important;background:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.18)) top center / min(320px,100%) 1px no-repeat !important}
.sharedaddy .sd-content ul,.sharedaddy .sd-like,.sharedaddy .wpl-likebox{display:flex !important;flex-wrap:wrap;justify-content:center;gap:10px;margin-left:auto !important;margin-right:auto !important;text-align:center}
.sharedaddy .sd-content ul li{margin:0 !important}
.sharedaddy .sd-content ul li a.sd-button{border-radius:20px !important;box-shadow:none !important;border:1px solid rgba(0,0,0,.18) !important;font-family:var(--hs-font-label) !important;font-weight:400 !important}
.sharedaddy iframe.post-likes-widget,#jp-post-flair iframe{width:300px !important;max-width:100%;margin-left:auto !important;margin-right:auto !important;display:block}
/* Likes are not used on this site: the "Like this" block is hidden everywhere. */
.sharedaddy.sd-like,.jetpack-likes-widget-wrapper,.sd-like.jetpack-likes-widget-wrapper,#jp-post-flair .sd-like{display:none !important}
/* "Related" posts heading: the same small centred label */
#jp-relatedposts{text-align:center}
#jp-relatedposts :is(h3.jp-relatedposts-headline,.jp-relatedposts-headline){float:none !important;display:block;width:100%;text-align:center;font-family:var(--hs-font-label) !important;font-weight:600 !important;font-size:12px !important;letter-spacing:.14em;text-transform:uppercase;color:var(--hs-muted)}
#jp-relatedposts .jp-relatedposts-headline em{font-style:normal !important;font-weight:inherit !important}
/* Related suggestions: a small cover teaser over artist (Playfair) and album (italic), like the home cards */
#jp-relatedposts :is(.jp-relatedposts-items,.jp-related-posts-i2__list){display:flex !important;flex-wrap:wrap;justify-content:center;gap:18px 28px;margin:14px auto 0 !important;padding:0 !important;list-style:none}
#jp-relatedposts :is(.jp-relatedposts-post,.jp-related-posts-i2__post){float:none !important;width:150px !important;max-width:150px;margin:0 !important;padding:0 !important;text-align:center !important;opacity:1 !important;display:flex;flex-direction:column;align-items:center}
#jp-relatedposts :is(.jp-relatedposts-post-img,.jp-related-posts-i2__post-img){display:block;width:84px !important;height:84px !important;max-width:84px;object-fit:cover;margin:0 auto 10px !important;border-radius:var(--hs-art-radius) !important;outline:var(--hs-art-edge);outline-offset:-1px;box-shadow:var(--hs-art-shadow);transition:transform .25s ease}
#jp-relatedposts :is(.jp-relatedposts-post-a,.jp-related-posts-i2__post-img-link):hover img{transform:translateY(-2px)}
#jp-relatedposts :is(.jp-relatedposts-post-title,.jp-related-posts-i2__post-heading){margin:0 !important;font-family:var(--hs-font-display) !important;font-size:15px !important;font-weight:600 !important;line-height:1.25 !important;text-align:center}
#jp-relatedposts :is(.jp-relatedposts-post-title,.jp-related-posts-i2__post-heading) a,#jp-relatedposts .jp-related-posts-i2__post-link{color:var(--hs-ink) !important;text-decoration:none !important;font-weight:600 !important}
#jp-relatedposts .hs-release-title .hs-t-album{font-size:13px}
#jp-relatedposts :is(.jp-relatedposts-post-date,.jp-related-posts-i2__post-date){margin-top:4px !important;font-family:var(--hs-font-text) !important;font-size:12px !important;color:var(--hs-muted) !important;opacity:1 !important}
#jp-relatedposts :is(.jp-relatedposts-post-context,.jp-related-posts-i2__post-context){display:none !important}
@media (max-width:520px){   /* phones: all three side by side */
  #jp-relatedposts :is(.jp-relatedposts-items,.jp-related-posts-i2__list){flex-wrap:nowrap;gap:12px}
  #jp-relatedposts :is(.jp-relatedposts-post,.jp-related-posts-i2__post){flex:1 1 0;width:auto !important;min-width:0}
  #jp-relatedposts :is(.jp-relatedposts-post-img,.jp-related-posts-i2__post-img){width:72px !important;height:72px !important}
  #jp-relatedposts :is(.jp-relatedposts-post-title,.jp-related-posts-i2__post-heading){font-size:13px !important}
  #jp-relatedposts .hs-release-title .hs-t-album{font-size:12px}
  #jp-relatedposts :is(.jp-relatedposts-post-date,.jp-related-posts-i2__post-date){font-size:11px !important}
}
/* Under single posts, the theme's "Posted in … Bookmark the permalink" line is blog furniture: hidden. */
body.single article.post .entry-footer{display:none !important}
#jp-relatedposts .jp-relatedposts-headline em::before,#jp-relatedposts .jp-relatedposts-headline::before{content:none !important;display:none !important;border:0 !important}
#jp-relatedposts .jp-relatedposts-headline{padding-top:22px !important;margin-top:18px !important;background:linear-gradient(rgba(0,0,0,.18),rgba(0,0,0,.18)) top center / min(320px,100%) 1px no-repeat !important}
/* iPad held sideways (and small laptops): three cards across instead of the theme's two */
@media (min-width:1000px) and (max-width:1279px){
  body:is(.blog,.archive,.search) .archive__grid > .grid__item{width:33.3333% !important}
  body:is(.blog,.archive,.search) article.post .entry-title{font-size:22px !important}
}
@media (min-width:1280px){
  body:is(.blog,.archive,.search) .archive__grid > .grid__item{width:25% !important}
  body:is(.blog,.archive,.search) article.post .entry-title{font-size:22px !important}
}


/* Artist pages in search results and archives: a matching card with the round photo.
   (Artist pages are the only pages with a featured image, so this targets them alone.) */
body:is(.blog,.archive,.search) article.page.has-post-thumbnail{text-align:center;padding-bottom:28px !important;margin-bottom:28px !important;position:relative}
body:is(.blog,.archive,.search) article.page.has-post-thumbnail::after{content:'';position:absolute;left:0;right:0;bottom:0;border-bottom:1px solid rgba(0,0,0,.18);translate:var(--hs-dx,0px) 0}
body:is(.blog,.archive,.search) article.page .entry-title{font-family:var(--hs-font-display) !important;font-weight:600 !important;font-style:normal !important;font-size:26px !important;line-height:1.2;text-align:center;margin:12px 0 14px !important;padding-top:0 !important;color:var(--hs-ink)}
body:is(.blog,.archive,.search) article.page :is(.entry-title a,.entry-permalink){color:inherit;text-decoration:none}
body:is(.blog,.archive,.search) article.page.has-post-thumbnail .entry-thumbnail{position:relative;width:220px;max-width:100%;margin:0 auto !important;border-radius:50% !important;overflow:hidden;box-shadow:var(--hs-art-shadow);transition:transform .25s ease}
body:is(.blog,.archive,.search) article.page.has-post-thumbnail .entry-thumbnail:hover{transform:translateY(-2px)}
body:is(.blog,.archive,.search) article.page.has-post-thumbnail :is(.entry-thumbnail img,img.wp-post-image){display:block;width:220px !important;max-width:100%;height:auto !important;aspect-ratio:1/1;object-fit:cover;margin:0 auto !important;border-radius:50% !important;outline:var(--hs-art-edge);outline-offset:-1px;box-shadow:none !important}
body:is(.blog,.archive,.search) article.page.has-post-thumbnail .entry-thumbnail .hover{border-radius:50% !important}
body:is(.blog,.archive,.search) article.page.has-post-thumbnail :is(.entry-summary,.entry-content,.entry-footer,.edit-link){display:none !important}
body:is(.blog,.archive,.search) article.page.has-post-thumbnail .entry-thumbnail::after{content:'Artist';position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:5;pointer-events:none;text-align:center;color:#fff;font-family:var(--hs-font-label);font-weight:300;font-size:17px;letter-spacing:.18em;text-transform:uppercase;text-shadow:var(--hs-on-image-shadow);opacity:0;transition:opacity .35s ease .12s}
body:is(.blog,.archive,.search) article.page.has-post-thumbnail .entry-thumbnail:hover::after{opacity:1}
/* Label pages with a featured image (their square Label Directory tile): a rounded square like album art,
   instead of the artists' circle, with a "Label" hover word to match the artists' "Artist". */
body:is(.blog,.archive,.search) article.page.hs-label-page.has-post-thumbnail .entry-thumbnail{border-radius:var(--hs-art-radius) !important}
body:is(.blog,.archive,.search) article.page.hs-label-page.has-post-thumbnail :is(.entry-thumbnail img,img.wp-post-image){border-radius:var(--hs-art-radius) !important}
body:is(.blog,.archive,.search) article.page.hs-label-page.has-post-thumbnail .entry-thumbnail .hover{border-radius:var(--hs-art-radius) !important}
body:is(.blog,.archive,.search) article.page.hs-label-page.has-post-thumbnail .entry-thumbnail::after{content:'Label'}
/* Label pages (and any other page) in results: same centered card and bold title, without the photo. */
body:is(.blog,.archive,.search) article.page:not(.has-post-thumbnail){text-align:center}
body:is(.blog,.archive,.search) article.page:not(.has-post-thumbnail) :is(.entry-header,.entry-summary,.entry-content){text-align:center !important}
@media (min-width:1000px){body:is(.blog,.archive,.search) article.page .entry-title{font-size:22px !important}}
/* Phones and tablets: the theme's narrow-screen wrappers float and pad to the left, so stack and center everything in the card. */
@media (max-width:1024px){
  body:is(.blog,.archive,.search) article.page{display:flex !important;flex-direction:column;align-items:center}
  body:is(.blog,.archive,.search) article.page > *,
  body:is(.blog,.archive,.search) article.page :is(.entry-header,.post-thumbnail,.featured-media,.entry-media){float:none !important;width:100% !important;max-width:100% !important;margin-left:0 !important;margin-right:0 !important;padding-left:0 !important;padding-right:0 !important;text-align:center !important;display:flex;flex-direction:column;align-items:center}
  body:is(.blog,.archive,.search) article.page.has-post-thumbnail .entry-thumbnail{width:220px !important;margin-left:auto !important;margin-right:auto !important}
  body:is(.blog,.archive,.search) article.page .entry-title{width:100%;padding-left:0 !important;padding-right:0 !important}
  /* Cards with a photo: the card itself keeps the theme's spacing (same as album cards); only the photo and title are re-centered inside it. */
  body:is(.blog,.archive,.search) article.page.has-post-thumbnail :is(.entry-header,.entry-thumbnail,.entry-title,.entry-image,.post-thumbnail,figure,.wp-post-image){float:none !important;left:auto !important;right:auto !important;margin-left:auto !important;margin-right:auto !important;align-self:center !important}
}


/* ---------- 16. Card hover: ripple and category word ---------- */
/* Two hairline rings spread from the centre like a drop hitting water (a nod to the Headstream mark)
   while a Jost Light word fades in. Replaces the theme's stretching lines and "Read More". */
body:is(.blog,.archive,.search) .entry-thumbnail :is(.hover__line,.hover__letter,.hover__letter-mask,.hover__more){display:none !important}
body:is(.blog,.archive,.search) .entry-thumbnail .hover{overflow:hidden}
body:is(.blog,.archive,.search) .entry-thumbnail .hover::before,
body:is(.blog,.archive,.search) .entry-thumbnail .hover::after{content:'';position:absolute;left:50%;top:50%;width:6px;height:6px;border-radius:50%;border:1.5px solid rgba(255,255,255,.8);opacity:0;transform:translate(-50%,-50%);pointer-events:none;z-index:1}
body:is(.blog,.archive,.search) .entry-thumbnail:hover .hover::before{animation:hs-ripple 1.1s cubic-bezier(.2,.6,.3,1) both}
body:is(.blog,.archive,.search) .entry-thumbnail:hover .hover::after{animation:hs-ripple 1.1s cubic-bezier(.2,.6,.3,1) .22s both}
@keyframes hs-ripple{0%{opacity:.9;width:6px;height:6px}100%{opacity:0;width:260px;height:260px}} /* grows by size, so the line stays hairline-thin */
/* The word: by category. Add a line here for any new category. */
body:is(.blog,.archive,.search) article.post .entry-thumbnail::after{
  content:'Read';position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);z-index:5;pointer-events:none;
  text-align:center;color:#fff;font-family:var(--hs-font-label);font-weight:300;font-size:17px;letter-spacing:.18em;text-transform:uppercase;
  text-shadow:var(--hs-on-image-shadow);opacity:0;transition:opacity .35s ease .12s;
}
body:is(.blog,.archive,.search) article.post .entry-thumbnail:hover::after{opacity:1}
body:is(.blog,.archive,.search) article:is(.category-albums,.category-singles-and-eps) .entry-thumbnail::after{content:'Listen'}
body:is(.blog,.archive,.search) article.category-weekly-releases .entry-thumbnail::after{content:'This Week'}
body:is(.blog,.archive,.search) article.category-videos .entry-thumbnail::after{content:'Watch'}


/* ---------- 17. Album-art frame ---------- */
/* One look for album art everywhere (album posts, Artist Catalog, home page, archives, search):
   softly rounded corners, a crisp 1px edge drawn on the artwork itself, and a short even shadow.
   Change the tokens in section 0 to adjust all of them at once. */
.hs-release-art,
.hs-release-cover,
.hs-hub-cover,
.hs-weekly .hs-card,
body:is(.blog,.archive,.search) article.post .entry-thumbnail,
body:is(.blog,.archive,.search) article.post .entry-thumbnail :is(img.wp-post-image,.hover){border-radius:var(--hs-art-radius) !important}
.hs-release-cover,
.hs-hub-cover,
.hs-weekly .hs-card,
body:is(.blog,.archive,.search) article.post .entry-thumbnail img.wp-post-image{outline:var(--hs-art-edge);outline-offset:-1px}
.hs-release-art,
.hs-hub-cover,
body:is(.blog,.archive,.search) article.post .entry-thumbnail{box-shadow:var(--hs-art-shadow) !important} /* !important: older artist pages style their own covers */


/* ---------- 18. Feel: transitions, fades, links, focus ---------- */
/* Images ease in as they load (the script adds these classes, so nothing hides if scripts are off) */
img.hs-fade{opacity:0;transition:opacity .3s ease}
img.hs-fade.hs-in{opacity:1}
/* Smooth scrolling for in-page jumps (Artist Directory letters) */
html{scroll-behavior:smooth}
/* Text links that draw their underline in from the left on hover */
.nav--footer a,.hs-release-overlay a.hs-release-label,.hs-genre-link,.hs-weekly a.hs-overlay-label,.hs-verified a,
.hs-artist-index .hs-az-name,.hs-release-artist a,#current-artist-roster a,.entry-content p a:not(.wp-block-button__link):not(:has(img)){
  text-decoration:none !important;background-image:linear-gradient(currentColor,currentColor);background-repeat:no-repeat;
  background-position:0 100%;background-size:0 1px;transition:background-size .3s cubic-bezier(.2,.75,.25,1);padding-bottom:1px}
.nav--footer a:hover,.hs-release-overlay a.hs-release-label:hover,.hs-genre-link:hover,.hs-weekly a.hs-overlay-label:hover,.hs-verified a:hover,
.hs-artist-index .hs-az-list a:hover .hs-az-name,.hs-release-artist a:hover,#current-artist-roster a:hover,.entry-content p a:not(.wp-block-button__link):not(:has(img)):hover,
.nav--footer a:focus-visible,.entry-content p a:focus-visible{background-size:100% 1px}
/* A click finishes the underline at once (otherwise the page can leave, or come back from the Back button,
   with the line frozen part-way, under the first letter or two). Touch screens skip the effect entirely. */
.nav--footer a:active,.hs-release-overlay a.hs-release-label:active,.hs-genre-link:active,.hs-weekly a.hs-overlay-label:active,.hs-verified a:active,
.hs-artist-index .hs-az-list a:active .hs-az-name,.hs-release-artist a:active,#current-artist-roster a:active,.entry-content p a:not(.wp-block-button__link):not(:has(img)):active{background-size:100% 1px;transition:none}
html.hs-snap *{transition:none !important}
@media (hover:none){
  .nav--footer a,.hs-release-overlay a.hs-release-label,.hs-genre-link,.hs-weekly a.hs-overlay-label,.hs-verified a,
  .hs-artist-index .hs-az-name,.hs-release-artist a,#current-artist-roster a,.entry-content p a:not(.wp-block-button__link):not(:has(img)){background-size:0 1px !important;transition:none !important}
}
/* Edge vignette (releases script): gallery items soften only in a narrow band at the screen's top and
   bottom edges; the script sets each item's fade as you scroll (the settings live in the script). */
.hs-edge-item{will-change:opacity}
@media print{.hs-edge-item{opacity:1 !important;translate:none !important}}
/* Selected text in the brand colours */
::selection{background:#1a1a1a;color:#f0ebe0}
/* Clear, consistent keyboard focus (mouse clicks don't show it) */
a:focus-visible,button:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--hs-ink);outline-offset:3px}
.site-footer a:focus-visible{outline-color:#fff}
:focus:not(:focus-visible){outline:none}


/* ---------- 19. Touch screens and the home-screen app ---------- */
/* Phones and tablets: no grey flash on tap, no double-tap zoom delay, no surprise text enlarging when turned sideways. */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
a,button,.hs-card,.hs-release-art,.hs-filter-btn,.hs-az-pill{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
@media (hover:none){
  /* Hover effects "stick" after a tap on touch screens, so they are switched off here... */
  .hs-weekly .hs-card:hover{transform:none;box-shadow:0 1px 3px rgba(0,0,0,.08)}
  .hs-weekly .hs-card:not(.hs-expanded):hover .hs-card-image,
  .hs-release-art:not(.hs-expanded):hover .hs-release-cover{transform:none}
  .hs-weekly .hs-icon-links a:hover,.hs-release-links a:hover{transform:none;opacity:1}
  body:is(.blog,.archive,.search) :is(article.post,article.page.has-post-thumbnail) .entry-thumbnail:hover{transform:none}
  body:is(.blog,.archive,.search) article.page.has-post-thumbnail .entry-thumbnail:hover::after{opacity:0}
  .hs-hub-card:hover .hs-hub-cover{transform:none}
  .hs-filter-btn:not(.hs-active):hover{background:linear-gradient(180deg,rgba(255,255,255,.45) 0%,rgba(255,255,255,0) 45%,rgba(0,0,0,.07) 100%),#d4cfc4;box-shadow:inset 0 1px 0 rgba(255,255,255,.5),inset 0 -1px 0 rgba(0,0,0,.05),0 1px 2px rgba(0,0,0,.1)}
  .hs-filter-btn:not(.hs-active):nth-child(odd):hover{transform:rotate(-1deg)}
  .hs-filter-btn:not(.hs-active):nth-child(even):hover{transform:rotate(.8deg)}
  .hs-filter-btn:hover::after{bottom:-4px;height:4px}
  .hs-artist-index a.hs-az-pill:hover{transform:none;border-color:rgba(0,0,0,.16);background:transparent;box-shadow:0 1px 2px rgba(0,0,0,.06),0 2px 6px rgba(0,0,0,.04)}
  /* ...and replaced with a quick press response the moment a finger lands */
  .hs-weekly .hs-card:active,.hs-release-art:active{transform:scale(.98);transition-duration:.1s}
  .hs-weekly .hs-icon-links a:active,.hs-release-links a:active{transform:scale(.88);opacity:.8;transition-duration:.08s}
  body:is(.blog,.archive,.search) .entry-thumbnail:active{transform:scale(.98);transition-duration:.1s}
  .hs-hub-card:active .hs-hub-cover{transform:scale(.97)}
  .hs-filter-btn:active{transform:rotate(0) translateY(1px);transition-duration:.08s}
  /* Keyboard keys pop up under the finger, like a phone keyboard */
  .hs-artist-index a.hs-az-pill:active{z-index:1;transform:translateY(-4px) scale(1.25);background:#fff;border-color:rgba(0,0,0,.45);box-shadow:0 6px 14px rgba(0,0,0,.14);transition-duration:.06s}
}
/* Home-screen app: a small back / share bar, since there is no browser toolbar (releases script adds it). */
.hs-app-bar{position:fixed;left:max(14px,env(safe-area-inset-left));bottom:calc(14px + env(safe-area-inset-bottom));z-index:56;display:flex;align-items:center;gap:2px;padding:3px;border-radius:24px;
  background:rgba(255,255,255,.88);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(0,0,0,.12);box-shadow:0 4px 14px rgba(0,0,0,.12);transition:transform .3s ease,opacity .3s ease}
.hs-app-bar.hs-tucked{transform:translateY(calc(100% + 30px));opacity:0}
.hs-app-bar button{width:40px;height:40px;display:flex;align-items:center;justify-content:center;padding:0;border:0;border-radius:50%;background:transparent;color:var(--hs-ink);cursor:pointer}
.hs-app-bar button:active{background:rgba(0,0,0,.07)}
.hs-app-bar svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media print{.hs-app-bar,.hs-az-jump{display:none}}


/* ---------- Reduced motion ---------- */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .hs-panel-overlay,.hs-panel{transition:none !important}
  .hs-panel-artist-tip{transition:opacity .15s ease;transform:none}
  .hs-skeleton{animation:none}
  .hs-flip{animation:none}
  .entry-content a img,.hs-panel a img{transition:none}
  body:is(.blog,.archive,.search) .entry-thumbnail .hover::before,
  body:is(.blog,.archive,.search) .entry-thumbnail .hover::after{animation:none !important}
}


/* ---------- 20. Album covers on list pages: the weekly card ---------- */
/* On the home page, archives and search, an album cover opens like a card in the weekly post: tap for the
   streaming links, label and genre; the Headstream icon (or the title) opens the album page. Built by the
   releases script from data the SEO snippet leaves next to each cover. */
.hs-home-card{position:relative;cursor:pointer;container-type:inline-size}
.hs-home-card:focus-visible{outline:2px solid #2a2a2a;outline-offset:3px}
.hs-home-card img.wp-post-image{transition:transform .4s ease,filter .3s ease}
.hs-home-card.hs-expanded img.wp-post-image{transform:scale(1.08);filter:brightness(.25)}
/* While open: the hover word, ripple and lift step aside */
.hs-home-card.hs-expanded::after,
.hs-home-card.hs-expanded .hover::before,
.hs-home-card.hs-expanded .hover::after{opacity:0 !important;animation:none !important}
.hs-home-card.hs-expanded,.hs-home-card.hs-expanded:hover{transform:none !important}
.hs-home-card .hs-card-overlay{position:absolute;inset:0;z-index:6;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;opacity:0;pointer-events:none;transition:opacity .3s ease;font-family:var(--hs-font-text)}
.hs-home-card.hs-expanded .hs-card-overlay{opacity:1;pointer-events:auto}
.hs-home-card .hs-overlay-genre{text-transform:uppercase;font-size:10px;letter-spacing:.08em;color:rgba(255,255,255,.6);text-align:center}
.hs-home-card .hs-overlay-genre:empty{display:none}
.hs-home-card .hs-overlay-genre a{color:inherit;text-decoration:none}
.hs-home-card .hs-overlay-genre a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.hs-home-card .hs-overlay-label{font-size:12px;letter-spacing:.02em;color:rgba(255,255,255,.85);text-align:center;text-decoration:none}
.hs-home-card a.hs-overlay-label:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.hs-home-card .hs-icon-links{display:flex;flex-direction:column;align-items:center;gap:14px}
.hs-home-card .hs-icon-row{display:flex;justify-content:center;align-items:center;gap:22px}
.hs-home-card .hs-card-overlay a{border:0 !important;box-shadow:none !important;background-image:none !important;text-decoration:none}   /* the theme's link underlines stay off */
.hs-home-card .hs-icon-links a{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;text-decoration:none;transition:transform .2s ease,opacity .2s ease}
.hs-home-card .hs-icon-links a:hover{transform:scale(1.1);opacity:.85}
.hs-home-card .hs-icon-links svg{width:32px;height:32px}
.hs-home-card .hs-overlay-close{position:absolute;top:10px;right:10px;width:26px;height:26px;display:flex;align-items:center;justify-content:center;padding:0;background:rgba(0,0,0,.25);border:1px solid rgba(255,255,255,.4);border-radius:50%;color:rgba(255,255,255,.9);font-size:12px;line-height:1;cursor:pointer;transition:background .15s ease,border-color .15s ease}
.hs-home-card .hs-overlay-close:hover{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.75)}
@container (max-width:230px){
  .hs-home-card .hs-card-overlay{gap:8px;padding:8px}
  .hs-home-card .hs-icon-links{gap:10px}
  .hs-home-card .hs-icon-row{gap:14px}
  .hs-home-card .hs-icon-links svg{width:25px;height:25px}
  .hs-home-card .hs-overlay-genre{font-size:9px}
  .hs-home-card .hs-overlay-label{font-size:11px}
  .hs-home-card .hs-overlay-close{top:6px;right:6px;width:24px;height:24px}
}
@container (max-width:150px){
  .hs-home-card .hs-icon-row{gap:10px}
  .hs-home-card .hs-icon-links svg{width:22px;height:22px}
  .hs-home-card .hs-overlay-genre{display:none}
}
@media (hover:none){
  .hs-home-card .hs-icon-links a:hover{transform:none;opacity:1}
  .hs-home-card .hs-icon-links a:active{transform:scale(.88);opacity:.8;transition-duration:.08s}
}
@media (prefers-reduced-motion:reduce){
  .hs-home-card img.wp-post-image,.hs-home-card .hs-card-overlay{transition:none}
}
/* Same proportions as the weekly cards: a larger cover first, then the artist and album in the weekly
   post's type sizes underneath (the title still opens the album page). Album and single posts only. */
body:is(.blog,.archive,.search) article:is(.category-albums,.category-singles-and-eps) .hover__handler{display:flex !important;flex-direction:column}
body:is(.blog,.archive,.search) article:is(.category-albums,.category-singles-and-eps) .entry-thumbnail{order:-1;width:250px}
body:is(.blog,.archive,.search) article:is(.category-albums,.category-singles-and-eps) :is(.entry-thumbnail img,.post-thumbnail img,img.wp-post-image){width:250px !important}
body:is(.blog,.archive,.search) article:is(.category-albums,.category-singles-and-eps) .entry-header{width:250px;max-width:100%;margin-left:auto;margin-right:auto}
body:is(.blog,.archive,.search) article:is(.category-albums,.category-singles-and-eps) .entry-title{font-size:15px !important;line-height:1.25;margin:12px 0 0 !important}
body:is(.blog,.archive,.search) article:is(.category-albums,.category-singles-and-eps) .hs-release-title .hs-t-album{margin-top:2px;font-size:14px;line-height:1.3}
body:is(.blog,.archive,.search) article:is(.category-albums,.category-singles-and-eps) .entry-footer{margin-top:12px !important}