/* SUBZ — фото вместо буквы: шапка, меню профиля, кабинет, настройки. */
.hdr__avatar:has(>img),.profile-menu__mini-avatar:has(>img),.cb-ava--img,.st-nick__ava--img{overflow:hidden;padding:0;background:#111;color:transparent}
.hdr__avatar>img,.profile-menu__mini-avatar>img,.cb-ava--img>img,.st-nick__ava>img{display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit}
a.st-nick__ava{position:relative;text-decoration:none;color:inherit}
.st-nick__ava>i{position:absolute;right:3px;bottom:3px;display:grid;place-items:center;width:22px;height:22px;border-radius:7px;background:#fff;color:#000;box-shadow:0 3px 10px rgb(0 0 0 / .45);opacity:.92;transition:opacity .2s}
.st-nick__ava:hover>i{opacity:1}
.st-nick__ava>i .ico{width:12px;height:12px}

/* v3 (селекторы рамок сильнее общего правила кольца); v2: рамка аватара из профиля — и в шапке. Кольцо снаружи круга, поэтому у аватара в шапке без overflow:hidden (фото скругляется само). */
.hdr__avatar:has(>img){overflow:visible}
@property --hdr-a{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes hdrSpin{to{--hdr-a:360deg}}
@keyframes hdrPulse{0%,100%{box-shadow:0 0 8px -2px var(--ac,#fff)}50%{box-shadow:0 0 16px 1px var(--ac,#fff)}}
@keyframes hdrFire{from{box-shadow:0 0 10px -2px #ff5a00}to{box-shadow:0 -3px 18px 1px #ff8a00}}
.hdr__avatar[class*="hdr__avatar--f-"]{position:relative}
.hdr__avatar[class*="hdr__avatar--f-"]::before{content:"";position:absolute;inset:-4px;z-index:1;padding:2px;border-radius:50%;pointer-events:none;background:var(--ac,#fff);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
.hdr__avatar.hdr__avatar--f-none::before{display:none}
.hdr__avatar--f-glow{animation:hdrPulse 2.4s ease-in-out infinite}
.hdr__avatar.hdr__avatar--f-holo::before{background:conic-gradient(from var(--hdr-a),#ff4fd8,#4fc3ff,#7bff9b,#ffe14f,#ff4fd8);animation:hdrSpin 4s linear infinite}
.hdr__avatar--f-holo{box-shadow:0 0 16px -4px #9f7bff}
.hdr__avatar.hdr__avatar--f-fire::before{background:conic-gradient(from var(--hdr-a),#ff2d00,#ffb300,#ff5a00,#ffe600,#ff2d00);animation:hdrSpin 1.6s linear infinite}
.hdr__avatar--f-fire{animation:hdrFire 1.2s ease-in-out infinite alternate}
.hdr__avatar.hdr__avatar--f-legend::before{padding:2.5px;background:conic-gradient(from var(--hdr-a),#fff7d6,#ffc53d,#9a6a00,#ffe9a3,#fff7d6);animation:hdrSpin 3s linear infinite}
.hdr__avatar--f-legend{box-shadow:0 0 18px -3px rgb(255 197 61 / .7)}
@media (prefers-reduced-motion:reduce){.hdr__avatar[class*="hdr__avatar--f-"],.hdr__avatar[class*="hdr__avatar--f-"]::before{animation:none}}