/* Universal "Demo preview by RosenetLabs" top bar — used on all demo pages */
.inl-demo-bar{
  position:sticky;top:0;z-index:100;
  background:#0F172A;color:#fff;
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  font-size:13px;
}
.inl-demo-bar .inl-bar-inner{
  max-width:1280px;margin:0 auto;padding:10px 24px;
  display:flex;align-items:center;gap:14px;flex-wrap:nowrap;
}
.inl-demo-bar .inl-label{display:flex;align-items:center;gap:10px;font-weight:500;color:#CBD5E1;flex:none;}
.inl-demo-bar .inl-label .inl-dot{width:7px;height:7px;border-radius:50%;background:#60A5FA;box-shadow:0 0 0 4px rgba(96,165,250,.18);flex:none;}
.inl-demo-bar .inl-label strong{color:#fff;font-weight:600;white-space:nowrap;}
/* disclaimer — fills center space */
.inl-demo-bar .preview-disclaimer{
  flex:1;min-width:0;text-align:center;
  font-size:11.5px;color:rgba(255,255,255,.48);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  letter-spacing:.01em;
}
/* language switcher */
.inl-demo-bar .preview-lang{
  display:inline-flex;align-items:center;gap:2px;flex:none;
  border:1px solid rgba(255,255,255,.18);border-radius:999px;padding:2px;
}
.inl-demo-bar .preview-lang button{
  border:0;background:transparent;color:rgba(255,255,255,.55);
  padding:4px 8px;border-radius:999px;cursor:pointer;
  font:inherit;font-size:11px;letter-spacing:.04em;font-weight:600;
  transition:background .15s ease,color .15s ease;white-space:nowrap;
}
.inl-demo-bar .preview-lang button.is-active{background:#fff;color:#0f172a;}
.inl-demo-bar .preview-lang button:not(.is-active):hover{color:#fff;}
.inl-demo-bar a.inl-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:7px 14px;border-radius:8px;
  font-size:12.5px;font-weight:600;letter-spacing:-.005em;
  text-decoration:none;white-space:nowrap;flex:none;
  transition:background .15s ease, color .15s ease, transform .15s ease;
}
.inl-demo-bar a.inl-back{color:#CBD5E1;}
.inl-demo-bar a.inl-back:hover{color:#fff;}
.inl-demo-bar a.inl-cta{background:#2563EB;color:#fff;box-shadow:0 4px 12px rgba(37,99,235,.32);}
.inl-demo-bar a.inl-cta:hover{background:#1D4ED8;transform:translateY(-1px);}
.inl-demo-bar svg{display:block;}
@media (max-width:780px){
  .inl-demo-bar .preview-disclaimer{display:none;}
}
@media (max-width:640px){
  .inl-demo-bar .inl-bar-inner{padding:8px 16px;gap:8px 10px;flex-wrap:wrap;justify-content:center;}
  .inl-demo-bar .inl-label{font-size:11.5px;}
  .inl-demo-bar a.inl-btn{font-size:11.5px;padding:6px 10px;}
  .inl-demo-bar .preview-lang button{padding:3px 7px;font-size:10.5px;}
}