@rstest/browser 0.7.9 → 0.8.0

package/src/hostController.ts

@@ -1,8 +1,11 @@
 import { existsSync } from 'node:fs';
 import fs from 'node:fs/promises';
 import type { IncomingMessage, ServerResponse } from 'node:http';
+import type { AddressInfo } from 'node:net';
 import { fileURLToPath } from 'node:url';
 import {
+  type BrowserTestRunOptions,
+  type BrowserTestRunResult,
   color,
   type FormattedError,
   getSetupFiles,
@@ -136,11 +139,9 @@ class ContainerRpcManager {
 
   private setupConnectionHandler(): void {
     this.wss.on('connection', (ws: WebSocket) => {
-      logger.log(color.gray('[Browser UI] Container WebSocket connected'));
-      logger.log(
-        color.gray(
-          `[Browser UI] Current ws: ${this.ws ? 'exists' : 'null'}, new ws: ${ws ? 'exists' : 'null'}`,
-        ),
+      logger.debug('[Browser UI] Container WebSocket connected');
+      logger.debug(
+        `[Browser UI] Current ws: ${this.ws ? 'exists' : 'null'}, new ws: ${ws ? 'exists' : 'null'}`,
       );
       this.attachWebSocket(ws);
     });
@@ -203,18 +204,14 @@ class ContainerRpcManager {
     testFile: string,
     testNamePattern?: string,
   ): Promise<void> {
-    logger.log(
-      color.gray(
-        `[Browser UI] reloadTestFile called, rpc: ${this.rpc ? 'exists' : 'null'}, ws: ${this.ws ? 'exists' : 'null'}`,
-      ),
+    logger.debug(
+      `[Browser UI] reloadTestFile called, rpc: ${this.rpc ? 'exists' : 'null'}, ws: ${this.ws ? 'exists' : 'null'}`,
     );
     if (!this.rpc) {
-      logger.log(
-        color.yellow('[Browser UI] RPC not available, skipping reloadTestFile'),
-      );
+      logger.debug('[Browser UI] RPC not available, skipping reloadTestFile');
       return;
     }
-    logger.log(color.gray(`[Browser UI] Calling reloadTestFile: ${testFile}`));
+    logger.debug(`[Browser UI] Calling reloadTestFile: ${testFile}`);
     await this.rpc.reloadTestFile(testFile, testNamePattern);
   }
 }
@@ -248,6 +245,8 @@ type WatchContext = {
   lastTestFiles: TestFileInfo[];
   hooksEnabled: boolean;
   cleanupRegistered: boolean;
+  chunkHashes: Map<string, string>;
+  affectedTestFiles: string[];
 };
 
 const watchContext: WatchContext = {
@@ -255,6 +254,8 @@ const watchContext: WatchContext = {
   lastTestFiles: [],
   hooksEnabled: false,
   cleanupRegistered: false,
+  chunkHashes: new Map(),
+  affectedTestFiles: [],
 };
 
 // ============================================================================
@@ -363,6 +364,99 @@ const excludePatternsToRegExp = (patterns: string[]): RegExp | null => {
   return new RegExp(`[\\\\/](${keywords.join('|')})[\\\\/]`);
 };
 
+type StatsModule = {
+  nameForCondition?: string;
+  children?: StatsModule[];
+};
+
+type StatsChunk = {
+  id?: string | number;
+  names?: string[];
+  hash?: string;
+  files?: string[];
+  modules?: StatsModule[];
+};
+
+/**
+ * Find test file path from chunk modules by matching against known entry files.
+ */
+const findTestFileInModules = (
+  modules: StatsModule[] | undefined,
+  entryTestFiles: Set<string>,
+): string | null => {
+  if (!modules) return null;
+
+  for (const m of modules) {
+    if (m.nameForCondition) {
+      const normalizedPath = normalize(m.nameForCondition);
+      if (entryTestFiles.has(normalizedPath)) {
+        return normalizedPath;
+      }
+    }
+    if (m.children) {
+      const found = findTestFileInModules(m.children, entryTestFiles);
+      if (found) return found;
+    }
+  }
+  return null;
+};
+
+/**
+ * Get a stable identifier for a chunk.
+ * Prefers chunk.id or chunk.names[0] over file paths for stability.
+ */
+const getChunkKey = (chunk: StatsChunk): string | null => {
+  if (chunk.id != null) {
+    return String(chunk.id);
+  }
+  if (chunk.names && chunk.names.length > 0) {
+    return chunk.names[0]!;
+  }
+  if (chunk.files && chunk.files.length > 0) {
+    return chunk.files[0]!;
+  }
+  return null;
+};
+
+/**
+ * Compare chunk hashes and find affected test files for watch mode re-runs.
+ * Uses chunk.id/names as stable keys instead of relying on file path patterns.
+ */
+const getAffectedTestFiles = (
+  chunks: StatsChunk[] | undefined,
+  entryTestFiles: Set<string>,
+): string[] => {
+  if (!chunks) return [];
+
+  const affectedFiles = new Set<string>();
+  const currentHashes = new Map<string, string>();
+
+  for (const chunk of chunks) {
+    if (!chunk.hash) continue;
+
+    // First check if this chunk contains a test entry file
+    const testFile = findTestFileInModules(chunk.modules, entryTestFiles);
+    if (!testFile) continue;
+
+    // Get a stable key for this chunk
+    const chunkKey = getChunkKey(chunk);
+    if (!chunkKey) continue;
+
+    const prevHash = watchContext.chunkHashes.get(chunkKey);
+    currentHashes.set(chunkKey, chunk.hash);
+
+    if (prevHash !== undefined && prevHash !== chunk.hash) {
+      affectedFiles.add(testFile);
+      logger.debug(
+        `[Watch] Chunk hash changed for ${chunkKey}: ${prevHash} -> ${chunk.hash} (test: ${testFile})`,
+      );
+    }
+  }
+
+  watchContext.chunkHashes = currentHashes;
+  return Array.from(affectedFiles);
+};
+
 const getRuntimeConfigFromProject = (
   project: ProjectContext,
 ): RuntimeConfig => {
@@ -747,8 +841,8 @@ const createBrowserRuntime = async ({
       plugins: userPlugins,
       server: {
         printUrls: false,
-        port: context.normalizedConfig.browser.port,
-        strictPort: context.normalizedConfig.browser.port !== undefined,
+        port: context.normalizedConfig.browser.port ?? 4000,
+        strictPort: context.normalizedConfig.browser.strictPort,
       },
       dev: {
         client: {
@@ -766,56 +860,63 @@ const createBrowserRuntime = async ({
     {
       name: 'rstest:browser-user-config',
       setup(api) {
-        api.modifyEnvironmentConfig((config, { mergeEnvironmentConfig }) => {
-          // Merge order: current config -> userConfig -> rstest required config (highest priority)
-          const merged = mergeEnvironmentConfig(config, userRsbuildConfig, {
-            source: {
-              entry: {
-                runner: resolveBrowserFile('client/entry.ts'),
+        api.modifyEnvironmentConfig({
+          handler: (config, { mergeEnvironmentConfig }) => {
+            // Merge order: current config -> userConfig -> rstest required config (highest priority)
+            const merged = mergeEnvironmentConfig(config, userRsbuildConfig, {
+              resolve: {
+                alias: rstestInternalAliases,
               },
-            },
-            resolve: {
-              alias: rstestInternalAliases,
-            },
-            output: {
-              target: 'web',
-              // Enable source map for inline snapshot support
-              sourceMap: {
-                js: 'source-map',
+              output: {
+                target: 'web',
+                // Enable source map for inline snapshot support
+                sourceMap: {
+                  js: 'source-map',
+                },
               },
-            },
-            tools: {
-              rspack: (rspackConfig) => {
-                rspackConfig.mode = 'development';
-                rspackConfig.lazyCompilation = {
-                  imports: true,
-                  entries: false,
-                };
-                rspackConfig.plugins = rspackConfig.plugins || [];
-                rspackConfig.plugins.push(virtualManifestPlugin);
-
-                // Extract and merge sourcemaps from pre-built @rstest/core files
-                // This preserves the sourcemap chain for inline snapshot support
-                // See: https://rspack.dev/config/module-rules#rulesextractsourcemap
-                const browserRuntimeDir = dirname(browserRuntimePath);
-                rspackConfig.module = rspackConfig.module || {};
-                rspackConfig.module.rules = rspackConfig.module.rules || [];
-                rspackConfig.module.rules.unshift({
-                  test: /\.js$/,
-                  include: browserRuntimeDir,
-                  extractSourceMap: true,
-                });
-
-                if (isDebug()) {
-                  logger.log(
-                    `[rstest:browser] extractSourceMap rule added for: ${browserRuntimeDir}`,
-                  );
-                }
+              tools: {
+                rspack: (rspackConfig) => {
+                  rspackConfig.mode = 'development';
+                  rspackConfig.lazyCompilation = {
+                    imports: true,
+                    entries: false,
+                  };
+                  rspackConfig.plugins = rspackConfig.plugins || [];
+                  rspackConfig.plugins.push(virtualManifestPlugin);
+
+                  // Extract and merge sourcemaps from pre-built @rstest/core files
+                  // This preserves the sourcemap chain for inline snapshot support
+                  // See: https://rspack.dev/config/module-rules#rulesextractsourcemap
+                  const browserRuntimeDir = dirname(browserRuntimePath);
+                  rspackConfig.module = rspackConfig.module || {};
+                  rspackConfig.module.rules = rspackConfig.module.rules || [];
+                  rspackConfig.module.rules.unshift({
+                    test: /\.js$/,
+                    include: browserRuntimeDir,
+                    extractSourceMap: true,
+                  });
+
+                  if (isDebug()) {
+                    logger.log(
+                      `[rstest:browser] extractSourceMap rule added for: ${browserRuntimeDir}`,
+                    );
+                  }
+                },
               },
-            },
-          });
-
-          return merged;
+            });
+
+            // Completely overwrite entry to prevent Rsbuild default entry detection from taking effect.
+            // In browser mode, entry is fully controlled by rstest (not user's src/index.ts).
+            // This must be done after mergeEnvironmentConfig to ensure highest priority.
+            merged.source = merged.source || {};
+            merged.source.entry = {
+              runner: resolveBrowserFile('client/entry.ts'),
+            };
+
+            return merged;
+          },
+          // Execute after all other plugins to ensure rstest's entry config has the highest priority
+          order: 'post',
         });
       },
     },
@@ -834,10 +935,34 @@ const createBrowserRuntime = async ({
             logger.log(color.cyan('\nFile changed, re-running tests...\n'));
           });
 
-          api.onAfterDevCompile(async () => {
+          api.onAfterDevCompile(async ({ stats }) => {
+            // Collect hashes even during initial build to establish baseline
+            if (stats) {
+              const projectEntries = await collectProjectEntries(context);
+              const entryTestFiles = new Set<string>(
+                projectEntries.flatMap((entry) =>
+                  entry.testFiles.map((f) => normalize(f)),
+                ),
+              );
+
+              const statsJson = stats.toJson({ all: true });
+              const affected = getAffectedTestFiles(
+                statsJson.chunks,
+                entryTestFiles,
+              );
+              watchContext.affectedTestFiles = affected;
+
+              if (affected.length > 0) {
+                logger.debug(
+                  `[Watch] Affected test files: ${affected.join(', ')}`,
+                );
+              }
+            }
+
             if (!watchContext.hooksEnabled) {
               return;
             }
+
             await onTriggerRerun();
           });
         },
@@ -890,10 +1015,8 @@ const createBrowserRuntime = async ({
       res.end(html);
       return true;
     } catch (error) {
-      logger.log(
-        color.yellow(
-          `[Browser UI] Failed to fetch container HTML from dev server: ${String(error)}`,
-        ),
+      logger.debug(
+        `[Browser UI] Failed to fetch container HTML from dev server: ${String(error)}`,
       );
       return false;
     }
@@ -925,10 +1048,8 @@ const createBrowserRuntime = async ({
       res.end(buffer);
       return true;
     } catch (error) {
-      logger.log(
-        color.yellow(
-          `[Browser UI] Failed to proxy asset from dev server: ${String(error)}`,
-        ),
+      logger.debug(
+        `[Browser UI] Failed to proxy asset from dev server: ${String(error)}`,
       );
       return false;
     }
@@ -952,15 +1073,13 @@ const createBrowserRuntime = async ({
         res.statusCode = 204;
         res.end();
       } catch (error) {
-        logger.log(
-          color.yellow(`[Browser UI] Failed to open editor: ${String(error)}`),
-        );
+        logger.debug(`[Browser UI] Failed to open editor: ${String(error)}`);
         res.statusCode = 500;
         res.end('Failed to open editor');
       }
       return;
     }
-    if (url.pathname === '/' || url.pathname === '/container.html') {
+    if (url.pathname === '/') {
       if (await respondWithDevServerHtml(url, res)) {
         return;
       }
@@ -1003,12 +1122,16 @@ const createBrowserRuntime = async ({
 
   const { port } = await devServer.listen();
 
-  // Create WebSocket server on a different port
-  const wsPort = port + 1;
-  const wss = new WebSocketServer({ port: wsPort });
-  logger.log(
-    color.gray(`[Browser UI] WebSocket server started on port ${wsPort}`),
-  );
+  // Create WebSocket server on an available port
+  // Using port: 0 lets the OS assign an available port, avoiding conflicts
+  // when the fixed port (e.g., container port + 1) is already in use
+  const wss = new WebSocketServer({ port: 0 });
+  await new Promise<void>((resolve, reject) => {
+    wss.once('listening', resolve);
+    wss.once('error', reject);
+  });
+  const wsPort = (wss.address() as AddressInfo).port;
+  logger.debug(`[Browser UI] WebSocket server started on port ${wsPort}`);
 
   let browserLauncher: BrowserType;
   const browserName = context.normalizedConfig.browser.browser;
@@ -1059,7 +1182,11 @@ const createBrowserRuntime = async ({
 // Main Entry Point
 // ============================================================================
 
-export const runBrowserController = async (context: Rstest): Promise<void> => {
+export const runBrowserController = async (
+  context: Rstest,
+  options?: BrowserTestRunOptions,
+): Promise<BrowserTestRunResult | void> => {
+  const { skipOnTestRunEnd = false } = options ?? {};
   const buildStart = Date.now();
   const containerDevServerEnv = process.env.RSTEST_CONTAINER_DEV_SERVER;
   let containerDevServer: string | undefined;
@@ -1068,10 +1195,8 @@ export const runBrowserController = async (context: Rstest): Promise<void> => {
   if (containerDevServerEnv) {
     try {
       containerDevServer = new URL(containerDevServerEnv).toString();
-      logger.log(
-        color.gray(
-          `[Browser UI] Using dev server for container: ${containerDevServer}`,
-        ),
+      logger.debug(
+        `[Browser UI] Using dev server for container: ${containerDevServer}`,
       );
     } catch (error) {
       logger.error(
@@ -1276,9 +1401,12 @@ export const runBrowserController = async (context: Rstest): Promise<void> => {
   // Create RPC methods that can access test state variables
   const createRpcMethods = (): HostRpcMethods => ({
     async rerunTest(testFile: string, testNamePattern?: string) {
+      const projectName = context.normalizedConfig.name || 'project';
+      const relativePath = relative(context.rootPath, testFile);
+      const displayPath = `<${projectName}>/${relativePath}`;
       logger.log(
         color.cyan(
-          `\nRe-running test: ${testFile}${testNamePattern ? ` (pattern: ${testNamePattern})` : ''}\n`,
+          `\nRe-running test: ${displayPath}${testNamePattern ? ` (pattern: ${testNamePattern})` : ''}\n`,
         ),
       );
       await rpcManager.reloadTestFile(testFile, testNamePattern);
@@ -1405,14 +1533,12 @@ export const runBrowserController = async (context: Rstest): Promise<void> => {
 
   // Only navigate on first creation
   if (isNewPage) {
-    await containerPage.goto(`http://localhost:${port}/container.html`, {
+    await containerPage.goto(`http://localhost:${port}/`, {
       waitUntil: 'load',
     });
 
     logger.log(
-      color.cyan(
-        `\nContainer page opened at http://localhost:${port}/container.html\n`,
-      ),
+      color.cyan(`\nBrowser mode opened at http://localhost:${port}/\n`),
     );
   }
 
@@ -1474,7 +1600,21 @@ export const runBrowserController = async (context: Rstest): Promise<void> => {
         await rpcManager.notifyTestFileUpdate(currentTestFiles);
       }
 
-      logger.log(color.cyan('Tests will be re-executed automatically\n'));
+      const affectedFiles = watchContext.affectedTestFiles;
+      watchContext.affectedTestFiles = [];
+
+      if (affectedFiles.length > 0) {
+        logger.log(
+          color.cyan(
+            `Re-running ${affectedFiles.length} affected test file(s)...\n`,
+          ),
+        );
+        for (const testFile of affectedFiles) {
+          await rpcManager.reloadTestFile(testFile);
+        }
+      } else if (!filesChanged) {
+        logger.log(color.cyan('Tests will be re-executed automatically\n'));
+      }
     };
   }
 
@@ -1505,14 +1645,24 @@ export const runBrowserController = async (context: Rstest): Promise<void> => {
     ensureProcessExitCode(1);
   }
 
-  for (const reporter of context.reporters) {
-    await reporter.onTestRunEnd?.({
-      results: context.reporterResults.results,
-      testResults: context.reporterResults.testResults,
-      duration,
-      snapshotSummary: context.snapshotManager.summary,
-      getSourcemap: async () => null,
-    });
+  const result: BrowserTestRunResult = {
+    results: reporterResults,
+    testResults: caseResults,
+    duration,
+    hasFailure: isFailure,
+  };
+
+  // Only call onTestRunEnd if not skipped (for unified reporter output)
+  if (!skipOnTestRunEnd) {
+    for (const reporter of context.reporters) {
+      await reporter.onTestRunEnd?.({
+        results: context.reporterResults.results,
+        testResults: context.reporterResults.testResults,
+        duration,
+        snapshotSummary: context.snapshotManager.summary,
+        getSourcemap: async () => null,
+      });
+    }
   }
 
   // Enable watch hooks AFTER initial test run to avoid duplicate runs
@@ -1522,6 +1672,8 @@ export const runBrowserController = async (context: Rstest): Promise<void> => {
       color.cyan('\nWatch mode enabled - will re-run tests on file changes\n'),
     );
   }
+
+  return result;
 };
 
 // ============================================================================

package/src/index.ts

@@ -1,12 +1,19 @@
-import type { Rstest } from '@rstest/core/browser';
+import type {
+  BrowserTestRunOptions,
+  BrowserTestRunResult,
+  Rstest,
+} from '@rstest/core/browser';
 import {
   type ListBrowserTestsResult,
   listBrowserTests as listBrowserTestsImpl,
   runBrowserController,
 } from './hostController';
 
-export async function runBrowserTests(context: Rstest): Promise<void> {
-  await runBrowserController(context);
+export async function runBrowserTests(
+  context: Rstest,
+  options?: BrowserTestRunOptions,
+): Promise<BrowserTestRunResult | void> {
+  return runBrowserController(context, options);
 }
 
 export async function listBrowserTests(
@@ -15,4 +22,8 @@ export async function listBrowserTests(
   return listBrowserTestsImpl(context);
 }
 
-export type { ListBrowserTestsResult };
+export type {
+  BrowserTestRunOptions,
+  BrowserTestRunResult,
+  ListBrowserTestsResult,
+};

package/dist/browser-container/container-static/css/container.dc438e35.css

@@ -1 +0,0 @@
-@import "https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap";@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-duration:initial}::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-space-y-reverse:0;--tw-border-style:solid;--tw-leading:initial;--tw-font-weight:initial;--tw-tracking:initial;--tw-duration:initial}}}@layer theme{:root,:host{--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-gray-400:#99a1af;--color-zinc-950:#09090b;--color-black:#000;--color-white:#fff;--spacing:.25rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--font-weight-medium:500;--font-weight-semibold:600;--tracking-tight:-.025em;--tracking-wide:.025em;--animate-spin:spin 1s linear infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1)}@supports (color:color(display-p3 0 0 0)){:root,:host{--color-gray-400:color(display-p3 .605734 .630385 .680158);--color-zinc-950:color(display-p3 .0353716 .0353595 .0435539)}}@supports (color:lab(0% 0 0)){:root,:host{--color-gray-400:lab(65.9269% -.832707 -8.17473);--color-zinc-950:lab(2.51107% .242703 -.886115)}}}@layer base,components;@layer utilities{.absolute{position:absolute}.absolute\!{position:absolute!important}.relative{position:relative}.inset-0{inset:calc(var(--spacing)*0)}.inset-x-0{inset-inline:calc(var(--spacing)*0)}.bottom-0{bottom:calc(var(--spacing)*0)}.z-10{z-index:10}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing)*0)}.m-0\!{margin:calc(var(--spacing)*0)!important}.m-1\!{margin:calc(var(--spacing)*1)!important}.mr-0\!{margin-right:calc(var(--spacing)*0)!important}.block{display:block}.flex{display:flex}.grid{display:grid}.inline{display:inline}.inline-flex{display:inline-flex}.inline-flex\!{display:inline-flex!important}.h-1\.5{height:calc(var(--spacing)*1.5)}.h-5{height:calc(var(--spacing)*5)}.h-5\!{height:calc(var(--spacing)*5)!important}.h-7{height:calc(var(--spacing)*7)}.h-\[52px\]{height:52px}.h-full{height:100%}.h-screen{height:100vh}.min-h-0{min-height:calc(var(--spacing)*0)}.w-1\.5{width:calc(var(--spacing)*1.5)}.w-5\!{width:calc(var(--spacing)*5)!important}.w-7{width:calc(var(--spacing)*7)}.w-\[18px\]{width:18px}.w-full{width:100%}.flex-1{flex:1}.shrink-0{flex-shrink:0}.translate-y-\[calc\(50\%-2px\)\]{--tw-translate-y:calc(50% - 2px);translate:var(--tw-translate-x)var(--tw-translate-y)}.animate-spin{animation:var(--animate-spin)}.cursor-default{cursor:default}.grid-cols-\[auto_minmax\(0\,1fr\)_auto\]{grid-template-columns:auto minmax(0,1fr) auto}.flex-col{flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.gap-0\.5{gap:calc(var(--spacing)*.5)}.gap-1{gap:calc(var(--spacing)*1)}.gap-1\.5{gap:calc(var(--spacing)*1.5)}.gap-2{gap:calc(var(--spacing)*2)}.gap-\[2px\]{gap:2px}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-hidden{overflow-x:hidden}.overflow-y-auto{overflow-y:auto}.rounded-full{border-radius:3.40282e38px}.border{border-style:var(--tw-border-style);border-width:1px}.border-0{border-style:var(--tw-border-style);border-width:0}.bg-black\/\[0\.02\]{background-color:#00000005}@supports (color:color-mix(in lab, red, red)){.bg-black\/\[0\.02\]{background-color:color-mix(in oklab,var(--color-black)2%,transparent)}}.bg-transparent{background-color:#0000}.bg-zinc-950{background-color:var(--color-zinc-950)}.p-0{padding:calc(var(--spacing)*0)}.p-0\!{padding:calc(var(--spacing)*0)!important}.p-3{padding:calc(var(--spacing)*3)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-2{padding-block:calc(var(--spacing)*2)}.font-mono{font-family:var(--font-mono)}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.text-\[10px\]\!{font-size:10px!important}.text-\[13px\]{font-size:13px}.text-\[13px\]\!{font-size:13px!important}.leading-none{--tw-leading:1;line-height:1}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.font-semibold\!{--tw-font-weight:var(--font-weight-semibold)!important;font-weight:var(--font-weight-semibold)!important}.tracking-tight{--tw-tracking:var(--tracking-tight);letter-spacing:var(--tracking-tight)}.tracking-wide{--tw-tracking:var(--tracking-wide);letter-spacing:var(--tracking-wide)}.text-black\!{color:var(--color-black)!important}.text-gray-400{color:var(--color-gray-400)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-150{--tw-duration:.15s;transition-duration:.15s}.duration-200{--tw-duration:.2s;transition-duration:.2s}.select-none{-webkit-user-select:none;user-select:none}@media (hover:hover){.group-hover\:opacity-100:is(:where(.group):hover *){opacity:1}}}:root{--lightningcss-light: ;--lightningcss-dark:initial;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{color:#eef1f6;background:#06070d;min-height:100vh;margin:0;font-family:Space Grotesk,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif;overflow:hidden}.animate-spin{animation-duration:.6s}@keyframes status-flash{0%{filter:brightness()}5%{filter:brightness(2.5)}15%{filter:brightness(1.8)}40%{filter:brightness(1.3)}to{filter:brightness()}}.status-icon-flash{animation:1.5s ease-out status-flash}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-tracking{syntax:"*";inherits:false}@property --tw-duration{syntax:"*";inherits:false}@keyframes spin{to{transform:rotate(360deg)}}