.sb-field{display:grid;gap:.3rem}
.sb-field input{height:2.5rem;padding:0 .6rem}
.sb-stage{display:flex;justify-content:center;align-items:center;height:4.5rem;margin-top:.75rem}
.sb-island{display:flex;justify-content:center;align-items:center;width:var(--w,10px);height:var(--h,10px);max-width:100%;overflow:hidden;border-radius:24px;background:#111;color:#fff;transition:width 614ms cubic-bezier(.23,1,.32,1),height 614ms cubic-bezier(.23,1,.32,1)}
.sb-island.is-nudge{animation:sb-nudge 420ms ease-out}
.sb-layer{display:flex;align-items:center;gap:.5rem;width:max-content;padding:.35rem .4rem .35rem .85rem;white-space:nowrap}
.sb-layer.plain{padding:.5rem .95rem}
.sb-layer>*{animation:sb-in 240ms cubic-bezier(.23,1,.32,1) backwards;animation-delay:calc(60ms + var(--i,0)*35ms)}
.sb-layer button{min-height:2rem;padding:0 .7rem;border:0;border-radius:16px;background:rgba(255,255,255,.14);color:inherit;font:inherit;cursor:pointer}
.sb-layer button.primary{background:#fff;color:#111}
.sb-err{color:#ff8b8b}
@keyframes sb-in{from{opacity:0;transform:translateY(4px)}}
@keyframes sb-nudge{30%{transform:scale(1.05)}60%{transform:scale(.98)}}
@media (prefers-reduced-motion:reduce){.sb-island{transition:none}.sb-island.is-nudge,.sb-layer>*{animation:none}}