@akanjs/cli 3.0.0-alpha.1 → 3.0.0-alpha.100

package/{index-pyt2b4nw.js → index-p5neav9b.js}

@@ -1,284 +1,33 @@
 // @bun
+import {
+  AsyncDefaultExportDetector,
+  resolveSsrPageEntriesForApp
+} from "./index-qsq3q8fy.js";
 import {
   BarrelAnalyzer,
-  ClientEntriesBundler,
-  GraphClientEntryDiscovery,
-  RouteClientBuilder,
-  VENDOR_SPECIFIERS,
   createBarrelImportsPlugin,
   createTsconfigPackageResolver,
   rewriteBarrelImports,
-  transformUseClient
-} from "./index-rh16j3c7.js";
-import {
-  __require
-} from "./index-r24hmh0q.js";
+  GraphClientEntryDiscovery,
+  transformUseClient,
+  ClientEntriesBundler,
+  VENDOR_SPECIFIERS,
+  RouteClientBuilder
+} from "./index-w8kmx1b6.js";
+var __require = import.meta.require;
 
 // pkgs/@akanjs/devkit/frontendBuild/allRoutesBuilder.ts
-import path4 from "path";
-
-// pkgs/@akanjs/devkit/artifact/implicitRootLayout.ts
-import { mkdir } from "fs/promises";
-import path from "path";
-var LAYOUT_KEY_RE = /^\.\/(.+\/)?_layout\.(tsx|ts|jsx|js)$/;
-async function appHasStModule(appCwdPath) {
-  return Bun.file(path.join(appCwdPath, "lib", "st.ts")).exists();
-}
-var IMPLICIT_LAYOUT_DIR = path.join(".akan", "generated", "root-layouts");
-var IMPLICIT_DICT_DIR = path.join(".akan", "generated", "dict");
-var IMPLICIT_OVERRIDES_DIR = path.join(".akan", "generated", "overrides");
-var OVERRIDES_KEY_RE = /^\.\/(.+\/)?_overrides\.(tsx|ts|jsx|js)$/;
-async function writeGeneratedOverridesLayoutFile(opts) {
-  const filename = `${opts.key.replace(/^\.\//, "").replace(/[^a-zA-Z0-9]+/g, "_")}.tsx`;
-  const absPath = path.join(path.resolve(opts.appCwdPath), IMPLICIT_OVERRIDES_DIR, filename);
-  const userRel = path.relative(path.dirname(absPath), opts.userAbsPath).split(path.sep).join("/");
-  const userSpecifier = userRel.startsWith(".") ? userRel : `./${userRel}`;
-  const source = `"use client";
-import { UiOverrideProvider } from "akanjs/ui";
-import { createElement, type ReactNode } from "react";
-import value from ${JSON.stringify(userSpecifier)};
-
-export default function AkanUiOverridesLayout({ children }: { children?: ReactNode }) {
-  return createElement(UiOverrideProvider, { value }, children);
-}
-`;
-  await Bun.write(absPath, source);
-  return absPath;
-}
-function getRootBoundarySegments(key) {
-  const match = LAYOUT_KEY_RE.exec(key);
-  if (!match)
-    return null;
-  const prefix = match[1]?.replace(/\/$/, "");
-  if (!prefix)
-    return [];
-  return prefix.split("/").filter(Boolean);
-}
-function implicitRootLayoutKey(segments) {
-  return `./${[...segments, "__root_layout"].join("/")}.tsx`;
-}
-function implicitRootLayoutAbsPath(appCwdPath, segments) {
-  const filename = segments.length ? `${segments.join("__")}__root_layout.tsx` : "__root_layout.tsx";
-  return path.join(path.resolve(appCwdPath), IMPLICIT_LAYOUT_DIR, filename);
-}
-function implicitDictionaryMacroAbsPath(appCwdPath) {
-  return path.join(path.resolve(appCwdPath), IMPLICIT_DICT_DIR, "useDict.ts");
-}
-function isRootBoundarySegments(segments, basePaths) {
-  const firstVisibleIndex = segments.findIndex((segment) => !/^\(.+\)$/.test(segment));
-  if (firstVisibleIndex === -1)
-    return segments.length <= 1;
-  if (segments.slice(firstVisibleIndex + 1).some((segment) => /^\(.+\)$/.test(segment)))
-    return false;
-  const visible = segments.slice(firstVisibleIndex);
-  const allowedBasePaths = new Set([...basePaths].map((basePath) => basePath.trim()).filter(Boolean));
-  return visible.length === 1 && (firstVisibleIndex > 0 || allowedBasePaths.has(visible[0] ?? ""));
-}
-function findRootBoundaries(pageKeys, appCwdPath, basePaths) {
-  const boundaries = new Map;
-  for (const key of pageKeys) {
-    const segments = getRootBoundarySegments(key);
-    if (!segments)
-      continue;
-    if (!isRootBoundarySegments(segments, basePaths))
-      continue;
-    const id = segments.join("/");
-    boundaries.set(id, {
-      sourceKey: key,
-      sourceAbsPath: path.resolve(appCwdPath, "page", key.replace(/^\.\//, "")),
-      segments
-    });
-  }
-  const hasExplicitRootBoundary = [...boundaries.values()].some((boundary) => boundary.segments.length === 0);
-  if (!hasExplicitRootBoundary && boundaries.size === 0) {
-    boundaries.set("", { sourceKey: null, sourceAbsPath: null, segments: [] });
-  }
-  return [...boundaries.values()].sort((a, b) => a.segments.join("/").localeCompare(b.segments.join("/")));
-}
-function hasAncestorRootBoundary(boundary, boundaries) {
-  return boundaries.some((candidate) => candidate !== boundary && candidate.segments.length < boundary.segments.length && candidate.segments.every((segment, index) => boundary.segments[index] === segment));
-}
-function findExplicitRootLayoutAbsPath(pageKeys, appCwdPath) {
-  const rootLayoutKey = pageKeys.find((key) => {
-    const segments = getRootBoundarySegments(key);
-    return segments !== null && segments.length === 0;
-  });
-  return rootLayoutKey ? path.resolve(appCwdPath, "page", rootLayoutKey.replace(/^\.\//, "")) : null;
-}
-function routePrefixForSegments(segments) {
-  const visible = segments.filter((segment) => !/^\(.+\)$/.test(segment));
-  return visible[0] ?? null;
-}
-async function assertEnvClientConvention(appCwdPath, appName) {
-  const envPath = path.join(appCwdPath, "env", "env.client.ts");
-  if (!await Bun.file(envPath).exists()) {
-    throw new Error(`[route-convention] app "${appName}" must provide env/env.client.ts exporting "env" for generated System.Provider`);
-  }
-}
-async function writeGeneratedDictionaryMacroFile(appCwdPath, appName) {
-  const absPath = implicitDictionaryMacroAbsPath(appCwdPath);
-  await mkdir(path.dirname(absPath), { recursive: true });
-  await Bun.write(absPath, `import { getAllDictionary } from "@apps/${appName}/lib/dict" with { type: "macro" };
-
-export const allDictionary = getAllDictionary();
-`);
-  return absPath;
-}
-async function writeGeneratedRootLayoutFile(opts) {
-  await assertEnvClientConvention(opts.appCwdPath, opts.appName);
-  const dictMacroAbsPath = opts.includeSystemProvider ? await writeGeneratedDictionaryMacroFile(opts.appCwdPath, opts.appName) : null;
-  const absPath = implicitRootLayoutAbsPath(opts.appCwdPath, opts.boundary.segments);
-  await mkdir(path.dirname(absPath), { recursive: true });
-  const dictMacroRel = dictMacroAbsPath ? path.relative(path.dirname(absPath), dictMacroAbsPath).split(path.sep).join("/") : null;
-  const dictMacroSpecifier = dictMacroRel ? dictMacroRel.startsWith(".") ? dictMacroRel : `./${dictMacroRel}` : null;
-  const sourceRel = opts.boundary.sourceAbsPath ? path.relative(path.dirname(absPath), opts.boundary.sourceAbsPath).split(path.sep).join("/") : null;
-  const sourceSpecifier = sourceRel ? sourceRel.startsWith(".") ? sourceRel : `./${sourceRel}` : null;
-  const inheritedSourceAbsPath = opts.rootSourceAbsPath && opts.rootSourceAbsPath !== opts.boundary.sourceAbsPath ? opts.rootSourceAbsPath : null;
-  const inheritedSourceRel = inheritedSourceAbsPath ? path.relative(path.dirname(absPath), inheritedSourceAbsPath).split(path.sep).join("/") : null;
-  const inheritedSourceSpecifier = inheritedSourceRel ? inheritedSourceRel.startsWith(".") ? inheritedSourceRel : `./${inheritedSourceRel}` : null;
-  const clientImport = opts.includeStInit ? `import { st } from "@apps/${opts.appName}/client";
-void st;
-` : `import "@apps/${opts.appName}/client";
-`;
-  const inheritedImport = inheritedSourceSpecifier ? `import * as inheritedLayout from ${JSON.stringify(inheritedSourceSpecifier)};
-` : `const inheritedLayout = {};
-`;
-  const prefix = routePrefixForSegments(opts.boundary.segments);
-  const userImport = sourceSpecifier ? `import UserLayout, * as userLayout from ${JSON.stringify(sourceSpecifier)};
-` : `const UserLayout = ({ children }) => children;
-const userLayout = {};
-`;
-  const source = opts.includeSystemProvider ? `import type { LayoutProps, PageProps } from "akanjs/client";
-import { loadFonts } from "akanjs/client";
-import { System } from "akanjs/ui";
-import { env } from "@apps/${opts.appName}/env/env.client";
-import { allDictionary } from ${JSON.stringify(dictMacroSpecifier)};
-${clientImport}${inheritedImport}${userImport}
-const userFonts = userLayout.fonts ?? inheritedLayout.fonts ?? [];
-const defaultFonts = userFonts.filter((font) => font.default);
-if (defaultFonts.length > 1) throw new Error("[route-convention] only one default font is allowed per root layout");
-const defaultFont = defaultFonts[0];
-const defaultFontClassName = defaultFont ? (defaultFont.className ?? \`font-\${defaultFont.name}\`) : undefined;
-
-export async function generateHead(props: PageProps) {
-  if (userLayout.generateHead) return userLayout.generateHead(props);
-  if (userLayout.head !== undefined) return userLayout.head;
-  if (inheritedLayout.generateHead) return inheritedLayout.generateHead(props);
-  return inheritedLayout.head;
-}
-
-export async function generateMetadata(props: PageProps) {
-  if (userLayout.generateMetadata) return userLayout.generateMetadata(props);
-  if (userLayout.metadata !== undefined) return userLayout.metadata;
-  if (inheritedLayout.generateMetadata) return inheritedLayout.generateMetadata(props);
-  return inheritedLayout.metadata;
-}
-
-export const NotFound = userLayout.NotFound ?? inheritedLayout.NotFound;
-export const Error = userLayout.Error ?? inheritedLayout.Error;
-export const pageConfig = userLayout.pageConfig ?? inheritedLayout.pageConfig;
-
-export default function GeneratedLayout({ children, params, searchParams }: LayoutProps) {
-  return (
-    <System.Provider
-      of={GeneratedLayout as never}
-      appName=${JSON.stringify(opts.appName)}
-      ${prefix ? `prefix=${JSON.stringify(prefix)}
-      ` : ""}params={params}
-      manifest={userLayout.manifest ?? inheritedLayout.manifest}
-      env={env}
-      theme={userLayout.theme ?? inheritedLayout.theme}
-      fonts={loadFonts(userFonts)}
-      className={defaultFontClassName}
-      gaTrackingId={userLayout.gaTrackingId ?? inheritedLayout.gaTrackingId}
-      layoutStyle={userLayout.layoutStyle ?? inheritedLayout.layoutStyle}
-      reconnect={userLayout.reconnect ?? inheritedLayout.reconnect ?? false}
-      wsConnect={userLayout.wsConnect ?? inheritedLayout.wsConnect ?? true}
-      allDictionary={process.env.AKAN_PUBLIC_RENDER_ENV === "ssr" ? allDictionary : undefined}
-    >
-      <UserLayout params={params} searchParams={searchParams}>{children}</UserLayout>
-    </System.Provider>
-  );
-}
-` : `import type { LayoutProps, PageProps } from "akanjs/client";
-${inheritedImport}${userImport}
-export async function generateHead(props: PageProps) {
-  if (userLayout.generateHead) return userLayout.generateHead(props);
-  if (userLayout.head !== undefined) return userLayout.head;
-  if (inheritedLayout.generateHead) return inheritedLayout.generateHead(props);
-  return inheritedLayout.head;
-}
-
-export async function generateMetadata(props: PageProps) {
-  if (userLayout.generateMetadata) return userLayout.generateMetadata(props);
-  if (userLayout.metadata !== undefined) return userLayout.metadata;
-  if (inheritedLayout.generateMetadata) return inheritedLayout.generateMetadata(props);
-  return inheritedLayout.metadata;
-}
-
-export const NotFound = userLayout.NotFound ?? inheritedLayout.NotFound;
-export const Error = userLayout.Error ?? inheritedLayout.Error;
-export const pageConfig = userLayout.pageConfig ?? inheritedLayout.pageConfig;
-
-export default function GeneratedLayout({ children, params, searchParams }: LayoutProps) {
-  return <UserLayout params={params} searchParams={searchParams}>{children}</UserLayout>;
-}
-`;
-  await Bun.write(absPath, source);
-  return absPath;
-}
-async function resolveSsrPageEntries(opts) {
-  const absPageDir = path.resolve(opts.appCwdPath, "page");
-  const hasSt = await appHasStModule(opts.appCwdPath);
-  const basePaths = opts.basePaths ?? [];
-  const rootSourceAbsPath = findExplicitRootLayoutAbsPath(opts.pageKeys, opts.appCwdPath);
-  const rootBoundaries = findRootBoundaries(opts.pageKeys, opts.appCwdPath, basePaths);
-  const rootLayoutKeys = new Set(opts.pageKeys.filter((key) => {
-    const segments = getRootBoundarySegments(key);
-    return segments !== null && isRootBoundarySegments(segments, basePaths);
-  }));
-  const base = await Promise.all(opts.pageKeys.filter((key) => !rootLayoutKeys.has(key)).map(async (key) => {
-    const userAbsPath = path.resolve(absPageDir, key);
-    if (OVERRIDES_KEY_RE.test(key)) {
-      const moduleAbsPath = await writeGeneratedOverridesLayoutFile({
-        appCwdPath: opts.appCwdPath,
-        key,
-        userAbsPath
-      });
-      return { key, moduleAbsPath, seedAbsPaths: [userAbsPath] };
-    }
-    return { key, moduleAbsPath: userAbsPath };
-  }));
-  const generated = await Promise.all(rootBoundaries.map(async (boundary) => ({
-    key: implicitRootLayoutKey(boundary.segments),
-    moduleAbsPath: await writeGeneratedRootLayoutFile({
-      appCwdPath: opts.appCwdPath,
-      appName: opts.appName,
-      boundary,
-      rootSourceAbsPath,
-      includeStInit: hasSt && boundary.segments.length === 0,
-      includeSystemProvider: !hasAncestorRootBoundary(boundary, rootBoundaries)
-    }),
-    seedAbsPaths: [...new Set([boundary.sourceAbsPath, rootSourceAbsPath].filter((absPath) => absPath !== null))]
-  })));
-  const entries = [...base, ...generated];
-  entries.sort((a, b) => a.key.localeCompare(b.key));
-  return entries;
-}
-async function resolveSsrPageEntriesForApp(app, pageKeys) {
-  const config = await app.getConfig();
-  return resolveSsrPageEntries({ appCwdPath: app.cwdPath, appName: app.name, pageKeys, basePaths: config.basePaths });
-}
+import path3 from "path";
 
 // pkgs/@akanjs/devkit/artifact/routeSeedIndex.ts
-import path2 from "path";
+import path from "path";
 import { assertUniqueRoutePatterns, compareRouteSpecificity, parseRouteModuleKey } from "akanjs/common";
 function computeRouteSeedIndex(pageEntries) {
   const layoutsByPrefix = new Map;
   const pagesBySegments = [];
   for (const { key, moduleAbsPath, seedAbsPaths } of pageEntries) {
     const parsed = parseRouteModuleKey(key);
-    const files = [path2.resolve(moduleAbsPath), ...(seedAbsPaths ?? []).map((seed) => path2.resolve(seed))];
+    const files = [path.resolve(moduleAbsPath), ...(seedAbsPaths ?? []).map((seed) => path.resolve(seed))];
     if (parsed.kind === "layout" || parsed.kind === "overrides") {
       const prefix = parsed.routeSegments.join("/");
       const prev = layoutsByPrefix.get(prefix) ?? [];
@@ -315,7 +64,7 @@ function computeRouteSeedIndex(pageEntries) {
 }
 var ROUTE_SEED_INDEX_JSON = "route-seed-index.json";
 function serializeRouteSeedIndexForArtifact(index, artifactDir, options = {}) {
-  const normalizedArtifactDir = path2.resolve(artifactDir);
+  const normalizedArtifactDir = path.resolve(artifactDir);
   if (options.production) {
     return {
       entries: index.entries.map((entry) => ({ routeId: entry.routeId }))
@@ -330,19 +79,19 @@ function serializeRouteSeedIndexForArtifact(index, artifactDir, options = {}) {
   };
 }
 async function saveRouteSeedIndex(artifactDir, index, options = {}) {
-  const absPath = path2.join(path2.resolve(artifactDir), ROUTE_SEED_INDEX_JSON);
+  const absPath = path.join(path.resolve(artifactDir), ROUTE_SEED_INDEX_JSON);
   await Bun.write(absPath, `${JSON.stringify(serializeRouteSeedIndexForArtifact(index, artifactDir, options), null, 2)}
 `);
   return absPath;
 }
 function serializeArtifactPath(artifactPath, artifactDir) {
-  if (!path2.isAbsolute(artifactPath))
+  if (!path.isAbsolute(artifactPath))
     return artifactPath;
-  return path2.relative(artifactDir, artifactPath).split(path2.sep).join("/");
+  return path.relative(artifactDir, artifactPath).split(path.sep).join("/");
 }
 
 // pkgs/@akanjs/devkit/frontendBuild/routesManifestArtifactSerializer.ts
-import path3 from "path";
+import path2 from "path";
 
 class RoutesManifestArtifactSerializer {
   #manifest;
@@ -350,7 +99,7 @@ class RoutesManifestArtifactSerializer {
   #production;
   constructor(manifest, artifactDir, options = {}) {
     this.#manifest = manifest;
-    this.#artifactDir = path3.resolve(artifactDir);
+    this.#artifactDir = path2.resolve(artifactDir);
     this.#production = options.production ?? false;
   }
   static serialize(manifest, artifactDir, options = {}) {
@@ -383,9 +132,9 @@ class RoutesManifestArtifactSerializer {
     };
   }
   #serializeArtifactPath(artifactPath) {
-    if (!path3.isAbsolute(artifactPath))
+    if (!path2.isAbsolute(artifactPath))
       return artifactPath;
-    return path3.relative(this.#artifactDir, artifactPath).split(path3.sep).join("/");
+    return path2.relative(this.#artifactDir, artifactPath).split(path2.sep).join("/");
   }
 }
 
@@ -415,17 +164,27 @@ class AllRoutesBuilder {
     const seedIndex = computeRouteSeedIndex(pageEntries);
     this.#app.verbose(`[build-all] discovered ${seedIndex.entries.length} routes`);
     this.#discovery = await GraphClientEntryDiscovery.create(this.#app);
+    const allEntries = [];
+    const seen = new Set;
     for (const entry of seedIndex.entries) {
       const seeds = Array.from(new Set([...seedIndex.globalLayoutFiles, ...entry.seeds]));
-      const delta = await this.#buildRoute(entry.routeId, seeds);
-      this.#mergeRoute(entry.routeId, delta);
+      for (const discovered of await this.#discovery.discover(seeds)) {
+        if (seen.has(discovered))
+          continue;
+        seen.add(discovered);
+        allEntries.push(discovered);
+      }
+      this.#routeIds.push(entry.routeId);
     }
+    this.#app.verbose(`[build-all] ${allEntries.length} client entries across ${this.#routeIds.length} routes`);
+    const delta = await this.#buildEntries(allEntries);
+    this.#mergeDelta(delta);
     this.#merged.knownEntries = Array.from(this.#knownSet);
     const manifest = {
       routeIds: this.#routeIds,
       ...this.#merged
     };
-    const manifestPath = path4.join(path4.resolve(this.#artifactDir), "routes-manifest.json");
+    const manifestPath = path3.join(path3.resolve(this.#artifactDir), "routes-manifest.json");
     await Bun.write(manifestPath, `${JSON.stringify(RoutesManifestArtifactSerializer.serialize(manifest, this.#artifactDir, {
       production: this.#command === "build"
     }), null, 2)}
@@ -433,23 +192,30 @@ class AllRoutesBuilder {
     this.#app.verbose(`[build-all] wrote ${manifestPath} routes=${this.#routeIds.length} entries=${this.#merged.knownEntries.length}`);
     return { manifest, manifestPath, seedIndex };
   }
-  async#buildRoute(routeId, seeds) {
+  async#buildEntries(entries) {
     if (!this.#discovery)
       throw new Error("[build-all] client entry discovery is not initialized");
+    if (entries.length === 0)
+      return {
+        manifestDelta: {},
+        ssrManifestDelta: { moduleLoading: null, moduleMap: {} },
+        newEntries: [],
+        clientDeps: []
+      };
     const started = Date.now();
     const delta = await new RouteClientBuilder({
       app: this.#app,
-      routeId,
-      seeds,
+      seeds: [],
+      entries,
       artifact: this.#artifact,
       knownEntries: this.#knownSet,
       discovery: this.#discovery,
       command: this.#command
     }).build();
-    this.#app.verbose(`[build-all] ${routeId} +${delta.newEntries.length} entries (${Date.now() - started}ms)`);
+    this.#app.verbose(`[build-all] bundled ${delta.newEntries.length} entries (${Date.now() - started}ms)`);
     return delta;
   }
-  #mergeRoute(routeId, delta) {
+  #mergeDelta(delta) {
     for (const [key, row] of Object.entries(delta.manifestDelta))
       this.#merged.clientManifest[key] = row;
     for (const [url, byName] of Object.entries(delta.ssrManifestDelta.moduleMap)) {
@@ -457,436 +223,109 @@ class AllRoutesBuilder {
     }
     for (const abs of delta.newEntries)
       this.#knownSet.add(abs);
-    this.#routeIds.push(routeId);
   }
 }
 
-// pkgs/@akanjs/devkit/frontendBuild/csrArtifactBuilder.ts
-import { mkdir as mkdir2, rm, unlink } from "fs/promises";
-import path6 from "path";
-
-// pkgs/@akanjs/devkit/frontendBuild/pagesEntrySourceGenerator.ts
-import fs from "fs";
+// pkgs/@akanjs/devkit/frontendBuild/cssCompiler.ts
 import path5 from "path";
-import ts from "typescript";
+import { Logger } from "akanjs/common";
+import { compile } from "tailwindcss";
 
-class PagesEntrySourceGenerator {
-  #pageEntries;
-  constructor(pageEntries) {
-    this.#pageEntries = pageEntries;
-  }
-  static generate(pageEntries) {
-    return new PagesEntrySourceGenerator(pageEntries).generate();
-  }
-  generate() {
-    const lines = this.#pageEntries.map(({ key, moduleAbsPath }) => {
-      const specifier = PagesEntrySourceGenerator.#toImportSpecifier(moduleAbsPath);
-      return `  ${JSON.stringify(key)}: () => import(${JSON.stringify(specifier)}),`;
-    });
-    return `export const pages = {
-${lines.join(`
-`)}
-};
-`;
+// pkgs/@akanjs/devkit/frontendBuild/cssCandidateCache.ts
+import { stat } from "fs/promises";
+var CANDIDATE_RE = /-?(?:[\w@]|\[[^\]\s]+\])[\w:/.-]*(?:\[[^\]\s]+\][\w:/.-]*)*/g;
+
+class CssCandidateCache {
+  static #version = 3;
+  #path;
+  #entries = new Map;
+  #dirty = false;
+  #reused = 0;
+  #rescanned = 0;
+  constructor(cachePath) {
+    this.#path = cachePath;
   }
-  static generateStatic(pageEntries) {
-    return new PagesEntrySourceGenerator(pageEntries).generateStatic();
+  get reused() {
+    return this.#reused;
   }
-  generateStatic() {
-    const imports = this.#pageEntries.map(({ moduleAbsPath }, index) => {
-      const specifier = PagesEntrySourceGenerator.#toImportSpecifier(moduleAbsPath);
-      return `import * as page${index} from ${JSON.stringify(specifier)};`;
-    });
-    const entries = this.#pageEntries.map(({ key, moduleAbsPath }, index) => {
-      const isAsyncDefault = PagesEntrySourceGenerator.#hasAsyncDefaultExport(moduleAbsPath);
-      return `  ${JSON.stringify(key)}: { loader: async () => page${index}, isAsyncDefault: ${isAsyncDefault} },`;
-    });
-    return `${imports.join(`
-`)}
-export const pages = {
-${entries.join(`
-`)}
-};
-`;
+  get rescanned() {
+    return this.#rescanned;
   }
-  static #toImportSpecifier(moduleAbsPath) {
-    return path5.resolve(moduleAbsPath).split(path5.sep).join("/");
+  async load() {
+    const raw = await Bun.file(this.#path).json().catch(() => null);
+    if (!raw || raw.version !== CssCandidateCache.#version || typeof raw.files !== "object")
+      return this;
+    for (const [file, entry] of Object.entries(raw.files)) {
+      if (typeof entry?.mtimeMs !== "number" || !Array.isArray(entry.candidates))
+        continue;
+      this.#entries.set(file, entry);
+    }
+    return this;
   }
-  static #hasAsyncDefaultExport(moduleAbsPath) {
-    try {
-      const source = fs.readFileSync(path5.resolve(moduleAbsPath), "utf8");
-      const sourceFile = ts.createSourceFile(moduleAbsPath, source, ts.ScriptTarget.Latest, true, PagesEntrySourceGenerator.#scriptKind(moduleAbsPath));
-      return PagesEntrySourceGenerator.#sourceFileHasAsyncDefaultExport(sourceFile);
-    } catch {
-      return false;
+  async candidatesFor(file) {
+    const stats = await stat(file).catch(() => null);
+    const cached = this.#entries.get(file);
+    if (stats && cached && cached.mtimeMs === stats.mtimeMs && cached.size === stats.size) {
+      this.#reused += 1;
+      return cached.candidates;
+    }
+    const content = await Bun.file(file).text();
+    const candidates = [...new Set(Array.from(content.matchAll(CANDIDATE_RE), (m) => m[0]))];
+    this.#rescanned += 1;
+    if (stats) {
+      this.#entries.set(file, { mtimeMs: stats.mtimeMs, size: stats.size, candidates });
+      this.#dirty = true;
     }
+    return candidates;
   }
-  static #sourceFileHasAsyncDefaultExport(sourceFile) {
-    const asyncBindings = new Map;
-    let defaultIdentifier = null;
-    for (const statement of sourceFile.statements) {
-      if (ts.isFunctionDeclaration(statement)) {
-        if (PagesEntrySourceGenerator.#hasModifier(statement, ts.SyntaxKind.DefaultKeyword)) {
-          return PagesEntrySourceGenerator.#hasModifier(statement, ts.SyntaxKind.AsyncKeyword);
-        }
-        if (statement.name) {
-          asyncBindings.set(statement.name.text, PagesEntrySourceGenerator.#hasModifier(statement, ts.SyntaxKind.AsyncKeyword));
-        }
-        continue;
-      }
-      if (ts.isVariableStatement(statement)) {
-        for (const declaration of statement.declarationList.declarations) {
-          if (!ts.isIdentifier(declaration.name))
-            continue;
-          asyncBindings.set(declaration.name.text, PagesEntrySourceGenerator.#isAsyncFunctionExpression(declaration.initializer));
-        }
-        continue;
-      }
-      if (ts.isExportAssignment(statement)) {
-        if (PagesEntrySourceGenerator.#isAsyncFunctionExpression(statement.expression))
-          return true;
-        if (ts.isIdentifier(statement.expression))
-          defaultIdentifier = statement.expression.text;
+  async save(present) {
+    for (const file of [...this.#entries.keys()]) {
+      if (present.has(file))
         continue;
-      }
-      if (ts.isExportDeclaration(statement) && statement.exportClause && ts.isNamedExports(statement.exportClause)) {
-        const exportClause = statement.exportClause;
-        for (const specifier of exportClause.elements) {
-          if (specifier.name.text !== "default")
-            continue;
-          defaultIdentifier = specifier.propertyName?.text ?? specifier.name.text;
-        }
-      }
+      this.#entries.delete(file);
+      this.#dirty = true;
     }
-    return defaultIdentifier ? asyncBindings.get(defaultIdentifier) === true : false;
-  }
-  static #hasModifier(node, kind) {
-    return ts.canHaveModifiers(node) && (ts.getModifiers(node)?.some((modifier) => modifier.kind === kind) ?? false);
-  }
-  static #isAsyncFunctionExpression(node) {
-    return Boolean(node && (ts.isArrowFunction(node) || ts.isFunctionExpression(node)) && PagesEntrySourceGenerator.#hasModifier(node, ts.SyntaxKind.AsyncKeyword));
-  }
-  static #scriptKind(moduleAbsPath) {
-    return moduleAbsPath.endsWith(".tsx") || moduleAbsPath.endsWith(".jsx") ? ts.ScriptKind.TSX : ts.ScriptKind.TS;
+    if (!this.#dirty)
+      return;
+    this.#dirty = false;
+    const files = {};
+    for (const [file, entry] of this.#entries)
+      files[file] = entry;
+    await Bun.write(this.#path, JSON.stringify({ version: CssCandidateCache.#version, files })).catch(() => {
+      return;
+    });
   }
 }
 
-// pkgs/@akanjs/devkit/frontendBuild/csrArtifactBuilder.ts
-class CsrArtifactBuilder {
-  #app;
-  #command;
-  #lang;
-  constructor(app, command = "start", lang = "en") {
-    this.#app = app;
-    this.#command = command;
-    this.#lang = lang;
+// pkgs/@akanjs/devkit/frontendBuild/cssImportResolver.ts
+import path4 from "path";
+var CSS_IMPORT_EXTS = ["", ".css", "/styles.css", "/index.css"];
+
+class CssImportResolver {
+  #workspaceRoot;
+  #paths;
+  #wildcardEntries;
+  constructor(workspaceRoot, paths = {}) {
+    this.#workspaceRoot = workspaceRoot;
+    this.#paths = paths;
+    this.#wildcardEntries = Object.entries(paths).filter(([key]) => key.endsWith("/*")).map(([key, replacements]) => ({ prefix: key.slice(0, -1), replacements })).sort((a, b) => b.prefix.length - a.prefix.length);
   }
-  async build() {
-    const pageKeys = await this.#app.getPageKeys();
-    if (pageKeys.length === 0) {
-      this.#app.log(`[cli] no route files under ${this.#app.cwdPath}/page \u2014 skipping CSR build`);
-      return null;
-    }
-    const pageEntries = await resolveSsrPageEntriesForApp(this.#app, pageKeys);
-    const akanConfig = await this.#app.getConfig();
-    const artifact = await this.#loadCsrArtifact();
-    const csrBasePaths = [...akanConfig.basePaths];
-    const htmlEntries = csrBasePaths.length > 0 ? csrBasePaths : ["index"];
-    await rm(this.#outputDir, { recursive: true, force: true });
-    await mkdir2(path6.join(this.#app.cwdPath, ".akan/generated/csr"), { recursive: true });
-    const generatedHtmlFiles = Object.fromEntries(htmlEntries.map((basePath) => this.#createHtmlFile(basePath)));
-    const result = await Bun.build({
-      target: "browser",
-      entrypoints: Object.keys(generatedHtmlFiles),
-      files: {
-        ...generatedHtmlFiles,
-        [`${this.#app.cwdPath}/.akan/generated/csr/csr.tsx`]: `
-import { bootCsr } from "akanjs/webkit";
-${PagesEntrySourceGenerator.generateStatic(pageEntries)}
-void bootCsr(pages);
-  `
-      },
-      root: `${this.#app.cwdPath}/.akan/generated/csr`,
-      outdir: this.#outputDir,
-      splitting: false,
-      minify: true,
-      env: "AKAN_PUBLIC_*",
-      define: this.#define(),
-      optimizeImports: akanConfig.optimizeImports
-    });
-    if (!result.success) {
-      const logs = result.logs.map((log) => log.message).join(`
-`);
-      throw new Error(`[csr-build] failed${logs ? `
-${logs}` : ""}`);
-    }
-    await this.#inlineCsrArtifacts(artifact.cssAssets ?? {});
-    this.#app.verbose(`[csr-build] output -> ${this.#outputDir}`);
-    return { outputDir: this.#outputDir };
+  static async create(app) {
+    const tsconfig = await app.getTsConfig();
+    return new CssImportResolver(app.workspace.workspaceRoot, tsconfig.compilerOptions.paths ?? {});
   }
-  get #outputDir() {
-    return path6.join(this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath, this.#command === "build" ? "csr" : ".akan/artifact/csr");
-  }
-  #define() {
-    const nodeEnv = this.#command === "build" ? "production" : "development";
-    return {
-      "process.env.NODE_ENV": JSON.stringify(nodeEnv),
-      "process.env.AKAN_PUBLIC_RENDER_ENV": JSON.stringify("csr"),
-      ...Object.fromEntries(Object.entries(this.#app.getPublicEnv()).map(([key, value]) => [`process.env.${key}`, JSON.stringify(value)]))
-    };
-  }
-  #createHtmlFile(basePath) {
-    const filename = `${basePath}.html`;
-    return [
-      `${this.#app.cwdPath}/.akan/generated/csr/${filename}`,
-      `<!doctype html>
-<html lang="${this.#lang}">
-  <head>
-    <meta charset="utf-8" />
-    <title>${this.#app.name}</title>
-    <base href="/" />
-    <meta name="viewport" content="width=device-width, initial-scale=1" />
-  </head>
-  <body>
-    <div id="root"></div>
-    <script type="module" src="./csr.tsx"></script>
-  </body>
-</html>
-  `
-    ];
-  }
-  async#loadCsrArtifact() {
-    const artifactDir = path6.join(this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath, ".akan/artifact");
-    const artifactFile = Bun.file(path6.join(artifactDir, "base-artifact.json"));
-    if (!await artifactFile.exists())
-      return { cssAssets: {} };
-    const artifact = await artifactFile.json();
-    return { cssAssets: artifact.cssAssets ?? {} };
-  }
-  async#inlineCsrArtifacts(cssAssets) {
-    const jsFiles = new Set;
-    const cssFiles = new Set;
-    for (const htmlPath of await this.#htmlOutputPaths()) {
-      const htmlFile = Bun.file(htmlPath);
-      if (!await htmlFile.exists())
-        continue;
-      const basePath = path6.basename(htmlPath, ".html") === "index" ? "" : path6.basename(htmlPath, ".html");
-      const inlined = await this.#inlineHtmlAssets(await htmlFile.text(), htmlPath, cssAssets[basePath]);
-      for (const filePath of inlined.jsFiles)
-        jsFiles.add(filePath);
-      for (const filePath of inlined.cssFiles)
-        cssFiles.add(filePath);
-      await Bun.write(htmlPath, inlined.html);
-    }
-    for (const filePath of jsFiles)
-      await unlink(filePath).catch(() => {
-        return;
-      });
-    for (const filePath of cssFiles)
-      await unlink(filePath).catch(() => {
-        return;
-      });
-    const remainingJs = await this.#listOutputFiles((filePath) => filePath.endsWith(".js"));
-    const remainingCss = await this.#listOutputFiles((filePath) => filePath.endsWith(".css"));
-    const remainingAssets = [...remainingJs, ...remainingCss];
-    if (remainingAssets.length > 0) {
-      throw new Error(`[csr-build] expected single-file HTML, but CSR assets remain:
-${remainingAssets.join(`
-`)}`);
-    }
-  }
-  async#inlineHtmlAssets(html, htmlPath, cssAsset) {
-    const jsFiles = [];
-    const cssFiles = CsrArtifactBuilder.collectStylesheetHrefs(html).map((href) => CsrArtifactBuilder.resolveHtmlAssetPath(htmlPath, href));
-    let next = CsrArtifactBuilder.stripBundledStylesheetLinks(html);
-    next = await CsrArtifactBuilder.replaceModuleScriptSrc(next, async (src) => {
-      const jsPath = CsrArtifactBuilder.resolveHtmlAssetPath(htmlPath, src);
-      jsFiles.push(jsPath);
-      return await Bun.file(jsPath).text();
-    });
-    const bundledCss = (await Promise.all(cssFiles.map((cssFile) => Bun.file(cssFile).text().catch(() => "")))).filter(Boolean).join(`
-`);
-    if (bundledCss) {
-      const style = CsrArtifactBuilder.createInlineStyle(bundledCss);
-      if (!next.includes(style))
-        next = CsrArtifactBuilder.injectBeforeHeadEnd(next, style);
-    }
-    if (cssAsset) {
-      const cssPath = path6.join(this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath, ".akan/artifact", cssAsset.cssRelPath);
-      const css = await Bun.file(cssPath).text();
-      const style = CsrArtifactBuilder.createInlineStyle(css);
-      if (!next.includes(style))
-        next = CsrArtifactBuilder.injectBeforeHeadEnd(next, style);
-    }
-    return { html: next, jsFiles, cssFiles };
-  }
-  async#htmlOutputPaths() {
-    return await this.#listOutputFiles((filePath) => filePath.endsWith(".html"));
-  }
-  async#listOutputFiles(predicate) {
-    const glob = new Bun.Glob("**/*");
-    const files = [];
-    for await (const filePath of glob.scan({ cwd: this.#outputDir, absolute: true })) {
-      if (predicate(filePath))
-        files.push(filePath);
-    }
-    return files.sort();
-  }
-  static injectBeforeHeadEnd(html, snippet) {
-    const matches = [...html.matchAll(/<\/head\s*>/gi)];
-    const bodyStart = html.search(/<body(?:\s|>)/i);
-    const headEnd = matches.filter((match) => match.index !== undefined && (bodyStart === -1 || match.index < bodyStart)).at(-1);
-    if (!headEnd || headEnd.index === undefined)
-      return `${snippet}
-${html}`;
-    return `${html.slice(0, headEnd.index)}${snippet}
-${html.slice(headEnd.index)}`;
-  }
-  static stripBundledStylesheetLinks(html) {
-    return html.replace(/<link\b(?=[^>]*\brel=["']stylesheet["'])[^>]*>\s*/gi, "");
-  }
-  static collectStylesheetHrefs(html) {
-    const linkRe = /<link\b(?=[^>]*\brel=["']stylesheet["'])(?=[^>]*\bhref=["']([^"']+)["'])[^>]*>/gi;
-    return [...html.matchAll(linkRe)].map((match) => match[1]).filter((href) => !!href);
-  }
-  static createInlineStyle(css) {
-    return `<style data-akan-css="active">
-${css.replace(/<\/style/gi, "<\\/style")}
-</style>`;
-  }
-  static async replaceModuleScriptSrc(html, loadScript) {
-    const scriptRe = /<script\b(?=[^>]*\btype=["']module["'])(?=[^>]*\bsrc=["']([^"']+)["'])[^>]*>\s*<\/script>/gi;
-    let result = "";
-    let lastIndex = 0;
-    let matched = false;
-    for (const match of html.matchAll(scriptRe)) {
-      const full = match[0];
-      const src = match[1];
-      if (match.index === undefined || !src)
-        continue;
-      matched = true;
-      result += html.slice(lastIndex, match.index);
-      result += `<script type="module">
-${CsrArtifactBuilder.escapeInlineScript(await loadScript(src))}
-</script>`;
-      lastIndex = match.index + full.length;
-    }
-    if (!matched)
-      return html;
-    return result + html.slice(lastIndex);
-  }
-  static escapeInlineScript(source) {
-    return source.replace(/<\/script/gi, "<\\/script");
-  }
-  static resolveHtmlAssetPath(htmlPath, src) {
-    if (/^[a-z][a-z0-9+.-]*:/i.test(src) || src.startsWith("//")) {
-      throw new Error(`[csr-build] cannot inline external script: ${src}`);
-    }
-    const normalized = src.startsWith("/") ? src.slice(1) : src;
-    return path6.resolve(path6.dirname(htmlPath), normalized);
-  }
-}
-
-// pkgs/@akanjs/devkit/frontendBuild/cssCompiler.ts
-import path8 from "path";
-import { Logger } from "akanjs/common";
-import { compile } from "tailwindcss";
-
-// pkgs/@akanjs/devkit/frontendBuild/cssCandidateCache.ts
-import { stat } from "fs/promises";
-var CANDIDATE_RE = /-?[\w@][\w:/.-]*(?:\[[^\]]+\][\w:/.-]*)*/g;
-
-class CssCandidateCache {
-  static #version = 1;
-  #path;
-  #entries = new Map;
-  #dirty = false;
-  #reused = 0;
-  #rescanned = 0;
-  constructor(cachePath) {
-    this.#path = cachePath;
-  }
-  get reused() {
-    return this.#reused;
-  }
-  get rescanned() {
-    return this.#rescanned;
-  }
-  async load() {
-    const raw = await Bun.file(this.#path).json().catch(() => null);
-    if (!raw || raw.version !== CssCandidateCache.#version || typeof raw.files !== "object")
-      return this;
-    for (const [file, entry] of Object.entries(raw.files)) {
-      if (typeof entry?.mtimeMs !== "number" || !Array.isArray(entry.candidates))
-        continue;
-      this.#entries.set(file, entry);
-    }
-    return this;
-  }
-  async candidatesFor(file) {
-    const stats = await stat(file).catch(() => null);
-    const cached = this.#entries.get(file);
-    if (stats && cached && cached.mtimeMs === stats.mtimeMs && cached.size === stats.size) {
-      this.#reused += 1;
-      return cached.candidates;
-    }
-    const content = await Bun.file(file).text();
-    const candidates = [...new Set(Array.from(content.matchAll(CANDIDATE_RE), (m) => m[0]))];
-    this.#rescanned += 1;
-    if (stats) {
-      this.#entries.set(file, { mtimeMs: stats.mtimeMs, size: stats.size, candidates });
-      this.#dirty = true;
-    }
-    return candidates;
-  }
-  async save(present) {
-    for (const file of [...this.#entries.keys()]) {
-      if (present.has(file))
-        continue;
-      this.#entries.delete(file);
-      this.#dirty = true;
-    }
-    if (!this.#dirty)
-      return;
-    this.#dirty = false;
-    const files = {};
-    for (const [file, entry] of this.#entries)
-      files[file] = entry;
-    await Bun.write(this.#path, JSON.stringify({ version: CssCandidateCache.#version, files })).catch(() => {
-      return;
-    });
-  }
-}
-
-// pkgs/@akanjs/devkit/frontendBuild/cssImportResolver.ts
-import path7 from "path";
-var CSS_IMPORT_EXTS = ["", ".css", "/styles.css", "/index.css"];
-
-class CssImportResolver {
-  #workspaceRoot;
-  #paths;
-  #wildcardEntries;
-  constructor(workspaceRoot, paths = {}) {
-    this.#workspaceRoot = workspaceRoot;
-    this.#paths = paths;
-    this.#wildcardEntries = Object.entries(paths).filter(([key]) => key.endsWith("/*")).map(([key, replacements]) => ({ prefix: key.slice(0, -1), replacements })).sort((a, b) => b.prefix.length - a.prefix.length);
-  }
-  static async create(app) {
-    const tsconfig = await app.getTsConfig();
-    return new CssImportResolver(app.workspace.workspaceRoot, tsconfig.compilerOptions.paths ?? {});
-  }
-  async resolve(id, fromBase) {
-    for (const resolve of [
-      () => this.#resolveWithTsconfig(id),
-      () => this.#resolveWithBun(id, fromBase),
-      () => this.#resolveWithRequire(id, fromBase),
-      () => this.#resolvePackageStyle(id, fromBase)
-    ]) {
-      const resolved = await resolve();
-      if (resolved)
-        return resolved;
-    }
-    return null;
+  async resolve(id, fromBase) {
+    for (const resolve of [
+      () => this.#resolveWithTsconfig(id),
+      () => this.#resolveWithBun(id, fromBase),
+      () => this.#resolveWithRequire(id, fromBase),
+      () => this.#resolvePackageStyle(id, fromBase)
+    ]) {
+      const resolved = await resolve();
+      if (resolved)
+        return resolved;
+    }
+    return null;
   }
   #resolveWithBun(id, fromBase) {
     for (const base of this.#resolutionBases(fromBase)) {
@@ -912,7 +351,7 @@ class CssImportResolver {
     const exact = this.#paths[id];
     if (exact) {
       for (const repl of exact) {
-        const resolved = await this.#firstExisting(path7.resolve(this.#workspaceRoot, repl));
+        const resolved = await this.#firstExisting(path4.resolve(this.#workspaceRoot, repl));
         if (resolved)
           return resolved;
       }
@@ -923,7 +362,7 @@ class CssImportResolver {
       const suffix = id.slice(prefix.length);
       for (const repl of replacements) {
         const replPath = repl.endsWith("/*") ? repl.slice(0, -1) : repl;
-        const resolved = await this.#firstExisting(path7.resolve(this.#workspaceRoot, replPath + suffix));
+        const resolved = await this.#firstExisting(path4.resolve(this.#workspaceRoot, replPath + suffix));
         if (resolved)
           return resolved;
       }
@@ -953,25 +392,29 @@ class CssImportResolver {
     try {
       if (!await Bun.file(pkgPath).exists())
         return null;
-      const pkgDir = path7.dirname(pkgPath);
+      const pkgDir = path4.dirname(pkgPath);
       const pkg = await Bun.file(pkgPath).json();
       const subpath = id === pkgName ? "." : `.${id.slice(pkgName.length)}`;
       const exportValue = pkg.exports?.[subpath];
-      const styleEntry = (typeof exportValue === "string" ? exportValue : exportValue?.style || exportValue?.import || exportValue?.default) || pkg.exports?.["."]?.style || pkg.style || "index.css";
-      return await this.#firstExisting(path7.resolve(pkgDir, styleEntry));
+      const exportedEntry = typeof exportValue === "string" ? exportValue : exportValue?.style || exportValue?.import || exportValue?.default;
+      if (exportedEntry)
+        return await this.#firstExisting(path4.resolve(pkgDir, exportedEntry));
+      if (subpath !== ".")
+        return await this.#firstExisting(path4.resolve(pkgDir, subpath));
+      return await this.#firstExisting(path4.resolve(pkgDir, pkg.exports?.["."]?.style || pkg.style || "index.css"));
     } catch {
       return null;
     }
   }
   #resolutionBases(fromBase) {
-    return [fromBase, this.#workspaceRoot, path7.dirname(Bun.main), path7.resolve(path7.dirname(Bun.main), "../..")];
+    return [fromBase, this.#workspaceRoot, path4.dirname(Bun.main), path4.resolve(path4.dirname(Bun.main), "../..")];
   }
   #packageJsonCandidates(pkgName) {
     return [
-      path7.join(this.#workspaceRoot, "pkgs", pkgName, "package.json"),
-      path7.join(this.#workspaceRoot, "node_modules", pkgName, "package.json"),
-      path7.join(path7.dirname(Bun.main), "node_modules", pkgName, "package.json"),
-      path7.join(path7.dirname(Bun.main), "../../", pkgName, "package.json")
+      path4.join(this.#workspaceRoot, "pkgs", pkgName, "package.json"),
+      path4.join(this.#workspaceRoot, "node_modules", pkgName, "package.json"),
+      path4.join(path4.dirname(Bun.main), "node_modules", pkgName, "package.json"),
+      path4.join(path4.dirname(Bun.main), "../../", pkgName, "package.json")
     ];
   }
   async#firstExisting(basePath) {
@@ -989,7 +432,7 @@ class CssImportResolver {
     return parts[0] ?? null;
   }
   static isCssFile(filePath) {
-    return path7.extname(filePath) === ".css";
+    return path4.extname(filePath) === ".css";
   }
 }
 
@@ -1008,13 +451,15 @@ class CssCompiler {
     this.#app = app;
   }
   get #candidateCachePath() {
-    return path8.join(this.#app.cwdPath, ".akan/cache/cssCandidates.json");
+    return path5.join(this.#app.cwdPath, ".akan/cache/cssCandidates.json");
   }
   #cssText = null;
   #cssTextByBasePath = null;
   #fileExistsCache = new Map;
   #resolvedFileCache = new Map;
   #resolvedSpecifierCache = new Map;
+  #discoveredCssPaths = new Set;
+  importedStylesheetsByBasePath = {};
   #fileExists(absPath) {
     let cached = this.#fileExistsCache.get(absPath);
     if (!cached) {
@@ -1036,7 +481,7 @@ class CssCompiler {
           return filePath;
       }
       for (const ext of SOURCE_EXTS) {
-        const filePath = path8.join(absPathNoExt, `index${ext}`);
+        const filePath = path5.join(absPathNoExt, `index${ext}`);
         if (await this.#fileExists(filePath))
           return filePath;
       }
@@ -1048,13 +493,20 @@ class CssCompiler {
   async getCss({ refresh } = {}) {
     if (this.#cssText !== null && !refresh)
       return this.#cssText;
+    this.#discoveredCssPaths.clear();
+    this.importedStylesheetsByBasePath = {};
     const { cssPaths, sourcePaths } = await this.discoverCssAndSources({ refresh });
-    this.#cssText = await this.compileCss(cssPaths, sourcePaths);
+    const { css, imported } = await this.#compileWithImports(cssPaths, sourcePaths);
+    this.#cssText = css;
+    this.importedStylesheetsByBasePath = { "": imported };
+    await this.#warnUnreachableStylesheets();
     return this.#cssText;
   }
   async getCssByBasePath({ refresh } = {}) {
     if (this.#cssTextByBasePath !== null && !refresh)
       return this.#cssTextByBasePath;
+    this.#discoveredCssPaths.clear();
+    this.importedStylesheetsByBasePath = {};
     const akanConfig = await this.#app.getConfig({ refresh });
     const pageKeys = await this.#app.getPageKeys({ refresh });
     const basePaths = [...akanConfig.basePaths];
@@ -1065,7 +517,8 @@ class CssCompiler {
           return ["", ""];
         const started = Date.now();
         const { cssPaths, sourcePaths } = await this.discoverCssAndSources({ refresh, pageKeys: rootPageKeys });
-        const css = await this.compileCss(cssPaths, sourcePaths);
+        const { css, imported } = await this.#compileWithImports(cssPaths, sourcePaths);
+        this.importedStylesheetsByBasePath[""] = imported;
         this.#logger.verbose(`css base=root paths=${cssPaths.length} sources=${sourcePaths.length} in ${Date.now() - started}ms`);
         return ["", css];
       })(),
@@ -1075,14 +528,27 @@ class CssCompiler {
           return [basePath, ""];
         const started = Date.now();
         const { cssPaths, sourcePaths } = await this.discoverCssAndSources({ refresh, pageKeys: basePathPageKeys });
-        const css = await this.compileCss(cssPaths, sourcePaths);
+        const { css, imported } = await this.#compileWithImports(cssPaths, sourcePaths);
+        this.importedStylesheetsByBasePath[basePath] = imported;
         this.#logger.verbose(`css base=${basePath} paths=${cssPaths.length} sources=${sourcePaths.length} in ${Date.now() - started}ms`);
         return [basePath, css];
       })
     ]);
     this.#cssTextByBasePath = Object.fromEntries(cssEntries);
+    await this.#warnUnreachableStylesheets();
     return this.#cssTextByBasePath;
   }
+  async#warnUnreachableStylesheets() {
+    const pageDir = path5.join(this.#app.cwdPath, "page");
+    const glob = new Bun.Glob("**/*.css");
+    for await (const cssPath of glob.scan({ cwd: pageDir, absolute: true })) {
+      if (cssPath.includes(`${path5.sep}(libs)${path5.sep}`))
+        continue;
+      if (this.#discoveredCssPaths.has(cssPath))
+        continue;
+      this.#logger.warn(`css ${path5.relative(this.#app.cwdPath, cssPath)} is imported by no route and never compiled`);
+    }
+  }
   async discoverCss({ refresh } = {}) {
     const { cssPaths } = await this.discoverCssAndSources({ refresh });
     return cssPaths;
@@ -1092,7 +558,7 @@ class CssCompiler {
     pageKeys
   } = {}) {
     pageKeys ??= await this.#app.getPageKeys({ refresh });
-    const seeds = pageKeys.map((key) => path8.resolve(this.#app.cwdPath, "page", key));
+    const seeds = pageKeys.map((key) => path5.resolve(this.#app.cwdPath, "page", key));
     const cssFiles = new Set;
     const sourceFiles = new Set;
     const queue = [...seeds];
@@ -1124,7 +590,7 @@ class CssCompiler {
       } catch {
         continue;
       }
-      const importerDir = path8.dirname(filePath);
+      const importerDir = path5.dirname(filePath);
       for (const imp of imports) {
         const spec = imp.path;
         if (!spec)
@@ -1142,21 +608,47 @@ class CssCompiler {
         queue.push(resolved);
       }
     }
-    return { cssPaths: [...cssFiles], sourcePaths: [...sourceFiles] };
+    const tokenPaths = await this.#libTokenStylesheets(sourceFiles);
+    const cssPaths = [...new Set([...tokenPaths, ...cssFiles])];
+    for (const cssPath of cssPaths)
+      this.#discoveredCssPaths.add(cssPath);
+    return { cssPaths, sourcePaths: [...sourceFiles] };
+  }
+  async#libTokenStylesheets(sourceFiles) {
+    const libsRoot = path5.join(this.#app.workspace.workspaceRoot, "libs");
+    const libNames = new Set;
+    for (const filePath of sourceFiles) {
+      const relPath = path5.relative(libsRoot, filePath);
+      if (relPath.startsWith("..") || path5.isAbsolute(relPath))
+        continue;
+      const [libName] = relPath.split(path5.sep);
+      if (libName)
+        libNames.add(libName);
+    }
+    const tokenPaths = await Promise.all([...libNames].sort().map(async (libName) => {
+      const tokensPath = path5.join(libsRoot, libName, "ui/tokens.css");
+      return await this.#fileExists(tokensPath) ? tokensPath : null;
+    }));
+    return tokenPaths.filter((tokensPath) => !!tokensPath);
   }
   async compileCss(cssPaths, sourcePaths) {
+    const { css } = await this.#compileWithImports(cssPaths, sourcePaths);
+    return css;
+  }
+  async#compileWithImports(cssPaths, sourcePaths) {
     if (cssPaths.length === 0)
-      return "";
+      return { css: "", imported: [] };
     const compileStarted = Date.now();
     const compilers = await Promise.all(cssPaths.map(async (cssPath) => {
       const css = await Bun.file(cssPath).text();
-      const base = path8.dirname(cssPath);
+      const base = path5.dirname(cssPath);
+      const imported = new Map;
       const compiler = await compile(css, {
         base,
-        loadStylesheet: (id, fromBase) => this.#loadStylesheet(id, fromBase),
+        loadStylesheet: (id, fromBase) => this.#loadStylesheet(id, fromBase, imported),
         loadModule: (id, fromBase) => this.#loadModule(id, fromBase)
       });
-      return { cssPath, compiler };
+      return { cssPath, compiler, imported };
     }));
     const sourceDirs = new Set;
     for (const entry of compilers) {
@@ -1169,23 +661,39 @@ class CssCompiler {
     const candidates = await this.#scanCandidates(sourcePaths, [...sourceDirs]);
     this.#logger.verbose(`css candidates scanned count=${candidates.length} sources=${sourcePaths.length} dirs=${sourceDirs.size} in ${Date.now() - scanStarted}ms`);
     const parts = [];
+    const imported = [];
     for (const entry of compilers) {
       if (!entry)
         continue;
-      parts.push(entry.compiler.build(candidates));
+      const part = entry.compiler.build(candidates);
+      parts.push(part);
+      for (const [cssPath, content] of entry.imported) {
+        const declaredNames = declaredCustomProperties(content);
+        imported.push({ cssPath, declaredNames });
+        if (declaredNames.length === 0 || declaredNames.some((name) => part.includes(`${name}:`)))
+          continue;
+        this.#logger.warn(`css @import ${cssPath} was loaded by ${entry.cssPath} but none of its ${declaredNames.length} declaration(s) reached the compiled CSS`);
+      }
     }
     this.#logger.verbose(`css compiled paths=${cssPaths.length} candidates=${candidates.length} in ${Date.now() - compileStarted}ms`);
-    return parts.join(`
-`);
+    return { css: parts.join(`
+`), imported };
   }
-  async#loadStylesheet(id, fromBase) {
+  async#loadStylesheet(id, fromBase, imported) {
     const p = await this.#resolveCssImport(id, fromBase);
+    this.#discoveredCssPaths.add(p);
     const content = await Bun.file(p).text();
-    return { path: p, base: path8.dirname(p), content };
+    imported?.set(p, content);
+    this.#logger.verbose(`css import "${id}" from ${fromBase} -> ${p} (${content.length} bytes)`);
+    return { path: p, base: path5.dirname(p), content };
   }
   async#resolveCssImport(id, fromBase) {
-    if (id.startsWith(".") || id.startsWith("/"))
-      return path8.resolve(fromBase, id);
+    if (id.startsWith(".") || id.startsWith("/")) {
+      const filePath = path5.resolve(fromBase, id);
+      if (await this.#fileExists(filePath))
+        return filePath;
+      throw new Error(`[css] failed to resolve stylesheet import "${id}" from ${fromBase} (no file at ${filePath})`);
+    }
     const resolver = await this.#getCssImportResolver();
     const resolved = await resolver.resolve(id, fromBase);
     if (resolved)
@@ -1198,89 +706,654 @@ class CssCompiler {
     this.#cssImportResolver = await CssImportResolver.create(this.#app);
     return this.#cssImportResolver;
   }
-  async#loadModule(id, fromBase) {
-    const p = __require.resolve(id, { paths: [fromBase] });
-    const mod = await import(p);
-    return { path: p, base: path8.dirname(p), module: mod.default ?? mod };
+  async#loadModule(id, fromBase) {
+    const p = __require.resolve(id, { paths: [fromBase] });
+    const mod = await import(p);
+    return { path: p, base: path5.dirname(p), module: mod.default ?? mod };
+  }
+  #resolveSourceImport(id, fromBase, resolvePackage) {
+    const cacheKey = `${fromBase}\x00${id}`;
+    let cached = this.#resolvedSpecifierCache.get(cacheKey);
+    if (cached)
+      return cached;
+    cached = this.#resolveSourceImportUncached(id, fromBase, resolvePackage);
+    this.#resolvedSpecifierCache.set(cacheKey, cached);
+    return cached;
+  }
+  async#resolveSourceImportUncached(id, fromBase, resolvePackage) {
+    if (id.startsWith(".") || id.startsWith("/")) {
+      const abs = id.startsWith("/") ? id : path5.resolve(fromBase, id);
+      return this.#resolveSourceFileCandidate(abs);
+    }
+    const pkg = await resolvePackage(id);
+    if (pkg)
+      return pkg.entryFile;
+    for (const resolve of [() => resolveSourceWithBun(id, fromBase), () => resolveSourceWithRequire(id, fromBase)]) {
+      const resolved = await resolve();
+      if (resolved)
+        return resolved;
+    }
+    return null;
+  }
+  async#scanCandidates(sourcePaths, dirs) {
+    const candidates = new Set;
+    const glob = new Bun.Glob("**/*.{tsx,ts,jsx,js,html}");
+    const files = new Set(sourcePaths);
+    await Promise.all(dirs.map(async (dir) => {
+      for await (const file of glob.scan({ cwd: dir, absolute: true })) {
+        if (isIgnoredNodeModuleSource(file))
+          continue;
+        files.add(file);
+      }
+    }));
+    const cache = await new CssCandidateCache(this.#candidateCachePath).load();
+    await Promise.all([...files].map(async (file) => {
+      for (const candidate of await cache.candidatesFor(file))
+        candidates.add(candidate);
+    }));
+    await cache.save(files);
+    this.#logger.verbose(`css candidate cache reused=${cache.reused} rescanned=${cache.rescanned}`);
+    return [...candidates];
+  }
+}
+function resolveSourceWithBun(id, fromBase) {
+  try {
+    const resolved = Bun.resolveSync(id, fromBase);
+    return isSourceFile(resolved) ? resolved : null;
+  } catch {
+    return null;
+  }
+}
+function resolveSourceWithRequire(id, fromBase) {
+  try {
+    const resolved = __require.resolve(id, { paths: [fromBase] });
+    return isSourceFile(resolved) ? resolved : null;
+  } catch {
+    return null;
+  }
+}
+function isSourceFile(filePath) {
+  return SOURCE_EXTS.includes(path5.extname(filePath));
+}
+function isIgnoredNodeModuleSource(filePath) {
+  return NODE_MODULES_RE.test(filePath) && !AKANJS_NODE_MODULE_RE.test(filePath);
+}
+function declaredCustomProperties(css) {
+  const withoutThemeBlocks = css.replace(/@theme[^{]*\{[^}]*\}/g, "");
+  return [...new Set([...withoutThemeBlocks.matchAll(/(?:^|[\s;{])(--[\w-]+)\s*:/g)].map(([, name]) => name))].filter((name) => !!name);
+}
+function getPageKeyBasePath(pageKey, basePaths) {
+  const normalized = pageKey.split(path5.sep).join("/").replace(/^\.\//, "");
+  const segments = normalized.split("/");
+  const firstPublicSegment = segments.find((segment) => segment !== "[lang]" && !/^\(.+\)$/.test(segment));
+  return firstPublicSegment && basePaths.includes(firstPublicSegment) ? firstPublicSegment : null;
+}
+
+// pkgs/@akanjs/devkit/frontendBuild/pagesBundleBuilder.ts
+import path8 from "path";
+
+// pkgs/@akanjs/devkit/transforms/externalizeFrameworkPlugin.ts
+import path6 from "path";
+var DEFAULT_INCLUDE = ["akanjs/", "@apps/", "@libs/"];
+var DEFAULT_EXCLUDE_EXACT = new Set(["akanjs/webkit", "@akanjs/cli", "@akanjs/devkit"]);
+var DEFAULT_EXCLUDE_PREFIX = ["@akanjs/cli/", "@akanjs/devkit/"];
+var OPTIONAL_BACKEND_EXTERNAL_EXACT = new Set([
+  "@libsql/client",
+  "bullmq",
+  "ioredis",
+  "postgres",
+  "protobufjs"
+]);
+var RUNTIME_EXTERNAL_EXACT = new Set([
+  "react",
+  "react-dom",
+  "react/jsx-runtime",
+  "react/jsx-dev-runtime",
+  "react-server-dom-webpack",
+  "react-server-dom-webpack/server.node",
+  "react-server-dom-webpack/client.node",
+  "react-server-dom-webpack/client.browser"
+]);
+var RUNTIME_EXTERNAL_PREFIX = ["react-dom/", "react-server-dom-webpack/"];
+var CANDIDATE_EXTS = [".tsx", ".ts", ".jsx", ".js", ".mjs", ".cjs"];
+async function createExternalizeFrameworkPlugin(options) {
+  const tsconfig = await options.app.getTsConfig();
+  const includePrefixes = options.include ?? DEFAULT_INCLUDE;
+  const extraExact = new Set(options.extra ?? []);
+  const workspaceRoot = options.app.workspace.workspaceRoot;
+  const tsconfigPaths = tsconfig.compilerOptions.paths ?? {};
+  const rootEntries = Object.entries(tsconfigPaths).filter(([k]) => !k.endsWith("/*")).map(([k, v]) => ({ pkg: k, entryFile: v[0] ?? null })).filter((e) => e.entryFile !== null);
+  const wildcardEntries = Object.entries(tsconfigPaths).filter(([k]) => k.endsWith("/*")).map(([k, v]) => ({ prefix: k.slice(0, -1), replacements: v })).sort((a, b) => b.prefix.length - a.prefix.length);
+  async function resolveWorkspaceSubpath(spec) {
+    if (!workspaceRoot)
+      return null;
+    for (const { prefix, replacements } of wildcardEntries) {
+      if (!spec.startsWith(prefix))
+        continue;
+      const suffix = spec.slice(prefix.length);
+      for (const repl of replacements) {
+        const replPath = repl?.endsWith("/*") ? repl.slice(0, -1) : repl ?? "";
+        if (!replPath)
+          continue;
+        const candidate = path6.resolve(workspaceRoot, replPath + suffix);
+        const hit = await firstExisting(candidate);
+        if (hit)
+          return hit;
+      }
+    }
+    for (const { pkg, entryFile } of rootEntries) {
+      if (spec !== pkg && !spec.startsWith(`${pkg}/`))
+        continue;
+      if (spec === pkg)
+        continue;
+      const suffix = spec.slice(pkg.length + 1);
+      const pkgDir = path6.dirname(path6.resolve(workspaceRoot, entryFile));
+      const candidate = path6.join(pkgDir, suffix);
+      const hit = await firstExisting(candidate);
+      if (hit)
+        return hit;
+    }
+    return null;
+  }
+  return {
+    name: "akan-externalize-framework",
+    setup(build) {
+      build.onResolve({ filter: /.*/ }, async (args) => {
+        const spec = args.path;
+        if (spec === "." || spec === ".." || spec.startsWith("./") || spec.startsWith("../") || spec.startsWith("/"))
+          return;
+        if (extraExact.has(spec) || DEFAULT_EXCLUDE_EXACT.has(spec))
+          return { path: spec, external: true };
+        for (const prefix of DEFAULT_EXCLUDE_PREFIX) {
+          if (spec.startsWith(prefix))
+            return { path: spec, external: true };
+        }
+        if (OPTIONAL_BACKEND_EXTERNAL_EXACT.has(spec))
+          return { path: spec, external: true };
+        if (RUNTIME_EXTERNAL_EXACT.has(spec))
+          return { path: spec, external: true };
+        for (const prefix of RUNTIME_EXTERNAL_PREFIX) {
+          if (spec.startsWith(prefix))
+            return { path: spec, external: true };
+        }
+        for (const prefix of includePrefixes) {
+          if (!spec.startsWith(prefix))
+            continue;
+          const resolved = await resolveWorkspaceSubpath(spec);
+          if (resolved)
+            return { path: resolved };
+          return;
+        }
+        return;
+      });
+    }
+  };
+}
+async function firstExisting(basePath) {
+  if (await Bun.file(basePath).exists())
+    return basePath;
+  for (const ext of CANDIDATE_EXTS) {
+    const candidate = `${basePath}${ext}`;
+    if (await Bun.file(candidate).exists())
+      return candidate;
+  }
+  for (const ext of CANDIDATE_EXTS) {
+    const candidate = path6.join(basePath, `index${ext}`);
+    if (await Bun.file(candidate).exists())
+      return candidate;
+  }
+  return null;
+}
+
+// pkgs/@akanjs/devkit/transforms/useClientBundlePlugin.ts
+function createUseClientBundlePlugin(options = {}) {
+  return {
+    name: "akan-use-client-bundle",
+    setup(build) {
+      build.onLoad({ filter: /\.(tsx|ts|jsx|js)$/ }, async (args) => {
+        if (args.path.includes("/node_modules/"))
+          return;
+        let source;
+        try {
+          source = await Bun.file(args.path).text();
+        } catch {
+          return;
+        }
+        const stubbed = transformUseClient(source, {
+          path: args.path,
+          workspaceRoot: options.workspaceRoot
+        });
+        if (stubbed === null)
+          return;
+        return { contents: stubbed, loader: loaderFor(args.path) };
+      });
+    }
+  };
+}
+function loaderFor(absPath) {
+  if (absPath.endsWith(".tsx"))
+    return "tsx";
+  if (absPath.endsWith(".jsx"))
+    return "jsx";
+  if (absPath.endsWith(".ts"))
+    return "ts";
+  return "js";
+}
+
+// pkgs/@akanjs/devkit/frontendBuild/pagesEntrySourceGenerator.ts
+import path7 from "path";
+class PagesEntrySourceGenerator {
+  #pageEntries;
+  constructor(pageEntries) {
+    this.#pageEntries = pageEntries;
+  }
+  static generate(pageEntries) {
+    return new PagesEntrySourceGenerator(pageEntries).generate();
+  }
+  generate() {
+    const lines = this.#pageEntries.map(({ key, moduleAbsPath }) => {
+      const specifier = PagesEntrySourceGenerator.#toImportSpecifier(moduleAbsPath);
+      return `  ${JSON.stringify(key)}: () => import(${JSON.stringify(specifier)}),`;
+    });
+    return `export const pages = {
+${lines.join(`
+`)}
+};
+`;
+  }
+  static async generateStatic(pageEntries) {
+    return await new PagesEntrySourceGenerator(pageEntries).generateStatic();
+  }
+  async generateStatic() {
+    const imports = this.#pageEntries.map(({ moduleAbsPath }, index) => {
+      const specifier = PagesEntrySourceGenerator.#toImportSpecifier(moduleAbsPath);
+      return `import * as page${index} from ${JSON.stringify(specifier)};`;
+    });
+    const entries = await Promise.all(this.#pageEntries.map(async ({ key, moduleAbsPath }, index) => {
+      const isAsyncDefault = await AsyncDefaultExportDetector.detect(moduleAbsPath);
+      return `  ${JSON.stringify(key)}: { loader: async () => page${index}, isAsyncDefault: ${isAsyncDefault} },`;
+    }));
+    return `${imports.join(`
+`)}
+export const pages = {
+${entries.join(`
+`)}
+};
+`;
+  }
+  static #toImportSpecifier(moduleAbsPath) {
+    return path7.resolve(moduleAbsPath).split(path7.sep).join("/");
+  }
+}
+
+// pkgs/@akanjs/devkit/frontendBuild/pagesBundleBuilder.ts
+var VIRTUAL_PAGES_ENTRY = "akan-pages-entry";
+
+class PagesBundleBuilder {
+  #app;
+  #command;
+  #pageEntries;
+  #started = Date.now();
+  constructor(app, command = "start", pageEntries) {
+    this.#app = app;
+    this.#command = command;
+    this.#pageEntries = pageEntries;
+  }
+  async build() {
+    const akanConfig = await this.#app.getConfig();
+    const resolvedEntries = this.#pageEntries ?? await resolveSsrPageEntriesForApp(this.#app, await this.#app.getPageKeys());
+    const entrySource = PagesEntrySourceGenerator.generate(resolvedEntries);
+    const workspaceRoot = this.#app.workspace.workspaceRoot;
+    const result = await Bun.build({
+      entrypoints: [VIRTUAL_PAGES_ENTRY],
+      outdir: `${this.#artifactDir}/server`,
+      target: "bun",
+      format: "esm",
+      splitting: this.#splitting,
+      minify: this.#command === "build",
+      naming: {
+        entry: "pages-[hash].[ext]",
+        chunk: "chunks/[name]-[hash].[ext]",
+        asset: "assets/[name]-[hash].[ext]"
+      },
+      define: this.#define(),
+      plugins: [
+        PagesBundleBuilder.createPagesEntryPlugin(entrySource),
+        PagesBundleBuilder.createCssStubPlugin(),
+        PagesBundleBuilder.createServerUseClientFetchPlugin(),
+        await createExternalizeFrameworkPlugin({ app: this.#app, extra: akanConfig.externalLibs }),
+        akanConfig.barrelImports.length > 0 ? await createBarrelImportsPlugin(this.#app, {
+          pipeAfter: (source, args) => transformUseClient(source, {
+            path: args.path,
+            workspaceRoot
+          })
+        }) : createUseClientBundlePlugin({ workspaceRoot })
+      ]
+    });
+    if (!result.success)
+      throw new AggregateError(result.logs, "[PagesBundleBuilder] Bun.build failed");
+    const entryArtifact = result.outputs.find((a) => a.kind === "entry-point");
+    if (!entryArtifact)
+      throw new Error("[PagesBundleBuilder] Bun.build emitted no entry-point artifact");
+    const bundlePath = path8.resolve(entryArtifact.path);
+    const buildId = Date.now();
+    const outputBytes = result.outputs.reduce((sum, output) => sum + output.size, 0);
+    const chunkCount = result.outputs.filter((output) => output.kind === "chunk").length;
+    this.#app.verbose(`[PagesBundleBuilder] ${path8.basename(bundlePath)} emitted in ${Date.now() - this.#started}ms splitting=${this.#splitting} entry=${entryArtifact.size} bytes outputs=${result.outputs.length} chunks=${chunkCount} total=${outputBytes} bytes`);
+    return {
+      bundlePath,
+      buildId,
+      splitting: this.#splitting,
+      entryBytes: entryArtifact.size,
+      outputBytes,
+      outputCount: result.outputs.length,
+      chunkCount
+    };
+  }
+  get #artifactDir() {
+    return `${this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath}/.akan/artifact`;
+  }
+  get #splitting() {
+    return process.env.AKAN_SERVER_PAGES_SPLITTING === "1";
+  }
+  #define() {
+    const nodeEnv = this.#command === "build" ? "production" : "development";
+    return {
+      "process.env.NODE_ENV": JSON.stringify(nodeEnv),
+      "process.env.AKAN_PUBLIC_RENDER_ENV": JSON.stringify("ssr"),
+      ...Object.fromEntries(Object.entries(this.#app.getPublicEnv()).map(([key, value]) => [`process.env.${key}`, JSON.stringify(value)]))
+    };
+  }
+  static createPagesEntryPlugin(source) {
+    return {
+      name: "akan-pages-entry",
+      setup(build) {
+        build.onResolve({ filter: /^akan-pages-entry$/ }, () => ({
+          path: VIRTUAL_PAGES_ENTRY,
+          namespace: "akan-virtual"
+        }));
+        build.onLoad({ filter: /^akan-pages-entry$/, namespace: "akan-virtual" }, () => ({
+          contents: source,
+          loader: "tsx"
+        }));
+      }
+    };
+  }
+  static createCssStubPlugin() {
+    return {
+      name: "akan-css-stub",
+      setup(build) {
+        build.onLoad({ filter: /\.css$/ }, () => ({
+          contents: "",
+          loader: "js"
+        }));
+      }
+    };
+  }
+  static createServerUseClientFetchPlugin() {
+    return {
+      name: "akan-server-use-client-fetch",
+      setup(build) {
+        build.onLoad({ filter: /[/\\]lib[/\\]useClient\.(ts|tsx|js|jsx)$/ }, async (args) => {
+          const source = await Bun.file(args.path).text();
+          const transformed = PagesBundleBuilder.transformServerUseClientFetchSource(source);
+          if (transformed === source)
+            return;
+          return { contents: transformed, loader: loaderFor2(args.path) };
+        });
+      }
+    };
+  }
+  static transformServerUseClientFetchSource(source) {
+    if (!source.includes(`with { type: "macro" }`) || !source.includes("FetchClient.build"))
+      return source;
+    return source.replace(/import\s+\{\s*getSerializedSignal\s*\}\s+from\s+["']\.\/sig["']\s+with\s+\{\s*type\s*:\s*["']macro["']\s*\};/, `import { fetch as serverFetch } from "./sig";`).replace(/const\s+fetchProto\s*=\s*FetchClient\.build<[^;]+;/, "const fetchProto = FetchClient.build<typeof signal>(cnst, serverFetch.serializedSignal, { Err: pageProto.Err, base: serverFetch });");
+  }
+}
+function loaderFor2(absPath) {
+  if (absPath.endsWith(".tsx"))
+    return "tsx";
+  if (absPath.endsWith(".jsx"))
+    return "jsx";
+  if (absPath.endsWith(".ts"))
+    return "ts";
+  return "js";
+}
+
+// pkgs/@akanjs/devkit/frontendBuild/csrArtifactBuilder.ts
+import { mkdir, rm, unlink } from "fs/promises";
+import path9 from "path";
+class CsrArtifactBuilder {
+  #app;
+  #command;
+  #lang;
+  constructor(app, command = "start", lang = "en") {
+    this.#app = app;
+    this.#command = command;
+    this.#lang = lang;
+  }
+  async build() {
+    const pageKeys = await this.#app.getPageKeys();
+    if (pageKeys.length === 0) {
+      this.#app.log(`[cli] no route files under ${this.#app.cwdPath}/page \u2014 skipping CSR build`);
+      return null;
+    }
+    const pageEntries = await resolveSsrPageEntriesForApp(this.#app, pageKeys);
+    const akanConfig = await this.#app.getConfig();
+    const cssAssets = await this.#loadCssAssets();
+    const basePaths = [...akanConfig.basePaths];
+    const htmlBasePaths = basePaths.length > 0 ? basePaths : [""];
+    await rm(this.#outputDir, { recursive: true, force: true });
+    await mkdir(this.#generatedDir, { recursive: true });
+    const generatedFiles = Object.fromEntries((await Promise.all(htmlBasePaths.map(async (basePath) => [
+      this.#createHtmlFile(basePath),
+      await this.#createEntryFile(basePath, CsrArtifactBuilder.pageEntriesForBasePath(pageEntries, basePath, basePaths))
+    ]))).flat());
+    const result = await Bun.build({
+      target: "browser",
+      entrypoints: htmlBasePaths.map((basePath) => this.#generatedPath(CsrArtifactBuilder.htmlFilename(basePath))),
+      files: generatedFiles,
+      root: this.#generatedDir,
+      outdir: this.#outputDir,
+      splitting: false,
+      minify: true,
+      env: "AKAN_PUBLIC_*",
+      define: this.#define(),
+      optimizeImports: akanConfig.optimizeImports,
+      plugins: [PagesBundleBuilder.createCssStubPlugin()]
+    });
+    if (!result.success) {
+      const logs = result.logs.map((log) => log.message).join(`
+`);
+      throw new Error(`[csr-build] failed${logs ? `
+${logs}` : ""}`);
+    }
+    await this.#inlineCsrArtifacts(cssAssets);
+    this.#app.verbose(`[csr-build] output -> ${this.#outputDir}`);
+    return { outputDir: this.#outputDir };
+  }
+  static pageEntriesForBasePath(pageEntries, basePath, basePaths) {
+    return pageEntries.filter((entry) => {
+      const entryBasePath = getPageKeyBasePath(entry.key, basePaths);
+      return entryBasePath === null || entryBasePath === basePath;
+    });
+  }
+  static htmlFilename(basePath) {
+    return `${basePath || "index"}.html`;
+  }
+  static entryFilename(basePath) {
+    return `${basePath || "index"}.csr.tsx`;
+  }
+  static basePathOfHtml(htmlPath) {
+    const name = path9.basename(htmlPath, ".html");
+    return name === "index" ? "" : name;
+  }
+  get #outputDir() {
+    return path9.join(this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath, this.#command === "build" ? "csr" : ".akan/artifact/csr");
+  }
+  get #generatedDir() {
+    return path9.join(this.#app.cwdPath, ".akan/generated/csr");
+  }
+  get #artifactDir() {
+    return path9.join(this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath, ".akan/artifact");
+  }
+  #generatedPath(filename) {
+    return path9.join(this.#generatedDir, filename);
+  }
+  #define() {
+    const nodeEnv = this.#command === "build" ? "production" : "development";
+    return {
+      "process.env.NODE_ENV": JSON.stringify(nodeEnv),
+      "process.env.AKAN_PUBLIC_RENDER_ENV": JSON.stringify("csr"),
+      ...Object.fromEntries(Object.entries(this.#app.getPublicEnv()).map(([key, value]) => [`process.env.${key}`, JSON.stringify(value)]))
+    };
+  }
+  async#createEntryFile(basePath, pageEntries) {
+    return [
+      this.#generatedPath(CsrArtifactBuilder.entryFilename(basePath)),
+      `import { bootCsr } from "akanjs/webkit";
+${await PagesEntrySourceGenerator.generateStatic(pageEntries)}
+void bootCsr(pages);
+`
+    ];
+  }
+  #createHtmlFile(basePath) {
+    return [
+      this.#generatedPath(CsrArtifactBuilder.htmlFilename(basePath)),
+      `<!doctype html>
+<html lang="${this.#lang}">
+  <head>
+    <meta charset="utf-8" />
+    <title>${this.#app.name}</title>
+    <base href="/" />
+    <meta name="viewport" content="width=device-width, initial-scale=1" />
+  </head>
+  <body>
+    <div id="root"></div>
+    <script type="module" src="./${CsrArtifactBuilder.entryFilename(basePath)}"></script>
+  </body>
+</html>
+  `
+    ];
+  }
+  async#loadCssAssets() {
+    const artifactFile = Bun.file(path9.join(this.#artifactDir, "base-artifact.json"));
+    if (!await artifactFile.exists())
+      return {};
+    const artifact = await artifactFile.json();
+    return artifact.cssAssets ?? {};
+  }
+  async#inlineCsrArtifacts(cssAssets) {
+    const jsFiles = new Set;
+    for (const htmlPath of await this.#htmlOutputPaths()) {
+      const htmlFile = Bun.file(htmlPath);
+      if (!await htmlFile.exists())
+        continue;
+      const basePath = CsrArtifactBuilder.basePathOfHtml(htmlPath);
+      const cssAsset = cssAssets[basePath];
+      if (!cssAsset) {
+        this.#app.logger.warn(`[csr-build] base-artifact.json has no compiled stylesheet for ${basePath || "root"}; ${path9.basename(htmlPath)} ships without CSS`);
+      }
+      const inlined = await this.#inlineHtmlAssets(await htmlFile.text(), htmlPath, cssAsset);
+      for (const filePath of inlined.jsFiles)
+        jsFiles.add(filePath);
+      await Bun.write(htmlPath, inlined.html);
+    }
+    for (const filePath of jsFiles)
+      await unlink(filePath).catch(() => {
+        return;
+      });
+    const remainingAssets = await this.#listOutputFiles((filePath) => filePath.endsWith(".js") || filePath.endsWith(".css"));
+    if (remainingAssets.length > 0) {
+      throw new Error(`[csr-build] expected single-file HTML, but CSR assets remain:
+${remainingAssets.join(`
+`)}`);
+    }
+  }
+  async#inlineHtmlAssets(html, htmlPath, cssAsset) {
+    let next = html;
+    if (cssAsset) {
+      const css = await Bun.file(path9.join(this.#artifactDir, cssAsset.cssRelPath)).text();
+      next = CsrArtifactBuilder.injectBeforeHeadEnd(next, CsrArtifactBuilder.createInlineStyle(css));
+    }
+    const jsFiles = [];
+    next = await CsrArtifactBuilder.replaceModuleScriptSrc(next, async (src) => {
+      const jsPath = CsrArtifactBuilder.resolveHtmlAssetPath(htmlPath, src);
+      jsFiles.push(jsPath);
+      return await Bun.file(jsPath).text();
+    });
+    return { html: next, jsFiles };
   }
-  #resolveSourceImport(id, fromBase, resolvePackage) {
-    const cacheKey = `${fromBase}\x00${id}`;
-    let cached = this.#resolvedSpecifierCache.get(cacheKey);
-    if (cached)
-      return cached;
-    cached = this.#resolveSourceImportUncached(id, fromBase, resolvePackage);
-    this.#resolvedSpecifierCache.set(cacheKey, cached);
-    return cached;
+  async#htmlOutputPaths() {
+    return await this.#listOutputFiles((filePath) => filePath.endsWith(".html"));
   }
-  async#resolveSourceImportUncached(id, fromBase, resolvePackage) {
-    if (id.startsWith(".") || id.startsWith("/")) {
-      const abs = id.startsWith("/") ? id : path8.resolve(fromBase, id);
-      return this.#resolveSourceFileCandidate(abs);
-    }
-    const pkg = await resolvePackage(id);
-    if (pkg)
-      return pkg.entryFile;
-    for (const resolve of [() => resolveSourceWithBun(id, fromBase), () => resolveSourceWithRequire(id, fromBase)]) {
-      const resolved = await resolve();
-      if (resolved)
-        return resolved;
+  async#listOutputFiles(predicate) {
+    const glob = new Bun.Glob("**/*");
+    const files = [];
+    for await (const filePath of glob.scan({ cwd: this.#outputDir, absolute: true })) {
+      if (predicate(filePath))
+        files.push(filePath);
     }
-    return null;
+    return files.sort();
   }
-  async#scanCandidates(sourcePaths, dirs) {
-    const candidates = new Set;
-    const glob = new Bun.Glob("**/*.{tsx,ts,jsx,js,html}");
-    const files = new Set(sourcePaths);
-    await Promise.all(dirs.map(async (dir) => {
-      for await (const file of glob.scan({ cwd: dir, absolute: true })) {
-        if (isIgnoredNodeModuleSource(file))
-          continue;
-        files.add(file);
-      }
-    }));
-    const cache = await new CssCandidateCache(this.#candidateCachePath).load();
-    await Promise.all([...files].map(async (file) => {
-      for (const candidate of await cache.candidatesFor(file))
-        candidates.add(candidate);
-    }));
-    await cache.save(files);
-    this.#logger.verbose(`css candidate cache reused=${cache.reused} rescanned=${cache.rescanned}`);
-    return [...candidates];
+  static injectBeforeHeadEnd(html, snippet) {
+    const scannable = CsrArtifactBuilder.blankEmbeddedContent(html);
+    const headEnd = scannable.search(/<\/head\s*>/i);
+    if (headEnd !== -1)
+      return `${html.slice(0, headEnd)}${snippet}
+${html.slice(headEnd)}`;
+    const bodyStart = scannable.search(/<body(?:\s|>)/i);
+    if (bodyStart !== -1)
+      return `${html.slice(0, bodyStart)}${snippet}
+${html.slice(bodyStart)}`;
+    return `${html}
+${snippet}`;
+  }
+  static blankEmbeddedContent(html) {
+    return html.replace(/<script\b[^>]*>[\s\S]*?<\/script\s*>|<style\b[^>]*>[\s\S]*?<\/style\s*>|<!--[\s\S]*?-->/gi, (match) => " ".repeat(match.length));
   }
-}
-function resolveSourceWithBun(id, fromBase) {
-  try {
-    const resolved = Bun.resolveSync(id, fromBase);
-    return isSourceFile(resolved) ? resolved : null;
-  } catch {
-    return null;
+  static createInlineStyle(css) {
+    return `<style data-akan-css="active">
+${css.replace(/<\/style/gi, "<\\/style")}
+</style>`;
   }
-}
-function resolveSourceWithRequire(id, fromBase) {
-  try {
-    const resolved = __require.resolve(id, { paths: [fromBase] });
-    return isSourceFile(resolved) ? resolved : null;
-  } catch {
-    return null;
+  static async replaceModuleScriptSrc(html, loadScript) {
+    const scriptRe = /<script\b(?=[^>]*\btype=["']module["'])(?=[^>]*\bsrc=["']([^"']+)["'])[^>]*>\s*<\/script>/gi;
+    let result = "";
+    let lastIndex = 0;
+    let matched = false;
+    for (const match of html.matchAll(scriptRe)) {
+      const full = match[0];
+      const src = match[1];
+      if (match.index === undefined || !src)
+        continue;
+      matched = true;
+      result += html.slice(lastIndex, match.index);
+      result += `<script type="module">
+${CsrArtifactBuilder.escapeInlineScript(await loadScript(src))}
+</script>`;
+      lastIndex = match.index + full.length;
+    }
+    if (!matched)
+      return html;
+    return result + html.slice(lastIndex);
+  }
+  static escapeInlineScript(source) {
+    return source.replace(/<\/script/gi, "<\\/script");
+  }
+  static resolveHtmlAssetPath(htmlPath, src) {
+    if (/^[a-z][a-z0-9+.-]*:/i.test(src) || src.startsWith("//")) {
+      throw new Error(`[csr-build] cannot inline external script: ${src}`);
+    }
+    const normalized = src.startsWith("/") ? src.slice(1) : src;
+    return path9.resolve(path9.dirname(htmlPath), normalized);
   }
-}
-function isSourceFile(filePath) {
-  return SOURCE_EXTS.includes(path8.extname(filePath));
-}
-function isIgnoredNodeModuleSource(filePath) {
-  return NODE_MODULES_RE.test(filePath) && !AKANJS_NODE_MODULE_RE.test(filePath);
-}
-function getPageKeyBasePath(pageKey, basePaths) {
-  const normalized = pageKey.split(path8.sep).join("/").replace(/^\.\//, "");
-  const segments = normalized.split("/");
-  const firstPublicSegment = segments.find((segment) => segment !== "[lang]" && !/^\(.+\)$/.test(segment));
-  return firstPublicSegment && basePaths.includes(firstPublicSegment) ? firstPublicSegment : null;
 }
 
 // pkgs/@akanjs/devkit/frontendBuild/fontOptimizer.ts
-import { mkdir as mkdir3, stat as stat2 } from "fs/promises";
-import path9 from "path";
-import ts2 from "typescript";
+import { mkdir as mkdir2, stat as stat2 } from "fs/promises";
+import path10 from "path";
+import ts from "typescript";
 var FONT_URL_PREFIX = "/_akan/fonts";
 var DEFAULT_FONT_SUBSETS = ["latin"];
 
@@ -1292,11 +1365,11 @@ class FontOptimizer {
   #cssParts = [];
   #woff2Ready = null;
   static #ksX1001Text = null;
-  static #cacheVersion = 1;
+  static #cacheVersion = 2;
   constructor(app, command = "start") {
     this.#app = app;
     this.#command = command;
-    this.#artifactRoot = path9.join(command === "build" ? app.dist.cwdPath : app.cwdPath, ".akan/artifact");
+    this.#artifactRoot = path10.join(command === "build" ? app.dist.cwdPath : app.cwdPath, ".akan/artifact");
   }
   async optimize() {
     const fonts = await this.discoverFonts();
@@ -1321,7 +1394,7 @@ class FontOptimizer {
     return result;
   }
   get #cachePath() {
-    return path9.join(this.#artifactRoot, "fontCache.json");
+    return path10.join(this.#artifactRoot, "fontCache.json");
   }
   async#buildCacheKey(fonts) {
     const sources = [];
@@ -1336,16 +1409,19 @@ class FontOptimizer {
         sources.push({ optimizedSrc: face.optimizedSrc, ...stamp });
       }
       for (const filePath of font.subsetFiles ?? []) {
-        const abs = path9.isAbsolute(filePath) ? filePath : path9.join(this.#app.cwdPath, filePath);
+        const abs = path10.isAbsolute(filePath) ? filePath : path10.join(this.#app.cwdPath, filePath);
         const stamp = await this.#fileStamp(abs);
         if (!stamp)
           return null;
         sources.push({ subsetFile: filePath, ...stamp });
       }
       if (this.#getFontSubsets(font).includes("auto"))
-        sources.push({ autoSubsetText: this.#hashFontConfig(await this.#collectAutoSubsetText()) });
+        sources.push({ autoSubsetText: this.#cacheDigest(await this.#collectAutoSubsetText()) });
     }
-    return this.#hashFontConfig({ version: FontOptimizer.#cacheVersion, fonts, sources });
+    return this.#cacheDigest({ version: FontOptimizer.#cacheVersion, fonts, sources });
+  }
+  #cacheDigest(value) {
+    return new Bun.CryptoHasher("sha256").update(this.#stableStringify(value)).digest("hex");
   }
   async#fileStamp(filePath) {
     try {
@@ -1359,7 +1435,7 @@ class FontOptimizer {
     const cache = await Bun.file(this.#cachePath).json().catch(() => null);
     if (cache?.version !== FontOptimizer.#cacheVersion || cache.key !== key)
       return null;
-    const files = cache.files.map((relativePath) => path9.join(this.#artifactRoot, relativePath));
+    const files = cache.files.map((relativePath) => path10.join(this.#artifactRoot, relativePath));
     for (const filePath of files) {
       if (!await Bun.file(filePath).exists())
         return null;
@@ -1371,7 +1447,7 @@ class FontOptimizer {
       version: FontOptimizer.#cacheVersion,
       key,
       css: result.css,
-      files: result.files.map((filePath) => path9.relative(this.#artifactRoot, filePath))
+      files: result.files.map((filePath) => path10.relative(this.#artifactRoot, filePath))
     };
     await Bun.write(this.#cachePath, JSON.stringify(cache));
   }
@@ -1379,7 +1455,7 @@ class FontOptimizer {
     const pageKeys = await this.#app.getPageKeys();
     const fonts = [];
     await Promise.all(pageKeys.map(async (key) => {
-      const filePath = path9.resolve(this.#app.cwdPath, "page", key);
+      const filePath = path10.resolve(this.#app.cwdPath, "page", key);
       const file = Bun.file(filePath);
       if (!await file.exists())
         return;
@@ -1398,8 +1474,8 @@ class FontOptimizer {
         this.#app.logger.warn(`[font] source not found: ${face.src}`);
         continue;
       }
-      const outputPath = path9.join(this.#artifactRoot, face.optimizedSrc.replace(/^\/_akan\//, ""));
-      await mkdir3(path9.dirname(outputPath), { recursive: true });
+      const outputPath = path10.join(this.#artifactRoot, face.optimizedSrc.replace(/^\/_akan\//, ""));
+      await mkdir2(path10.dirname(outputPath), { recursive: true });
       const sourceBuffer = Buffer.from(await Bun.file(sourcePath).arrayBuffer());
       const outputBuffer = await this.#buildFontBuffer(font, sourceBuffer, sourcePath);
       await Bun.write(outputPath, outputBuffer);
@@ -1413,17 +1489,17 @@ class FontOptimizer {
       this.#cssParts.push(...faceCss, this.#buildRootVariableRule(font));
   }
   #extractFontsExport(source, filePath) {
-    const sourceFile = ts2.createSourceFile(filePath, source, ts2.ScriptTarget.Latest, true, ts2.ScriptKind.TSX);
+    const sourceFile = ts.createSourceFile(filePath, source, ts.ScriptTarget.Latest, true, ts.ScriptKind.TSX);
     const fonts = [];
     for (const statement of sourceFile.statements) {
-      if (!ts2.isVariableStatement(statement))
+      if (!ts.isVariableStatement(statement))
         continue;
-      const modifiers = ts2.canHaveModifiers(statement) ? ts2.getModifiers(statement) : undefined;
-      const isExported = modifiers?.some((modifier) => modifier.kind === ts2.SyntaxKind.ExportKeyword) ?? false;
+      const modifiers = ts.canHaveModifiers(statement) ? ts.getModifiers(statement) : undefined;
+      const isExported = modifiers?.some((modifier) => modifier.kind === ts.SyntaxKind.ExportKeyword) ?? false;
       if (!isExported)
         continue;
       for (const declaration of statement.declarationList.declarations) {
-        if (!ts2.isIdentifier(declaration.name) || declaration.name.text !== "fonts")
+        if (!ts.isIdentifier(declaration.name) || declaration.name.text !== "fonts")
           continue;
         const value = declaration.initializer ? this.#literalToValue(declaration.initializer) : null;
         if (Array.isArray(value)) {
@@ -1434,20 +1510,20 @@ class FontOptimizer {
     return fonts;
   }
   #literalToValue(node) {
-    if (ts2.isStringLiteralLike(node))
+    if (ts.isStringLiteralLike(node))
       return node.text;
-    if (ts2.isNumericLiteral(node))
+    if (ts.isNumericLiteral(node))
       return Number(node.text);
-    if (node.kind === ts2.SyntaxKind.TrueKeyword)
+    if (node.kind === ts.SyntaxKind.TrueKeyword)
       return true;
-    if (node.kind === ts2.SyntaxKind.FalseKeyword)
+    if (node.kind === ts.SyntaxKind.FalseKeyword)
       return false;
-    if (ts2.isArrayLiteralExpression(node))
+    if (ts.isArrayLiteralExpression(node))
       return node.elements.map((element) => this.#literalToValue(element));
-    if (ts2.isObjectLiteralExpression(node)) {
+    if (ts.isObjectLiteralExpression(node)) {
       const obj = {};
       for (const prop of node.properties) {
-        if (!ts2.isPropertyAssignment(prop))
+        if (!ts.isPropertyAssignment(prop))
           continue;
         const name = this.#getPropertyName(prop.name);
         if (!name)
@@ -1456,13 +1532,13 @@ class FontOptimizer {
       }
       return obj;
     }
-    if (ts2.isAsExpression(node) || ts2.isSatisfiesExpression(node) || ts2.isParenthesizedExpression(node)) {
+    if (ts.isAsExpression(node) || ts.isSatisfiesExpression(node) || ts.isParenthesizedExpression(node)) {
       return this.#literalToValue(node.expression);
     }
     return;
   }
   #getPropertyName(name) {
-    if (ts2.isIdentifier(name) || ts2.isStringLiteral(name) || ts2.isNumericLiteral(name))
+    if (ts.isIdentifier(name) || ts.isStringLiteral(name) || ts.isNumericLiteral(name))
       return name.text;
     return null;
   }
@@ -1546,8 +1622,8 @@ class FontOptimizer {
       return null;
     const rel = src.replace(/^\//, "");
     const candidates = [
-      this.#command === "build" ? path9.join(this.#app.dist.cwdPath, "public", rel) : null,
-      path9.join(this.#app.cwdPath, "public", rel),
+      this.#command === "build" ? path10.join(this.#app.dist.cwdPath, "public", rel) : null,
+      path10.join(this.#app.cwdPath, "public", rel),
       this.#resolveWorkspacePublicPath(rel)
     ].filter(Boolean);
     for (const candidate of candidates) {
@@ -1582,7 +1658,7 @@ class FontOptimizer {
       return "woff2";
     if (signature === "OTTO")
       return "otf";
-    const ext = path9.extname(sourcePath).slice(1).toLowerCase();
+    const ext = path10.extname(sourcePath).slice(1).toLowerCase();
     if (ext === "otf" || ext === "woff" || ext === "woff2")
       return ext;
     return "ttf";
@@ -1591,7 +1667,7 @@ class FontOptimizer {
     const [root, dep, ...rest] = rel.split("/");
     if (root !== "libs" || !dep || rest.length === 0)
       return null;
-    return path9.join(this.#app.workspace.workspaceRoot, "libs", dep, "public", ...rest);
+    return path10.join(this.#app.workspace.workspaceRoot, "libs", dep, "public", ...rest);
   }
   async#getSubsetText(font) {
     const parts = new Set;
@@ -1601,7 +1677,7 @@ class FontOptimizer {
     if (font.subsetText)
       parts.add(font.subsetText);
     for (const filePath of font.subsetFiles ?? []) {
-      const abs = path9.isAbsolute(filePath) ? filePath : path9.join(this.#app.cwdPath, filePath);
+      const abs = path10.isAbsolute(filePath) ? filePath : path10.join(this.#app.cwdPath, filePath);
       const file = Bun.file(abs);
       if (await file.exists())
         parts.add(await file.text());
@@ -1621,16 +1697,19 @@ class FontOptimizer {
   }
   async#collectAutoSubsetText() {
     const libPageRoots = (await this.#app.getPageRoots()).filter((root) => root.keyPrefix).map((root) => root.dir);
-    const roots = [...["page", "ui"].map((dir) => path9.join(this.#app.cwdPath, dir)), ...libPageRoots];
+    const roots = [...["page", "ui", "lib"].map((dir) => path10.join(this.#app.cwdPath, dir)), ...libPageRoots];
     const glob = new Bun.Glob("**/*.{ts,tsx,js,jsx,html,md}");
     const parts = [];
-    await Promise.all(roots.map(async (root) => {
-      if (!await stat2(root).then((entry) => entry.isDirectory(), () => false))
-        return;
-      for await (const filePath of glob.scan({ cwd: root, absolute: true })) {
+    for (const root of [...new Set(roots)].sort()) {
+      const isDir = await stat2(root).then((entry) => entry.isDirectory(), () => false);
+      if (!isDir)
+        continue;
+      const filePaths = [];
+      for await (const filePath of glob.scan({ cwd: root, absolute: true }))
+        filePaths.push(filePath);
+      for (const filePath of filePaths.sort())
         parts.push(await Bun.file(filePath).text());
-      }
-    }));
+    }
     return parts.join("");
   }
   #rangeText(start, end) {
@@ -1701,358 +1780,255 @@ ${declarations.map(([prop, value]) => `  ${prop}: ${value};`).join(`
         name: this.#getFontFallbackName(font),
         font: fallback,
         metrics: fallbackMetrics,
-        "font-weight": String(face.weight),
-        "font-style": face.style
-      }));
-    }
-    return css.join("");
-  }
-  #buildRootVariableRule(font) {
-    return `:root { ${this.#getFontVariableName(font)}: ${this.#quote(font.name)}, ${this.#quote(this.#getFontFallbackName(font))}; }`;
-  }
-  #buildFontUtilityRules(fonts) {
-    const rules = [];
-    const seen = new Set;
-    for (const font of fonts) {
-      const className = font.className || `font-${font.name}`;
-      const selector = `.${this.#escapeCssClassName(className)}`;
-      const rule = `${selector} { font-family: var(${this.#getFontVariableName(font)}); }`;
-      if (seen.has(rule))
-        continue;
-      seen.add(rule);
-      rules.push(rule);
-    }
-    return rules.join(`
-`);
-  }
-  #escapeCssClassName(value) {
-    return value.replace(/^-?\d|[^a-zA-Z0-9_-]/g, (part) => [...part].map((char) => `\\${char.codePointAt(0)?.toString(16)} `).join(""));
-  }
-  #toDeclarationEntries(declarations = []) {
-    return declarations.map((declaration) => [declaration.prop, declaration.value]);
-  }
-  #quote(value) {
-    return JSON.stringify(value);
-  }
-}
-
-// pkgs/@akanjs/devkit/frontendBuild/pagesBundleBuilder.ts
-import path11 from "path";
-
-// pkgs/@akanjs/devkit/transforms/externalizeFrameworkPlugin.ts
-import path10 from "path";
-var DEFAULT_INCLUDE = ["akanjs/", "@apps/", "@libs/"];
-var DEFAULT_EXCLUDE_EXACT = new Set(["akanjs/webkit", "@akanjs/cli", "@akanjs/devkit"]);
-var DEFAULT_EXCLUDE_PREFIX = ["@akanjs/cli/", "@akanjs/devkit/"];
-var OPTIONAL_BACKEND_EXTERNAL_EXACT = new Set([
-  "@libsql/client",
-  "bullmq",
-  "croner",
-  "ioredis",
-  "postgres",
-  "protobufjs"
-]);
-var RUNTIME_EXTERNAL_EXACT = new Set([
-  "react",
-  "react-dom",
-  "react/jsx-runtime",
-  "react/jsx-dev-runtime",
-  "react-server-dom-webpack",
-  "react-server-dom-webpack/server.node",
-  "react-server-dom-webpack/client.node",
-  "react-server-dom-webpack/client.browser"
-]);
-var RUNTIME_EXTERNAL_PREFIX = ["react-dom/", "react-server-dom-webpack/"];
-var CANDIDATE_EXTS = [".tsx", ".ts", ".jsx", ".js", ".mjs", ".cjs"];
-async function createExternalizeFrameworkPlugin(options) {
-  const tsconfig = await options.app.getTsConfig();
-  const includePrefixes = options.include ?? DEFAULT_INCLUDE;
-  const extraExact = new Set(options.extra ?? []);
-  const workspaceRoot = options.app.workspace.workspaceRoot;
-  const tsconfigPaths = tsconfig.compilerOptions.paths ?? {};
-  const rootEntries = Object.entries(tsconfigPaths).filter(([k]) => !k.endsWith("/*")).map(([k, v]) => ({ pkg: k, entryFile: v[0] ?? null })).filter((e) => e.entryFile !== null);
-  const wildcardEntries = Object.entries(tsconfigPaths).filter(([k]) => k.endsWith("/*")).map(([k, v]) => ({ prefix: k.slice(0, -1), replacements: v })).sort((a, b) => b.prefix.length - a.prefix.length);
-  async function resolveWorkspaceSubpath(spec) {
-    if (!workspaceRoot)
-      return null;
-    for (const { prefix, replacements } of wildcardEntries) {
-      if (!spec.startsWith(prefix))
-        continue;
-      const suffix = spec.slice(prefix.length);
-      for (const repl of replacements) {
-        const replPath = repl?.endsWith("/*") ? repl.slice(0, -1) : repl ?? "";
-        if (!replPath)
-          continue;
-        const candidate = path10.resolve(workspaceRoot, replPath + suffix);
-        const hit = await firstExisting(candidate);
-        if (hit)
-          return hit;
-      }
-    }
-    for (const { pkg, entryFile } of rootEntries) {
-      if (spec !== pkg && !spec.startsWith(`${pkg}/`))
-        continue;
-      if (spec === pkg)
-        continue;
-      const suffix = spec.slice(pkg.length + 1);
-      const pkgDir = path10.dirname(path10.resolve(workspaceRoot, entryFile));
-      const candidate = path10.join(pkgDir, suffix);
-      const hit = await firstExisting(candidate);
-      if (hit)
-        return hit;
-    }
-    return null;
-  }
-  return {
-    name: "akan-externalize-framework",
-    setup(build) {
-      build.onResolve({ filter: /.*/ }, async (args) => {
-        const spec = args.path;
-        if (spec === "." || spec === ".." || spec.startsWith("./") || spec.startsWith("../") || spec.startsWith("/"))
-          return;
-        if (extraExact.has(spec) || DEFAULT_EXCLUDE_EXACT.has(spec))
-          return { path: spec, external: true };
-        for (const prefix of DEFAULT_EXCLUDE_PREFIX) {
-          if (spec.startsWith(prefix))
-            return { path: spec, external: true };
-        }
-        if (OPTIONAL_BACKEND_EXTERNAL_EXACT.has(spec))
-          return { path: spec, external: true };
-        if (RUNTIME_EXTERNAL_EXACT.has(spec))
-          return { path: spec, external: true };
-        for (const prefix of RUNTIME_EXTERNAL_PREFIX) {
-          if (spec.startsWith(prefix))
-            return { path: spec, external: true };
-        }
-        for (const prefix of includePrefixes) {
-          if (!spec.startsWith(prefix))
-            continue;
-          const resolved = await resolveWorkspaceSubpath(spec);
-          if (resolved)
-            return { path: resolved };
-          return;
-        }
-        return;
-      });
+        "font-weight": String(face.weight),
+        "font-style": face.style
+      }));
     }
-  };
-}
-async function firstExisting(basePath) {
-  if (await Bun.file(basePath).exists())
-    return basePath;
-  for (const ext of CANDIDATE_EXTS) {
-    const candidate = `${basePath}${ext}`;
-    if (await Bun.file(candidate).exists())
-      return candidate;
+    return css.join("");
   }
-  for (const ext of CANDIDATE_EXTS) {
-    const candidate = path10.join(basePath, `index${ext}`);
-    if (await Bun.file(candidate).exists())
-      return candidate;
+  #buildRootVariableRule(font) {
+    return `:root { ${this.#getFontVariableName(font)}: ${this.#quote(font.name)}, ${this.#quote(this.#getFontFallbackName(font))}; }`;
   }
-  return null;
-}
-
-// pkgs/@akanjs/devkit/transforms/useClientBundlePlugin.ts
-function createUseClientBundlePlugin(options = {}) {
-  return {
-    name: "akan-use-client-bundle",
-    setup(build) {
-      build.onLoad({ filter: /\.(tsx|ts|jsx|js)$/ }, async (args) => {
-        if (args.path.includes("/node_modules/"))
-          return;
-        let source;
-        try {
-          source = await Bun.file(args.path).text();
-        } catch {
-          return;
-        }
-        const stubbed = transformUseClient(source, {
-          path: args.path,
-          workspaceRoot: options.workspaceRoot
-        });
-        if (stubbed === null)
-          return;
-        return { contents: stubbed, loader: loaderFor(args.path) };
-      });
+  #buildFontUtilityRules(fonts) {
+    const rules = [];
+    const seen = new Set;
+    for (const font of fonts) {
+      const className = font.className || `font-${font.name}`;
+      const selector = `.${this.#escapeCssClassName(className)}`;
+      const rule = `${selector} { font-family: var(${this.#getFontVariableName(font)}); }`;
+      if (seen.has(rule))
+        continue;
+      seen.add(rule);
+      rules.push(rule);
     }
-  };
-}
-function loaderFor(absPath) {
-  if (absPath.endsWith(".tsx"))
-    return "tsx";
-  if (absPath.endsWith(".jsx"))
-    return "jsx";
-  if (absPath.endsWith(".ts"))
-    return "ts";
-  return "js";
+    return rules.join(`
+`);
+  }
+  #escapeCssClassName(value) {
+    return value.replace(/^-?\d|[^a-zA-Z0-9_-]/g, (part) => [...part].map((char) => `\\${char.codePointAt(0)?.toString(16)} `).join(""));
+  }
+  #toDeclarationEntries(declarations = []) {
+    return declarations.map((declaration) => [declaration.prop, declaration.value]);
+  }
+  #quote(value) {
+    return JSON.stringify(value);
+  }
 }
 
-// pkgs/@akanjs/devkit/frontendBuild/pagesBundleBuilder.ts
-var VIRTUAL_PAGES_ENTRY = "akan-pages-entry";
+// pkgs/@akanjs/devkit/frontendBuild/fontPruner.ts
+import { rm as rm2, rmdir, stat as stat3 } from "fs/promises";
+import path11 from "path";
+import { isFontOptimizationEnabled } from "akanjs/client";
+var FONT_GLOB = "**/*.{woff2,woff,ttf,otf,ttc,eot}";
+var REFERRER_GLOB = "**/*.{css,js,mjs,cjs,json,html,htm,svg,xml,webmanifest}";
 
-class PagesBundleBuilder {
+class FontPruner {
   #app;
-  #command;
-  #pageEntries;
-  #started = Date.now();
-  constructor(app, command = "start", pageEntries) {
+  #keepGlobs;
+  #publicRoot;
+  #artifactRoot;
+  constructor(app, { keepFonts = [] } = {}) {
     this.#app = app;
-    this.#command = command;
-    this.#pageEntries = pageEntries;
-  }
-  async build() {
-    const akanConfig = await this.#app.getConfig();
-    const resolvedEntries = this.#pageEntries ?? await resolveSsrPageEntriesForApp(this.#app, await this.#app.getPageKeys());
-    const entrySource = PagesEntrySourceGenerator.generate(resolvedEntries);
-    const workspaceRoot = this.#app.workspace.workspaceRoot;
-    const result = await Bun.build({
-      entrypoints: [VIRTUAL_PAGES_ENTRY],
-      outdir: `${this.#artifactDir}/server`,
-      target: "bun",
-      format: "esm",
-      splitting: this.#splitting,
-      minify: this.#command === "build",
-      naming: {
-        entry: "pages-[hash].[ext]",
-        chunk: "chunks/[name]-[hash].[ext]",
-        asset: "assets/[name]-[hash].[ext]"
-      },
-      define: this.#define(),
-      plugins: [
-        PagesBundleBuilder.createPagesEntryPlugin(entrySource),
-        PagesBundleBuilder.createServerCssStubPlugin(),
-        PagesBundleBuilder.createServerUseClientFetchPlugin(),
-        await createExternalizeFrameworkPlugin({ app: this.#app, extra: akanConfig.externalLibs }),
-        akanConfig.barrelImports.length > 0 ? await createBarrelImportsPlugin(this.#app, {
-          pipeAfter: (source, args) => transformUseClient(source, {
-            path: args.path,
-            workspaceRoot
-          })
-        }) : createUseClientBundlePlugin({ workspaceRoot })
-      ]
-    });
-    if (!result.success)
-      throw new AggregateError(result.logs, "[PagesBundleBuilder] Bun.build failed");
-    const entryArtifact = result.outputs.find((a) => a.kind === "entry-point");
-    if (!entryArtifact)
-      throw new Error("[PagesBundleBuilder] Bun.build emitted no entry-point artifact");
-    const bundlePath = path11.resolve(entryArtifact.path);
-    const buildId = Date.now();
-    const outputBytes = result.outputs.reduce((sum, output) => sum + output.size, 0);
-    const chunkCount = result.outputs.filter((output) => output.kind === "chunk").length;
-    this.#app.verbose(`[PagesBundleBuilder] ${path11.basename(bundlePath)} emitted in ${Date.now() - this.#started}ms splitting=${this.#splitting} entry=${entryArtifact.size} bytes outputs=${result.outputs.length} chunks=${chunkCount} total=${outputBytes} bytes`);
-    return {
-      bundlePath,
-      buildId,
-      splitting: this.#splitting,
-      entryBytes: entryArtifact.size,
-      outputBytes,
-      outputCount: result.outputs.length,
-      chunkCount
-    };
-  }
-  get #artifactDir() {
-    return `${this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath}/.akan/artifact`;
+    this.#keepGlobs = keepFonts;
+    this.#publicRoot = path11.join(app.dist.cwdPath, "public");
+    this.#artifactRoot = path11.join(app.dist.cwdPath, ".akan/artifact");
+  }
+  async prune() {
+    const empty = { removed: [], kept: [], freedBytes: 0 };
+    if (!await this.#isDirectory(this.#publicRoot))
+      return empty;
+    const candidates = await this.#collectCandidates();
+    if (!candidates.length)
+      return empty;
+    const fonts = await new FontOptimizer(this.#app, "build").discoverFonts();
+    const unoptimizedSrcs = new Set;
+    const optimizedSrcs = new Set;
+    for (const font of fonts) {
+      const target = isFontOptimizationEnabled(font) ? optimizedSrcs : unoptimizedSrcs;
+      for (const fontPath of font.paths)
+        target.add(path11.posix.basename(fontPath.src));
+    }
+    const result = { removed: [], kept: [], freedBytes: 0 };
+    const undecided = [];
+    for (const candidate of candidates) {
+      const reason = this.#staticKeepReason(candidate, unoptimizedSrcs);
+      if (reason)
+        result.kept.push({ file: candidate.rel, bytes: candidate.bytes, reason });
+      else
+        undecided.push(candidate);
+    }
+    if (undecided.length) {
+      const referrers = await this.#findReferrers(undecided, optimizedSrcs);
+      for (const candidate of undecided) {
+        const referrer = referrers.get(candidate.rel);
+        if (referrer)
+          result.kept.push({ file: candidate.rel, bytes: candidate.bytes, reason: { kind: "referenced", referrer } });
+        else
+          result.removed.push({ file: candidate.rel, bytes: candidate.bytes });
+      }
+    }
+    await this.#remove(result.removed.map(({ file }) => file));
+    result.freedBytes = result.removed.reduce((total, { bytes }) => total + bytes, 0);
+    this.#report(result);
+    return result;
   }
-  get #splitting() {
-    return process.env.AKAN_SERVER_PAGES_SPLITTING === "1";
+  #staticKeepReason(candidate, unoptimizedSrcs) {
+    if (unoptimizedSrcs.has(candidate.basename))
+      return { kind: "unoptimized" };
+    for (const glob of this.#keepGlobs) {
+      if (new Bun.Glob(glob).match(candidate.rel))
+        return { kind: "declared", glob };
+    }
+    return null;
   }
-  #define() {
-    const nodeEnv = this.#command === "build" ? "production" : "development";
-    return {
-      "process.env.NODE_ENV": JSON.stringify(nodeEnv),
-      "process.env.AKAN_PUBLIC_RENDER_ENV": JSON.stringify("ssr"),
-      ...Object.fromEntries(Object.entries(this.#app.getPublicEnv()).map(([key, value]) => [`process.env.${key}`, JSON.stringify(value)]))
-    };
+  async#collectCandidates() {
+    const candidates = [];
+    for await (const rel of new Bun.Glob(FONT_GLOB).scan({ cwd: this.#publicRoot, dot: false })) {
+      const entry = await stat3(path11.join(this.#publicRoot, rel)).catch(() => null);
+      if (!entry?.isFile())
+        continue;
+      candidates.push({ rel: rel.split(path11.sep).join("/"), basename: path11.basename(rel), bytes: entry.size });
+    }
+    return candidates;
   }
-  static createPagesEntryPlugin(source) {
-    return {
-      name: "akan-pages-entry",
-      setup(build) {
-        build.onResolve({ filter: /^akan-pages-entry$/ }, () => ({
-          path: VIRTUAL_PAGES_ENTRY,
-          namespace: "akan-virtual"
-        }));
-        build.onLoad({ filter: /^akan-pages-entry$/, namespace: "akan-virtual" }, () => ({
-          contents: source,
-          loader: "tsx"
-        }));
-      }
-    };
+  async#findReferrers(candidates, optimizedSrcs) {
+    const referrers = new Map;
+    const authoritative = candidates;
+    const bundled = candidates.filter((candidate) => !optimizedSrcs.has(candidate.basename));
+    const roots = [
+      { dir: this.#publicRoot, label: "public", needles: authoritative },
+      { dir: path11.join(this.#artifactRoot, "styles"), label: ".akan/artifact/styles", needles: authoritative },
+      { dir: path11.join(this.#artifactRoot, "client"), label: ".akan/artifact/client", needles: bundled },
+      { dir: path11.join(this.#artifactRoot, "client-ssr"), label: ".akan/artifact/client-ssr", needles: bundled },
+      { dir: path11.join(this.#artifactRoot, "server"), label: ".akan/artifact/server", needles: bundled },
+      { dir: path11.join(this.#app.dist.cwdPath, "csr"), label: "csr", needles: bundled }
+    ];
+    for (const root of roots) {
+      const pending = root.needles.filter((candidate) => !referrers.has(candidate.rel));
+      if (!pending.length || !await this.#isDirectory(root.dir))
+        continue;
+      await this.#scanRoot(root, pending, referrers);
+    }
+    return referrers;
   }
-  static createServerCssStubPlugin() {
-    return {
-      name: "akan-server-css-stub",
-      setup(build) {
-        build.onLoad({ filter: /\.css$/ }, () => ({
-          contents: "",
-          loader: "js"
-        }));
+  async#scanRoot(root, pending, referrers) {
+    const needles = pending.map((candidate) => ({
+      rel: candidate.rel,
+      forms: [...new Set([candidate.basename, encodeURIComponent(candidate.basename)])]
+    }));
+    for await (const rel of new Bun.Glob(REFERRER_GLOB).scan({ cwd: root.dir, dot: false })) {
+      const remaining = needles.filter((needle) => !referrers.has(needle.rel));
+      if (!remaining.length)
+        return;
+      const text = await Bun.file(path11.join(root.dir, rel)).text().catch(() => "");
+      if (!text)
+        continue;
+      for (const needle of remaining) {
+        if (needle.forms.some((form) => text.includes(form)))
+          referrers.set(needle.rel, `${root.label}/${rel.split(path11.sep).join("/")}`);
       }
-    };
+    }
   }
-  static createServerUseClientFetchPlugin() {
-    return {
-      name: "akan-server-use-client-fetch",
-      setup(build) {
-        build.onLoad({ filter: /[/\\]lib[/\\]useClient\.(ts|tsx|js|jsx)$/ }, async (args) => {
-          const source = await Bun.file(args.path).text();
-          const transformed = PagesBundleBuilder.transformServerUseClientFetchSource(source);
-          if (transformed === source)
-            return;
-          return { contents: transformed, loader: loaderFor2(args.path) };
-        });
-      }
-    };
+  async#remove(files) {
+    await Promise.all(files.map((file) => rm2(path11.join(this.#publicRoot, file), { force: true })));
+    const dirs = [...new Set(files.map((file) => path11.posix.dirname(file)))].filter((dir) => dir !== "." && dir !== "/").sort((a, b) => b.length - a.length);
+    for (const dir of dirs)
+      await rmdir(path11.join(this.#publicRoot, dir)).catch(() => {
+        return;
+      });
   }
-  static transformServerUseClientFetchSource(source) {
-    if (!source.includes(`with { type: "macro" }`) || !source.includes("FetchClient.build"))
-      return source;
-    return source.replace(/import\s+\{\s*getSerializedSignal\s*\}\s+from\s+["']\.\/sig["']\s+with\s+\{\s*type\s*:\s*["']macro["']\s*\};/, `import { fetch as serverFetch } from "./sig";`).replace(/const\s+fetchProto\s*=\s*FetchClient\.build<[^;]+;/, "const fetchProto = FetchClient.build<typeof signal>(cnst, serverFetch.serializedSignal, { Err: pageProto.Err, base: serverFetch });");
+  #report(result) {
+    if (!result.removed.length && !result.kept.length)
+      return;
+    for (const { file, bytes } of result.removed)
+      this.#app.verbose(`[font-prune] dropped public/${file} (${FontPruner.formatBytes(bytes)})`);
+    for (const { file, reason } of result.kept)
+      this.#app.verbose(`[font-prune] kept public/${file} \u2014 ${FontPruner.describe(reason)}`);
+    const byReferrer = new Map;
+    for (const { bytes, reason } of result.kept) {
+      if (reason.kind !== "referenced")
+        continue;
+      const entry = byReferrer.get(reason.referrer) ?? { files: 0, bytes: 0 };
+      entry.files += 1;
+      entry.bytes += bytes;
+      byReferrer.set(reason.referrer, entry);
+    }
+    if (!byReferrer.size)
+      return;
+    const ranked = [...byReferrer.entries()].sort(([, a], [, b]) => b.bytes - a.bytes);
+    const named = ranked.slice(0, 3).map(([referrer, { files, bytes }]) => `${referrer} (${files}, ${FontPruner.formatBytes(bytes)})`);
+    const rest = ranked.length - named.length;
+    this.#app.logger.info(`[font-prune] kept ${FontPruner.formatBytes(ranked.reduce((total, [, entry]) => total + entry.bytes, 0))} of fonts in public/ because these reference them: ${named.join(", ")}${rest > 0 ? ` and ${rest} more` : ""}`);
+  }
+  static describe(reason) {
+    if (reason.kind === "unoptimized")
+      return "declared with optimize: false, so the runtime CSS serves it";
+    if (reason.kind === "declared")
+      return `kept by assets.keepFonts "${reason.glob}"`;
+    return `referenced by ${reason.referrer}`;
+  }
+  static formatBytes(bytes) {
+    if (bytes < 1024)
+      return `${bytes}B`;
+    if (bytes < 1024 * 1024)
+      return `${(bytes / 1024).toFixed(1)}KB`;
+    return `${(bytes / 1024 / 1024).toFixed(1)}MB`;
+  }
+  async#isDirectory(dir) {
+    return await stat3(dir).then((entry) => entry.isDirectory(), () => false);
   }
 }
-function loaderFor2(absPath) {
-  if (absPath.endsWith(".tsx"))
-    return "tsx";
-  if (absPath.endsWith(".jsx"))
-    return "jsx";
-  if (absPath.endsWith(".ts"))
-    return "ts";
-  return "js";
-}
 
 // pkgs/@akanjs/devkit/frontendBuild/precompressArtifacts.ts
-import fs2 from "fs";
+import fs from "fs";
 import path12 from "path";
+import zlib from "zlib";
 var COMPRESSIBLE_EXTS = new Set([".css", ".html", ".js", ".json", ".svg"]);
 var MIN_COMPRESS_BYTES = 1024;
+var BROTLI_QUALITY_BY_EXT = { ".css": 11 };
+var DEFAULT_BROTLI_QUALITY = 9;
+var GZIP_LEVEL = 9;
 async function precompressArtifacts(app) {
-  const roots = [path12.join(app.dist.cwdPath, ".akan/artifact/client")];
-  const result = { files: 0, inputBytes: 0, outputBytes: 0 };
+  const roots = [
+    path12.join(app.dist.cwdPath, ".akan/artifact/client"),
+    path12.join(app.dist.cwdPath, ".akan/artifact/styles")
+  ];
+  const result = { files: 0, inputBytes: 0, outputBytes: 0, brotliBytes: 0 };
   await Promise.all(roots.map((root) => precompressRoot(root, result)));
   if (result.files > 0) {
-    app.verbose(`[precompress] wrote ${result.files} gzip sidecars (${formatBytes(result.inputBytes)} -> ${formatBytes(result.outputBytes)})`);
+    app.verbose(`[precompress] wrote ${result.files} sidecars (${formatBytes(result.inputBytes)} -> gzip ${formatBytes(result.outputBytes)} / br ${formatBytes(result.brotliBytes)})`);
   }
   return result;
 }
 async function precompressRoot(root, result) {
-  if (!fs2.existsSync(root) || !fs2.statSync(root).isDirectory())
+  if (!fs.existsSync(root) || !fs.statSync(root).isDirectory())
     return;
   const glob = new Bun.Glob("**/*");
   for await (const filePath of glob.scan({ cwd: root, absolute: true })) {
     if (!await shouldPrecompress(filePath))
       continue;
     const bytes = await Bun.file(filePath).bytes();
-    const gz = Bun.gzipSync(toArrayBuffer(bytes));
-    await Bun.write(`${filePath}.gz`, gz);
+    const buffer = toArrayBuffer(bytes);
+    const gz = Bun.gzipSync(buffer, { level: GZIP_LEVEL });
+    const br = brotliCompress(buffer, path12.extname(filePath).toLowerCase());
+    await Promise.all([Bun.write(`${filePath}.gz`, gz), Bun.write(`${filePath}.br`, br)]);
     result.files += 1;
     result.inputBytes += bytes.byteLength;
     result.outputBytes += gz.byteLength;
+    result.brotliBytes += br.byteLength;
   }
 }
+function brotliCompress(buffer, ext) {
+  const quality = BROTLI_QUALITY_BY_EXT[ext] ?? DEFAULT_BROTLI_QUALITY;
+  return zlib.brotliCompressSync(buffer, {
+    params: {
+      [zlib.constants.BROTLI_PARAM_QUALITY]: quality,
+      [zlib.constants.BROTLI_PARAM_SIZE_HINT]: buffer.byteLength
+    }
+  });
+}
 async function shouldPrecompress(filePath) {
-  if (filePath.endsWith(".gz"))
+  if (filePath.endsWith(".gz") || filePath.endsWith(".br"))
     return false;
   if (!COMPRESSIBLE_EXTS.has(path12.extname(filePath).toLowerCase()))
     return false;
@@ -2119,6 +2095,7 @@ class SsrBaseArtifactBuilder {
       branches: [...akanConfig.branches],
       i18n: akanConfig.i18n,
       imageConfig: akanConfig.images,
+      web: akanConfig.web,
       deepLinkAssociations: Object.values(akanConfig.mobile.targets).filter((target) => (target.deepLinks?.domains?.length ?? 0) > 0).map((target) => ({
         targetName: target.name,
         appId: target.appId,
@@ -2145,7 +2122,7 @@ class SsrBaseArtifactBuilder {
     const ssrBundle = await new ClientEntriesBundler({
       app: this.#app,
       entries: [rscSegmentOutletEntry],
-      ...RouteClientBuilder.resolveSsrClientExternalOptions(this.#command),
+      ...RouteClientBuilder.resolveSsrClientBundleOptions(this.#command),
       outputSubdir: "client-ssr",
       command: this.#command
     }).bundle();
@@ -2197,13 +2174,13 @@ class SsrBaseArtifactBuilder {
 `);
       if (!cssText)
         return [];
-      return [this.#writeCssAsset(basePath, cssText)];
+      return [this.#writeCssAsset(basePath, cssText, cssCompiler.importedStylesheetsByBasePath[basePath] ?? [])];
     })));
     if (optimizedFonts.files.length > 0)
       this.#app.verbose(`[base-artifact] optimized ${optimizedFonts.files.length} font files`);
     return { cssCompiler, optimizedFonts, cssAssets };
   }
-  async#writeCssAsset(basePath, cssText) {
+  async#writeCssAsset(basePath, cssText, imported) {
     const cssAssetName = basePath || "root";
     const preparedCssText = await prepareCssAsset(this.#command, basePath, cssText);
     const cssHash = Bun.hash(`${basePath}
@@ -2213,220 +2190,16 @@ ${preparedCssText}`).toString(36);
       `/_akan/styles/${cssAssetName}-${cssHash}.css`
     ];
     await Bun.write(path13.join(this.#absArtifactDir, cssRelPath), preparedCssText);
+    SsrBaseArtifactBuilder.#warnDroppedImports(this.#app, cssRelPath, preparedCssText, imported);
     this.#app.verbose(`[base-artifact] wrote ${preparedCssText.length} bytes of CSS for ${basePath} -> ${cssRelPath}`);
     return [basePath, { cssUrl, cssRelPath }];
   }
-}
-// pkgs/@akanjs/devkit/frontendBuild/styleGuard.ts
-var PREFIX = "(?:bg|text|border(?:-[tblrxy])?(?:-[se])?|ring(?:-offset)?|fill|stroke|shadow|from|to|via|divide|outline|decoration|placeholder|caret|accent)";
-var PALETTE = "(?:slate|gray|zinc|neutral|stone|red|orange|amber|yellow|lime|green|emerald|teal|cyan|sky|blue|indigo|violet|purple|fuchsia|pink|rose)";
-var LEAD = "(^|[\\s\"'`{(\\[:!])";
-var TAIL = "(?=[\\s\"'`})\\]:/!,]|$)";
-var RAW_PALETTE_RE = new RegExp(`${LEAD}((?:${PREFIX})-)${PALETTE}-\\d{2,3}${TAIL}`, "g");
-var ARBITRARY_COLOR_RE = /\[(#[0-9a-fA-F]{3,8}|(?:rgb|rgba|hsl|hsla|oklch|oklab|lab|lch|hwb|color)\([^\]]*\))\]/g;
-var INTERPOLATED_ARBITRARY_RE = new RegExp(`${LEAD}[a-z][a-z0-9-]*-\\[[^\\]\`]*\\$\\{`, "g");
-var STYLE_OBJECT_RE = /style=\{\{([\s\S]*?)\}\}/g;
-var STYLE_TAG_RE = /<style[^>]*>([\s\S]*?)<\/style>/g;
-var INLINE_COLOR_LITERAL_RE = /#[0-9a-fA-F]{3,8}\b|(?:rgb|rgba|hsl|hsla|oklch|oklab|lab|lch|hwb)\(/g;
-var DAISYUI_LEGACY_RE = new RegExp(`${LEAD}(?:` + "btn-(?:primary|secondary|accent|neutral|info|success|warning|error|ghost|link|outline|square|circle|wide|block|xs|sm|md|lg)|" + "badge-(?:primary|secondary|accent|neutral|info|success|warning|error|ghost|outline)|" + "alert-(?:info|success|warning|error)|" + "input-(?:bordered|primary|secondary|accent|ghost|error)|" + "select-(?:bordered|primary|ghost)|textarea-(?:bordered|primary|ghost)|" + "checkbox-(?:primary|secondary|accent)|toggle-(?:primary|secondary|accent)|" + "loading-(?:spinner|dots|ring|ball|bars|infinity)|" + "card-(?:body|title|actions)|modal-(?:box|action|backdrop)|" + "collapse-(?:title|content|arrow|plus)|dropdown-(?:content|end|start|hover)|" + "stat-(?:title|value|desc)|tabs-(?:boxed|lifted|bordered)|tab-active|" + "menu-(?:title|dropdown)|steps-(?:horizontal|vertical)|join-item|" + "mockup-(?:code|phone|browser|window)|drawer-(?:side|content|toggle)" + `)${TAIL}`, "g");
-var ALL_RULES = [
-  "raw-palette",
-  "arbitrary-color",
-  "inline-color",
-  "daisyui-legacy",
-  "interpolated-arbitrary"
-];
-
-class StyleGuard {
-  run(files) {
-    const out = [];
-    for (const file of files) {
-      const directives = this.#parseDirectives(file.content);
-      const scan = this.#stripComments(file.content);
-      const local = [];
-      this.#scanClassLiterals(file, scan, local);
-      this.#scanInlineColors(file, scan, local);
-      for (const v of local)
-        if (!this.#isSuppressed(v, directives))
-          out.push(v);
-    }
-    return out;
-  }
-  #stripComments(src) {
-    const out = src.split("");
-    const blank = (i2) => {
-      if (src[i2] !== `
-`)
-        out[i2] = " ";
-    };
-    let state = "code";
-    let i = 0;
-    while (i < src.length) {
-      const c = src[i];
-      const d = src[i + 1];
-      if (state === "code") {
-        if (c === "/" && d === "/") {
-          blank(i);
-          blank(i + 1);
-          state = "line";
-          i += 2;
-        } else if (c === "/" && d === "*") {
-          blank(i);
-          blank(i + 1);
-          state = "block";
-          i += 2;
-        } else {
-          if (c === "'")
-            state = "squote";
-          else if (c === '"')
-            state = "dquote";
-          else if (c === "`")
-            state = "template";
-          i++;
-        }
-      } else if (state === "line") {
-        if (c === `
-`)
-          state = "code";
-        else
-          blank(i);
-        i++;
-      } else if (state === "block") {
-        if (c === "*" && d === "/") {
-          blank(i);
-          blank(i + 1);
-          state = "code";
-          i += 2;
-        } else {
-          blank(i);
-          i++;
-        }
-      } else {
-        const close = state === "squote" ? "'" : state === "dquote" ? '"' : "`";
-        if (c === "\\")
-          i += 2;
-        else {
-          if (c === close)
-            state = "code";
-          i++;
-        }
-      }
-    }
-    return out.join("");
-  }
-  #parseDirectives(content) {
-    const directives = { file: null, nextLine: new Map };
-    const lines = content.split(`
-`);
-    for (let i = 0;i < lines.length; i++) {
-      const line = lines[i];
-      const nextLineMatch = line.match(/styleguard-disable-next-line\b(.*)$/);
-      if (nextLineMatch) {
-        directives.nextLine.set(i + 2, this.#extractRules(nextLineMatch[1]));
+  static #warnDroppedImports(app, cssRelPath, css, imported) {
+    for (const { cssPath, declaredNames } of imported) {
+      if (declaredNames.length === 0 || declaredNames.some((name) => css.includes(`${name}:`)))
         continue;
-      }
-      const fileMatch = line.match(/styleguard-disable\b(.*)$/);
-      if (fileMatch)
-        directives.file = this.#mergeFileScope(directives.file, this.#extractRules(fileMatch[1]));
-    }
-    return directives;
-  }
-  #extractRules(tail) {
-    const found = ALL_RULES.filter((rule) => tail.includes(rule));
-    return found.length === 0 ? "all" : new Set(found);
-  }
-  #mergeFileScope(prev, next) {
-    if (prev === "all" || next === "all")
-      return "all";
-    return new Set([...prev ?? [], ...next]);
-  }
-  #isSuppressed(v, directives) {
-    if (directives.file === "all" || directives.file?.has(v.rule))
-      return true;
-    const nextLine = directives.nextLine.get(v.line);
-    return nextLine === "all" || (nextLine?.has(v.rule) ?? false);
-  }
-  #scanClassLiterals(file, scan, out) {
-    for (const m of scan.matchAll(RAW_PALETTE_RE)) {
-      out.push(this.#violation(file, m.index ?? 0, {
-        rule: "raw-palette",
-        severity: "error",
-        suggestion: "\uC2DC\uB9E8\uD2F1 \uD1A0\uD070\uC73C\uB85C \uAD50\uCCB4\uD558\uC138\uC694 \u2014 \uC608: text-gray-500\u2192text-muted-foreground, bg-red-500\u2192bg-destructive, bg-blue-500\u2192bg-info. \uBE0C\uB79C\uB4DC \uC0C9\uC740 page/styles.css \uD1A0\uD070\uC5D0\uC11C \uC870\uC815\uD569\uB2C8\uB2E4."
-      }));
-    }
-    for (const m of scan.matchAll(ARBITRARY_COLOR_RE)) {
-      out.push(this.#violation(file, m.index ?? 0, {
-        rule: "arbitrary-color",
-        severity: "error",
-        suggestion: "\uC784\uC758 \uC0C9 \uB9AC\uD130\uB7F4 \uB300\uC2E0 \uD1A0\uD070\uC744 \uC4F0\uC138\uC694 \u2014 bg-[#3b82f6]\u2192bg-info, text-[rgb(...)]\u2192\uC2DC\uB9E8\uD2F1 \uD1A0\uD070. \uAF2D \uD544\uC694\uD558\uBA74 \uC2A4\uCF54\uD504 \uD1A0\uD070(.campaign-x { --primary: \u2026 })\uC744 \uC815\uC758\uD558\uC138\uC694."
-      }));
-    }
-    for (const m of scan.matchAll(DAISYUI_LEGACY_RE)) {
-      out.push(this.#violation(file, m.index ?? 0, {
-        rule: "daisyui-legacy",
-        severity: "error",
-        suggestion: "daisyUI \uD074\uB798\uC2A4\uB294 \uC81C\uAC70\uB410\uC2B5\uB2C8\uB2E4. akanjs/ui \uD504\uB9AC\uBBF8\uD2F0\uBE0C(Button/Badge \uB4F1)\uB098 buttonRecipe()/badgeRecipe() + \uC2DC\uB9E8\uD2F1 \uD1A0\uD070\uC73C\uB85C \uAD50\uCCB4\uD558\uC138\uC694."
-      }));
-    }
-    for (const m of scan.matchAll(INTERPOLATED_ARBITRARY_RE)) {
-      out.push(this.#violation(file, m.index ?? 0, {
-        rule: "interpolated-arbitrary",
-        severity: "error",
-        suggestion: "\uB7F0\uD0C0\uC784 \uAC12\uC73C\uB85C \uC784\uC758\uAC12 \uD074\uB798\uC2A4\uB97C \uC870\uB9BD\uD558\uBA74 CSS \uAC00 \uC0DD\uC131\uB418\uC9C0 \uC54A\uC2B5\uB2C8\uB2E4(\uC2A4\uCE90\uB108\uB294 \uC18C\uC2A4 \uD14D\uC2A4\uD2B8\uB97C \uC77D\uC2B5\uB2C8\uB2E4). \uD06C\uAE30/\uC704\uCE58\uB294 style prop \uC73C\uB85C \uB118\uAE30\uC138\uC694 \u2014 style={{ minHeight }}. \uAC12\uC774 enum \uC774\uBA74 \uB9AC\uD130\uB7F4 \uD074\uB798\uC2A4 \uB9F5\uC73C\uB85C \uB450\uC138\uC694."
-      }));
-    }
-  }
-  #scanInlineColors(file, scan, out) {
-    const push = (index) => out.push(this.#violation(file, index, {
-      rule: "inline-color",
-      severity: "error",
-      suggestion: "\uC778\uB77C\uC778 \uC0C9 \uB9AC\uD130\uB7F4 \uB300\uC2E0 CSS \uBCC0\uC218/\uD1A0\uD070\uC744 \uCC38\uC870\uD558\uC138\uC694 \u2014 style={{ color: 'var(--primary)' }} \uB610\uB294 \uC2DC\uB9E8\uD2F1 \uD074\uB798\uC2A4(text-primary). \uD558\uB4DC\uCF54\uB529 hex/rgb \uB294 \uD14C\uB9C8 \uC804\uD658\uC744 \uAE68\uB728\uB9BD\uB2C8\uB2E4."
-    }));
-    for (const region of [STYLE_OBJECT_RE, STYLE_TAG_RE]) {
-      for (const m of scan.matchAll(region)) {
-        const inner = m[1] ?? "";
-        const innerStart = (m.index ?? 0) + m[0].indexOf(inner);
-        for (const lit of inner.matchAll(INLINE_COLOR_LITERAL_RE)) {
-          push(innerStart + (lit.index ?? 0));
-        }
-      }
-    }
-  }
-  #violation(file, index, base) {
-    const before = file.content.slice(0, index);
-    const line = before.length === 0 ? 1 : before.split(`
-`).length;
-    const lineStart = before.lastIndexOf(`
-`) + 1;
-    const lineEnd = file.content.indexOf(`
-`, index);
-    const snippet = file.content.slice(lineStart, lineEnd === -1 ? undefined : lineEnd).trim();
-    return { ...base, path: file.path, line, snippet };
-  }
-  static countNamedComponentClasses(css) {
-    const names = new Set;
-    const layerRe = /@layer\s+components\s*\{/g;
-    for (const layer of css.matchAll(layerRe)) {
-      const bodyStart = (layer.index ?? 0) + layer[0].length;
-      const body = StyleGuard.#extractBalanced(css, bodyStart);
-      for (const sel of body.matchAll(/(^|[\s}])\.(-?[a-zA-Z_][\w-]*)/g))
-        names.add(sel[2]);
-    }
-    return { count: names.size, names: [...names].sort() };
-  }
-  static #extractBalanced(css, start) {
-    let depth = 1;
-    for (let i = start;i < css.length; i++) {
-      const ch = css[i];
-      if (ch === "{")
-        depth++;
-      else if (ch === "}") {
-        depth--;
-        if (depth === 0)
-          return css.slice(start, i);
-      }
+      app.logger.warn(`[base-artifact] @import ${cssPath} declares ${declaredNames.length} custom propert${declaredNames.length === 1 ? "y" : "ies"} and none of them are in ${cssRelPath}`);
     }
-    return css.slice(start);
   }
 }
-export { AllRoutesBuilder, CsrArtifactBuilder, CssCompiler, FontOptimizer, PagesBundleBuilder, precompressArtifacts, SsrBaseArtifactBuilder };
+export { AllRoutesBuilder, CssCompiler, PagesBundleBuilder, CsrArtifactBuilder, FontOptimizer, FontPruner, precompressArtifacts, SsrBaseArtifactBuilder };