.collection-potion{isolation:isolate;background:#241c26;border:1px solid #c46a2a;border-radius:8px;flex-shrink:0;height:22px;margin:4px 0;position:relative;overflow:hidden}.collection-potion-fill{background:linear-gradient(#ffad46,#e66713);transition:width .3s ease-out;position:absolute;inset:0 auto 0 0;overflow:hidden}.collection-potion-label{text-align:center;color:#fff;text-shadow:0 1px 3px #000,0 0 2px #000;font-size:12px;font-weight:700;line-height:20px;display:block;position:relative}.potion-wave{background:radial-gradient(at 50% 0,#fff8 50%,#0000 53%) 0 0/48px 9px repeat-x;height:9px;animation:4s linear infinite potion-wave;position:absolute;inset:-4px -48px auto}.collection-potion-fill i{border:1px solid #ffe8b799;border-radius:50%;width:4px;height:4px;animation:3.6s ease-in infinite potion-bubble;position:absolute;bottom:-5px;left:18%}.collection-potion-fill i:nth-of-type(2){animation-delay:-1.4s;left:52%}.collection-potion-fill i:nth-of-type(3){animation-delay:-2.5s;left:83%}.collection-potion.is-complete{animation:.65s ease-out potion-complete}@keyframes potion-wave{to{transform:translate(48px)}}@keyframes potion-bubble{to{opacity:0;transform:translateY(-26px)}}@keyframes potion-complete{40%{border-color:#fff2c6;box-shadow:0 0 8px #ff922c88}}@media (prefers-reduced-motion:reduce){.collection-potion,.collection-potion *{transition:none!important;animation:none!important}}