Rework app bar, notes layout, Settings/Admin/login restyle

App bar: brand, Studies / Read Bible / Reading Plans, and one account menu
(theme, Settings, Admin, Log out). Study stage: notes get their own box above
the resources in the right column. Settings, Admin and the login page use the
reader themes; add a theme-aware danger colour.

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

src/components/study/CrossRefsTab.jsx

@@ -13,7 +13,7 @@ function RefChip({ label, onRemove, loadVerseText }) {
     <div className="rounded-xl border border-[var(--r-line)]">
       <div className="flex items-center justify-between gap-2 px-3 py-1.5">
         <button type="button" onClick={toggle} aria-expanded={open} className="flex-1 text-left text-sm">{label}</button>
-        <button type="button" onClick={onRemove} aria-label={`Remove ${label}`} className="text-[var(--r-sub)] hover:text-red-600">×</button>
+        <button type="button" onClick={onRemove} aria-label={`Remove ${label}`} className="text-[var(--r-sub)] hover:text-[var(--r-danger,#b42318)]">×</button>
       </div>
       {open && <p className="border-t border-[var(--r-line)] px-3 py-2 font-serif text-[13px] leading-relaxed text-[var(--r-sub)]">{text ?? 'Loading…'}</p>}
     </div>