/* t1028u — top safe-area / overlap fixes (all apps) + chrome minimize */
:root{
  --safe-t: max(env(safe-area-inset-top, 0px), 62px) !important;
  --safe-b: env(safe-area-inset-bottom, 0px);
  --chrome-top: calc(var(--safe-t) + 8px);
}
.phone, .phone *{ box-sizing:border-box; }
/* Screens always clear Dynamic Island / notch */
.screen, .screen.app, .screen.on, .v6-pane{
  padding-top: max(12px, calc(var(--safe-t) + 8px)) !important;
}
/* Exception: full-bleed heroes may pull under status bar, but content above them must not */
.hero.parallax-hero, .hero{
  margin-top: 0 !important; /* was negative — caused collisions with titles/chips */
}
.hero.bleed-top{
  margin-top: calc(-1 * (var(--safe-t) + 8px)) !important;
  padding-top: calc(var(--safe-t) + 8px) !important;
}
.hero.bleed-top > .pic, .hero.bleed-top > .scrim{ top:0; }
.hero.bleed-top > .copy{ padding-top: calc(18px + var(--safe-t)) !important; }

/* Stacked home chrome: title → chips → avatar row — no overlap */
.large-title{
  position: relative; z-index: 5;
  margin: 0 16px 6px !important;
  padding-top: 0 !important;
  line-height: 1.1;
}
.sticky-chips{
  position: relative !important; /* not sticky over hero by default */
  top: auto !important;
  z-index: 4;
  margin: 0 0 10px;
  padding: 0 16px !important;
  background: transparent !important;
}
.home-chrome, .topbar, .avatar-chip{ position: relative; z-index: 4; }
.search-float{
  position: relative; z-index: 4;
  display:flex; gap:8px; align-items:center;
  margin: 0 16px 12px; padding:0;
}
.search-float input{ flex:1; min-height:44px; }
.back, button.back{
  top: calc(10px + var(--safe-t)) !important;
  z-index: 6 !important;
}
/* Compact chrome states */
.phone.is-compact .large-title{ font-size: 18px !important; letter-spacing: .02em; margin-bottom: 2px !important; }
.phone.is-compact .sticky-chips{ display:none; }
.phone.is-compact .tabs nav{ min-height: 48px !important; padding-top: 4px !important; padding-bottom: 4px !important; }
.phone.is-compact.thy-skin .tabs nav button .lab{ max-width:0; opacity:0; }
.phone.is-compact.pul-skin .tabs nav button .lab{ opacity:0; height:0; overflow:hidden; }
.phone.is-compact.pul-skin .tabs nav button.nav-start{ transform: translateY(-10px) scale(.86); }

/* App switcher */
.app-switcher{
  position:fixed; inset:0; z-index:120; display:none;
  background:rgba(8,10,14,.72);
  backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
  align-items:center; justify-content:flex-start;
  overflow-x:auto; overflow-y:hidden; scroll-snap-type:x mandatory;
  padding: calc(var(--safe-t) + 24px) 10vw calc(var(--safe-b) + 24px);
  gap: 18px;
}
.app-switcher.on{ display:flex; }
.app-switcher .as-card{
  flex:0 0 72vw; height:72dvh; scroll-snap-align:center;
  border-radius: 28px; overflow:hidden; position:relative;
  background: var(--paper, #111); color: var(--ink,#fff);
  box-shadow: 0 24px 60px rgba(0,0,0,.45);
  transform: scale(.92); transition: transform .35s cubic-bezier(.22,1.2,.36,1);
  border: 1px solid rgba(255,255,255,.12);
}
.app-switcher .as-card.on{ transform: scale(1); }
.app-switcher .as-card .as-label{
  position:absolute; left:14px; right:14px; bottom:14px; z-index:2;
  font-weight:800; font-size:15px; letter-spacing:.04em;
  text-shadow: 0 2px 10px rgba(0,0,0,.5);
}
.app-switcher .as-card .as-preview{
  position:absolute; inset:0; transform-origin: top center;
  transform: scale(.42); pointer-events:none; overflow:hidden;
}
.app-switcher .as-hint{ position:fixed; top: calc(var(--safe-t) + 8px); left:0; right:0; text-align:center; color:#fff; font-weight:700; font-size:13px; opacity:.8; pointer-events:none; }
@media (prefers-reduced-motion: reduce){
  .app-switcher, .app-switcher .as-card{ transition:none!important; backdrop-filter:none!important; }
}

/* t1045u — never let app inline :root zero out safe area */
html{
  --safe-t: max(env(safe-area-inset-top, 0px), 62px) !important;
}
.screen{
  padding-top: calc(var(--safe-t) + 12px) !important;
}