:root{--demoHeight:52px}
.demo-banner{
  position:sticky;top:0;z-index:500;min-height:var(--demoHeight);
  display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;
  padding:9px 16px;color:#ffffff;background:#052b3b;
  border-bottom:3px solid #06b6d4;box-shadow:0 10px 24px rgba(5,43,59,.18);
  font-weight:850;text-align:center
}
.demo-banner span{display:inline-flex;align-items:center;gap:8px}
.demo-banner strong{color:#67e8f9;letter-spacing:.08em}
.demo-banner a,.demo-banner button{
  border:0;border-radius:8px;padding:7px 11px;font-weight:900;cursor:pointer
}
.demo-banner a{background:#06b6d4;color:#032633}
.demo-banner button{background:rgba(255,255,255,.14);color:#fff}
.brand small{font-size:0}
.brand small::after{content:"DEMO";font-size:10px;letter-spacing:.12em}
@media(max-width:760px){.demo-banner{font-size:12px;justify-content:flex-start}.demo-banner a,.demo-banner button{width:auto}}
@media print{.demo-banner{display:none!important}}