/* ========================================================================
   ЛАБА — illustrated author rank frames
   12 transparent WebP overlays. Loaded AFTER style.css so old CSS-only rings
   are completely replaced without touching ranking/level logic.
   ======================================================================== */

.author-avatar,
.rank-avatar,
.member-avatar-edit{
  --laba-rank-frame:none;
  position:relative!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
  isolation:isolate!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
}

/* The frame is the layout box; the actual avatar sits inside its transparent hole. */
.author-avatar{
  width:120px!important;
  height:120px!important;
  flex:0 0 120px!important;
}
.author-avatar>img,
.author-avatar>.avatar-placeholder{
  width:62px!important;
  height:62px!important;
  position:relative!important;
  z-index:2!important;
  display:block!important;
  object-fit:cover!important;
  border-radius:50%!important;
  background:#0b0d0d!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.055),0 7px 24px rgba(0,0,0,.42)!important;
}

.rank-avatar{
  width:104px!important;
  height:104px!important;
}
.rank-avatar>img{
  width:54px!important;
  height:54px!important;
  position:relative!important;
  z-index:2!important;
  display:block!important;
  object-fit:cover!important;
  border-radius:50%!important;
  background:#0b0d0d!important;
  box-shadow:0 0 0 1px rgba(255,255,255,.055),0 6px 20px rgba(0,0,0,.38)!important;
}

/* Kill all previous procedural CSS rims and draw one real art overlay instead. */
.author-avatar::before,
.rank-avatar::before,
.member-avatar-edit::before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  z-index:4!important;
  pointer-events:none!important;
  border:0!important;
  border-radius:0!important;
  background-color:transparent!important;
  background-image:var(--laba-rank-frame)!important;
  background-repeat:no-repeat!important;
  background-position:center!important;
  background-size:contain!important;
  box-shadow:none!important;
  -webkit-mask:none!important;
  mask:none!important;
  filter:none!important;
}
.author-avatar::after,
.rank-avatar::after,
.member-avatar-edit::after{
  content:none!important;
  display:none!important;
  background:none!important;
  border:0!important;
  box-shadow:none!important;
  -webkit-mask:none!important;
  mask:none!important;
}

:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-1{--laba-rank-frame:url('/assets/rank-frames/01_novichok.webp?v=463')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-2{--laba-rank-frame:url('/assets/rank-frames/02_uchenik.webp?v=463')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-3{--laba-rank-frame:url('/assets/rank-frames/03_podmastere.webp?v=463')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-4{--laba-rank-frame:url('/assets/rank-frames/04_remeslennik.webp?v=463')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-5{--laba-rank-frame:url('/assets/rank-frames/05_master.webp?v=463')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-6{--laba-rank-frame:url('/assets/rank-frames/06_artizan.webp?v=463')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-7{--laba-rank-frame:url('/assets/rank-frames/07_maestro.webp?v=463')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-8{--laba-rank-frame:url('/assets/rank-frames/08_grandmaster.webp?v=463')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-9{--laba-rank-frame:url('/assets/rank-frames/09_virtuoso.webp')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-10{--laba-rank-frame:url('/assets/rank-frames/10_keeper.webp')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-11{--laba-rank-frame:url('/assets/rank-frames/11_creator_v2.webp')}
:is(.author-avatar,.rank-avatar,.member-avatar-edit).level-12{--laba-rank-frame:url('/assets/rank-frames/09_legenda_laby.webp?v=463')}

/* Own-profile previews use the same art and avatar window as public surfaces. */
.member-profile .member-avatar-edit{width:96px;height:96px;flex:0 0 96px}
.member-profile .member-avatar-edit>img{width:50px;height:50px;border:0;position:relative;z-index:2}
.member-profile .member-preview-rank .member-avatar-edit{width:80px;height:80px;flex-basis:80px}
.member-profile .member-preview-rank .member-avatar-edit>img{width:42px;height:42px}

/* Give the real art enough layout room so wings/crests never cover author text. */
.author-card-head{gap:10px!important;min-height:120px}
.author-rank-card{
  grid-template-columns:52px 104px minmax(0,1fr)!important;
  min-height:132px!important;
  gap:15px!important;
}

/* The last three frames already contain their own painted glow. Keep only a very soft halo. */
.author-avatar.level-7,.rank-avatar.level-7{filter:drop-shadow(0 0 5px rgba(209,168,95,.12))}
.author-avatar.level-8,.rank-avatar.level-8{filter:drop-shadow(0 0 7px rgba(141,183,213,.14))}
.author-avatar.level-9,.rank-avatar.level-9{filter:drop-shadow(0 0 7px rgba(179,139,220,.15))}
.author-avatar.level-10,.rank-avatar.level-10{filter:drop-shadow(0 0 7px rgba(119,197,158,.15))}
.author-avatar.level-11,.rank-avatar.level-11{filter:drop-shadow(0 0 8px rgba(225,151,91,.16))}
.author-avatar.level-12,.rank-avatar.level-12{filter:drop-shadow(0 0 9px rgba(225,181,91,.18))}

@media(max-width:760px){
  .author-avatar{width:108px!important;height:108px!important;flex-basis:108px!important}
  .author-avatar>img,.author-avatar>.avatar-placeholder{width:56px!important;height:56px!important}
  .rank-avatar{width:90px!important;height:90px!important}
  .rank-avatar>img{width:47px!important;height:47px!important}
  .author-rank-card{grid-template-columns:40px 90px minmax(0,1fr)!important;min-height:118px!important;gap:10px!important;padding-left:8px!important;padding-right:12px!important}
  .author-card-head{min-height:108px;gap:6px!important}
}

@media(max-width:430px){
  .rank-avatar{width:82px!important;height:82px!important}
  .rank-avatar>img{width:43px!important;height:43px!important}
  .author-rank-card{grid-template-columns:34px 82px minmax(0,1fr)!important;gap:8px!important}
}