/* viewport 记得加 viewport-fit=cover */
.header {
padding-top: max(12px, env(safe-area-inset-top));
}
iPhone 上页面顶部标题被状态栏和时间压住，往下滑一截才看得清，同一份代码放到安卓机上却一点问题都没有。这类现象通常不是突然出现的，往前翻半天日志能看到苗头。
追下去是这么回事：页面用了 fixed 顶栏却没有写 viewport-fit=cover，Safari 把安全区当成页面外部，内容直接铺到屏幕最上方，状态栏就盖在标题上。加上这行之后还得配 padding，不然还是白搭。
「viewport-fit cover」确认了原因之后，改动尽量只碰那一处，顺手改的东西后面最容易出问题。同类问题如果隔一段时间又出现，多半是某个定时任务或重启流程把改动冲掉了。
处理上按这个顺序：在 viewport 里补上 viewport-fit=cover，页面才会延伸到刘海那块安全区，不写就永远是白边；给顶栏加 padding-top，用 env(safe-area-inset-top) 把状态栏那块高度让出来，值别写死；安卓没有安全区，用 max() 补一个基础间距，两边显示才统一，否则安卓顶得太靠上。
确认没问题再收工，刘海机上标题完整露在状态栏下方，没有安全区的旧机型间距也不会塌。