/* Shared RareErth refinement layer */
:root{--site-max:1320px;--site-gutter:clamp(1.5rem,5vw,4rem);--readable-floor:.875rem}
.cc,.content-container{max-width:var(--site-max)!important;padding-left:var(--site-gutter)!important;padding-right:var(--site-gutter)!important;margin-left:auto!important;margin-right:auto!important;width:100%!important}
.nav-links a{opacity:.68!important}.nav-links a:hover,.nav-links a.active{opacity:1!important}
.sl,.section-label{font-size:.75rem!important}.footer-bottom,.platform-link,.plat-link,.album-meta,.latest-episode-meta{font-size:.875rem!important}
.theme-toggle,.hamburger{min-width:44px!important;min-height:44px!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}.hamburger span{left:8px!important;width:28px!important}.mobile-controls{gap:.25rem!important}
.reveal{opacity:0;transform:translate3d(0,32px,0);transition:opacity .85s cubic-bezier(.22,1,.36,1),transform .85s cubic-bezier(.22,1,.36,1);will-change:opacity,transform}.reveal.visible{opacity:1;transform:none}.reveal[data-stagger="1"]{transition-delay:.08s}.reveal[data-stagger="2"]{transition-delay:.16s}.reveal[data-stagger="3"]{transition-delay:.24s}
.premium-image{overflow:hidden}.premium-image img{transition:transform 1.2s cubic-bezier(.22,1,.36,1);will-change:transform}.premium-image.in-view img{transform:scale(1.025)}
.latest-issue{padding:clamp(1.25rem,3vw,2rem)!important;border:1px solid var(--color-faint)!important;border-radius:16px!important;background:color-mix(in srgb,var(--color-cream) 94%,var(--color-terracotta) 6%)!important}
.catalog-toggle{margin-top:1.5rem;border:1px solid currentColor;border-radius:999px;background:transparent;color:inherit;padding:.75rem 1.15rem;min-height:44px;font:500 .875rem var(--font-sans);letter-spacing:.04em}
@media(max-width:768px){.site-nav{padding-left:1.25rem!important;padding-right:1.25rem!important}.music-hero,.podcast-hero{min-height:62vh!important}.mobile-collapsible>.premium-extra{display:none}.mobile-collapsible.expanded>.premium-extra{display:block}.about-grid{gap:2.5rem!important}.footer-links{justify-content:center}.hero{min-height:92svh!important}}
@media(min-width:769px) and (max-height:850px){.hero{min-height:90vh!important}.podcast-hero,.music-hero{min-height:64vh!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}.reveal{opacity:1!important;transform:none!important;transition:none!important}.premium-image img,.hero-bg,.podcast-hero-bg,.music-hero-bg{transform:none!important;transition:none!important}}
@media(max-width:768px){.mobile-collapsible .premium-extra{display:none!important}.mobile-collapsible.expanded .premium-extra{display:revert!important}}
:focus-visible{outline:2px solid var(--color-terracotta)!important;outline-offset:4px!important}
input,textarea,button{font-size:max(1rem,16px)}
.back-to-top{min-width:44px!important;min-height:44px!important}
@media(min-width:769px) and (max-width:1200px){.hover-strip{overflow-x:auto!important;overscroll-behavior-inline:contain;scroll-snap-type:x proximity}.hover-strip .hover-item{min-width:160px!important;scroll-snap-align:start}.hover-strip .hover-info{padding:1rem!important}.hover-strip .hover-ttl{font-size:1rem!important}}
.back-to-top{width:48px!important;height:48px!important}
@media(min-width:769px) and (max-width:1200px){#singleGrid{width:100%!important;max-width:100%!important;display:flex!important;overflow-x:auto!important;overflow-y:hidden!important}#singleGrid .hover-item{flex:0 0 180px!important;min-width:180px!important;width:180px!important}}
.hero{min-height:82svh!important}.latest-episode{scroll-margin-top:7rem}.worlds-section{scroll-margin-top:7rem}
@media(max-width:768px){.hero{min-height:84svh!important}}
@media(max-width:768px){.theme-toggle.desktop-toggle{display:none!important}}
@media(max-width:768px){nav.site-nav>button.desktop-toggle{display:none!important;visibility:hidden!important;pointer-events:none!important}}
/* Keep the shared reading gutter viewport-relative even when a live-source section has its own inset. */
@media(max-width:768px){.cc,.content-container{width:100vw!important;max-width:100vw!important;margin-left:calc(50% - 50vw)!important;margin-right:calc(50% - 50vw)!important;padding-left:1.5rem!important;padding-right:1.5rem!important}}

/* Approved follow-up preview: keep first-page headings clear of the fixed banner. */
.hero-safe-home .hero-content{padding-top:clamp(8.75rem,12vw,10.5rem)!important}
.hero-safe-podcast .content-container{padding-top:clamp(9.5rem,13vw,11rem)!important}
.hero-safe-photography .cc{padding-top:clamp(9.5rem,13vw,11rem)!important}
.library-grid{align-items:start!important}
.library-column{display:flex!important;flex-direction:column!important;align-self:start!important}
@media(min-width:769px){.mobile-collapsible>.catalog-toggle{display:none!important}}
.social-icon{width:48px!important;height:48px!important;padding:0!important;border-radius:50%!important;display:inline-flex!important;align-items:center!important;justify-content:center!important}
.social-icon img{width:21px!important;height:21px!important;display:block!important;filter:none!important}
[data-theme="dark"] .social-icon img{filter:invert(1)!important}
@media(max-width:768px){
 .hero-safe-home .hero-content{padding-top:9rem!important}
 .hero-safe-podcast .content-container{padding-top:9.5rem!important}
 .hero-safe-photography .cc{padding-top:9.5rem!important}
 .library-grid{grid-template-columns:1fr!important;gap:3rem!important}
}

/* Cache-busted phone follow-up: keep every first-page heading visibly below the fixed nav. */
@media(max-width:768px){
  .music-hero>.cc{padding-top:10.5rem!important}
  main.page-enter>section:first-child>.cc:not(.hero-content):not(.content-container){padding-top:10.5rem!important}
  .hero-safe-photography>.cc{padding-top:10.5rem!important}
}
/* The library columns share a bottom baseline on wide screens, as requested. */
@media(min-width:769px){
  .library-grid{align-items:end!important}
  .library-column{align-self:end!important}
}
/* Platform marks stay unmistakable on small, high-density phone screens. */
.social-icon{background:color-mix(in srgb,var(--color-cream) 82%,white 18%)!important;border:1px solid color-mix(in srgb,var(--color-faint) 72%,var(--color-charcoal) 28%)!important}
.social-icon img{width:26px!important;height:26px!important;object-fit:contain!important}

/* Editorial library and platform pass - preview */
.library-grid{align-items:stretch!important}
.library-column{display:grid!important;grid-template-rows:auto 1fr auto;align-self:stretch!important;min-width:0}
.library-list{display:flex;flex-direction:column}
.library-action{min-height:4.75rem;display:flex;align-items:flex-end}
.library-action:empty{display:none}
.catalog-toggle{appearance:none;margin-top:1.5rem!important;border:0!important;border-bottom:1px solid color-mix(in srgb,var(--color-terracotta) 65%,transparent)!important;border-radius:0!important;padding:.55rem 0 .4rem!important;min-height:0!important;color:var(--color-terracotta)!important;text-transform:uppercase;font-size:.69rem!important;letter-spacing:.15em!important;cursor:pointer}
.catalog-toggle:hover{border-bottom-color:var(--color-terracotta)!important}
.mobile-collapsible .premium-extra{display:none!important}
.mobile-collapsible.expanded .premium-extra{display:block!important}
.social-icon{width:42px!important;height:42px!important;border:0!important;border-radius:2px!important;background:transparent!important;position:relative;transition:transform .25s ease,background-color .25s ease!important}
.social-icon:after{content:"";position:absolute;inset:auto 9px 4px;height:1px;background:var(--color-terracotta);opacity:.32;transform:scaleX(.45);transition:transform .25s ease,opacity .25s ease}
.social-icon:hover{background:color-mix(in srgb,var(--color-terracotta) 7%,transparent)!important;transform:translateY(-2px)}
.social-icon:hover:after{transform:scaleX(1);opacity:.85}
.social-icon img{width:20px!important;height:20px!important;filter:grayscale(1) brightness(.38) sepia(.12)!important;opacity:.86;transition:opacity .25s ease!important}
.social-icon:hover img{opacity:1}
html.dark .social-icon img{filter:grayscale(1) brightness(0) invert(1)!important;opacity:.76}
@media(max-width:768px){.library-grid{align-items:start!important}.library-column{display:block!important}.library-action{min-height:0}.social-icon{width:40px!important;height:40px!important}}
/* User steering: only Books collapses; other full lists still share the common frame. */
@media(min-width:769px){
 .library-column{height:100%}
 .library-list{height:100%;justify-content:space-between}
 .library-column:has(.library-action:not(:empty)) .library-list{height:auto;justify-content:flex-start}
}
/* Return the phone menu mark to its earlier compact proportion, while keeping the tap target accessible. */
@media(max-width:768px){
 .hamburger{width:40px!important;min-width:40px!important;height:40px!important;min-height:40px!important}
 .hamburger span{left:9px!important;width:22px!important;height:1px!important}
 .hamburger span:nth-child(1){top:12px!important}
 .hamburger span:nth-child(2){top:19px!important}
 .hamburger span:nth-child(3){top:26px!important}
}

/* Natural library rhythm: every item keeps the same compact spacing; shorter lists stay short. */
.library-grid{align-items:start!important}
.library-column{display:block!important;align-self:start!important;height:auto!important}
.library-list{display:flex!important;flex-direction:column!important;height:auto!important;justify-content:flex-start!important;gap:0!important}
.library-action{min-height:0!important;display:block!important}

/* Keep the footer visibly present across every route in both color modes. */
.site-footer{display:block!important;visibility:visible!important;opacity:1!important;border-top:1px solid var(--color-faint)!important}
.site-footer .footer-bottom{color:var(--color-warm-grey)!important}
.site-footer .footer-links a{color:var(--color-warm-grey)!important;opacity:.72}
.site-footer .footer-links a:hover{color:var(--color-terracotta)!important;opacity:1}
