.hsd{position:relative;margin:48px auto 0;height:104px;width:540px;max-width:92vw}.hsd .chip{position:absolute;top:30px;left:50%;width:44px;height:44px;margin-left:-22px;border-radius:11px;transform:translate(0) scale(.6);opacity:0;box-shadow:0 8px 20px -8px hsl(var(--foreground) / .34);transition:transform .8s cubic-bezier(.22,.61,.36,1),opacity .5s ease,background-color .45s ease}.hsd .basepill{position:absolute;left:50%;top:0;transform:translate(-50%) translateY(4px);font-family:var(--font-mono);font-size:10px;color:hsl(var(--text-muted));background:hsl(var(--card));border:1px solid hsl(var(--border));border-radius:999px;padding:3px 9px;opacity:0;transition:opacity .4s ease,transform .4s ease;white-space:nowrap}.hsd.on .basepill{opacity:1;transform:translate(-50%) translateY(0)}.hsd .cap{position:absolute;bottom:4px;width:100%;display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:hsl(var(--text-muted));opacity:0;transition:opacity .4s ease}.hsd.on .cap{opacity:1}