.owlkun{display:block;width:100%;height:auto;overflow:visible}
.owlkun *{transform-box:fill-box}
.owlkun .ok-owl{transform-origin:50% 100%}.owlkun .ok-head{transform-origin:50% 95%}.owlkun .ok-cap{transform-origin:50% 100%}
.owlkun .ok-wingL{transform-origin:20% 0%}.owlkun .ok-wingR{transform-origin:80% 0%}.owlkun .ok-wave{transform-origin:92% 62%;opacity:0}
.owlkun .ok-lids{opacity:0}
.owlkun.hello .ok-wingL{opacity:0}.owlkun.hello .ok-wave{opacity:1}.owlkun.hello .ok-owl{transform:translate(12%,3%) scale(.88)}
@media (prefers-reduced-motion:no-preference){
.owlkun .ok-owl{animation:ok-breathe 3.2s ease-in-out infinite}
.owlkun .ok-cap{animation:ok-cap 3.2s ease-in-out infinite}
.owlkun .ok-lids{animation:ok-blinkL 4.6s linear infinite}.owlkun .ok-pupils{animation:ok-blinkP 4.6s linear infinite}
.owlkun.think .ok-head{animation:ok-think 7.2s cubic-bezier(.45,0,.3,1) infinite}
.owlkun.think .ok-cap{animation:ok-thinkcap 7.2s cubic-bezier(.45,0,.3,1) infinite}
.owlkun.talk .ok-head{animation:ok-nod .62s ease-in-out infinite}
.owlkun.talk .ok-wingL,.owlkun.talk .ok-wingR{animation:ok-flapS 1.24s ease-in-out infinite}
.owlkun.happy .ok-owl{animation:ok-jump 1.5s cubic-bezier(.3,0,.3,1) infinite}
.owlkun.happy .ok-cap{animation:ok-capjump 1.5s cubic-bezier(.3,0,.3,1) infinite}
.owlkun.happy .ok-wingL{animation:ok-flapL 1.5s ease-in-out infinite}.owlkun.happy .ok-wingR{animation:ok-flapR 1.5s ease-in-out infinite}
.owlkun.happy .ok-lids{animation:ok-smileL 1.5s linear infinite}.owlkun.happy .ok-pupils{animation:ok-smileP 1.5s linear infinite}
.owlkun.hello .ok-wingL{opacity:0}.owlkun.hello .ok-wave{opacity:1;animation:ok-wave 1.1s ease-in-out infinite}
.owlkun.hello .ok-head{animation:ok-hellohead 2.2s ease-in-out infinite}
.owlkun.hello .ok-owl{animation:ok-hellobody 2.2s ease-in-out infinite}
}
@keyframes ok-breathe{0%,100%{transform:translateY(0) scale(1,1)}50%{transform:translateY(-1.2%) scale(.99,1.018)}}
@keyframes ok-cap{0%,100%{transform:translateY(0) rotate(0)}58%{transform:translateY(-3%) rotate(-1.2deg)}}
@keyframes ok-blinkL{0%,91%,97%,100%{opacity:0}92%,96%{opacity:1}}
@keyframes ok-blinkP{0%,91%,97%,100%{opacity:1}92%,96%{opacity:0}}
@keyframes ok-think{0%,4%,100%{transform:rotate(0)}20%{transform:rotate(-18deg)}24%,44%{transform:rotate(-17deg)}64%{transform:rotate(18deg)}68%,86%{transform:rotate(17deg)}}
@keyframes ok-thinkcap{0%,8%,100%{transform:translate(0,0) rotate(0)}24%{transform:translate(-6%,2%) rotate(-10deg)}30%,46%{transform:translate(-4%,1.5%) rotate(-6deg)}68%{transform:translate(6%,2%) rotate(10deg)}74%,88%{transform:translate(4%,1.5%) rotate(6deg)}}
@keyframes ok-nod{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(2.2%) rotate(1.5deg)}}
@keyframes ok-flapS{0%,100%{transform:rotate(0)}50%{transform:rotate(5deg)}}
@keyframes ok-jump{0%,100%{transform:translateY(0) scale(1,1)}12%{transform:translateY(1%) scale(1.06,.92)}42%{transform:translateY(-9%) scale(.96,1.06)}70%{transform:translateY(0) scale(1.05,.94)}84%{transform:translateY(-1%) scale(.99,1.02)}}
@keyframes ok-capjump{0%,12%,100%{transform:translateY(0) rotate(0)}48%{transform:translateY(-26%) rotate(-9deg)}74%{transform:translateY(0) rotate(3deg)}86%{transform:translateY(-6%) rotate(0)}}
@keyframes ok-flapL{0%,12%,100%{transform:rotate(0)}42%{transform:rotate(30deg)}70%{transform:rotate(-4deg)}}
@keyframes ok-flapR{0%,12%,100%{transform:rotate(0)}42%{transform:rotate(-30deg)}70%{transform:rotate(4deg)}}
@keyframes ok-smileL{0%,20%,72%,100%{opacity:0}24%,68%{opacity:1}}
@keyframes ok-smileP{0%,20%,72%,100%{opacity:1}24%,68%{opacity:0}}
@keyframes ok-wave{0%,100%{transform:rotate(7deg)}50%{transform:rotate(-13deg)}}
@keyframes ok-hellobody{0%,100%{transform:translate(12%,3%) scale(.88)}50%{transform:translate(12%,2%) scale(.885,.895)}}
@keyframes ok-hellohead{0%,100%{transform:rotate(0)}50%{transform:rotate(-4deg)}}
.ui-login-band{grid-column:1/-1;position:relative;display:flex;align-items:center;min-height:96px;margin:26px 0 0;box-sizing:border-box;padding:12px 28px 12px 118px;border-radius:24px;background:#005f94;isolation:isolate;box-shadow:0 12px 26px rgba(0,95,148,.22);animation:ui-rise .5s ease-out .15s both}
.ui-login-band::after{content:"";position:absolute;inset:0;border-radius:24px;z-index:-1;pointer-events:none;background:radial-gradient(circle at 74% 26%,#fae200 0 3.5px,transparent 4.5px),radial-gradient(circle at 81% 70%,rgba(255,255,255,.75) 0 2.5px,transparent 3.5px),radial-gradient(circle at 66% 78%,rgba(255,255,255,.5) 0 2px,transparent 3px),radial-gradient(circle at 92% 34%,rgba(255,255,255,.45) 0 2px,transparent 3px),radial-gradient(circle at 96% 120%,rgba(255,255,255,.10) 0 120px,transparent 121px),repeating-linear-gradient(transparent 0 32px,rgba(255,255,255,.07) 32px 33px);animation:ui-twinkle 3.6s ease-in-out infinite}
.ui-login-band .ui-owl{position:absolute;left:20px;top:50%;width:86px;height:86px;margin-top:-43px}
.ui-login-band .owlkun>circle{display:none}
.ui-login-band .ui-day{display:grid;gap:1px;color:#fff;line-height:1.45;text-align:left}
.ui-login-band .ui-day__date{font-size:14px;letter-spacing:.12em;opacity:.86;font-variant-numeric:tabular-nums}
.ui-login-band .ui-day__title{justify-self:start;font-size:22px;font-weight:800;letter-spacing:.05em;padding:0 .1em;background:linear-gradient(transparent 82%,#fae200 82% 93%,transparent 93%)}
.ui-login-band .ui-day__msg{font-size:15px;opacity:.94}
@keyframes ui-twinkle{0%,100%{opacity:1}50%{opacity:.72}}
@keyframes ui-rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@media(max-width:600px){.ui-login-band{min-height:84px;padding:10px 16px 10px 88px;border-radius:18px}.ui-login-band .ui-owl{left:10px;width:70px;height:70px;margin-top:-35px}.ui-login-band .ui-day__title{font-size:17px}.ui-login-band .ui-day__date,.ui-login-band .ui-day__msg{font-size:13px}}
@media(prefers-reduced-motion:reduce){.ui-login-band,.ui-login-band::after,.ui-login-band .owlkun *{animation:none}}