@akanjs/cli 3.0.0-beta.3 → 3.0.0-beta.30

package/{index-a64esmtb.js → index-376gpdds.js}

@@ -1,97 +1,32 @@
 // @bun
 import {
-  AsyncDefaultExportDetector,
   resolveSsrPageEntriesForApp
-} from "./index-2tv3fdx4.js";
+} from "./index-n3jk2501.js";
 import {
+  computeRouteSeedIndex,
+  saveRouteSeedIndex,
   BarrelAnalyzer,
-  createBarrelImportsPlugin,
   createTsconfigPackageResolver,
   rewriteBarrelImports,
   GraphClientEntryDiscovery,
-  transformUseClient,
+  bundleDefine,
   ClientEntriesBundler,
   VENDOR_SPECIFIERS,
-  RouteClientBuilder
-} from "./index-w8kmx1b6.js";
+  RouteClientBuilder,
+  CsrEntryFiles,
+  PagesEntrySourceGenerator,
+  PagesBundleBuilder
+} from "./index-6x9p8dpb.js";
+import {
+  SOURCE_EXTS
+} from "./index-48k96p55.js";
 var __require = import.meta.require;
 
 // pkgs/@akanjs/devkit/frontendBuild/allRoutesBuilder.ts
-import path3 from "path";
-
-// pkgs/@akanjs/devkit/artifact/routeSeedIndex.ts
 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 = [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) ?? [];
-      layoutsByPrefix.set(prefix, [...prev, ...files]);
-    } else if (parsed.kind === "page") {
-      pagesBySegments.push({
-        key,
-        pattern: parsed.pattern,
-        segments: parsed.routeSegments,
-        files,
-        includeOwnLayout: parsed.leaf === "_index"
-      });
-    }
-  }
-  assertUniqueRoutePatterns(pagesBySegments);
-  const rootLayouts = layoutsByPrefix.get("") ?? [];
-  const globalLayoutFiles = rootLayouts;
-  const seedEntries = [];
-  for (const { pattern, segments, files, includeOwnLayout } of pagesBySegments) {
-    const layouts = [];
-    const maxPrefixLength = includeOwnLayout ? segments.length : Math.max(segments.length - 1, 0);
-    for (let i = 0;i <= maxPrefixLength; i++) {
-      const prefix = segments.slice(0, i).join("/");
-      const layoutFiles = layoutsByPrefix.get(prefix);
-      if (layoutFiles)
-        layouts.push(...layoutFiles);
-    }
-    const seeds = Array.from(new Set([...layouts, ...files]));
-    const routeId = pattern || "/";
-    seedEntries.push({ routeId, pattern: routeId, seeds });
-  }
-  seedEntries.sort((a, b) => compareRouteSpecificity(a.pattern, b.pattern));
-  return { entries: seedEntries, globalLayoutFiles };
-}
-var ROUTE_SEED_INDEX_JSON = "route-seed-index.json";
-function serializeRouteSeedIndexForArtifact(index, artifactDir, options = {}) {
-  const normalizedArtifactDir = path.resolve(artifactDir);
-  if (options.production) {
-    return {
-      entries: index.entries.map((entry) => ({ routeId: entry.routeId }))
-    };
-  }
-  return {
-    entries: index.entries.map((entry) => ({
-      ...entry,
-      seeds: entry.seeds.map((seed) => serializeArtifactPath(seed, normalizedArtifactDir))
-    })),
-    globalLayoutFiles: index.globalLayoutFiles.map((file) => serializeArtifactPath(file, normalizedArtifactDir))
-  };
-}
-async function saveRouteSeedIndex(artifactDir, index, options = {}) {
-  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 (!path.isAbsolute(artifactPath))
-    return artifactPath;
-  return path.relative(artifactDir, artifactPath).split(path.sep).join("/");
-}
 
 // pkgs/@akanjs/devkit/frontendBuild/routesManifestArtifactSerializer.ts
