better-ts-stack 2.1.2 → 2.2.0

package/README.md

@@ -37,6 +37,9 @@ npx better-ts-stack . --framework nextjs --database drizzle --pm pnpm
 | `--auth` / `--no-auth`             | Add authentication                           |
 | `--docker` / `--no-docker`         | Add Docker files                             |
 | `--rate-limit` / `--no-rate-limit` | Add rate limiting (Express and NestJS)       |
+| `--ci` / `--no-ci`                 | Add a GitHub Actions workflow                |
+| `--no-agents`                      | Leave out AGENTS.md (added by default)       |
+| `--vscode` / `--no-vscode`         | Add VS Code settings and extensions          |
 | `--git` / `--no-git`               | Initialize a git repository                  |
 | `--install` / `--no-install`       | Install dependencies                         |
 | `-y`, `--yes`                      | Use defaults for missing options, no prompts |
@@ -46,7 +49,7 @@ npx better-ts-stack . --framework nextjs --database drizzle --pm pnpm
 
 `--database` names the ORM, which also selects the database: `prisma` and `drizzle` use PostgreSQL, `mongoose` uses MongoDB.
 
-With `--yes`, the defaults are Express, no database, no auth, no rate limiting, no Docker, git initialized, and dependencies not installed. The package manager defaults to the one that ran the CLI: `pnpm` for `pnpm dlx`, `bun` for `bunx`, and `npm` otherwise.
+With `--yes`, the defaults are Express, no database, no auth, no rate limiting, no Docker, no CI, no VS Code settings, an `AGENTS.md`, git initialized, and dependencies not installed. The package manager defaults to the one that ran the CLI: `pnpm` for `pnpm dlx`, `bun` for `bunx`, and `npm` otherwise.
 
 The project path can be a name (`my-app`), a nested path (`apps/api`), or `.` for the current directory.
 
@@ -54,12 +57,12 @@ The project path can be a name (`my-app`), a nested path (`apps/api`), or `.` fo
 
 | Project type   | Stack                                   | Optional setup                                                           |
 | -------------- | --------------------------------------- | ------------------------------------------------------------------------ |
-| Backend API    | Express 5 or NestJS 12 + TypeScript     | PostgreSQL, MongoDB, Prisma, Drizzle, Mongoose, JWT auth, Docker, git    |
+| Backend API    | Express 5 or NestJS 12 + TypeScript     | PostgreSQL, MongoDB, Prisma, Drizzle, Mongoose, Better Auth, Docker, git |
 | Full-stack app | Next.js 16 or TanStack Start + React 19 | PostgreSQL, MongoDB, Prisma, Drizzle, Mongoose, Better Auth, Docker, git |
 
 Notes:
 
-- Better Auth is only offered for full-stack projects that use a database.
+- Better Auth is offered for every framework; full-stack projects need a database for it.
 
 ## Interactive Prompt Flow
 
@@ -77,10 +80,15 @@ Without flags, the CLI asks, in order:
 6. Package manager: `npm`, `pnpm`, or `bun`
 7. Docker setup
 8. Authentication
-   - Express and NestJS apps: JWT-based auth
-   - Next.js and TanStack Start apps: Better Auth, only when a database is selected
-9. Git initialization
-10. Dependency installation
+   - Better Auth for every framework
+   - Next.js and TanStack Start apps: only when a database is selected
+9. Rate limiting (Express and NestJS)
+10. GitHub Actions CI
+11. VS Code settings
+12. Git initialization
+13. Dependency installation
+
+`AGENTS.md` and `CLAUDE.md` are added without a question; pass `--no-agents` to leave them out.
 
 The CLI does not ask for a port. Backend projects default to `PORT=3000`.
 
@@ -93,7 +101,7 @@ Every generated project includes:
 - `.env.example` and `.env` setup
 - Ready-to-run project scripts
 - Health check endpoint at `/health` for backend projects
-- shadcn-compatible UI components for Next.js and TanStack Start projects
+- shadcn/ui components built on Base UI for Next.js and TanStack Start projects
 - Database wiring and schema setup when selected
 - Authentication scaffolding when selected
 - Docker files when selected

package/dist/args.js

@@ -23,7 +23,8 @@ Options left out are asked interactively, unless --yes is given.
   --rate-limit, --no-rate-limit
                           Add rate limiting (Express and NestJS)
   --ci, --no-ci           Add a GitHub Actions workflow
