/* The Home screen on phones and tablets (mobile-you.js). Its sections are
   home-view.css. */
@media (max-width: 1023px), (pointer: coarse) {
  #mobile-you-screen.mobile-you-screen {
    position: fixed;
    inset: 0 0 var(--mobile-tab-bar-height, 68px) 0;
    z-index: 700;
    background: linear-gradient(135deg, #0a0e27, #1a1a2e);
    /* The status bar keeps Home's background; only what is below it scrolls,
       so Home never passes under the clock or Dynamic Island. */
    box-sizing: border-box;
    padding-top: env(safe-area-inset-top, 0px);
  }
  #mobile-you-screen[hidden] { display: none !important; }
  /* The screen already ends at the top of the bottom navigation, which
     includes the safe area, so the bottom padding is the same in Safari and
     the installed app. */
  .mobile-you-scroll { box-sizing: border-box; height: 100%; overflow-y: auto; -webkit-overflow-scrolling: touch; padding: 1.25rem 1rem 2.5rem; }
  .mobile-you-content { max-width: 680px; margin: 0 auto; }
  .mobile-you-screen { isolation: isolate; }
  .mobile-you-state { color:#c7cfdd; padding:2rem .5rem; text-align:center; }
  .mobile-you-state h1 { color:white; }
}
@media (min-width: 1024px) and (pointer: fine) { #mobile-you-screen { display:none !important; } }
