Match the browser/OS chrome to the theme and clear the status bar

The app now sets theme-color, color-scheme and the page background from the chosen theme,
so the iPad status-bar area no longer shows a light band over a dark theme. Every top bar
leaves room for the status bar via a safe-top class (replacing a rule that padded every
<header>). Install defaults match the paper theme.

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>

src/components/study/PageShell.jsx

@@ -65,7 +65,7 @@ export default function PageShell({ title, onBack, actions, active = null, maxWi
   const go = { studies: goStudies, reader: openBibleReader, plans: openReadingPlans };
   return (
     <div className="min-h-screen bg-[var(--r-bg)] font-sans text-[var(--r-text)]" style={themeVars(readerTheme)}>
-      <header className="sticky top-0 z-30 border-b border-[var(--r-line)] bg-[var(--r-bar)]">
+      <header className="safe-top sticky top-0 z-30 border-b border-[var(--r-line)] bg-[var(--r-bar)]">
         <div className={`mx-auto flex h-12 ${maxWidth} items-center gap-4 px-4`}>
           <button type="button" onClick={goHome} className="flex shrink-0 items-center gap-2" aria-label="Bible Study home">
             <img src="/logo.svg" alt="" className="h-6 w-6" />

src/components/study/StudioShell.jsx

@@ -24,7 +24,7 @@ export default function StudioShell({ stage, loading = false, fixedHeight = fals
 
   return (
     <div className={`bg-[var(--r-bg)] font-sans text-[var(--r-text)] ${fixedHeight ? 'flex h-screen flex-col overflow-hidden' : 'min-h-screen'}`} style={themeVars(readerTheme)}>
-      <div className="z-30 shrink-0 border-b border-[var(--r-line)] bg-[var(--r-bar)]">
+      <div className="safe-top z-30 shrink-0 border-b border-[var(--r-line)] bg-[var(--r-bar)]">
         <div className="mx-auto flex h-12 max-w-[1600px] items-center gap-3 px-3">
           <button type="button" onClick={goHome} aria-label="Back to home"
             className="flex h-9 items-center gap-0.5 rounded-lg pl-1 pr-2 text-[var(--r-sub)] hover:bg-black/5"><ChevronLeft /><span className="hidden text-xs sm:inline">Home</span></button>