@import url("https://fonts.googleapis.com/css2?family=EB+Garamond:wght@400&family=Figtree:wght@400;500;600;700&display=swap");
/* Wispr-style palette: cream canvas, forest and lavender blocks, ink type and 2px ink borders, no shadows. Loaded last on every page. */
:root{--mello-page-background:#f9f8f6;--r-cream:#ffffff;--r-pink:#fbe9e3;--r-butter:#fdf1e3;--r-sky:#f1ede8;--r-tomato:#1e293b;--r-orange:#e07a5f;--r-ink:#1e293b;--r-muted:#64748b;--r-amber:#f4a261;--r-teal:#2a9d8f}
:is(.page-home,.catalog-page){--navy:var(--r-ink);--ink:var(--r-ink);--blue-line:var(--r-tomato);--cream:var(--r-cream);--paper:var(--r-cream);--soft-blue:#fbe3e7;--muted:var(--r-muted);background:var(--mello-page-background);color:var(--r-ink)}
:is(.page-home,.catalog-page)::before{opacity:0}
/* Header */
:is(.page-home,.catalog-page) .top{background:transparent}
.approved-logo>span{color:var(--r-tomato);-webkit-text-stroke:0;filter:none}
:is(.page-home,.catalog-page) nav.main a{color:var(--r-ink)}
:is(.page-home,.catalog-page) nav.main a.on{background:var(--r-pink);box-shadow:none;color:var(--r-ink)}
.chrome-cta{background:var(--r-orange);color:var(--r-cream);border-color:var(--r-orange);box-shadow:none}
.chrome-cta .chrome-symbol path{fill:var(--r-cream);stroke:var(--r-orange)}
.chrome-cta small{color:var(--r-muted)}
.chrome-cta:hover,.episode-link:hover,.demo-analysis:hover,.search-submit:hover{box-shadow:0 6px 14px #464c8c33}
/* Search and explorer */
.discovery{background:var(--r-pink);box-shadow:none}
.discovery-intro p,.discovery-intro .intro-lead{color:var(--r-ink)}
.discovery-search{border:2px solid var(--r-tomato);background:var(--r-cream);box-shadow:none}
.discovery-search input{color:var(--r-ink)}
.discovery-search input::placeholder{color:var(--r-muted)}
.discovery-search:focus-within{outline-color:#464c8c55}
.search-glyph{stroke:var(--r-ink)}
.search-submit{background:var(--r-orange);color:var(--r-cream)}
.popular-searches{color:var(--r-ink)}
.popular-searches button{background:var(--r-sky);color:var(--r-ink)}
.show-browser,.show-detail{background:var(--r-cream)}
.band-indicator{background:var(--r-tomato)}
.discovery,.approved-hero{background:var(--r-pink)}
.band-selector button[aria-pressed="true"]{color:var(--r-cream)}
.show-option.selected{border-color:var(--r-tomato);background:#f6ecff}
.discovery-status,.full-facts{color:var(--r-muted)}
.episode-link{border-color:var(--r-tomato);color:var(--r-tomato)}
/* Hero */
.approved-hero{background:var(--r-butter);border-radius:40px;width:calc(100% - var(--mello-page-gutter) - var(--mello-page-gutter))}
.approved-copy h1{color:var(--r-tomato)}
.approved-copy h1 span{color:var(--r-ink)}
.approved-copy>p,.free-note{color:var(--r-ink)}
.demo-pill{background:var(--r-butter)}
.demo-analysis{background:#f6ecff;border-color:var(--r-tomato)}
/* Headings across pages */
:is(.page-home,.catalog-page) :is(h1,h2):not(.sr-only){color:var(--r-tomato)}
.catalog-page main>section>.wrap,.catalog-page #shows>.wrap{background:var(--r-cream)}
.catalog-page .chip{background:var(--r-sky);color:var(--r-ink)}
.catalog-page .chip.on{background:var(--r-tomato);color:var(--r-cream)}
.catalog-back{color:var(--r-muted)}
.ext-install{background:#e9ebf5;border-color:#ccd2ec;color:#8186b0}
.ext-install .ext-status{background:#dde2f4;color:#5e6396}
footer{color:var(--r-muted)}
/* Blocks that kept the old lavender and sage */
.band-selector button{background:var(--r-sky);color:var(--r-ink)}
.show-option .show-row-art,.detail-thumb,.show-art-placeholder,.catalog-page .tile .show-art,.catalog-page .show-artwork{background:#f3f1dc}
.catalog-page .moment-playlists{background:var(--r-butter);border-color:#d9b8ef}
.familiar-card{background:#f6ecff;border-color:#1a1a1a}
.familiar-card:nth-child(3n){background:#eef0dc}
.familiar-card:nth-child(2n){background:#f7e9ff}
.catalog-empty{background:#f6ecff}
.catalog-page main>section:not(#shows) h1,.catalog-page main>section h1,.catalog-page #shows h1,.catalog-page .showhead h1{color:var(--r-tomato)}
.catalog-page main>section:not(#shows) p,.catalog-page main>section:not(#shows) li{color:var(--r-ink)}

/* Overrides */
:is(.page-home,.catalog-page){font-family:Figtree,Inter,system-ui,sans-serif}
:is(.page-home,.catalog-page) :is(h1,h2,h3),.approved-logo>span,.approved-copy h1,.browser-heading h2,.detail-heading h2,.hero-facts h2{font-family:"EB Garamond","Cormorant Garamond",Georgia,serif!important;font-weight:400!important;letter-spacing:-.02em!important}
.approved-logo>span{font-size:44px}
.chrome-cta,.search-submit{background:var(--r-orange)!important;color:#fff!important;border:0!important;border-radius:12px!important;box-shadow:0 2px 6px rgba(224,122,95,.3)!important}
.chrome-cta .chrome-symbol path{fill:#fff;stroke:var(--r-orange)}
.discovery-search{border:1.5px solid #e4ded6;border-radius:12px;background:#fff;box-shadow:0 2px 10px rgba(30,41,59,.07),0 1px 2px rgba(30,41,59,.05)}
.show-browser,.show-detail{background:#fff;border:0;box-shadow:0 2px 10px rgba(30,41,59,.07),0 1px 2px rgba(30,41,59,.05)}
:is(.page-home,.catalog-page) nav.main a.on{background:var(--r-butter);color:var(--r-ink);border:0}
.band-indicator{background:var(--r-ink)}
.show-option.selected{border-color:var(--r-orange);background:#fdf3ef}
.episode-link{border-color:var(--r-ink);color:var(--r-ink)}
.catalog-page main>section>.wrap,.catalog-page #shows>.wrap{background:#fff;border:0;box-shadow:0 2px 10px rgba(30,41,59,.07),0 1px 2px rgba(30,41,59,.05)}
.catalog-page .moment-playlists{background:var(--r-butter);border:0}
.familiar-card,.catalog-page .tile{background:#fff!important;border:1px solid #eee9e3!important;box-shadow:0 2px 10px rgba(30,41,59,.07),0 1px 2px rgba(30,41,59,.05)!important}
.familiar-card:nth-child(n){background:#fff!important}
.show-option .show-row-art,.detail-thumb,.show-art-placeholder,.catalog-page .tile .show-art,.catalog-page .show-artwork{background:#f6f2ec}
.popular-searches button,.band-selector button,.catalog-page .chip{background:var(--r-sky);color:var(--r-ink)}
.catalog-page .chip.on{background:var(--r-ink);color:#fff}
.discovery-intro p{color:var(--r-ink)!important}
.show-art-placeholder,.catalog-page .tile .name,.moment-copy b,.familiar-card b,.demo-dialog h2,.catalog-page .band-heading h3,.ext-mock h2{font-family:"EB Garamond","Cormorant Garamond",Georgia,serif!important;font-weight:400!important;letter-spacing:-.01em!important}
.moment-copy b,.familiar-card b,.catalog-page .tile .name{font-size:1.25em}
/* Match the concept page: amber wash behind search, terracotta wash on secondary blocks, no eyebrow labels */
.discovery{background:var(--r-butter)}
.approved-hero,.catalog-page .moment-playlists{background:var(--r-pink)}
:is(.page-home,.catalog-page) .eyebrow{display:none!important}
/* Compact extension mockup */
.catalog-page .ext>.wrap>.ext-mock .vz{max-width:980px;width:100%;margin-inline:auto;gap:20px;align-items:start}
.vz-top{padding:9px 12px}.vz-logo{font-size:17px}.vz-box{font-size:13px;padding:4px 12px}
.vz-row{grid-template-columns:38% minmax(0,1fr);gap:12px;padding:9px 12px}
#extension .vz .vz-meta p{font-size:11px}#extension .vz .vz-meta .vz-title{font-size:13px}
#extension .vz-player{aspect-ratio:16/10}
.vz-label{transform:scale(.85);transform-origin:bottom right;right:10px;bottom:10px}
#extension .ext-details{font-size:14px}
.ext-install{padding:8px 12px 8px 16px;font-size:14px}
.catalog-page .ext>.wrap>div:nth-of-type(1){max-width:980px;width:100%;margin-inline:auto}
.vz-search,.vz-player{border:0!important;box-shadow:0 2px 10px rgba(30,41,59,.07),0 1px 2px rgba(30,41,59,.05)!important}
.vz-pill{border:0!important;box-shadow:none!important}.vz-band{background:#e07a5f!important;border:0!important}
/* Frozen header: stays at the top while scrolling, shadow only after scrolling starts */
:is(.page-home,.catalog-page) header{position:sticky!important;top:env(safe-area-inset-top,0px);z-index:50!important;background:var(--mello-page-background)!important;transition:box-shadow .2s}
:is(.page-home,.catalog-page) header .top{height:68px!important;padding-top:8px!important;padding-bottom:8px!important}
:is(.page-home,.catalog-page) header .approved-logo>span{font-size:38px}
body.scrolled header{box-shadow:0 2px 12px rgba(30,41,59,.08)}
#browse{scroll-margin-top:66px!important}
.home-index{margin-top:0}
@media(prefers-reduced-motion:reduce){:is(.page-home,.catalog-page) header{transition:none}}