-import path2 from "path";
+import { RoutesManifestStore } from "akanjs/server/artifact/routesManifestStore";
 
 class RoutesManifestArtifactSerializer {
   #manifest;
@@ -99,42 +34,17 @@ class RoutesManifestArtifactSerializer {
   #production;
   constructor(manifest, artifactDir, options = {}) {
     this.#manifest = manifest;
-    this.#artifactDir = path2.resolve(artifactDir);
+    this.#artifactDir = artifactDir;
     this.#production = options.production ?? false;
   }
   static serialize(manifest, artifactDir, options = {}) {
     return new RoutesManifestArtifactSerializer(manifest, artifactDir, options).serialize();
   }
   serialize() {
-    const serialized = {
-      ...this.#manifest,
-      knownEntries: this.#manifest.knownEntries.map((entry) => this.#serializeArtifactPath(entry))
-    };
+    const serialized = RoutesManifestStore.serialize(this.#manifest, this.#artifactDir);
     if (this.#production)
       delete serialized.knownEntries;
-    return {
-      ...serialized,
-      clientManifest: Object.fromEntries(Object.entries(this.#manifest.clientManifest).map(([key, row]) => [this.#serializeArtifactPath(key), row])),
-      ssrManifest: {
-        ...this.#manifest.ssrManifest,
-        moduleMap: Object.fromEntries(Object.entries(this.#manifest.ssrManifest.moduleMap).map(([entryUrl, byName]) => [
-          entryUrl,
-          Object.fromEntries(Object.entries(byName).map(([name, entry]) => [
-            name,
-            {
-              ...entry,
-              id: this.#serializeArtifactPath(entry.id),
-              chunks: entry.chunks.map((chunk) => this.#serializeArtifactPath(chunk))
-            }
-          ]))
-        ]))
-      }
-    };
-  }
-  #serializeArtifactPath(artifactPath) {
-    if (!path2.isAbsolute(artifactPath))
-      return artifactPath;
-    return path2.relative(this.#artifactDir, artifactPath).split(path2.sep).join("/");
+    return serialized;
   }
 }
 
@@ -164,27 +74,22 @@ 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;
+    const allEntries = new Set;
     for (const entry of seedIndex.entries) {
       const seeds = Array.from(new Set([...seedIndex.globalLayoutFiles, ...entry.seeds]));
-      for (const discovered of await this.#discovery.discover(seeds)) {
-        if (seen.has(discovered))
-          continue;
-        seen.add(discovered);
-        allEntries.push(discovered);
-      }
+      for (const discovered of await this.#discovery.discover(seeds))
+        allEntries.add(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.#app.verbose(`[build-all] ${allEntries.size} 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 = path3.join(path3.resolve(this.#artifactDir), "routes-manifest.json");
+    const manifestPath = path.join(path.resolve(this.#artifactDir), "routes-manifest.json");
     await Bun.write(manifestPath, `${JSON.stringify(RoutesManifestArtifactSerializer.serialize(manifest, this.#artifactDir, {
       production: this.#command === "build"
     }), null, 2)}
@@ -216,18 +121,231 @@ class AllRoutesBuilder {
     return 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)) {
-      this.#merged.ssrManifest.moduleMap[url] = byName;
-    }
+    Object.assign(this.#merged.clientManifest, delta.manifestDelta);
+    Object.assign(this.#merged.ssrManifest.moduleMap, delta.ssrManifestDelta.moduleMap);
     for (const abs of delta.newEntries)
       this.#knownSet.add(abs);
   }
 }
 
+// pkgs/@akanjs/devkit/frontendBuild/csrArtifactBuilder.ts
+import { mkdir, rm, unlink } from "fs/promises";
+import path2 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: bundleDefine(this.#app, this.#command, "csr"),
+      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 CsrEntryFiles.pageEntriesForBasePath(pageEntries, basePath, basePaths);
+  }
+  static htmlFilename(basePath) {
+    return `${basePath || "index"}.html`;
+  }
+  static entryFilename(basePath) {
+    return CsrEntryFiles.entryFilename(basePath);
+  }
+  static basePathOfHtml(htmlPath) {
+    const name = path2.basename(htmlPath, ".html");
+    return name === "index" ? "" : name;
+  }
+  get #outputDir() {
+    return path2.join(this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath, this.#command === "build" ? "csr" : ".akan/artifact/csr");
+  }
+  get #generatedDir() {
+    return path2.join(this.#app.cwdPath, ".akan/generated/csr");
+  }
+  get #artifactDir() {
+    return path2.join(this.#command === "build" ? this.#app.dist.cwdPath : this.#app.cwdPath, ".akan/artifact");
+  }
+  #generatedPath(filename) {
+    return path2.join(this.#generatedDir, filename);
+  }
+  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(path2.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.#listOutputFiles((filePath) => filePath.endsWith(".html"))) {
+      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"}; ${path2.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(path2.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 };
+  }
+  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 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));
+  }
+  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 path2.resolve(path2.dirname(htmlPath), normalized);
+  }
+}
+
 // pkgs/@akanjs/devkit/frontendBuild/cssCompiler.ts
-import path5 from "path";
+import path4 from "path";
 import { Logger } from "akanjs/common";
 import { compile } from "tailwindcss";
 
@@ -298,7 +416,7 @@ class CssCandidateCache {
 }
 
 // pkgs/@akanjs/devkit/frontendBuild/cssImportResolver.ts
-import path4 from "path";
+import path3 from "path";
 var CSS_IMPORT_EXTS = ["", ".css", "/styles.css", "/index.css"];
 
 class CssImportResolver {
@@ -317,8 +435,8 @@ class CssImportResolver {
   async resolve(id, fromBase) {
     for (const resolve of [
       () => this.#resolveWithTsconfig(id),
-      () => this.#resolveWithBun(id, fromBase),
-      () => this.#resolveWithRequire(id, fromBase),
+      () => this.#resolveCssWith(fromBase, (base) => Bun.resolveSync(id, base)),
+      () => this.#resolveCssWith(fromBase, (base) => __require.resolve(id, { paths: [base] })),
       () => this.#resolvePackageStyle(id, fromBase)
     ]) {
       const resolved = await resolve();
@@ -327,20 +445,10 @@ class CssImportResolver {
     }
     return null;
   }
-  #resolveWithBun(id, fromBase) {
-    for (const base of this.#resolutionBases(fromBase)) {
-      try {
-        const resolved = Bun.resolveSync(id, base);
-        if (CssImportResolver.isCssFile(resolved))
-          return resolved;
-      } catch {}
-    }
-    return null;
-  }
-  #resolveWithRequire(id, fromBase) {
+  #resolveCssWith(fromBase, resolveFrom) {
     for (const base of this.#resolutionBases(fromBase)) {
       try {
-        const resolved = __require.resolve(id, { paths: [base] });
+        const resolved = resolveFrom(base);
         if (CssImportResolver.isCssFile(resolved))
           return resolved;
       } catch {}
@@ -351,7 +459,7 @@ class CssImportResolver {
     const exact = this.#paths[id];
     if (exact) {
       for (const repl of exact) {
-        const resolved = await this.#firstExisting(path4.resolve(this.#workspaceRoot, repl));
+        const resolved = await this.#firstExisting(path3.resolve(this.#workspaceRoot, repl));
         if (resolved)
           return resolved;
       }
@@ -362,7 +470,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(path4.resolve(this.#workspaceRoot, replPath + suffix));
+        const resolved = await this.#firstExisting(path3.resolve(this.#workspaceRoot, replPath + suffix));
         if (resolved)
           return resolved;
       }
@@ -392,34 +500,34 @@ class CssImportResolver {
     try {
       if (!await Bun.file(pkgPath).exists())
         return null;
-      const pkgDir = path4.dirname(pkgPath);
+      const pkgDir = path3.dirname(pkgPath);
       const pkg = await Bun.file(pkgPath).json();
       const subpath = id === pkgName ? "." : `.${id.slice(pkgName.length)}`;
       const exportValue = pkg.exports?.[subpath];
       const exportedEntry = typeof exportValue === "string" ? exportValue : exportValue?.style || exportValue?.import || exportValue?.default;
       if (exportedEntry)
-        return await this.#firstExisting(path4.resolve(pkgDir, exportedEntry));
+        return await this.#firstExisting(path3.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"));
+        return await this.#firstExisting(path3.resolve(pkgDir, subpath));
+      return await this.#firstExisting(path3.resolve(pkgDir, pkg.exports?.["."]?.style || pkg.style || "index.css"));
     } catch {
       return null;
     }
   }
   #resolutionBases(fromBase) {
-    return [fromBase, this.#workspaceRoot, path4.dirname(Bun.main), path4.resolve(path4.dirname(Bun.main), "../..")];
+    return [fromBase, this.#workspaceRoot, path3.dirname(Bun.main), path3.resolve(path3.dirname(Bun.main), "../..")];
   }
   #packageJsonCandidates(pkgName) {
     return [
-      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")
+      path3.join(this.#workspaceRoot, "pkgs", pkgName, "package.json"),
+      path3.join(this.#workspaceRoot, "node_modules", pkgName, "package.json"),
+      path3.join(path3.dirname(Bun.main), "node_modules", pkgName, "package.json"),
+      path3.join(path3.dirname(Bun.main), "../../", pkgName, "package.json")
     ];
   }
   async#firstExisting(basePath) {
     for (const suffix of CSS_IMPORT_EXTS) {
-      const candidate = `${basePath}${suffix}`;
+      const candidate = path3.normalize(`${basePath}${suffix}`);
       if (await Bun.file(candidate).exists())
         return candidate;
     }
@@ -432,12 +540,11 @@ class CssImportResolver {
     return parts[0] ?? null;
   }
   static isCssFile(filePath) {
-    return path4.extname(filePath) === ".css";
+    return path3.extname(filePath) === ".css";
   }
 }
 
 // pkgs/@akanjs/devkit/frontendBuild/cssCompiler.ts
-var SOURCE_EXTS = [".ts", ".tsx", ".js", ".jsx", ".mjs", ".cjs"];
 var NON_SOURCE_EXT_RE = /\.(json|svg|png|jpe?g|webp|gif|avif|ico|woff2?|ttf|otf|mp3|mp4|wav)$/i;
 var NODE_MODULES_RE = /[\\/]node_modules[\\/]/;
 var AKANJS_NODE_MODULE_RE = /[\\/]node_modules[\\/]akanjs[\\/]/;
@@ -451,7 +558,7 @@ class CssCompiler {
     this.#app = app;
   }
   get #candidateCachePath() {
-    return path5.join(this.#app.cwdPath, ".akan/cache/cssCandidates.json");
+    return path4.join(this.#app.cwdPath, ".akan/cache/cssCandidates.json");
   }
   #cssText = null;
   #cssTextByBasePath = null;
@@ -481,7 +588,7 @@ class CssCompiler {
           return filePath;
       }
       for (const ext of SOURCE_EXTS) {
-        const filePath = path5.join(absPathNoExt, `index${ext}`);
+        const filePath = path4.join(absPathNoExt, `index${ext}`);
         if (await this.#fileExists(filePath))
           return filePath;
       }
@@ -511,42 +618,33 @@ class CssCompiler {
     const pageKeys = await this.#app.getPageKeys({ refresh });
     const basePaths = [...akanConfig.basePaths];
     const rootPageKeys = pageKeys.filter((pageKey) => getPageKeyBasePath(pageKey, basePaths) === null);
+    const compileBasePath = async (basePath, basePathPageKeys, label = basePath) => {
+      if (basePathPageKeys.length === 0)
+        return [basePath, ""];
+      const started = Date.now();
+      const { cssPaths, sourcePaths } = await this.discoverCssAndSources({ refresh, pageKeys: basePathPageKeys });
+      const { css, imported } = await this.#compileWithImports(cssPaths, sourcePaths);
+      this.importedStylesheetsByBasePath[basePath] = imported;
+      this.#logger.verbose(`css base=${label} paths=${cssPaths.length} sources=${sourcePaths.length} in ${Date.now() - started}ms`);
+      return [basePath, css];
+    };
     const cssEntries = await Promise.all([
-      (async () => {
-        if (rootPageKeys.length === 0)
-          return ["", ""];
-        const started = Date.now();
-        const { cssPaths, sourcePaths } = await this.discoverCssAndSources({ refresh, pageKeys: rootPageKeys });
-        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];
-      })(),
-      ...basePaths.map(async (basePath) => {
-        const basePathPageKeys = pageKeys.filter((pageKey) => getPageKeyBasePath(pageKey, basePaths) === basePath);
-        if (basePathPageKeys.length === 0)
-          return [basePath, ""];
-        const started = Date.now();
-        const { cssPaths, sourcePaths } = await this.discoverCssAndSources({ refresh, pageKeys: basePathPageKeys });
-        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];
-      })
+      compileBasePath("", rootPageKeys, "root"),
+      ...basePaths.map((basePath) => compileBasePath(basePath, pageKeys.filter((pageKey) => getPageKeyBasePath(pageKey, basePaths) === basePath)))
     ]);
     this.#cssTextByBasePath = Object.fromEntries(cssEntries);
     await this.#warnUnreachableStylesheets();
     return this.#cssTextByBasePath;
   }
   async#warnUnreachableStylesheets() {
-    const pageDir = path5.join(this.#app.cwdPath, "page");
+    const pageDir = path4.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}`))
+      if (cssPath.includes(`${path4.sep}(libs)${path4.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`);
+      this.#logger.warn(`css ${path4.relative(this.#app.cwdPath, cssPath)} is imported by no route and never compiled`);
     }
   }
   async discoverCss({ refresh } = {}) {
@@ -558,7 +656,7 @@ class CssCompiler {
     pageKeys
   } = {}) {
     pageKeys ??= await this.#app.getPageKeys({ refresh });
-    const seeds = pageKeys.map((key) => path5.resolve(this.#app.cwdPath, "page", key));
+    const seeds = pageKeys.map((key) => path4.resolve(this.#app.cwdPath, "page", key));
     const cssFiles = new Set;
     const sourceFiles = new Set;
     const queue = [...seeds];
@@ -587,772 +685,198 @@ class CssCompiler {
       let imports;
       try {
         imports = this.#transpiler.scanImports(source);
-      } catch {
-        continue;
-      }
-      const importerDir = path5.dirname(filePath);
-      for (const imp of imports) {
-        const spec = imp.path;
-        if (!spec)
-          continue;
-        if (spec.endsWith(".css")) {
-          const cssPath = await this.#resolveCssImport(spec, importerDir);
-          cssFiles.add(cssPath);
-          continue;
-        }
-        if (NON_SOURCE_EXT_RE.test(spec))
-          continue;
-        const resolved = await this.#resolveSourceImport(spec, importerDir, resolvePackage);
-        if (!resolved || sourceFiles.has(resolved) || isIgnoredNodeModuleSource(resolved))
-          continue;
-        queue.push(resolved);
-      }
-    }
-    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 { css: "", imported: [] };
-    const compileStarted = Date.now();
-    const compilers = await Promise.all(cssPaths.map(async (cssPath) => {
-      const css = await Bun.file(cssPath).text();
-      const base = path5.dirname(cssPath);
-      const imported = new Map;
-      const compiler = await compile(css, {
-        base,
-        loadStylesheet: (id, fromBase) => this.#loadStylesheet(id, fromBase, imported),
-        loadModule: (id, fromBase) => this.#loadModule(id, fromBase)
-      });
-      return { cssPath, compiler, imported };
-    }));
-    const sourceDirs = new Set;
-    for (const entry of compilers) {
-      if (!entry)
-        continue;
-      for (const s of entry.compiler.sources)
-        sourceDirs.add(s.base);
-    }
-    const scanStarted = Date.now();
-    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;
-      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 { css: parts.join(`
-`), imported };
-  }
-  async#loadStylesheet(id, fromBase, imported) {
-    const p = await this.#resolveCssImport(id, fromBase);
-    this.#discoveredCssPaths.add(p);
-    const content = await Bun.file(p).text();
-    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("/")) {
-      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)
-      return resolved;
-    throw new Error(`[css] failed to resolve stylesheet import "${id}" from ${fromBase}`);
-  }
-  async#getCssImportResolver() {
-    if (this.#cssImportResolver)
-      return this.#cssImportResolver;
-    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: 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())
+      } catch {
         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(`
-`)}`);
+      const importerDir = path4.dirname(filePath);
+      for (const imp of imports) {
+        const spec = imp.path;
+        if (!spec)
+          continue;
+        if (spec.endsWith(".css")) {
+          const cssPath = await this.#resolveCssImport(spec, importerDir);
+          cssFiles.add(cssPath);
+          continue;
+        }
+        if (NON_SOURCE_EXT_RE.test(spec))
+          continue;
+        const resolved = await this.#resolveSourceImport(spec, importerDir, resolvePackage);
+        if (!resolved || sourceFiles.has(resolved) || isIgnoredNodeModuleSource(resolved))
+          continue;
+        queue.push(resolved);
+      }
     }
+    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#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));
+  async#libTokenStylesheets(sourceFiles) {
+    const libsRoot = path4.join(this.#app.workspace.workspaceRoot, "libs");
+    const libNames = new Set;
+    for (const filePath of sourceFiles) {
+      const relPath = path4.relative(libsRoot, filePath);
+      if (relPath.startsWith("..") || path4.isAbsolute(relPath))
+        continue;
+      const [libName] = relPath.split(path4.sep);
+      if (libName)
+        libNames.add(libName);
     }
-    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 };
+    const tokenPaths = await Promise.all([...libNames].sort().map(async (libName) => {
+      const tokensPath = path4.join(libsRoot, libName, "ui/tokens.css");
+      return await this.#fileExists(tokensPath) ? tokensPath : null;
+    }));
+    return tokenPaths.filter((tokensPath) => !!tokensPath);
   }
-  async#htmlOutputPaths() {
-    return await this.#listOutputFiles((filePath) => filePath.endsWith(".html"));
+  async compileCss(cssPaths, sourcePaths) {
+    const { css } = await this.#compileWithImports(cssPaths, sourcePaths);
+    return css;
   }
-  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);
+  async#compileWithImports(cssPaths, sourcePaths) {
+    if (cssPaths.length === 0)
+      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 = path4.dirname(cssPath);
+      const imported = new Map;
+      const compiler = await compile(css, {
+        base,
+        loadStylesheet: (id, fromBase) => this.#loadStylesheet(id, fromBase, imported),
+        loadModule: (id, fromBase) => this.#loadModule(id, fromBase)
+      });
+      return { cssPath, compiler, imported };
+    }));
+    const sourceDirs = new Set;
+    for (const entry of compilers) {
+      for (const s of entry.compiler.sources)
+        sourceDirs.add(s.base);
     }
-    return files.sort();
+    const scanStarted = Date.now();
+    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) {
+      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 { css: parts.join(`
+`), imported };
   }
-  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}`;
+  async#loadStylesheet(id, fromBase, imported) {
+    const p = await this.#resolveCssImport(id, fromBase);
+    this.#discoveredCssPaths.add(p);
+    const content = await Bun.file(p).text();
+    imported?.set(p, content);
+    this.#logger.verbose(`css import "${id}" from ${fromBase} -> ${p} (${content.length} bytes)`);
+    return { path: p, base: path4.dirname(p), content };
   }
-  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));
+  async#resolveCssImport(id, fromBase) {
+    if (id.startsWith(".") || id.startsWith("/")) {
+      const filePath = path4.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})`);
+    }
+    this.#cssImportResolver ??= await CssImportResolver.create(this.#app);
+    const resolved = await this.#cssImportResolver.resolve(id, fromBase);
+    if (resolved)
+      return resolved;
+    throw new Error(`[css] failed to resolve stylesheet import "${id}" from ${fromBase}`);
   }
-  static createInlineStyle(css) {
-    return `<style data-akan-css="active">
-${css.replace(/<\/style/gi, "<\\/style")}
-</style>`;
+  async#loadModule(id, fromBase) {
+    const p = __require.resolve(id, { paths: [fromBase] });
+    const mod = await import(p);
+    return { path: p, base: path4.dirname(p), module: mod.default ?? mod };
   }
-  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;
+  #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 : path4.resolve(fromBase, id);
+      return this.#resolveSourceFileCandidate(abs);
     }
-    if (!matched)
-      return html;
-    return result + html.slice(lastIndex);
+    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;
   }
-  static escapeInlineScript(source) {
-    return source.replace(/<\/script/gi, "<\\/script");
+  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 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 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.has(path4.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) {
+  return CsrEntryFiles.basePathOfPageKey(pageKey, basePaths);
+}
 
 // pkgs/@akanjs/devkit/frontendBuild/fontOptimizer.ts
 import { mkdir as mkdir2, stat as stat2 } from "fs/promises";
-import path10 from "path";
+import path5 from "path";
 import ts from "typescript";
 var FONT_URL_PREFIX = "/_akan/fonts";
 var DEFAULT_FONT_SUBSETS = ["latin"];
@@ -1369,7 +893,7 @@ class FontOptimizer {
   constructor(app, command = "start") {
     this.#app = app;
     this.#command = command;
-    this.#artifactRoot = path10.join(command === "build" ? app.dist.cwdPath : app.cwdPath, ".akan/artifact");
+    this.#artifactRoot = path5.join(command === "build" ? app.dist.cwdPath : app.cwdPath, ".akan/artifact");
   }
   async optimize() {
     const fonts = await this.discoverFonts();
@@ -1394,7 +918,7 @@ class FontOptimizer {
     return result;
   }
   get #cachePath() {
-    return path10.join(this.#artifactRoot, "fontCache.json");
+    return path5.join(this.#artifactRoot, "fontCache.json");
   }
   async#buildCacheKey(fonts) {
     const sources = [];
@@ -1409,7 +933,7 @@ class FontOptimizer {
         sources.push({ optimizedSrc: face.optimizedSrc, ...stamp });
       }
       for (const filePath of font.subsetFiles ?? []) {
-        const abs = path10.isAbsolute(filePath) ? filePath : path10.join(this.#app.cwdPath, filePath);
+        const abs = path5.isAbsolute(filePath) ? filePath : path5.join(this.#app.cwdPath, filePath);
         const stamp = await this.#fileStamp(abs);
         if (!stamp)
           return null;
@@ -1435,7 +959,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) => path10.join(this.#artifactRoot, relativePath));
+    const files = cache.files.map((relativePath) => path5.join(this.#artifactRoot, relativePath));
     for (const filePath of files) {
       if (!await Bun.file(filePath).exists())
         return null;
@@ -1447,7 +971,7 @@ class FontOptimizer {
       version: FontOptimizer.#cacheVersion,
       key,
       css: result.css,
-      files: result.files.map((filePath) => path10.relative(this.#artifactRoot, filePath))
+      files: result.files.map((filePath) => path5.relative(this.#artifactRoot, filePath))
     };
     await Bun.write(this.#cachePath, JSON.stringify(cache));
   }
@@ -1455,7 +979,7 @@ class FontOptimizer {
     const pageKeys = await this.#app.getPageKeys();
     const fonts = [];
     await Promise.all(pageKeys.map(async (key) => {
-      const filePath = path10.resolve(this.#app.cwdPath, "page", key);
+      const filePath = path5.resolve(this.#app.cwdPath, "page", key);
       const file = Bun.file(filePath);
       if (!await file.exists())
         return;
@@ -1464,7 +988,7 @@ class FontOptimizer {
         return;
       fonts.push(...this.#extractFontsExport(source, filePath));
     }));
-    return this.#dedupeFonts(fonts);
+    return [...new Map(fonts.map((font) => [JSON.stringify(font), font])).values()];
   }
   async#optimizeFont(font) {
     const faceCss = [];
@@ -1474,8 +998,8 @@ class FontOptimizer {
         this.#app.logger.warn(`[font] source not found: ${face.src}`);
         continue;
       }
-      const outputPath = path10.join(this.#artifactRoot, face.optimizedSrc.replace(/^\/_akan\//, ""));
-      await mkdir2(path10.dirname(outputPath), { recursive: true });
+      const outputPath = path5.join(this.#artifactRoot, face.optimizedSrc.replace(/^\/_akan\//, ""));
+      await mkdir2(path5.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);
@@ -1497,8 +1021,8 @@ class FontOptimizer {
     const entries = Array.isArray(value) ? value : [];
     const fonts = entries.filter((entry) => this.#isReadableFont(entry));
     if (fonts.length !== entries.length || !Array.isArray(value))
-      this.#app.logger.warn(`[font] ${path10.relative(this.#app.cwdPath, filePath)} declares fonts the build cannot read without evaluating the module \u2014 write the list inline, or nothing is subset for it and every /_akan/fonts request 404s`);
-    return fonts.map((font) => this.#withFontDefaults(font));
+      this.#app.logger.warn(`[font] ${path5.relative(this.#app.cwdPath, filePath)} declares fonts the build cannot read without evaluating the module \u2014 write the list inline, or nothing is subset for it and every /_akan/fonts request 404s`);
+    return fonts.map((font) => ({ ...font, subsets: font.subsets ?? [...DEFAULT_FONT_SUBSETS] }));
   }
   #isReadableFont(value) {
     if (!value || typeof value !== "object")
@@ -1587,15 +1111,6 @@ class FontOptimizer {
       return name.text;
     return null;
   }
-  #dedupeFonts(fonts) {
-    const map = new Map;
-    for (const font of fonts)
-      map.set(JSON.stringify(font), font);
-    return [...map.values()];
-  }
-  #withFontDefaults(font) {
-    return { ...font, subsets: font.subsets ?? [...DEFAULT_FONT_SUBSETS] };
-  }
   #getFontSubsets(font) {
     return font.subsets ?? DEFAULT_FONT_SUBSETS;
   }
@@ -1608,11 +1123,8 @@ class FontOptimizer {
   #isFontOptimizationEnabled(font) {
     return font.optimize !== false;
   }
-  #getFontStyles(font) {
-    return font.styles?.length ? font.styles : ["normal"];
-  }
   #getFontFaces(font) {
-    const enabledStyles = new Set(this.#getFontStyles(font));
+    const enabledStyles = new Set(font.styles?.length ? font.styles : ["normal"]);
     return font.paths.map((fontPath) => {
       const style = fontPath.style ?? "normal";
       return {
@@ -1667,8 +1179,8 @@ class FontOptimizer {
       return null;
     const rel = src.replace(/^\//, "");
     const candidates = [
-      this.#command === "build" ? path10.join(this.#app.dist.cwdPath, "public", rel) : null,
-      path10.join(this.#app.cwdPath, "public", rel),
+      this.#command === "build" ? path5.join(this.#app.dist.cwdPath, "public", rel) : null,
+      path5.join(this.#app.cwdPath, "public", rel),
       this.#resolveWorkspacePublicPath(rel)
     ].filter(Boolean);
     for (const candidate of candidates) {
@@ -1685,15 +1197,12 @@ class FontOptimizer {
   }
   async#convertToWoff2(buffer, sourcePath) {
     const { createFont } = await import("fonteditor-core");
-    await this.#initWoff2();
-    const font = createFont(buffer, { type: this.#getFontType(sourcePath, buffer) });
-    return font.write({ type: "woff2", toBuffer: true });
-  }
-  async#initWoff2() {
     this.#woff2Ready ??= import("fonteditor-core").then(({ woff2 }) => woff2.init()).then(() => {
       return;
     });
-    return this.#woff2Ready;
+    await this.#woff2Ready;
+    const font = createFont(buffer, { type: this.#getFontType(sourcePath, buffer) });
+    return font.write({ type: "woff2", toBuffer: true });
   }
   #getFontType(sourcePath, buffer) {
     const signature = buffer.toString("ascii", 0, 4);
@@ -1703,7 +1212,7 @@ class FontOptimizer {
       return "woff2";
     if (signature === "OTTO")
       return "otf";
-    const ext = path10.extname(sourcePath).slice(1).toLowerCase();
+    const ext = path5.extname(sourcePath).slice(1).toLowerCase();
     if (ext === "otf" || ext === "woff" || ext === "woff2")
       return ext;
     return "ttf";
@@ -1712,7 +1221,7 @@ class FontOptimizer {
     const [root, dep, ...rest] = rel.split("/");
     if (root !== "libs" || !dep || rest.length === 0)
       return null;
-    return path10.join(this.#app.workspace.workspaceRoot, "libs", dep, "public", ...rest);
+    return path5.join(this.#app.workspace.workspaceRoot, "libs", dep, "public", ...rest);
   }
   async#getSubsetText(font) {
     const parts = new Set;
@@ -1722,7 +1231,7 @@ class FontOptimizer {
     if (font.subsetText)
       parts.add(font.subsetText);
     for (const filePath of font.subsetFiles ?? []) {
-      const abs = path10.isAbsolute(filePath) ? filePath : path10.join(this.#app.cwdPath, filePath);
+      const abs = path5.isAbsolute(filePath) ? filePath : path5.join(this.#app.cwdPath, filePath);
       const file = Bun.file(abs);
       if (await file.exists())
         parts.add(await file.text());
@@ -1731,9 +1240,9 @@ class FontOptimizer {
   }
   async#getSubsetPresetText(subset) {
     if (subset === "latin")
-      return this.#rangeText(32, 126);
+      return FontOptimizer.#rangeText(32, 126);
     if (subset === "latin-ext")
-      return `${this.#rangeText(32, 126)}${this.#rangeText(160, 591)}`;
+      return `${FontOptimizer.#rangeText(32, 126)}${FontOptimizer.#rangeText(160, 591)}`;
     if (subset === "ks-x-1001")
       return FontOptimizer.#getKsX1001Text();
     if (subset === "auto")
@@ -1742,7 +1251,7 @@ class FontOptimizer {
   }
   async#collectAutoSubsetText() {
     const libPageRoots = (await this.#app.getPageRoots()).filter((root) => root.keyPrefix).map((root) => root.dir);
-    const roots = [...["page", "ui", "lib"].map((dir) => path10.join(this.#app.cwdPath, dir)), ...libPageRoots];
+    const roots = [...["page", "ui", "lib"].map((dir) => path5.join(this.#app.cwdPath, dir)), ...libPageRoots];
     const glob = new Bun.Glob("**/*.{ts,tsx,js,jsx,html,md}");
     const parts = [];
     for (const root of [...new Set(roots)].sort()) {
@@ -1757,12 +1266,6 @@ class FontOptimizer {
     }
     return parts.join("");
   }
-  #rangeText(start, end) {
-    let text = "";
-    for (let code = start;code <= end; code++)
-      text += String.fromCodePoint(code);
-    return text;
-  }
   static #getKsX1001Text() {
     if (FontOptimizer.#ksX1001Text)
       return FontOptimizer.#ksX1001Text;
@@ -1778,11 +1281,11 @@ class FontOptimizer {
       }
       FontOptimizer.#ksX1001Text = [...chars].join("");
     } catch {
-      FontOptimizer.#ksX1001Text = FontOptimizer.#rangeTextStatic(44032, 55203);
+      FontOptimizer.#ksX1001Text = FontOptimizer.#rangeText(44032, 55203);
     }
     return FontOptimizer.#ksX1001Text;
   }
-  static #rangeTextStatic(start, end) {
+  static #rangeText(start, end) {
     let text = "";
     for (let code = start;code <= end; code++)
       text += String.fromCodePoint(code);
@@ -1862,7 +1365,7 @@ ${declarations.map(([prop, value]) => `  ${prop}: ${value};`).join(`
 
 // pkgs/@akanjs/devkit/frontendBuild/fontPruner.ts
 import { rm as rm2, rmdir, stat as stat3 } from "fs/promises";
-import path11 from "path";
+import path6 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}";
@@ -1875,8 +1378,8 @@ class FontPruner {
   constructor(app, { keepFonts = [] } = {}) {
     this.#app = app;
     this.#keepGlobs = keepFonts;
-    this.#publicRoot = path11.join(app.dist.cwdPath, "public");
-    this.#artifactRoot = path11.join(app.dist.cwdPath, ".akan/artifact");
+    this.#publicRoot = path6.join(app.dist.cwdPath, "public");
+    this.#artifactRoot = path6.join(app.dist.cwdPath, ".akan/artifact");
   }
   async prune() {
     const empty = { removed: [], kept: [], freedBytes: 0 };
@@ -1891,7 +1394,7 @@ class FontPruner {
     for (const font of fonts) {
       const target = isFontOptimizationEnabled(font) ? optimizedSrcs : unoptimizedSrcs;
       for (const fontPath of font.paths)
-        target.add(path11.posix.basename(fontPath.src));
+        target.add(path6.posix.basename(fontPath.src));
     }
     const result = { removed: [], kept: [], freedBytes: 0 };
     const undecided = [];
@@ -1929,10 +1432,10 @@ class FontPruner {
   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);
+      const entry = await stat3(path6.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 });
+      candidates.push({ rel: rel.split(path6.sep).join("/"), basename: path6.basename(rel), bytes: entry.size });
     }
     return candidates;
   }
@@ -1942,11 +1445,11 @@ class FontPruner {
     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 }
+      { dir: path6.join(this.#artifactRoot, "styles"), label: ".akan/artifact/styles", needles: authoritative },
+      { dir: path6.join(this.#artifactRoot, "client"), label: ".akan/artifact/client", needles: bundled },
+      { dir: path6.join(this.#artifactRoot, "client-ssr"), label: ".akan/artifact/client-ssr", needles: bundled },
+      { dir: path6.join(this.#artifactRoot, "server"), label: ".akan/artifact/server", needles: bundled },
+      { dir: path6.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));
@@ -1965,20 +1468,20 @@ class FontPruner {
       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(() => "");
+      const text = await Bun.file(path6.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("/")}`);
+          referrers.set(needle.rel, `${root.label}/${rel.split(path6.sep).join("/")}`);
       }
     }
   }
   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);
+    await Promise.all(files.map((file) => rm2(path6.join(this.#publicRoot, file), { force: true })));
+    const dirs = [...new Set(files.map((file) => path6.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(() => {
+      await rmdir(path6.join(this.#publicRoot, dir)).catch(() => {
         return;
       });
   }
@@ -2026,17 +1529,18 @@ class FontPruner {
 
 // pkgs/@akanjs/devkit/frontendBuild/precompressArtifacts.ts
 import fs from "fs";
-import path12 from "path";
+import path7 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;
+var { formatBytes } = FontPruner;
 async function precompressArtifacts(app) {
   const roots = [
-    path12.join(app.dist.cwdPath, ".akan/artifact/client"),
-    path12.join(app.dist.cwdPath, ".akan/artifact/styles")
+    path7.join(app.dist.cwdPath, ".akan/artifact/client"),
+    path7.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)));
@@ -2053,9 +1557,9 @@ async function precompressRoot(root, result) {
     if (!await shouldPrecompress(filePath))
       continue;
     const bytes = await Bun.file(filePath).bytes();
-    const buffer = toArrayBuffer(bytes);
+    const buffer = bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
     const gz = Bun.gzipSync(buffer, { level: GZIP_LEVEL });
-    const br = brotliCompress(buffer, path12.extname(filePath).toLowerCase());
+    const br = brotliCompress(buffer, path7.extname(filePath).toLowerCase());
     await Promise.all([Bun.write(`${filePath}.gz`, gz), Bun.write(`${filePath}.br`, br)]);
     result.files += 1;
     result.inputBytes += bytes.byteLength;
@@ -2075,26 +1579,16 @@ function brotliCompress(buffer, ext) {
 async function shouldPrecompress(filePath) {
   if (filePath.endsWith(".gz") || filePath.endsWith(".br"))
     return false;
-  if (!COMPRESSIBLE_EXTS.has(path12.extname(filePath).toLowerCase()))
+  if (!COMPRESSIBLE_EXTS.has(path7.extname(filePath).toLowerCase()))
     return false;
   const file = Bun.file(filePath);
   if (!await file.exists())
     return false;
   return file.size >= MIN_COMPRESS_BYTES;
 }
-function toArrayBuffer(bytes) {
-  return bytes.buffer.slice(bytes.byteOffset, bytes.byteOffset + bytes.byteLength);
-}
-function 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`;
-}
 
 // pkgs/@akanjs/devkit/frontendBuild/ssrBaseArtifactBuilder.ts
-import path13 from "path";
+import path8 from "path";
 import { optimize } from "@tailwindcss/node";
 function prepareCssAsset(command, basePath, cssText) {
   return optimize(cssText, { file: `${basePath || "root"}.css`, minify: command === "build" }).code;
@@ -2110,7 +1604,10 @@ class SsrBaseArtifactBuilder {
     this.#app = app;
     this.#command = command;
     this.#artifactDir = `${command === "build" ? app.dist.cwdPath : app.cwdPath}/.akan/artifact`;
-    this.#absArtifactDir = path13.resolve(this.#artifactDir);
+    this.#absArtifactDir = path8.resolve(this.#artifactDir);
+  }
+  static servedWeb(command, web) {
+    return command === "start" ? { ssr: true, csr: true } : web;
   }
   async build() {
     const akanConfig = await this.#app.getConfig();
@@ -2132,7 +1629,7 @@ class SsrBaseArtifactBuilder {
       rscRuntimeSsrManifest,
       vendorMap,
       cssAssets,
-      pagesBundlePath: this.#command === "build" ? path13.relative(this.#absArtifactDir, pagesBundle.bundlePath) : pagesBundle.bundlePath,
+      pagesBundlePath: this.#command === "build" ? path8.relative(this.#absArtifactDir, pagesBundle.bundlePath) : pagesBundle.bundlePath,
       pagesBundleBuildId: pagesBundle.buildId,
       domains: [...akanConfig.domains],
       subRoutes: Object.fromEntries(Array.from(akanConfig.subRoutes.entries()).map(([basePath, domains]) => [basePath, [...domains]])),
@@ -2140,27 +1637,28 @@ 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) => ({
+      web: SsrBaseArtifactBuilder.servedWeb(this.#command, akanConfig.web),
+      deepLinkAssociations: Object.values(akanConfig.native.targets).filter((target) => (target.deepLinks?.domains?.length ?? 0) > 0).map((target) => ({
         targetName: target.name,
-        appId: target.appId,
+        iosAppId: SsrBaseArtifactBuilder.#appIdOn(target.appId, "ios"),
+        androidAppId: SsrBaseArtifactBuilder.#appIdOn(target.appId, "android"),
         domains: target.deepLinks?.domains ?? [],
-        iosTeamId: target.deepLinks?.ios?.teamId,
-        androidSha256CertFingerprints: target.deepLinks?.android?.sha256CertFingerprints
+        iosTeamId: target.ios?.teamId,
+        androidSha256CertFingerprints: target.android?.sha256CertFingerprints
       }))
     };
-    await Bun.write(path13.join(this.#absArtifactDir, "base-artifact.json"), `${JSON.stringify(artifact, null, 2)}
+    await Bun.write(path8.join(this.#absArtifactDir, "base-artifact.json"), `${JSON.stringify(artifact, null, 2)}
 `);
     this.#app.verbose(`[base-artifact] complete in ${Date.now() - this.#started}ms`);
     return { artifact, seedIndex, cssCompiler, optimizedFonts };
   }
   async#buildRuntimeClientEntries() {
     const akanServerPath = await this.#resolveAkanServerPath();
-    const rscClientEntry = path13.resolve(akanServerPath, "rscClient.tsx");
-    const rscSegmentOutletEntry = path13.resolve(akanServerPath, "rscSegmentOutlet.tsx");
+    const rscClientEntry = path8.resolve(akanServerPath, "rscClient.tsx");
+    const rscSegmentOutletEntry = path8.resolve(akanServerPath, "rscSegmentOutlet.tsx");
     const vendorEntries = VENDOR_SPECIFIERS.map((specifier) => ({
       specifier,
-      absPath: path13.resolve(akanServerPath, "vendor", `${specifier.replaceAll("/", "-").replaceAll(".", "-")}.ts`)
+      absPath: path8.resolve(akanServerPath, "vendor", `${specifier.replaceAll("/", "-").replaceAll(".", "-")}.ts`)
     }));
     const entries = [rscClientEntry, rscSegmentOutletEntry, ...vendorEntries.map((v) => v.absPath)];
     const clientBundle = await new ClientEntriesBundler({ app: this.#app, entries, command: this.#command }).bundle();
@@ -2197,15 +1695,15 @@ class SsrBaseArtifactBuilder {
   async#resolveAkanServerPath() {
     const candidates = [];
     try {
-      candidates.push(path13.dirname(Bun.resolveSync("akanjs/server", this.#app.workspace.workspaceRoot)));
+      candidates.push(path8.dirname(Bun.resolveSync("akanjs/server", this.#app.workspace.workspaceRoot)));
     } catch {}
-    candidates.push(path13.join(this.#app.workspace.workspaceRoot, "pkgs/akanjs/server"), path13.join(this.#app.workspace.workspaceRoot, "node_modules/akanjs/server"));
+    candidates.push(path8.join(this.#app.workspace.workspaceRoot, "pkgs/akanjs/server"), path8.join(this.#app.workspace.workspaceRoot, "node_modules/akanjs/server"));
     try {
-      candidates.push(path13.dirname(Bun.resolveSync("akanjs/server", path13.dirname(Bun.main))));
+      candidates.push(path8.dirname(Bun.resolveSync("akanjs/server", path8.dirname(Bun.main))));
     } catch {}
-    candidates.push(path13.join(path13.dirname(Bun.main), "node_modules/akanjs/server"), path13.join(path13.dirname(Bun.main), "../../akanjs/server"), path13.resolve(import.meta.dir, "../../server"), path13.resolve(import.meta.dir, "../server"));
+    candidates.push(path8.join(path8.dirname(Bun.main), "node_modules/akanjs/server"), path8.join(path8.dirname(Bun.main), "../../akanjs/server"), path8.resolve(import.meta.dir, "../../server"), path8.resolve(import.meta.dir, "../server"));
     for (const candidate of candidates) {
-      if (await Bun.file(path13.join(candidate, "rscClient.tsx")).exists())
+      if (await Bun.file(path8.join(candidate, "rscClient.tsx")).exists())
         return candidate;
     }
     throw new Error(`[base-artifact] failed to locate akanjs/server; looked in: ${candidates.join(", ")}`);
@@ -2234,11 +1732,14 @@ ${preparedCssText}`).toString(36);
       `styles/${cssAssetName}-${cssHash}.css`,
       `/_akan/styles/${cssAssetName}-${cssHash}.css`
     ];
-    await Bun.write(path13.join(this.#absArtifactDir, cssRelPath), preparedCssText);
+    await Bun.write(path8.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 }];
   }
+  static #appIdOn(appId, platform) {
+    return typeof appId === "string" ? appId : appId[platform] ?? appId.default ?? null;
+  }
   static #warnDroppedImports(app, cssRelPath, css, imported) {
     for (const { cssPath, declaredNames } of imported) {
       if (declaredNames.length === 0 || declaredNames.some((name) => css.includes(`${name}:`)))
@@ -2247,4 +1748,4 @@ ${preparedCssText}`).toString(36);
     }
   }
 }
-export { AllRoutesBuilder, CssCompiler, PagesBundleBuilder, CsrArtifactBuilder, FontOptimizer, FontPruner, precompressArtifacts, SsrBaseArtifactBuilder };
+export { AllRoutesBuilder, CsrArtifactBuilder, CssCompiler, FontOptimizer, FontPruner, precompressArtifacts, SsrBaseArtifactBuilder };