:root{--bn-green:#28733d;--bn-green-deep:#18552b;--bn-green-light:#68a975}
.bn-brand-logo{display:block;width:154px;height:154px;object-fit:contain;margin:0 auto 18px;background:transparent}
.card h2{color:var(--bn-green-deep)}
.add-friend-btn{background:linear-gradient(145deg,var(--bn-green),var(--bn-green-deep));box-shadow:0 5px 16px #18552b24}
.bn-loading-track{width:min(280px,100%);height:132px;position:relative;overflow:hidden;margin:0 auto 12px;contain:layout paint}
.bn-loading-traveler{position:absolute;left:0;top:4px;width:calc(100% - 112px);height:112px;animation:bn-travel 8s linear infinite;animation-delay:var(--bn-motion-delay,0ms)}
.bn-loading-bear{display:block;width:112px;height:112px;background:url('/assets/bn-bear-walk-v1.webp') 0 0 / 400% 200% no-repeat;animation:bn-walk 1s steps(1,end) infinite,bn-turn 8s steps(1,end) infinite;animation-delay:var(--bn-step-delay,0ms),var(--bn-motion-delay,0ms);filter:drop-shadow(0 3px 2px #14452315)}
.bn-loading-status{text-align:center;color:#315c3b;font-size:14px;line-height:1.6}
@keyframes bn-travel{0%,100%{transform:translateX(100%)}50%{transform:translateX(0)}}
@keyframes bn-turn{0%{transform:scaleX(1)}50%{transform:scaleX(-1)}100%{transform:scaleX(1)}}
@keyframes bn-walk{0%{background-position:0 0}12.5%{background-position:33.333333% 0}25%{background-position:66.666667% 0}37.5%{background-position:100% 0}50%{background-position:0 100%}62.5%{background-position:33.333333% 100%}75%{background-position:66.666667% 100%}87.5%,100%{background-position:100% 100%}}
@media(prefers-reduced-motion:reduce){.bn-loading-traveler{animation:none;left:calc(50% - 56px)}.bn-loading-bear{animation:none}.add-friend-btn{transition:none}}
