:root{--network-safe-area-top: env(safe-area-inset-top, 0px);--network-banner-height: 56px}.network-status-region{position:fixed;z-index:2000;top:var(--network-safe-area-top);left:50%;width:var(--ludio-consumer-frame-width, 100%);transform:translate(-50%);overflow:hidden;pointer-events:none}.network-status{display:flex;align-items:center;justify-content:center;gap:6px;min-height:var(--network-banner-height);box-sizing:border-box;padding:6px max(12px,env(safe-area-inset-right,0px));background:var(--network-offline);color:var(--ludio-text, #f7f7f8);font-size:12px;font-weight:500;line-height:20px;text-align:center;overflow-wrap:anywhere;transform:translateY(-105%);opacity:0;visibility:hidden;transition:transform .3s cubic-bezier(.2,0,0,1),opacity .16s,background-color .16s,color .16s,visibility 0s .3s}.network-status[data-visible=true]{transform:translateY(0);opacity:1;visibility:visible;transition-delay:0s}.network-status[data-connection=recovered]{background:var(--network-success);color:var(--network-on-success)}.network-status svg{flex:0 0 16px;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}img[data-image-state=pending],img[data-image-state=failed]{background:var(--ludio-border, #36363d);color:transparent;font-size:0}img[data-image-recovered=true][data-image-state=ready]{animation:network-image-reveal .42s ease-out both}@keyframes network-image-reveal{0%{opacity:0;filter:blur(10px)}to{opacity:1;filter:blur(0)}}@media(prefers-reduced-motion:reduce){.network-status{transition:none}img[data-image-recovered=true][data-image-state=ready]{animation:none}}.comment-image-placeholder{display:block;width:100%;height:100%;min-height:48px;border-radius:inherit;background:var(--ludio-border, #36363d)}.creator-image:empty{background:var(--ludio-border, #36363d)}