-  --agents, --no-agents   Add AGENTS.md for AI coding agents
+  --no-agents             Leave out AGENTS.md for AI coding agents (added by
+                          default)
   --vscode, --no-vscode   Add VS Code settings and recommended extensions
   --git, --no-git         Initialize a git repository
   --install, --no-install Install dependencies

package/dist/builder/buildPlanner.js

@@ -15,7 +15,13 @@ const gitInitializer_1 = require("./gitInitializer");
 const moduleSelector_1 = require("./moduleSelector");
 const templateContext_1 = require("./templateContext");
 // Files the builder writes itself instead of copying them from a module
-const GENERATED_FILES = ["package.json", ".env", ".env.example", "README.md"];
+const GENERATED_FILES = [
+    "package.json",
+    ".env",
+    ".env.example",
+    "README.md",
+    configGenerator_1.STACK_FILE,
+];
 // Loads the selected modules and merges their configurations
 async function loadBuildInputs(config) {
     const selection = (0, moduleSelector_1.selectModules)(config);

package/dist/builder/configGenerator.js

@@ -3,11 +3,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.GENERATED_SECRETS = void 0;
+exports.STACK_FILE = exports.GENERATED_SECRETS = void 0;
 exports.processScriptVariables = processScriptVariables;
 exports.mergeConfigurations = mergeConfigurations;
 exports.generatePackageJson = generatePackageJson;
 exports.generatePnpmWorkspace = generatePnpmWorkspace;
+exports.generateStackFile = generateStackFile;
 exports.generateEnvFile = generateEnvFile;
 // Utilities for merging module configurations and generating project files
 const fs_extra_1 = __importDefault(require("fs-extra"));
@@ -96,7 +97,6 @@ async function generatePackageJson(targetDir, mergedConfig, config) {
 // these are not approved; entries for packages a project lacks are ignored.
 const PNPM_BUILD_DEPENDENCIES = [
     "@prisma/engines",
-    "bcrypt",
     "esbuild",
     "prisma",
     "unrs-resolver",
@@ -128,7 +128,32 @@ async function generatePnpmWorkspace(targetDir, overrides) {
     }
 }
 // Variables that get a random value in .env instead of the module's default
-exports.GENERATED_SECRETS = ["JWT_SECRET", "BETTER_AUTH_SECRET"];
+exports.GENERATED_SECRETS = ["BETTER_AUTH_SECRET"];
+// Name of the file that records how a project was generated
+exports.STACK_FILE = "better-ts-stack.json";
+// Records the stack choices, so later commands (such as adding a module to the
+// project) know what the project was generated with
+async function generateStackFile(targetDir, config) {
+    try {
+        const { version } = (await fs_extra_1.default.readJson(node_path_1.default.join(__dirname, "../../package.json")));
+        const stack = {
+            cliVersion: version,
+            framework: config.framework,
+            database: config.database,
+            packageManager: config.packageManager,
+            auth: config.useAuth,
+            docker: config.useDocker,
+            rateLimit: config.useRateLimit,
+            ci: config.useCi,
+            agents: config.useAgents,
+            vscode: config.useVscode,
+        };
+        await fs_extra_1.default.writeFile(node_path_1.default.join(targetDir, exports.STACK_FILE), JSON.stringify(stack, null, 2) + "\n", "utf-8");
+    }
+    catch (error) {
+        throw (0, types_1.buildError)(error, "STACK_FILE_ERROR", `Failed to write ${exports.STACK_FILE}`);
+    }
+}
 // Generates .env and .env.example files from merged environment variables
 async function generateEnvFile(targetDir, envVars) {
     try {

package/dist/builder/index.js

@@ -52,9 +52,10 @@ async function build(config, targetDir) {
         if (config.packageManager === "pnpm") {
             await (0, configGenerator_1.generatePnpmWorkspace)(targetDir, mergedConfig.overrides);
         }
-        // 7. Generate environment files and the README
+        // 7. Generate environment files, the README, and the stack file
         await (0, configGenerator_1.generateEnvFile)(targetDir, mergedConfig.envVars);
         await (0, readmeGenerator_1.generateReadme)(targetDir, config, mergedConfig);
+        await (0, configGenerator_1.generateStackFile)(targetDir, config);
         // 8. Install dependencies and initialize git (both optional); a failure
         // in either is reported as a warning and does not fail the build
         const depsInstalled = config.installDeps &&

package/dist/builder/readmeGenerator.js

@@ -49,8 +49,8 @@ function renderReadme(config, mergedConfig, targetDir) {
     }
     if (config.useAuth) {
         lines.push(isFullstack
-            ? "- **Auth:** Better Auth with email and password"
-            : "- **Auth:** JWT with `/auth/register`, `/auth/login`, and `/auth/me`");
+            ? "- **Auth:** Better Auth with email and password, email verification, password reset, and GitHub and Google sign-in"
+            : "- **Auth:** Better Auth on `/api/auth` with email and password, email verification, password reset, GitHub and Google sign-in, and bearer tokens; `GET /api/me` is a protected example");
     }
     if (config.useRateLimit) {
         lines.push(`- **Rate limiting:** 100 requests per client IP in 15 minutes${config.useAuth ? ", and 10 sign-up or login attempts" : ""}`);

package/dist/output/nextSteps.js

@@ -24,9 +24,7 @@ function generateNextSteps(config, targetDir, depsInstalled, isForReadme = false
         steps.push("Review the generated .env and set your database connection details");
     }
     if (config.useAuth) {
-        steps.push(isFullstack
-            ? "Review BETTER_AUTH_SECRET and BETTER_AUTH_URL in .env"
-            : "Review the generated JWT_SECRET in .env");
+        steps.push("Review BETTER_AUTH_URL in .env, and add GitHub, Google, or Resend keys when you need them");
     }
     // Step 3: Install dependencies if not already done
     if (!depsInstalled) {
@@ -66,7 +64,7 @@ function generateNextSteps(config, targetDir, depsInstalled, isForReadme = false
     if (config.useAuth) {
         steps.push(isFullstack
             ? "Visit /sign-up to create your first account"
-            : "Create a user via POST /auth/register then login with /auth/login");
+            : "Create a user with POST /api/auth/sign-up/email, then call GET /api/me with the set-auth-token header as a bearer token");
     }
     if (config.useDocker) {
         steps.push(`To run the app in Docker instead: ${config.packageManager} run docker:up`);

package/dist/prompts/stack.js

@@ -84,7 +84,7 @@ async function collectStackChoices(preset) {
     }
     const useAuth = isAuthAvailable
         ? await ask(preset.useAuth, () => (0, ui_1.confirm)({
-            message: isFullstack ? "Add Better Auth?" : "Add JWT authentication?",
+            message: "Add authentication (Better Auth)?",
             initialValue: false,
         }))
         : false;
@@ -96,10 +96,8 @@ async function collectStackChoices(preset) {
         ? false
         : await ask(preset.useRateLimit, () => (0, ui_1.confirm)({ message: "Add rate limiting?", initialValue: false }));
     const useCi = await ask(preset.useCi, () => (0, ui_1.confirm)({ message: "Add GitHub Actions CI?", initialValue: false }));
-    const useAgents = await ask(preset.useAgents, () => (0, ui_1.confirm)({
-        message: "Add AGENTS.md for AI coding agents?",
-        initialValue: false,
-    }));
+    // AGENTS.md is always added without asking; --no-agents leaves it out
+    const useAgents = preset.useAgents ?? true;
     const useVscode = await ask(preset.useVscode, () => (0, ui_1.confirm)({ message: "Add VS Code settings?", initialValue: false }));
     const initGit = await ask(preset.initGit, () => (0, ui_1.confirm)({ message: "Initialize a git repository?", initialValue: true }));
     const installDeps = await ask(preset.installDeps, () => (0, ui_1.confirm)({ message: "Install dependencies now?", initialValue: false }));

package/dist/types/index.js

@@ -13,7 +13,7 @@ exports.DEFAULT_CHOICES = {
     useAuth: false,
     useRateLimit: false,
     useCi: false,
-    useAgents: false,
+    useAgents: true,
     useVscode: false,
     packageManager: "npm",
     initGit: true,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "better-ts-stack",
-  "version": "2.1.2",
+  "version": "2.2.0",
   "description": "A CLI that scaffolds Express, NestJS, Next.js, and TanStack Start projects with a database, authentication, and Docker already set up.",
   "keywords": [
     "cli",

package/templates/backend/express/src/env.ts.hbs

@@ -22,8 +22,19 @@ const envSchema = z.object({
   MONGODB_URI: z.url(),
 {{/if}}
 {{#if useAuth}}
-  JWT_SECRET: z.string().min(32, "JWT_SECRET must be at least 32 characters"),
-  JWT_EXPIRES_IN: z.string().default("1h"),
+  BETTER_AUTH_SECRET: z
+    .string()
+    .min(32, "BETTER_AUTH_SECRET must be at least 32 characters"),
+  // The public URL of this server; links in emails point here
+  BETTER_AUTH_URL: z.url(),
+  // Optional: GitHub and Google sign-in are turned on when both are set
+  GITHUB_CLIENT_ID: z.string().optional(),
+  GITHUB_CLIENT_SECRET: z.string().optional(),
+  GOOGLE_CLIENT_ID: z.string().optional(),
+  GOOGLE_CLIENT_SECRET: z.string().optional(),
+  // Optional: without it, emails are printed to the log
+  RESEND_API_KEY: z.string().optional(),
+  EMAIL_FROM: z.string().default("onboarding@resend.dev"),
 {{/if}}
 });
 

package/templates/backend/express/src/index.ts.hbs

@@ -16,9 +16,17 @@ import { connectDB, disconnectDB } from "./lib/db";
 {{#if useRateLimit}}
 import { apiLimiter } from "./middleware/rateLimit";
 {{/if}}
+{{#if useAuth}}
+import { toNodeHandler } from "better-auth/node";
+{{#if (eq database 'mongoose')}}
+import { auth, mongoClient } from "./lib/auth";
+{{else}}
+import { auth } from "./lib/auth";
+{{/if}}
+{{/if}}
 import healthRouter from "./routes/health";
 {{#if useAuth}}
-import authRouter from "./routes/auth";
+import meRouter from "./routes/me";
 {{/if}}
 
 const app: Express = express();
@@ -26,18 +34,35 @@ const port = env.PORT;
 
 // Middleware
 app.use(helmet());
+{{#if useAuth}}
+// Browser clients read the bearer token from the set-auth-token header
+app.use(cors({ origin: env.CORS_ORIGIN, exposedHeaders: ["set-auth-token"] }));
+{{else}}
 app.use(cors({ origin: env.CORS_ORIGIN }));
+{{/if}}
 {{#if useRateLimit}}
 app.use(apiLimiter);
 {{/if}}
 app.use(morgan("dev"));
+{{#if useAuth}}
+// Better Auth reads the client IP for its rate limits from this header. It is
+// set from req.ip on every request, so a client cannot pick its own value.
+// Behind a reverse proxy, set app.set("trust proxy", 1) for the real client IP
+app.use("/api/auth", (req: Request, _res: Response, next: NextFunction) => {
+  req.headers["x-client-ip"] = req.ip;
+  next();
+});
+// Sign-up, sign-in, sessions, email verification, and password reset. Better
+// Auth reads the request body itself, so it is mounted before express.json()
+app.all("/api/auth/*splat", toNodeHandler(auth));
+{{/if}}
 app.use(express.json());
 app.use(express.urlencoded({ extended: true }));
 
 // Routes
 app.use("/health", healthRouter);
 {{#if useAuth}}
-app.use("/auth", authRouter);
+app.use("/api/me", meRouter);
 {{/if}}
 
 // 404 handler
@@ -73,7 +98,11 @@ function closeDatabase(): Promise<void> {
 {{else if (eq database 'drizzle')}}
   return db.$client.end();
 {{else if (eq database 'mongoose')}}
+{{#if useAuth}}
+  return Promise.all([disconnectDB(), mongoClient.close()]).then(() => undefined);
+{{else}}
   return disconnectDB();
+{{/if}}
 {{else}}
   return Promise.resolve();
 {{/if}}

package/templates/backend/nestjs/src/app.module.ts.hbs

@@ -16,6 +16,9 @@ import { AuthModule } from "./auth/auth.module.js";
 import { DatabaseModule } from "./database/database.module.js";
 {{/if}}
 import { HealthController } from "./health/health.controller.js";
+{{#if useAuth}}
+import { MeController } from "./me/me.controller.js";
+{{/if}}
 {{#if (eq database 'prisma')}}
 import { PrismaModule } from "./prisma/prisma.module.js";
 {{/if}}
@@ -39,7 +42,7 @@ import { PrismaModule } from "./prisma/prisma.module.js";
     ThrottlerModule.forRoot([{ ttl: 15 * 60 * 1000, limit: 100 }]),
     {{/if}}
   ],
-  controllers: [HealthController],
+  controllers: [HealthController{{#if useAuth}}, MeController{{/if}}],
   {{#if useRateLimit}}
   providers: [{ provide: APP_GUARD, useClass: ThrottlerGuard }],
   {{/if}}

package/templates/backend/nestjs/src/env.ts.hbs

@@ -22,8 +22,19 @@ const envSchema = z.object({
   MONGODB_URI: z.url(),
 {{/if}}
 {{#if useAuth}}
-  JWT_SECRET: z.string().min(32, "JWT_SECRET must be at least 32 characters"),
-  JWT_EXPIRES_IN: z.string().default("1h"),
+  BETTER_AUTH_SECRET: z
+    .string()
+    .min(32, "BETTER_AUTH_SECRET must be at least 32 characters"),
+  // The public URL of this server; links in emails point here
+  BETTER_AUTH_URL: z.url(),
+  // Optional: GitHub and Google sign-in are turned on when both are set
+  GITHUB_CLIENT_ID: z.string().optional(),
+  GITHUB_CLIENT_SECRET: z.string().optional(),
+  GOOGLE_CLIENT_ID: z.string().optional(),
+  GOOGLE_CLIENT_SECRET: z.string().optional(),
+  // Optional: without it, emails are printed to the log
+  RESEND_API_KEY: z.string().optional(),
+  EMAIL_FROM: z.string().default("onboarding@resend.dev"),
 {{/if}}
 });
 

package/templates/backend/nestjs/src/health/health.controller.ts.hbs

@@ -2,12 +2,19 @@ import { Controller, Get } from "@nestjs/common";
 {{#if useRateLimit}}
 import { SkipThrottle } from "@nestjs/throttler";
 {{/if}}
+{{#if useAuth}}
+import { AllowAnonymous } from "@thallesp/nestjs-better-auth";
+{{/if}}
 
 {{#if useRateLimit}}
 // Docker and load balancers call the health check on a schedule, so it is not
 // counted
 @SkipThrottle()
 {{/if}}
+{{#if useAuth}}
+// Every route needs a session unless it is marked public
+@AllowAnonymous()
+{{/if}}
 @Controller("health")
 export class HealthController {
   @Get()

package/templates/backend/nestjs/src/{main.ts → main.ts.hbs}

@@ -7,11 +7,22 @@ import { AppModule } from "./app.module.js";
 import { env } from "./env.js";
 
 async function bootstrap(): Promise<void> {
+{{#if useAuth}}
+  // Better Auth reads the body of its own routes; the auth module adds the
+  // JSON and form parsers back for every other route
+  const app = await NestFactory.create(AppModule, { bodyParser: false });
+{{else}}
   const app = await NestFactory.create(AppModule);
+{{/if}}
   const port = env.PORT;
 
   app.use(helmet());
+{{#if useAuth}}
+  // Browser clients read the bearer token from the set-auth-token header
+  app.enableCors({ origin: env.CORS_ORIGIN, exposedHeaders: ["set-auth-token"] });
+{{else}}
   app.enableCors({ origin: env.CORS_ORIGIN });
+{{/if}}
   // Lets modules close database connections when the process is stopped
   app.enableShutdownHooks();
 

package/templates/frontend/nextjs/app/globals.css

@@ -1,89 +1,129 @@
 @import "tailwindcss";
+@import "tw-animate-css";
+@import "shadcn/tailwind.css";
 
-:root {
-  --radius: 0.65rem;
-  --background: oklch(1 0 0);
-  --foreground: oklch(0.145 0 0);
-  --card: oklch(1 0 0);
-  --card-foreground: oklch(0.145 0 0);
-  --popover: oklch(1 0 0);
-  --popover-foreground: oklch(0.145 0 0);
-  --primary: oklch(0.205 0 0);
-  --primary-foreground: oklch(0.985 0 0);
-  --secondary: oklch(0.97 0 0);
-  --secondary-foreground: oklch(0.205 0 0);
-  --muted: oklch(0.97 0 0);
-  --muted-foreground: oklch(0.556 0 0);
-  --accent: oklch(0.97 0 0);
-  --accent-foreground: oklch(0.205 0 0);
-  --destructive: oklch(0.577 0.245 27.325);
-  --border: oklch(0.922 0 0);
-  --input: oklch(0.922 0 0);
-  --ring: oklch(0.708 0 0);
-  --chart-1: oklch(0.646 0.222 41.116);
-  --chart-2: oklch(0.6 0.118 184.704);
-  --chart-3: oklch(0.398 0.07 227.392);
-  --chart-4: oklch(0.828 0.189 84.429);
-  --chart-5: oklch(0.769 0.188 70.08);
-  --radius: 0.625rem;
-  --sidebar: oklch(0.985 0 0);
-  --sidebar-foreground: oklch(0.145 0 0);
-  --sidebar-primary: oklch(0.205 0 0);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.97 0 0);
-  --sidebar-accent-foreground: oklch(0.205 0 0);
-  --sidebar-border: oklch(0.922 0 0);
-  --sidebar-ring: oklch(0.708 0 0);
-}
+@custom-variant dark (&:is(.dark *));
 
-.dark {
-  --background: oklch(0.145 0 0);
-  --foreground: oklch(0.985 0 0);
-  --card: oklch(0.205 0 0);
-  --card-foreground: oklch(0.985 0 0);
-  --popover: oklch(0.205 0 0);
-  --popover-foreground: oklch(0.985 0 0);
-  --primary: oklch(0.922 0 0);
-  --primary-foreground: oklch(0.205 0 0);
-  --secondary: oklch(0.269 0 0);
-  --secondary-foreground: oklch(0.985 0 0);
-  --muted: oklch(0.269 0 0);
-  --muted-foreground: oklch(0.708 0 0);
-  --accent: oklch(0.269 0 0);
-  --accent-foreground: oklch(0.985 0 0);
-  --destructive: oklch(0.704 0.191 22.216);
-  --border: oklch(1 0 0 / 10%);
-  --input: oklch(1 0 0 / 15%);
-  --ring: oklch(0.556 0 0);
-  --chart-1: oklch(0.488 0.243 264.376);
-  --chart-2: oklch(0.696 0.17 162.48);
-  --chart-3: oklch(0.769 0.188 70.08);
-  --chart-4: oklch(0.627 0.265 303.9);
-  --chart-5: oklch(0.645 0.246 16.439);
-  --sidebar: oklch(0.205 0 0);
-  --sidebar-foreground: oklch(0.985 0 0);
-  --sidebar-primary: oklch(0.488 0.243 264.376);
-  --sidebar-primary-foreground: oklch(0.985 0 0);
-  --sidebar-accent: oklch(0.269 0 0);
-  --sidebar-accent-foreground: oklch(0.985 0 0);
-  --sidebar-border: oklch(1 0 0 / 10%);
-  --sidebar-ring: oklch(0.556 0 0);
-}
-* {
-  border-color: var(--border);
+@theme inline {
+    --font-heading: var(--font-sans);
+    --font-sans: var(--font-sans);
+    --color-sidebar-ring: var(--sidebar-ring);
+    --color-sidebar-border: var(--sidebar-border);
+    --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+    --color-sidebar-accent: var(--sidebar-accent);
+    --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+    --color-sidebar-primary: var(--sidebar-primary);
+    --color-sidebar-foreground: var(--sidebar-foreground);
+    --color-sidebar: var(--sidebar);
+    --color-chart-5: var(--chart-5);
+    --color-chart-4: var(--chart-4);
+    --color-chart-3: var(--chart-3);
+    --color-chart-2: var(--chart-2);
+    --color-chart-1: var(--chart-1);
+    --color-ring: var(--ring);
+    --color-input: var(--input);
+    --color-border: var(--border);
+    --color-destructive: var(--destructive);
+    --color-accent-foreground: var(--accent-foreground);
+    --color-accent: var(--accent);
+    --color-muted-foreground: var(--muted-foreground);
+    --color-muted: var(--muted);
+    --color-secondary-foreground: var(--secondary-foreground);
+    --color-secondary: var(--secondary);
+    --color-primary-foreground: var(--primary-foreground);
+    --color-primary: var(--primary);
+    --color-popover-foreground: var(--popover-foreground);
+    --color-popover: var(--popover);
+    --color-card-foreground: var(--card-foreground);
+    --color-card: var(--card);
+    --color-foreground: var(--foreground);
+    --color-background: var(--background);
+    --radius-sm: calc(var(--radius) * 0.6);
+    --radius-md: calc(var(--radius) * 0.8);
+    --radius-lg: var(--radius);
+    --radius-xl: calc(var(--radius) * 1.4);
+    --radius-2xl: calc(var(--radius) * 1.8);
+    --radius-3xl: calc(var(--radius) * 2.2);
+    --radius-4xl: calc(var(--radius) * 2.6);
 }
 
-body {
-  background: var(--background);
-  color: var(--foreground);
-  font-family: var(--font-geist-sans), sans-serif;
+:root {
+    --background: oklch(1 0 0);
+    --foreground: oklch(0.145 0 0);
+    --card: oklch(1 0 0);
+    --card-foreground: oklch(0.145 0 0);
+    --popover: oklch(1 0 0);
+    --popover-foreground: oklch(0.145 0 0);
+    --primary: oklch(0.205 0 0);
+    --primary-foreground: oklch(0.985 0 0);
+    --secondary: oklch(0.97 0 0);
+    --secondary-foreground: oklch(0.205 0 0);
+    --muted: oklch(0.97 0 0);
+    --muted-foreground: oklch(0.556 0 0);
+    --accent: oklch(0.97 0 0);
+    --accent-foreground: oklch(0.205 0 0);
+    --destructive: oklch(0.577 0.245 27.325);
+    --border: oklch(0.922 0 0);
+    --input: oklch(0.922 0 0);
+    --ring: oklch(0.708 0 0);
+    --chart-1: oklch(0.87 0 0);
+    --chart-2: oklch(0.556 0 0);
+    --chart-3: oklch(0.439 0 0);
+    --chart-4: oklch(0.371 0 0);
+    --chart-5: oklch(0.269 0 0);
+    --radius: 0.625rem;
+    --sidebar: oklch(0.985 0 0);
+    --sidebar-foreground: oklch(0.145 0 0);
+    --sidebar-primary: oklch(0.205 0 0);
+    --sidebar-primary-foreground: oklch(0.985 0 0);
+    --sidebar-accent: oklch(0.97 0 0);
+    --sidebar-accent-foreground: oklch(0.205 0 0);
+    --sidebar-border: oklch(0.922 0 0);
+    --sidebar-ring: oklch(0.708 0 0);
 }
 
-a {
-  text-underline-offset: 0.2rem;
+.dark {
+    --background: oklch(0.145 0 0);
+    --foreground: oklch(0.985 0 0);
+    --card: oklch(0.205 0 0);
+    --card-foreground: oklch(0.985 0 0);
+    --popover: oklch(0.205 0 0);
+    --popover-foreground: oklch(0.985 0 0);
+    --primary: oklch(0.922 0 0);
+    --primary-foreground: oklch(0.205 0 0);
+    --secondary: oklch(0.269 0 0);
+    --secondary-foreground: oklch(0.985 0 0);
+    --muted: oklch(0.269 0 0);
+    --muted-foreground: oklch(0.708 0 0);
+    --accent: oklch(0.269 0 0);
+    --accent-foreground: oklch(0.985 0 0);
+    --destructive: oklch(0.704 0.191 22.216);
+    --border: oklch(1 0 0 / 10%);
+    --input: oklch(1 0 0 / 15%);
+    --ring: oklch(0.556 0 0);
+    --chart-1: oklch(0.87 0 0);
+    --chart-2: oklch(0.556 0 0);
+    --chart-3: oklch(0.439 0 0);
+    --chart-4: oklch(0.371 0 0);
+    --chart-5: oklch(0.269 0 0);
+    --sidebar: oklch(0.205 0 0);
+    --sidebar-foreground: oklch(0.985 0 0);
+    --sidebar-primary: oklch(0.488 0.243 264.376);
+    --sidebar-primary-foreground: oklch(0.985 0 0);
+    --sidebar-accent: oklch(0.269 0 0);
+    --sidebar-accent-foreground: oklch(0.985 0 0);
+    --sidebar-border: oklch(1 0 0 / 10%);
+    --sidebar-ring: oklch(0.556 0 0);
 }
 
-::selection {
-  background: color-mix(in oklab, var(--accent) 65%, white);
-  color: var(--foreground);
+@layer base {
+  * {
+    @apply border-border outline-ring/50;
+    }
+  body {
+    @apply bg-background text-foreground;
+    }
+  html {
+    @apply font-sans;
+    }
 }