.demo-bar{position:relative;z-index:60;display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:40px;padding:6px max(16px,env(safe-area-inset-left)) 6px max(16px,env(safe-area-inset-right));background:#0d0d0c;color:#f3f1ec;font:500 13px/1.3 Inter Tight Variable,Inter Tight,system-ui,sans-serif;letter-spacing:.005em}.demo-bar__label{display:flex;align-items:center;gap:10px;min-width:0}.demo-bar__badge{flex:none;padding:3px 8px;border-radius:999px;background:#d4ff3f;color:#0d0d0c;font-weight:700;font-size:11px;letter-spacing:.06em;text-transform:uppercase}.demo-bar__text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#c9c6bf}.demo-bar__back{flex:none;display:inline-flex;align-items:center;gap:6px;padding:6px 4px;color:#f3f1ec;font-weight:600;text-decoration:none}.demo-bar__back:hover{text-decoration:underline;text-underline-offset:3px}.demo-bar :focus-visible{outline-color:#d4ff3f}@media(max-width:560px){.demo-bar__text .long{display:none}}.in-preview .demo-bar__back{display:none}.demo-note{display:flex;gap:10px;align-items:flex-start;padding:12px 14px;border-radius:12px;font-size:14px;line-height:1.45}
