.wx .wx-orb{position:relative;flex:none;display:block;width:88px;height:88px;padding:0;margin:0;border:0;border-radius:22px;overflow:hidden;cursor:pointer;background:#6fa8dc;color:#fff;-webkit-tap-highlight-color:transparent;box-shadow:0 6px 18px rgba(20,40,70,.28),inset 0 0 0 1px rgba(255,255,255,.35);transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s}
.wx .wx-orb:hover{transform:translateY(-2px) scale(1.04);box-shadow:0 10px 24px rgba(20,40,70,.34),inset 0 0 0 1px rgba(255,255,255,.5)}
.wx .wx-orb:active{transform:scale(.97)}
.wx .wx-orb:focus-visible{outline:2px solid var(--signal,#21adff);outline-offset:3px}
.wx .wx-orb canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.wx .wx-orb__fb{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(#4a9be6,#cfe6f6)}
.wx .wx-orb--fog .wx-orb__fb{background:linear-gradient(#a3b0b8,#dbe1e4)}
.wx .wx-orb--rain .wx-orb__fb{background:linear-gradient(#566a7d,#93a5b2)}
.wx .wx-orb--snow .wx-orb__fb{background:linear-gradient(#9db3c6,#e5eef6)}
.wx .wx-orb--storm .wx-orb__fb{background:linear-gradient(#2d3347,#5a6280)}
.wx .wx-orb--cloud .wx-orb__fb{background:linear-gradient(#7f93a6,#c6d0d8)}
.wx .wx-orb__fb svg{width:52px;height:52px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;max-height:none!important}
.wx .wx-orb.is-live .wx-orb__fb{display:none}
.wx .wx-orb__tip{position:absolute;left:0;right:0;bottom:3px;text-align:center;font:600 9px/1 var(--font-display,system-ui);letter-spacing:.04em;color:#fff;text-shadow:0 1px 3px rgba(0,0,0,.6);opacity:0;transition:opacity .3s;pointer-events:none}
.wx .wx-orb:hover .wx-orb__tip,.wx .wx-orb:focus-visible .wx-orb__tip{opacity:.9}
@media(hover:none){.wx .wx-orb__tip{display:none}}
@media(max-width:550px){.wx .wx-orb{width:74px;height:74px;border-radius:19px}}
@media(prefers-reduced-motion:reduce){.wx .wx-orb,.wx .wx-orb:hover{transition:none;transform:none}}