.demo-bar{display:flex;align-items:center;gap:10px 18px;flex-wrap:wrap;padding:8px max(16px,env(safe-area-inset-right,0px)) 8px max(16px,env(safe-area-inset-left,0px));padding-top:calc(8px + env(safe-area-inset-top,0px));background:#111;color:#fff;font:500 13.5px/1.3 -apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif}.demo-home{display:inline-flex;align-items:center;gap:8px;color:#fff;text-decoration:none;font-weight:700;letter-spacing:.02em}.demo-home svg{width:26px;height:26px;color:#fff}.demo-home span{background:#e8a33d;color:#111;border-radius:999px;padding:2px 9px;font-size:12px;text-transform:uppercase;letter-spacing:.1em}.demo-note{flex:1 1 260px;color:#d4d4d4}.demo-roles{display:inline-flex;align-items:center;gap:4px}.demo-roles span{color:#a3a3a3;margin-right:4px}.demo-roles a{color:#fff;text-decoration:none;padding:6px 12px;border-radius:999px;min-height:32px;display:inline-flex;align-items:center}.demo-roles a:hover{background:#2a2a2a}.demo-roles a[aria-current=page]{background:#fff;color:#111;font-weight:700}.demo-bar a:focus-visible{outline:3px solid #E8A33D;outline-offset:2px}body.is-demo .boot{min-height:calc(100vh - 52px)}@media(max-width:640px){.demo-note{display:none}.demo-roles{margin-left:auto}.demo-roles span{display:none}}
