/* Athar 80: animated multilayer frames, pausing offscreen via v78 observer. */
.frame74[data-edge="spiderweb80"]{--frame-art:url("frames80/spiderweb80.svg")}
.frame74[data-edge="serpent80"]{--frame-art:url("frames80/serpent80.svg")}
.frame74[data-edge="specter80"]{--frame-art:url("frames80/specter80.svg")}
.frame74[data-edge="lion80"]{--frame-art:url("frames80/lion80.svg")}
.frame74[data-edge="wolf80"]{--frame-art:url("frames80/wolf80.svg")}
.frame74[data-edge="falcon80"]{--frame-art:url("frames80/falcon80.svg")}
.frame74[data-edge="horse80"]{--frame-art:url("frames80/horse80.svg")}
.frame74[data-edge="fox80"]{--frame-art:url("frames80/fox80.svg")}
.frame74[data-edge="tiger80"]{--frame-art:url("frames80/tiger80.svg")}
.frame74[data-edge="desert80"]{--frame-art:url("frames80/desert80.svg")}
.frame74[data-edge="oasis80"]{--frame-art:url("frames80/oasis80.svg")}
.frame74[data-edge="spring80"]{--frame-art:url("frames80/spring80.svg")}
.frame74[data-edge="alpine80"]{--frame-art:url("frames80/alpine80.svg")}
.frame74[data-edge="forest80"]{--frame-art:url("frames80/forest80.svg")}
.frame74[data-edge="villa80"]{--frame-art:url("frames80/villa80.svg")}
.frame74[data-edge="metropolis80"]{--frame-art:url("frames80/metropolis80.svg")}
.frame74[data-edge="reef80"]{--frame-art:url("frames80/reef80.svg")}
.frame74[data-edge="aurora80"]{--frame-art:url("frames80/aurora80.svg")}

