.pixel-loader{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:70px;height:25px;vertical-align:middle;line-height:1;color:inherit}
.pixel-loader-bag{position:relative;width:20px;height:15px;margin:5px 8px 0 0;border:2px solid currentColor;box-shadow:inset 0 -3px 0 currentColor;animation:clockout-bag-step .85s steps(2,end) infinite}
.pixel-loader-bag:before{content:"";position:absolute;left:4px;top:-7px;width:8px;height:5px;border:2px solid currentColor;border-bottom:0}
.pixel-loader-bag:after{content:"";position:absolute;left:6px;top:3px;width:4px;height:3px;background:currentColor}
.pixel-loader i{display:block;width:5px;height:5px;background:currentColor;opacity:.25;animation:clockout-pixel-step .85s steps(2,end) infinite}
.pixel-loader i:nth-of-type(2){animation-delay:.14s}.pixel-loader i:nth-of-type(3){animation-delay:.28s}
.loading{color:#edc78f}.status.loading{border-color:transparent;background:transparent;min-height:46px;display:flex;align-items:center;padding:8px 0}
button[aria-busy=true]{display:inline-flex;align-items:center;justify-content:center;gap:12px;cursor:wait}button[aria-busy=true] .pixel-loader{min-width:62px;flex:none}
.ui-toast{position:fixed;z-index:1000;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);display:flex;align-items:center;gap:18px;width:max-content;max-width:min(460px,calc(100vw - 28px));padding:14px 16px;border:2px solid #91ae9d;background:#20352d;color:#e5f1e5;box-shadow:0 4px 0 #080f19;font:inherit;font-size:13px;line-height:1.7;animation:clockout-toast-in .18s ease-out}
.ui-toast[data-kind=error]{border-color:#c5988b;background:#392b30;color:#f1d2c4}.ui-toast[data-kind=info]{border-color:#879bb5;background:#202c3c;color:#e5e9ee}.ui-toast button{flex:none;width:30px;min-height:30px;padding:0;border:0;box-shadow:none;background:transparent;color:inherit;font:inherit;font-size:20px;cursor:pointer}.ui-toast button:focus-visible{outline:2px solid currentColor;outline-offset:2px}.ui-toast.hidden{display:none!important}
@keyframes clockout-bag-step{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@keyframes clockout-pixel-step{0%,70%,100%{opacity:.25;transform:translateY(0)}35%{opacity:1;transform:translateY(-3px)}}
@keyframes clockout-toast-in{from{opacity:0;transform:translate(-50%,8px)}to{opacity:1;transform:translate(-50%,0)}}
@media(prefers-reduced-motion:reduce){.pixel-loader-bag,.pixel-loader i,.ui-toast{animation:none!important}.pixel-loader i{opacity:.8}}
