@layer components{.a-bar-preview{--a-bar-bg:#1e1e2e;--a-bar-item:#313244;--a-bar-accent:#89b4fa;background-color:var(--a-bar-bg);flex-direction:column;justify-content:space-between;gap:8px;height:100%;padding:8px;display:flex;position:relative;overflow:clip}.a-bar-preview .a-bar-logo{width:100px;fill:var(--white);margin-inline:auto}.a-bar-preview__bar{background-color:var(--a-bar-item);border-radius:6px;justify-content:space-between;align-items:center;gap:8px;width:100%;height:24px;padding:0 8px;display:flex}.a-bar-preview__bar--2{animation:a-bar-2-slide-in 8s var(--transition-easing) infinite;transform:translateY(200%)}@keyframes a-bar-2-slide-in{0%,10%,to{transform:translateY(200%)}15%,90%{transform:none}}.a-bar-preview__items{align-items:center;gap:6px;display:flex}.a-bar-preview__items--right{margin-left:auto}.a-bar-preview__item{background-color:var(--a-bar-accent);opacity:.9;border-radius:3px;height:12px}.a-bar-preview__item--logo{background-color:var(--a-bar-accent);width:16px}.a-bar-preview__item--workspace{width:32px}.a-bar-preview__item--window{width:48px}.a-bar-preview__item--small{width:20px}.a-bar-preview__item--time{width:40px}.a-bar-preview__bar--2 .a-bar-preview__item--window{animation:a-bar-window-fade-in 8s var(--transition-easing) infinite}.a-bar-preview__bar--2 .a-bar-preview__items--right .a-bar-preview__item{animation:a-bar-item-fade-in 8s var(--transition-easing) infinite}.a-bar-preview__bar--2 .a-bar-preview__items--right .a-bar-preview__item:first-child{animation-name:a-bar-item-fade-in-delay-3}.a-bar-preview__bar--2 .a-bar-preview__items--right .a-bar-preview__item:nth-child(2){animation-name:a-bar-item-fade-in-delay-2}@keyframes a-bar-window-fade-in{0%,15%{opacity:0;transform:translate(-5%)}19%,90%{opacity:.9;transform:translate(0)}to{opacity:0;transform:translate(-5%)}}@keyframes a-bar-item-fade-in{0%,22.5%{opacity:0;transform:translate(5%)}26.5%,90%{opacity:.9;transform:translate(0)}to{opacity:0;transform:translate(5%)}}@keyframes a-bar-item-fade-in-delay-2{0%,27.5%{opacity:0;transform:translate(5%)}31.5%,90%{opacity:.9;transform:translate(0)}to{opacity:0;transform:translate(5%)}}@keyframes a-bar-item-fade-in-delay-3{0%,35%{opacity:0;transform:translate(5%)}39%,90%{opacity:.9;transform:translate(0)}to{opacity:0;transform:translate(5%)}}}
