Fix dark theme fill, theme toggle visibility and bank account creation

- The Carbon theme class is now also set on html, with a themed background and a full-height root, so the dark theme fills the whole window instead of stopping at the content height. An inline script in index.html applies the saved theme before first paint.
- The header theme button gets a tooltip, inline padding and a max width so it is no longer clipped at the window edge. New Invoice also gets a labelled Dark mode toggle wired to the same handler.
- A shared BankAccountModal replaces the inline editor in Settings and adds a Create bank account button under the bank selector on New Invoice, which selects the new account on save. Settings keeps one Add bank account button under the table. Bank name and account number are now required.

src/App.tsx

@@ -11,6 +11,7 @@ import Clients from "./views/Clients";
 import { ToastProvider, useToast } from "./components/ToastProvider";
 import AppSettings from "./views/AppSettings";
 import { requestSettingsTab } from "./lib/settingsTab";
+import { applyDocumentTheme, cachedTheme, normalizeTheme } from "./lib/theme";
 
 export default function App() {
   return (
@@ -46,9 +47,15 @@ function AppInner() {
     void refreshSettings();
   }, [refreshSettings]);
 
+  // Before settings load (and on the error screen) use the cached theme so the window never flashes white.
+  const theme = settings ? normalizeTheme(settings.theme) : cachedTheme();
+  useEffect(() => {
+    applyDocumentTheme(theme);
+  }, [theme]);
+
   if (loading) {
     return (
-      <Theme theme="g10">
+      <Theme theme={theme} className="voiced-theme">
         <div className="voiced-empty">
           <Loading description="Loading Voiced" withOverlay={false} small />
         </div>
@@ -58,7 +65,7 @@ function AppInner() {
 
   if (error) {
     return (
-      <Theme theme="g10">
+      <Theme theme={theme} className="voiced-theme">
         <div className="voiced-page">
           <InlineNotification
             kind="error"
@@ -74,11 +81,9 @@ function AppInner() {
 
   if (!settings) return null;
 
-  const theme = settings.theme === "g100" ? "g100" : "g10";
-
   if (!settings.onboarded) {
     return (
-      <Theme theme={theme}>
+      <Theme theme={theme} className="voiced-theme">
         <Onboarding
           initial={settings}
           onDone={(next) => {
@@ -106,8 +111,8 @@ function AppInner() {
   };
 
   return (
-    <Theme theme={theme}>
-      <AppShell view={view} onNavigate={setView} theme={settings.theme} onToggleTheme={toggleTheme}>
+    <Theme theme={theme} className="voiced-theme">
+      <AppShell view={view} onNavigate={setView} theme={theme} onToggleTheme={toggleTheme}>
         {/* Main views stay mounted so a half-typed invoice survives switching tabs. */}
         <NewInvoice
           settings={settings}
@@ -116,6 +121,8 @@ function AppInner() {
           onActivate={() => setView("new")}
           openDraftId={openDraftId}
           onDraftOpened={() => setOpenDraftId(null)}
+          theme={theme}
+          onToggleTheme={toggleTheme}
         />
         <div hidden={view !== "invoices"}>
           <InvoiceHistory