/* Shared concept bar: every demo says plainly that it's a tbd. concept. */
.concept-bar {
  position: relative; z-index: 1000; display: flex; align-items: center; justify-content: center; gap: 10px 18px; flex-wrap: wrap;
  padding: 8px 16px; background: #141210; color: #F4ECE3; font: 500 12.5px/1.3 "Schibsted Grotesk", system-ui, sans-serif; letter-spacing: .02em; text-align: center;
}
.concept-bar b { font-family: "Bodoni Moda", Georgia, serif; font-weight: 500; font-size: 15px; letter-spacing: -.02em; }
.concept-bar b span { color: #C8473B; }
.concept-bar .cb-dot { width: 6px; height: 6px; border-radius: 50%; background: #C8473B; display: inline-block; margin-right: 6px; vertical-align: 1px; }
.concept-bar a { color: inherit; text-underline-offset: 3px; }
.concept-bar a:hover { color: #fff; }
.in-frame .concept-bar .cb-back { display: none; }
.demo-toast {
  position: fixed; left: 50%; bottom: 24px; z-index: 1001; transform: translate(-50%, 20px); opacity: 0; pointer-events: none;
  background: #141210; color: #F4ECE3; padding: 12px 18px; border-radius: 10px; font: 500 14px/1.4 "Schibsted Grotesk", system-ui, sans-serif;
  max-width: min(92vw, 440px); box-shadow: 0 20px 40px -20px rgba(0,0,0,.6); transition: opacity .3s, transform .3s;
}
.demo-toast.show { opacity: 1; transform: translate(-50%, 0); }
@media (prefers-reduced-motion: reduce) { .demo-toast { transition: none; } }