header{position:fixed;top:30px;left:4vw;right:4vw;z-index:5;display:flex;align-items:baseline;justify-content:space-between;gap:24px;background:none;padding:0;transition:opacity 250ms ease}
header a{opacity:1;color:#555;text-decoration:none;font-family:Helvetica,Arial,sans-serif;font-size:16px}
header .artist-name{font-size:18px;font-weight:400;letter-spacing:normal;color:#363636}
header nav{display:flex;align-items:center;gap:32px}
header nav a{position:relative;display:block;padding:8px 0}
header nav a::after{content:attr(data-label);position:absolute;right:0;top:100%;white-space:nowrap;font-size:13px;opacity:0;transition:opacity 180ms ease;pointer-events:none}
header nav a:hover::after,header nav a:focus-visible::after{opacity:1}
body.focused header,body:has(#single:not([hidden])) header{opacity:0;pointer-events:none;visibility:hidden}
@media(max-width:700px){header{left:24px;right:24px;top:22px}header .artist-name{font-size:18px}}

header nav a::after{content:none;display:none}

/* Crop the source's white padding in layout without modifying the artwork. */
header .artist-name{display:inline-block;line-height:1;mix-blend-mode:multiply}
header .wordmark{display:inline-block;position:relative;width:118px;height:19.98px;overflow:hidden;vertical-align:baseline}
header .wordmark img{position:absolute;width:134.73px;max-width:none;height:auto;left:-8.30px;top:-8.21px;-webkit-user-drag:none;user-select:none}