/* Round of 29/10: per-track covers, social links, Everseed symbol and the floating message button. */

/* Album art follows the selected track */
.album-art{justify-content:flex-start}
.album-art img{object-position:center 72%;filter:contrast(1.05) brightness(.82);transition:opacity .45s ease,transform .9s cubic-bezier(.2,.7,.2,1)}
.album-art-shade{background:linear-gradient(180deg,#07080acc 0%,#07080a55 34%,transparent 58%)!important}
.album-art h3{font-size:clamp(26px,3vw,36px);margin-top:4px}
.album-art>span{position:static!important;margin-bottom:10px}
.album-art.is-swapping img{animation:cover-in .7s cubic-bezier(.2,.7,.2,1)}
.album-art.is-swapping h3,.album-art.is-swapping small{animation:cover-text-in .6s .08s cubic-bezier(.2,.7,.2,1) both}
@keyframes cover-in{from{opacity:.15;transform:scale(1.08)}to{opacity:1;transform:scale(1)}}
@keyframes cover-text-in{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.track-thumb{width:44px;height:44px;flex:0 0 44px;border-radius:11px;object-fit:cover;object-position:center 70%;border:1px solid #ffffff14;opacity:.78;transition:opacity .3s,transform .3s}
.track.is-active .track-thumb,.track-select:hover .track-thumb{opacity:1;transform:scale(1.04)}
@media(max-width:560px){.track-thumb{width:38px;height:38px;flex-basis:38px}}

/* Social links */
.social-links{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.social-links a{width:46px;height:46px;display:grid;place-items:center;border-radius:50%;border:1px solid #d9c18e40;color:#e8dcc2;background:#ffffff06;transition:background .3s,color .3s,border-color .3s,transform .3s}
.social-links a:hover,.social-links a:focus-visible{background:linear-gradient(135deg,#dfc794,#b8995f);color:#14161a;border-color:transparent;transform:translateY(-2px)}
.social-links svg{width:19px;height:19px}
.family .social-links{margin-top:26px}
footer .social-links{margin:4px 0}
#main-nav .social-links{display:none}
@media(max-width:1080px){#main-nav.is-open .social-links{display:flex;margin-top:18px}}

/* Project Everseed: symbol only, never stretched */
.everseed-art{max-width:300px;aspect-ratio:1;margin:18px auto 0;mask-image:radial-gradient(circle at center,#000 48%,transparent 71%)}
.everseed-art img{width:100%;height:100%;object-fit:contain;opacity:1}
.everseed h2{margin-top:6px}
.motion-enabled .everseed-art img{animation:seed-glow 5.5s ease-in-out infinite}
@keyframes seed-glow{0%,100%{filter:brightness(.92) drop-shadow(0 0 0 #c9a76a00)}50%{filter:brightness(1.08) drop-shadow(0 0 22px #c9a76a55)}}

/* Floating message button: appears after the first screen */
.sms-float{gap:12px;padding:7px 20px 7px 7px;min-height:58px;background:#111316d9;color:#f3ead8;border:1px solid #d9c18e55;backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px) saturate(1.2);box-shadow:0 14px 40px #000a,inset 0 1px 0 #ffffff12;opacity:0;transform:translateY(18px) scale(.96);pointer-events:none;transition:opacity .45s ease,transform .45s cubic-bezier(.2,.7,.2,1),border-color .3s}
.sms-float.is-ready{opacity:1;transform:none;pointer-events:auto}
.sms-float:hover{transform:translateY(-3px);border-color:#e6cf9e}
.sms-float>svg{display:none}
.sms-avatar{position:relative;width:44px;height:44px;flex:0 0 44px}
.sms-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover;object-position:center 30%;border:1.5px solid #d9c18e}
.sms-avatar i{position:absolute;right:-3px;bottom:-3px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#dfc794,#b8995f);color:#15171a;box-shadow:0 0 0 2px #111316}
.sms-avatar i svg{width:11px;height:11px}
.sms-float span{font-size:14px;letter-spacing:.2px}
.sms-float small{color:#cdbf9f;font-size:10px;letter-spacing:.4px}
@media(max-width:700px){.sms-float{width:auto;height:auto;padding:5px;min-height:0;border-radius:50%}.sms-float>span:not(.sms-avatar){display:none}.sms-float>.sms-avatar{display:block;width:52px;height:52px;flex-basis:52px}}
@media(prefers-reduced-motion:reduce){.sms-float{transition:none}.album-art.is-swapping img,.album-art.is-swapping h3,.album-art.is-swapping small{animation:none}}
