.demo-ribbon{z-index:60;color:#f5f6f8;font-family:var(--font-body), system-ui, sans-serif;background:#0e1014;border-bottom:1px solid #ffffff14;font-size:16px;line-height:1.3;position:relative}.demo-ribbon__in{flex-wrap:wrap;justify-content:space-between;align-items:center;column-gap:16px;width:min(100% - 2*clamp(16px,4vw,40px),1240px);margin-inline:auto;display:flex}.demo-ribbon__label{color:#c9ced6;flex-wrap:wrap;align-items:center;gap:4px 8px;min-height:44px;margin:0;display:flex}.demo-ribbon__chip{color:#f5f6f8;font-weight:700}.demo-ribbon__sep{color:#7d848f}.demo-ribbon__links{align-items:center;gap:4px 18px;display:flex}.demo-ribbon__back,.demo-ribbon__cta{color:#f5f6f8;white-space:nowrap;align-items:center;gap:6px;min-height:44px;font-weight:700;text-decoration:none;display:inline-flex}.demo-ribbon__back svg,.demo-ribbon__cta svg{flex:none;width:15px;height:15px}.demo-ribbon__back:hover{text-underline-offset:4px;text-decoration:underline}.demo-ribbon__cta{color:#6ee58c}.demo-ribbon__cta:hover{color:#9af0b0;text-underline-offset:4px;text-decoration:underline}.demo-ribbon :focus-visible{outline-offset:2px;border-radius:4px;outline:2px solid #f5f6f8}@media (max-width:719px){.demo-ribbon__back,.demo-ribbon__cta{min-height:44px;font-size:16px}.demo-ribbon__label{row-gap:0;min-height:0;padding-top:10px}.demo-ribbon__sep{display:none}.demo-ribbon__chip:after{content:":"}.demo-ribbon__links{flex-wrap:wrap;justify-content:space-between;width:100%}}body:has(.demo-ribbon):after{display:none}.demo-ribbon__price{color:#f5f6f8;white-space:nowrap;font-weight:700}.demo-ribbon__style{color:#c9ced5;flex-basis:100%;margin:0;padding:2px 0 8px;font-size:16px;line-height:1.4}.demo-ribbon--end{z-index:auto;border-top:1px solid #ffffff14;border-bottom:0}@media (max-width:999px){.sample-root:has(.mt-bar) .demo-ribbon--end{padding-bottom:calc(76px + env(safe-area-inset-bottom))}}@media (max-width:899px){.sample-root:has(.hs-bar) .demo-ribbon--end{padding-bottom:calc(76px + env(safe-area-inset-bottom))}}