.frame74.animated78:has(.frame80-paint){background:none}
.frame74 .frame80-paint{position:absolute;inset:0;pointer-events:none;background:var(--frame-art) center /100% 100% no-repeat;filter:drop-shadow(0 4px 6px #0004);animation:frame80-live 9s ease-in-out infinite alternate;transform-origin:center}
.frame74 .frame80-gleam{position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent 10%,#fffe 49%,transparent 53%);opacity:0;mix-blend-mode:soft-light;animation:frame80-gleam 13s linear infinite}
.frame74 .frame80-particle{position:absolute;width:4%;height:4%;border-radius:50%;background:radial-gradient(circle,#fff 0%,#cde8e9b8 30%,transparent 75%);pointer-events:none;animation:frame80-ambient 5s ease-in-out infinite alternate;animation-delay:var(--delay,0s)}
@keyframes frame80-live{from{filter:drop-shadow(0 3px 5px #0003) saturate(.92)}to{filter:drop-shadow(0 5px 9px #0006) saturate(1.1)}}
@keyframes frame80-gleam{0%,45%{opacity:0;transform:translateX(-60%)}50%{opacity:.17}80%,100%{opacity:0;transform:translateX(45%)}}
@keyframes frame80-ambient{to{opacity:.2;transform:translate(12px,-15px) scale(1.8)}}
.frame74:not(.moving78) :is(.frame80-paint,.frame80-gleam,.frame80-particle){animation-play-state:paused}
.avatar-button{position:relative;isolation:isolate;overflow:visible!important}
.avatar-frame80{position:absolute;inset:-19%;pointer-events:none;z-index:4;background-repeat:no-repeat;background-size:100% 100%;background-position:center;filter:drop-shadow(0 2px 7px #0007);transform-origin:center;animation:avatar-frame80 5s ease-in-out infinite alternate}
.avatar-frame80::after{content:"";position:absolute;inset:8%;border-radius:50%;border:2px solid #fff5;box-shadow:0 0 16px #ffffff65,inset 0 0 8px #ffffff35;animation:avatar-pulse80 4s ease-in-out infinite alternate}
.avatar-frame80 .avatar-flicker80{position:absolute;inset:5%;border-radius:50%;background:conic-gradient(from 30deg,transparent 0 50%,#ffffff60 60%,transparent 71% 100%);mask:radial-gradient(transparent 59%,black 64%);animation:avatar-spin80 13s linear infinite;opacity:.65}
@keyframes avatar-frame80{to{filter:drop-shadow(0 4px 9px #0008) saturate(1.18)}}
@keyframes avatar-pulse80{to{opacity:.2;transform:scale(1.045)}}
@keyframes avatar-spin80{to{transform:rotate(360deg)}}
.avatar-frame-edit80,.avatar-sound-toggle80{display:inline-flex;align-items:center;gap:6px;font-size:.89rem;padding:8px 13px;border:1px solid color-mix(in srgb,var(--accent,#548f87),transparent 55%);border-radius:999px;cursor:pointer}
.frame-picker80{padding:20px;max-width:min(94vw,780px);max-height:86vh;overflow:auto;border:1px solid #aab6b5;border-radius:22px;color:var(--text,#213b38);background:var(--surface,#fff)}
.frame-picker80::backdrop{background:#081a20aa;backdrop-filter:blur(5px)}
.frame-picker80>header{display:flex;justify-content:space-between;align-items:center;margin-bottom:13px}
.frame-options80{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:10px;margin:12px 0 18px}
.frame-options80 button{display:grid;gap:4px;border:1px solid #9bacb466;background:transparent;color:inherit;padding:7px;border-radius:13px;cursor:pointer}
.frame-options80 button[aria-pressed="true"]{outline:3px solid var(--accent,#49a08a)}
.frame-options80 img{width:100%;aspect-ratio:1;object-fit:contain;background:#163335;border-radius:12px}
.frame-options80 small{font-size:.74rem}
.frame-picker80 footer{display:flex;justify-content:flex-end;gap:10px;align-items:center;flex-wrap:wrap}
.music-sources80,.music-catalog80{border:1px solid #a1b3b255;border-radius:16px;padding:13px;margin:12px 0;background:#78b2ad0e}
.music-sources-title80{display:flex;flex-direction:column;gap:3px;margin-bottom:8px}
.music-sources80 select,.music-catalog80 select,.music-catalog80 input{width:100%;margin:5px 0;padding:10px;border-radius:9px}
.music-sources80 button,.music-catalog80 button{margin:8px 0}
.remote-track80{display:flex;justify-content:space-between;align-items:center;gap:8px;border-top:1px solid #abbcbd55;padding:9px 0}
.remote-track80>div,.remote-track80>span{display:flex;flex-direction:column;min-width:0;overflow-wrap:anywhere}
.remote-track80 small{font-size:.77rem;opacity:.8;overflow-wrap:anywhere}
.remote-track80 button{flex:none}
.library-filter80{display:block;margin:12px 0;font-weight:600}.library-filter80 select{margin-inline-start:10px;padding:8px 12px;border-radius:9px}
@media (prefers-reduced-motion:reduce){.avatar-frame80,.avatar-frame80::after,.avatar-flicker80,.frame74 .frame80-paint,.frame74 .frame80-gleam,.frame74 .frame80-particle{animation:none!important}}
.avatar-frame80[data-edge="spiderweb80"]{background-image:url("frames80/spiderweb80-avatar.svg")}
.avatar-frame80[data-edge="serpent80"]{background-image:url("frames80/serpent80-avatar.svg")}
.avatar-frame80[data-edge="specter80"]{background-image:url("frames80/specter80-avatar.svg")}
.avatar-frame80[data-edge="lion80"]{background-image:url("frames80/lion80-avatar.svg")}
.avatar-frame80[data-edge="wolf80"]{background-image:url("frames80/wolf80-avatar.svg")}
.avatar-frame80[data-edge="falcon80"]{background-image:url("frames80/falcon80-avatar.svg")}
.avatar-frame80[data-edge="horse80"]{background-image:url("frames80/horse80-avatar.svg")}
.avatar-frame80[data-edge="fox80"]{background-image:url("frames80/fox80-avatar.svg")}
.avatar-frame80[data-edge="tiger80"]{background-image:url("frames80/tiger80-avatar.svg")}
.avatar-frame80[data-edge="desert80"]{background-image:url("frames80/desert80-avatar.svg")}
.avatar-frame80[data-edge="oasis80"]{background-image:url("frames80/oasis80-avatar.svg")}
.avatar-frame80[data-edge="spring80"]{background-image:url("frames80/spring80-avatar.svg")}
.avatar-frame80[data-edge="alpine80"]{background-image:url("frames80/alpine80-avatar.svg")}
.avatar-frame80[data-edge="forest80"]{background-image:url("frames80/forest80-avatar.svg")}
.avatar-frame80[data-edge="villa80"]{background-image:url("frames80/villa80-avatar.svg")}
.avatar-frame80[data-edge="metropolis80"]{background-image:url("frames80/metropolis80-avatar.svg")}
.avatar-frame80[data-edge="reef80"]{background-image:url("frames80/reef80-avatar.svg")}
.avatar-frame80[data-edge="aurora80"]{background-image:url("frames80/aurora80-avatar.svg")}

.avatar-button.sound-playing80 .avatar-frame80{animation:avatar-sound80 .4s ease-in-out infinite alternate;filter:drop-shadow(0 0 13px #8cd2d8a1)}
@keyframes avatar-sound80{from{transform:scale(.985)}to{transform:scale(1.027)}}
@media(prefers-reduced-motion:reduce){.avatar-button.sound-playing80 .avatar-frame80{animation:none!important}}