/* CherryAmbient. Префикс .ca- */
/* скелетоны: геометрию дают сами .v3-card/.v3-hero, здесь только заливка и блик */
.ca-sk{position:relative;overflow:hidden;cursor:default;pointer-events:none;background:var(--panel,#15101a)}
.ca-sk.ca-sk.v3-hero{background:#130e18}
.ca-sk .v3-card-img.v3-card-img{background:#1c1521}
.ca-sk .v3-card-desc.v3-card-desc{display:block}
.ca-b{display:inline-block;vertical-align:middle;height:9px;border-radius:5px;background:rgba(255,255,255,.07)}
.ca-sk .v3-card-name .ca-b{height:13px;background:rgba(255,255,255,.1)}
.ca-sk .v3-card-desc .ca-b{display:block;height:8px;margin:4px 0 7px}
.ca-sk .v3-card-src .ca-b{height:7px;background:rgba(240,207,154,.1)}
.ca-sk .v3-hero-body .ca-b{display:block}
.ca-sk .v3-hero-body .ca-b:first-child{background:rgba(255,255,255,.12)}
.ca-sk::before{content:"";position:absolute;inset:0;z-index:3;pointer-events:none;
  background:linear-gradient(105deg,transparent 28%,rgba(255,154,176,.06) 42%,rgba(240,207,154,.11) 50%,rgba(255,154,176,.06) 58%,transparent 72%);
  transform:translateX(-110%);animation:ca-sh 1.6s cubic-bezier(.45,.1,.35,1) var(--ca-d,0s) infinite}
@keyframes ca-sh{70%,100%{transform:translateX(110%)}}
.ca-ghost{position:absolute;left:0;top:0;width:0;height:0;z-index:5;pointer-events:none;transition:opacity .42s ease}
.ca-rv{animation:ca-in .42s ease both}
@keyframes ca-in{from{opacity:0}}

/* параллакс портрета */
.ca-px-on{overflow:hidden}
.ca-px{position:absolute;inset:0;z-index:0;pointer-events:none;transform-origin:50% 0;will-change:transform}
.ca-px-sh{position:absolute;inset:0;background:#0a070c;opacity:0}

/* дыхание фона чата: scale/translate складываются с transform из cherry-v3 (scale 1.04, на ПК translateX(-50%)) */
@supports (scale:1){
  .ca-br{animation:ca-kb 28s ease-in-out infinite}
  .ca-br-v{animation:ca-vl 9s ease-in-out infinite}
}
@keyframes ca-kb{0%,100%{scale:1;translate:0 0}25%{scale:1.03;translate:2% -1.2%}50%{scale:1.058;translate:.4% -2.6%}75%{scale:1.03;translate:-2% -1.2%}}
@keyframes ca-vl{0%,100%{opacity:1}35%{opacity:.93}55%{opacity:.975}80%{opacity:.945}}

/* пустые состояния */
.v3-scenes-empty.ca-empty{grid-column:1/-1;padding-top:36px}
.ca-mw{position:relative;width:108px;height:119px;margin-bottom:6px;flex:0 0 auto}
.ca-mw::before{content:"";position:absolute;left:-22px;right:-22px;top:-8px;bottom:-14px;border-radius:50%;
  background:radial-gradient(closest-side,rgba(232,69,95,.2),rgba(232,69,95,.07) 60%,transparent)}
.ca-mw::after{content:"";position:absolute;left:24px;right:24px;bottom:-5px;height:10px;border-radius:50%;background:rgba(0,0,0,.45);animation:ca-shd 3.8s ease-in-out infinite}
.ca-pop,.ca-bob{position:relative;z-index:1;width:100%;height:100%;transform-origin:50% 100%}
.ca-pop{animation:ca-pop .5s cubic-bezier(.34,1.6,.5,1) both}
.ca-bob{animation:ca-bob 3.8s ease-in-out infinite}
.ca-shocked .ca-pop{animation:ca-pop .45s cubic-bezier(.34,1.6,.5,1) both,ca-jolt .5s ease-out .5s}
.ca-grin .ca-bob{animation-name:ca-sway}
.ca-wave .ct-arm{transform-box:view-box;transform-origin:99px 95px;animation:ca-wave 2.8s ease-in-out .6s infinite}
@keyframes ca-pop{from{transform:scale(.4) translateY(20px);opacity:0}}
@keyframes ca-bob{0%,100%{transform:translateY(3px)}50%{transform:translateY(-5px)}}
@keyframes ca-shd{0%,100%{transform:scaleX(1);opacity:.9}50%{transform:scaleX(.82);opacity:.55}}
@keyframes ca-sway{0%,100%{transform:rotate(-5deg) translateY(2px)}50%{transform:rotate(-2deg) translateY(-4px)}}
@keyframes ca-jolt{20%{transform:translateY(-10px) scale(.96,1.06)}45%{transform:scale(1.05,.95)}70%{transform:translateY(-2px)}}
@keyframes ca-wave{0%,55%,100%{transform:rotate(20deg)}66%{transform:rotate(-6deg)}77%{transform:rotate(22deg)}88%{transform:rotate(0)}}
.ca-empty .v3-create.ca-cta{flex:0 0 auto;height:48px;padding:0 26px;margin-top:8px;border-radius:14px;background:#e8455f;border-color:transparent;color:#fff;box-shadow:0 10px 24px -10px rgba(232,69,95,.7)}
.ca-empty .ca-cta em{color:#fff!important}
.ca-empty .v3-scenes-empty-text{max-width:290px}
.ca-peek{position:absolute;right:24px;top:-60px;width:66px;height:73px;margin:0;pointer-events:none}
.ca-peek::after{display:none}
.ca-peek .ca-pop{animation-delay:.28s}

@media (prefers-reduced-motion:reduce){
  .ca-sk::before,.ca-rv,.ca-br,.ca-br-v,.ca-mw *,.ca-mw::after{animation:none!important}
  .ca-ghost{transition:none}
  .ca-sk::before{display:none}
}
