ai: scope console theme to content wrapper, fix font loading

Two bugs in the previous /ai redesign:

1. theme="console" on AppShell put the entire shell (sidebar, appbar,
   appbar dropdowns, the lot) inside [data-theme="console"], so the
   console palette + JetBrains Mono override leaked into the sidebar
   and made light mode look broken on /ai. Scoped now: the AppShell
   stays in skyrise (so light/dark toggle keeps working everywhere),
   and only the route content area gets data-theme="console" via an
   inner wrapper.

2. The Google Fonts @import inside console.css was being silently
   dropped because @import rules must precede all other rules in the
   final bundle, and skyrise's content lands first. Moved JetBrains
   Mono + Newsreader into app.css's top-level @import url() alongside
   the existing Inter/Instrument Sans/Geist Mono families.

Atmosphere ::before was also position: fixed, which painted the grain
overlay across the whole viewport (including the sidebar) regardless
of where data-theme lived. Now position: absolute on the wrapper, with
isolation: isolate to keep z-index local.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

app/routes/ai.tsx

@@ -316,18 +316,26 @@ export default function AIRoute() {
   const availableModels = status.kind === "live" ? status.models : ["mock"]
 
   return (
-    <AppShell title="AI" theme="console">
+    <AppShell title="AI">
       <LLMProvider adapter={adapter} model={activeModel}>
-        <ChatSurface
-          models={availableModels}
-          model={activeModel}
-          onModelChange={setModel}
-          agents={agents}
-          activeAgent={activeAgent}
-          onAgentChange={setActiveAgentId}
-          isMock={status.kind === "mock"}
-          onRetryProbe={probe}
-        />
+        {/* Console aesthetic is scoped to this wrapper only, so the appbar
+         * and sidebar keep using the global skyrise tokens (light/dark
+         * toggle still works for them). */}
+        <div
+          data-theme="console"
+          className="-m-6 flex h-full min-h-0 flex-col bg-[var(--console-ink)] text-[var(--console-text)]"
+        >
+          <ChatSurface
+            models={availableModels}
+            model={activeModel}
+            onModelChange={setModel}
+            agents={agents}
+            activeAgent={activeAgent}
+            onAgentChange={setActiveAgentId}
+            isMock={status.kind === "mock"}
+            onRetryProbe={probe}
+          />
+        </div>
       </LLMProvider>
     </AppShell>
   )