body>header .cover-art-title{margin:0;line-height:0;letter-spacing:0;flex:none;display:flex;width:clamp(220px,25vw,340px);pointer-events:none}
body>header .cover-title-glyph{display:block;width:25%;flex:0 0 25%;opacity:0;will-change:transform,opacity,filter}
body>header .cover-title-glyph img{display:block;width:100%;height:auto;filter:saturate(.45);pointer-events:none}
body>header .cover-art-title.title-arriving .cover-title-glyph{opacity:1;animation:title-drift 4.1s cubic-bezier(.25,.1,.25,1) calc((3 - var(--glyph-index))*.3s) both}
@keyframes title-drift{0%,24%{opacity:1;transform:translateY(0);filter:blur(0)}68%{opacity:.55}100%{opacity:0;transform:translateY(-38px);filter:blur(5px)}}
@media(max-width:600px){body>header .cover-art-title{width:min(58vw,270px)}}
@media(prefers-reduced-motion:reduce){@keyframes title-drift{0%,24%{opacity:1}100%{opacity:0}}}

/* Keep the original glyph shapes, closing only the space between them. */
body>header .cover-title-glyph{position:relative}
body>header .cover-title-glyph+.cover-title-glyph{margin-left:-3%}
body>header .cover-title-wheel{position:absolute;left:65%;top:8%;width:16%;height:auto;overflow:visible;filter:drop-shadow(0 0 1px #91b9ee) drop-shadow(0 0 3px #b7dfff66);transform-origin:center;animation:cover-wheel-turn 8s linear infinite;pointer-events:none}
@keyframes cover-wheel-turn{to{transform:rotate(360deg)}}
@media(prefers-reduced-motion:reduce){body>header .cover-title-wheel{animation:none}}