Why is @media applied differently in Safari?

Question

css

Safari 14.1.2

The crux of the matter is as follows.
I'll start by saying it only starts working at 375px (I'm looking in Responsive Design Mode) The next media query is supposed to apply its properties starting at 400px, but in reality it only starts applying them at 460px Here's my meta tag
@media (min-width: 320px)




@media (min-width: 400px)

<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">

oh well, it's not a problem to make a mobile phone from 320 to 1024, but the media request does not cling to 1024, similar to these examples. Neither , nor . The rule only takes effect, mind you, at 1170px. Let me explain once again that I'm watching all this in Responsive Design Mode. I admit that everything can work quite normally on real devices, but I am not able to typeset due to a problem with incorrect use of media queries. I want to note that in chrome on my laptop, media queries work as they should. @media (min-width: 1024px)@media (max-width: 1024px)@media (min-width: 1024px)

Answer 1

The answer is ridiculously stupid, I haven’t gotten used to the browser itself yet, and without noticing it, I accidentally slightly changed the scaling. The problem is solved, the key combination command / ctrl + 0 reset the scale and everything behaves according to the standard.