npm - @ozdao/martyrs - Versions diffs - 0.2.571 → 0.2.574 - Mend

@ozdao/martyrs 0.2.571 → 0.2.574

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (819) hide show

package/dist/builder.js CHANGED Viewed

@@ -1,7 +1,7 @@
 import history from "connect-history-api-fallback";
 import path from "path";
 import chalk from "chalk";
-import core, { rspack as rspack$2, ProgressPlugin } from "@rspack/core";
+import core, { rspack as rspack$2, ProgressPlugin, experiments } from "@rspack/core";
 import devMiddleware from "webpack-dev-middleware";
 import express from "express";
 import fs, { readFileSync } from "fs";
@@ -12,11 +12,9 @@ import { CleanWebpackPlugin } from "clean-webpack-plugin";
 import { RsdoctorRspackPlugin } from "@rsdoctor/rspack-plugin";
 import { BundleAnalyzerPlugin } from "webpack-bundle-analyzer";
 import Dotenv from "dotenv-webpack";
-import glob from "glob-all";
 import { merge } from "webpack-merge";
 import { StatsWriterPlugin } from "webpack-stats-plugin";
 import { InjectManifest } from "@aaroon/workbox-rspack-plugin";
-import { PurgeCSSPlugin } from "purgecss-webpack-plugin";
 import { RspackManifestPlugin } from "rspack-manifest-plugin";
 import nodeExternals from "webpack-node-externals";
 function createSpaDevServer(projectRoot, configs, createServer) {
@@ -125,6 +123,27 @@ function createSpaProdServer(projectRoot, configs, createServer) {
 const template = `
   <html {{{ meta.htmlAttrs }}}>
     <head {{{ meta.headAttrs }}}>
+      <script>
+        // Blocking theme script для SPA (SSR уже добавил атрибуты через meta.htmlAttrs)
+        (function() {
+          var root = document.documentElement;
+          if (root.hasAttribute('data-theme')) return;
+          try {
+            var theme = (document.cookie.match(/theme=([^;]+)/) || [])[1];
+            if (theme === 'dark') {
+              root.classList.add('dark-theme');
+              root.setAttribute('data-theme', 'dark');
+              root.setAttribute('color-scheme', 'dark');
+            } else if (theme === 'light') {
+              root.classList.add('light-theme');
+              root.setAttribute('data-theme', 'light');
+              root.setAttribute('color-scheme', 'light');
+            } else {
+              root.setAttribute('color-scheme', 'light dark');
+            }
+          } catch(e) {}
+        })();
+      </script>
       {{{ meta.headTags }}}
       <meta charset="UTF-8">
@@ -519,21 +538,27 @@ function createSsrDevServer(projectRoot, configs, createServer) {
     cachedStatsJson = stats.toJson({
       assets: true,
       chunks: true,
-      modules: true,
+      modules: false,
       entrypoints: true,
-      chunkModules: true
+      chunkModules: false,
+      assetsByChunkName: true
     });
   });
   const clientDevMiddleware = devMiddleware(clientCompiler, {
     publicPath: client.output.publicPath,
     serverSideRender: true,
     stats: {
-      children: true,
+      preset: "normal",
       assets: true,
-      chunks: true,
-      modules: true,
+      assetsSpace: 15,
+      chunks: false,
+      chunkModules: false,
+      modules: false,
+      children: false,
       entrypoints: true,
-      chunkModules: true
+      timings: true,
+      colors: true,
+      groupAssetsByPath: true
     }
   });
   const port = process.env.PORT || 8080;
@@ -555,6 +580,7 @@ function createSsrDevServer(projectRoot, configs, createServer) {
         {
           url: req.originalUrl,
           cookies: req.cookies,
+          headers: req.headers,
           languages: req.acceptsLanguages()
         },
         res.locals.webpack.devMiddleware
@@ -622,6 +648,7 @@ function createSsrProdServer(projectRoot, configs, createServer) {
       const { html, meta, state, statusCode, usedModules, loadedModules } = await _renderApp({
         url: req.originalUrl,
         cookies: req.cookies,
+        headers: req.headers,
         languages: req.acceptsLanguages(),
         ssrContext
       });
@@ -682,6 +709,1137 @@ function createSsrProdServer(projectRoot, configs, createServer) {
   };
   return start;
 }
+class MartyrsJIT {
+  constructor(options = {}) {
+    this.rules = options.rules || [];
+    this.variants = options.variants || [];
+    this.cache = /* @__PURE__ */ new Map();
+    this.usedTokens = /* @__PURE__ */ new Set();
+  }
+  /**
+   * Добавить правило
+   * @param {RegExp} pattern - паттерн для матча токена
+   * @param {Function} handler - (match) => css string
+   */
+  addRule(pattern, handler) {
+    this.rules.push([pattern, handler]);
+  }
+  /**
+   * Добавить вариант
+   * @param {string} name - имя варианта (mobile, hover, etc)
+   * @param {Function} wrapper - (selector, css) => wrapped css
+   */
+  addVariant(name, wrapper) {
+    this.variants.push({ name, wrapper });
+  }
+  /**
+   * Генерирует CSS для одного токена
+   * @param {string} token - CSS класс (например "cols-[1fr_3fr]" или "mobile:hover:bg-main")
+   * @returns {string|null} CSS или null если не матчит
+   */
+  generateForToken(token) {
+    if (this.cache.has(token)) {
+      return this.cache.get(token);
+    }
+    const appliedVariants = [];
+    let baseToken = token;
+    while (true) {
+      let found = false;
+      for (const variant of this.variants) {
+        if (baseToken.startsWith(variant.name + ":")) {
+          appliedVariants.push(variant);
+          baseToken = baseToken.slice(variant.name.length + 1);
+          found = true;
+          break;
+        }
+      }
+      if (!found) break;
+    }
+    for (const [pattern, handler] of this.rules) {
+      const match = baseToken.match(pattern);
+      if (match) {
+        let css = handler(match, this);
+        if (!css) continue;
+        const selector = this.escapeSelector(token);
+        if (appliedVariants.length === 0) {
+          css = `.${selector} { ${css} }`;
+        } else {
+          const pseudoVariants = appliedVariants.filter(
+            (v) => ["hover", "focus", "active", "disabled", "first", "last", "odd", "even", "group-hover"].includes(v.name)
+          );
+          const mediaVariants = appliedVariants.filter(
+            (v) => ["mobile", "tablet", "desktop", "widescreen", "dark", "light", "print"].includes(v.name)
+          );
+          let pseudoSuffix = "";
+          for (const v of pseudoVariants) {
+            const pseudoMap = {
+              "hover": ":hover",
+              "focus": ":focus",
+              "active": ":active",
+              "disabled": ":disabled",
+              "first": ":first-child",
+              "last": ":last-child",
+              "odd": ":nth-child(odd)",
+              "even": ":nth-child(even)",
+              "group-hover": ""
+              // special case
+            };
+            pseudoSuffix += pseudoMap[v.name] || "";
+          }
+          let result;
+          if (pseudoVariants.some((v) => v.name === "group-hover")) {
+            result = `.group:hover .${selector}${pseudoSuffix} { ${css} }`;
+          } else {
+            result = `.${selector}${pseudoSuffix} { ${css} }`;
+          }
+          for (const v of mediaVariants.reverse()) {
+            const mediaMap = {
+              "mobile": "@media (max-width: 640px)",
+              "tablet": "@media (min-width: 641px) and (max-width: 1024px)",
+              "desktop": "@media (min-width: 1025px) and (max-width: 1440px)",
+              "widescreen": "@media (min-width: 1441px)",
+              "dark": "@media (prefers-color-scheme: dark)",
+              "light": "@media (prefers-color-scheme: light)",
+              "print": "@media print"
+            };
+            const media = mediaMap[v.name];
+            if (media) {
+              result = `${media} { ${result} }`;
+            }
+          }
+          css = result;
+        }
+        this.cache.set(token, css);
+        return css;
+      }
+    }
+    return null;
+  }
+  /**
+   * Экранирует специальные символы в CSS селекторе
+   */
+  escapeSelector(selector) {
+    return selector.replace(/\[/g, "\\[").replace(/\]/g, "\\]").replace(/\(/g, "\\(").replace(/\)/g, "\\)").replace(/:/g, "\\:").replace(/\//g, "\\/").replace(/%/g, "\\%").replace(/\./g, "\\.").replace(/,/g, "\\,").replace(/_/g, "\\_").replace(/#/g, "\\#").replace(/\+/g, "\\+").replace(/\*/g, "\\*").replace(/!/g, "\\!").replace(/'/g, "\\'").replace(/"/g, '\\"').replace(/`/g, "\\`").replace(/;/g, "\\;").replace(/\{/g, "\\{").replace(/\}/g, "\\}");
+  }
+  /**
+   * Генерирует CSS для массива токенов
+   * @param {string[]} tokens
+   * @returns {string} CSS
+   */
+  generate(tokens) {
+    const groups = {
+      base: [],
+      hover: [],
+      focus: [],
+      active: [],
+      disabled: [],
+      first: [],
+      last: [],
+      odd: [],
+      even: [],
+      groupHover: [],
+      widescreen: [],
+      desktop: [],
+      tablet: [],
+      mobile: [],
+      dark: [],
+      light: [],
+      print: []
+    };
+    for (const token of tokens) {
+      if (this.usedTokens.has(token)) continue;
+      const css = this.generateForToken(token);
+      if (!css) continue;
+      this.usedTokens.add(token);
+      if (token.includes("mobile:")) groups.mobile.push(css);
+      else if (token.includes("tablet:")) groups.tablet.push(css);
+      else if (token.includes("desktop:")) groups.desktop.push(css);
+      else if (token.includes("widescreen:")) groups.widescreen.push(css);
+      else if (token.includes("dark:")) groups.dark.push(css);
+      else if (token.includes("light:")) groups.light.push(css);
+      else if (token.includes("print:")) groups.print.push(css);
+      else if (token.includes("group-hover:")) groups.groupHover.push(css);
+      else if (token.includes("hover:")) groups.hover.push(css);
+      else if (token.includes("focus:")) groups.focus.push(css);
+      else if (token.includes("active:")) groups.active.push(css);
+      else if (token.includes("disabled:")) groups.disabled.push(css);
+      else if (token.includes("first:")) groups.first.push(css);
+      else if (token.includes("last:")) groups.last.push(css);
+      else if (token.includes("odd:")) groups.odd.push(css);
+      else if (token.includes("even:")) groups.even.push(css);
+      else groups.base.push(css);
+    }
+    return [
+      ...groups.base,
+      ...groups.hover,
+      ...groups.focus,
+      ...groups.active,
+      ...groups.disabled,
+      ...groups.first,
+      ...groups.last,
+      ...groups.odd,
+      ...groups.even,
+      ...groups.groupHover,
+      ...groups.widescreen,
+      ...groups.desktop,
+      ...groups.tablet,
+      ...groups.mobile,
+      ...groups.dark,
+      ...groups.light,
+      ...groups.print
+    ].join("\n");
+  }
+  /**
+   * Парсит значение в скобках [...]
+   * Заменяет _ на пробел (как в Tailwind)
+   * Добавляет пробелы вокруг + и - в calc()
+   * @param {string} value - например "1fr_3fr" или "var(--medium)"
+   * @returns {string} - "1fr 3fr" или "var(--medium)"
+   */
+  parseArbitraryValue(value) {
+    let result = value.replace(/_/g, " ");
+    result = result.replace(/(\d)([+-])(\d)/g, "$1 $2 $3");
+    result = result.replace(/(\))([+-])(\d)/g, "$1 $2 $3");
+    result = result.replace(/(\d)([+-])(\()/g, "$1 $2 $3");
+    result = result.replace(/(%)([+-])(\d)/g, "$1 $2 $3");
+    return result;
+  }
+  /**
+   * Получить весь сгенерированный CSS
+   */
+  getCSS() {
+    return Array.from(this.cache.values()).join("\n");
+  }
+  /**
+   * Очистить кэш (для watch mode)
+   */
+  reset() {
+    this.cache.clear();
+    this.usedTokens.clear();
+  }
+}
+const sizeVars = ["extra", "big", "semi", "medium", "regular", "small", "thin", "micro", "nano"];
+const colorNames = [
+  "main",
+  "second",
+  "third",
+  "fourth",
+  "fifth",
+  "black",
+  "dark",
+  "grey",
+  "light",
+  "white",
+  "red",
+  "red-nice",
+  "green",
+  "green-nice",
+  "orange",
+  "orange-nice",
+  "yellow",
+  "yellow-nice",
+  "youtube",
+  "telegram",
+  "twitter",
+  "instagram",
+  "reddit",
+  "transparent"
+];
+const colorVariants = ["extra", "big", "semi", "medium", "regular", "small", "thin", "micro", "nano"];
+function resolveColor(name) {
+  for (const color of colorNames) {
+    if (name === color) {
+      return `rgb(var(--${color}))`;
+    }
+    for (const variant of colorVariants) {
+      if (name === `${color}-${variant}`) {
+        return `var(--${color}-${variant})`;
+      }
+    }
+  }
+  return null;
+}
+function resolveValue(value, jit) {
+  if (!value) return null;
+  if (value.startsWith("[") && value.endsWith("]")) {
+    const inner = value.slice(1, -1);
+    return jit ? jit.parseArbitraryValue(inner) : inner.replace(/_/g, " ");
+  }
+  if (sizeVars.includes(value)) return `var(--${value})`;
+  if (/^\d+r$/.test(value)) return value.replace("r", "rem");
+  if (/^\d+(vh|vw|dvh|dvw|svh|svw|lvh|lvw|deg)$/.test(value)) return value;
+  if (/^\d+$/.test(value)) return `${value}%`;
+  if (value === "auto") return "auto";
+  if (value === "zero") return "0";
+  if (value === "full") return "100%";
+  if (value === "screen") return "100vh";
+  if (value === "min") return "min-content";
+  if (value === "max") return "max-content";
+  if (value === "fit") return "fit-content";
+  return null;
+}
+const dir = { t: "top", r: "right", b: "bottom", l: "left" };
+const easings = {
+  "linear": "linear",
+  "ease": "ease",
+  "ease-in": "ease-in",
+  "ease-out": "ease-out",
+  "ease-in-out": "ease-in-out",
+  // Standard easings
+  "sine-in": "cubic-bezier(0.12,0,0.39,0)",
+  "sine-out": "cubic-bezier(0.61,1,0.88,1)",
+  "sine-in-out": "cubic-bezier(0.37,0,0.63,1)",
+  "quad-in": "cubic-bezier(0.11,0,0.5,0)",
+  "quad-out": "cubic-bezier(0.5,1,0.89,1)",
+  "quad-in-out": "cubic-bezier(0.45,0,0.55,1)",
+  "cubic": "cubic-bezier(0.65,0,0.35,1)",
+  "cubic-in": "cubic-bezier(0.32,0,0.67,0)",
+  "cubic-out": "cubic-bezier(0.33,1,0.68,1)",
+  "cubic-in-out": "cubic-bezier(0.65,0,0.35,1)",
+  "quart-in": "cubic-bezier(0.5,0,0.75,0)",
+  "quart-out": "cubic-bezier(0.25,1,0.5,1)",
+  "quart-in-out": "cubic-bezier(0.76,0,0.24,1)",
+  "quint-in": "cubic-bezier(0.64,0,0.78,0)",
+  "quint-out": "cubic-bezier(0.22,1,0.36,1)",
+  "quint-in-out": "cubic-bezier(0.83,0,0.17,1)",
+  "expo-in": "cubic-bezier(0.7,0,0.84,0)",
+  "expo-out": "cubic-bezier(0.16,1,0.3,1)",
+  "expo-in-out": "cubic-bezier(0.87,0,0.13,1)",
+  "circ-in": "cubic-bezier(0.55,0,1,0.45)",
+  "circ-out": "cubic-bezier(0,0.55,0.45,1)",
+  "circ-in-out": "cubic-bezier(0.85,0,0.15,1)",
+  "back-in": "cubic-bezier(0.36,0,0.66,-0.56)",
+  "back-out": "cubic-bezier(0.34,1.56,0.64,1)",
+  "back-in-out": "cubic-bezier(0.68,-0.6,0.32,1.6)",
+  "elastic": "cubic-bezier(0.17,0.67,0.33,0.94)",
+  "spring": "cubic-bezier(0.23,1,0.32,1.01)",
+  "bounce": "cubic-bezier(0.71,-0.46,0.88,0.6)"
+};
+function handleNegative(val, jit) {
+  const isNeg = val.endsWith("-negative");
+  const clean = isNeg ? val.slice(0, -9) : val;
+  const resolved = resolveValue(clean, jit);
+  if (!resolved) return null;
+  return isNeg ? `calc(${resolved} * -1)` : resolved;
+}
+const rules = [
+  // Display
+  [/^d-(block|inline|inline-block|flex|inline-flex|grid|inline-grid|none|contents|table|table-row|table-cell)$/, (m) => `display: ${m[1]};`],
+  // Position
+  [/^pos-(relative|absolute|fixed|sticky|static)$/, (m) => `position: ${m[1]};`],
+  [/^pos-(t|r|b|l)-(.+)$/, (m, jit) => {
+    const v = handleNegative(m[2], jit);
+    return v ? `${dir[m[1]]}: ${v};` : null;
+  }],
+  // Grid
+  [/^cols-(.+)$/, (m, jit) => {
+    if (m[1].startsWith("[")) {
+      const v = resolveValue(m[1], jit);
+      return v ? `display: grid; grid-template-columns: ${v};` : null;
+    }
+    const n = parseInt(m[1]);
+    if (n > 0) return `display: grid; grid-template-columns: repeat(${n}, minmax(0, 1fr));`;
+    return null;
+  }],
+  [/^rows-(.+)$/, (m, jit) => {
+    if (m[1].startsWith("[")) {
+      const v = resolveValue(m[1], jit);
+      return v ? `display: grid; grid-template-rows: ${v};` : null;
+    }
+    const n = parseInt(m[1]);
+    if (n > 0) return `display: grid; grid-template-rows: repeat(${n}, minmax(0, 1fr));`;
+    return null;
+  }],
+  // Gap (специфичные перед общими)
+  [/^gap-x-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `column-gap: ${v};` : null;
+  }],
+  [/^gap-y-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `row-gap: ${v};` : null;
+  }],
+  [/^gap-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `gap: ${v};` : null;
+  }],
+  // Size (специфичные перед общими)
+  [/^w-min-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `min-width: ${v};` : null;
+  }],
+  [/^w-max-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `max-width: ${v};` : null;
+  }],
+  [/^h-min-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `min-height: ${v};` : null;
+  }],
+  [/^h-max-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `max-height: ${v};` : null;
+  }],
+  [/^w-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `width: ${v};` : null;
+  }],
+  [/^h-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `height: ${v};` : null;
+  }],
+  // Padding (специфичные перед общими)
+  [/^pd-(t|r|b|l)-(.+)$/, (m, jit) => {
+    const v = handleNegative(m[2], jit);
+    return v ? `padding-${dir[m[1]]}: ${v};` : null;
+  }],
+  [/^pd-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `padding: ${v};` : null;
+  }],
+  // Margin (специфичные перед общими)
+  [/^mn-(t|r|b|l)-(.+)$/, (m, jit) => {
+    const v = handleNegative(m[2], jit);
+    return v ? `margin-${dir[m[1]]}: ${v};` : null;
+  }],
+  [/^mn-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `margin: ${v};` : null;
+  }],
+  // Border radius (специфичные перед общими)
+  [/^radius-tl-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `border-top-left-radius: ${v};` : null;
+  }],
+  [/^radius-tr-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `border-top-right-radius: ${v};` : null;
+  }],
+  [/^radius-bl-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `border-bottom-left-radius: ${v};` : null;
+  }],
+  [/^radius-br-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `border-bottom-right-radius: ${v};` : null;
+  }],
+  [/^radius-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `border-radius: ${v};` : null;
+  }],
+  // Inset
+  [/^top-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `top: ${v};` : null;
+  }],
+  [/^right-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `right: ${v};` : null;
+  }],
+  [/^bottom-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `bottom: ${v};` : null;
+  }],
+  [/^left-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `left: ${v};` : null;
+  }],
+  [/^inset-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `inset: ${v};` : null;
+  }],
+  // Z-index (z-index-0..10 → 0, 10, 20..100, z-index-1-negative → -10)
+  [/^z-index-(\d+)(-negative)?$/, (m) => {
+    const val = parseInt(m[1]) * 10;
+    return `z-index: ${m[2] ? -val : val};`;
+  }],
+  // Z-index (z-0, z-10, z-[100])
+  [/^z-(.+)$/, (m) => {
+    if (m[1].startsWith("[")) return `z-index: ${m[1].slice(1, -1)};`;
+    if (/^\d+$/.test(m[1])) return `z-index: ${m[1]};`;
+    if (m[1] === "auto") return "z-index: auto;";
+    return null;
+  }],
+  // Flex
+  [/^flex-center$/, () => "align-items: center; justify-content: center;"],
+  [/^flex-(h-center|justify-start|justify-center|justify-end|justify-between|justify-around)$/, (m) => {
+    const map = { "h-center": "center", "justify-start": "flex-start", "justify-center": "center", "justify-end": "flex-end", "justify-between": "space-between", "justify-around": "space-around" };
+    return `justify-content: ${map[m[1]]};`;
+  }],
+  [/^flex-(v-center|align-start|align-center|align-end|align-stretch|align-baseline)$/, (m) => {
+    const map = { "v-center": "center", "align-start": "flex-start", "align-center": "center", "align-end": "flex-end", "align-stretch": "stretch", "align-baseline": "baseline" };
+    return `align-items: ${map[m[1]]};`;
+  }],
+  [/^flex-(row|column|row-reverse|column-reverse)$/, (m) => `flex-direction: ${m[1]};`],
+  [/^flex-(wrap|nowrap)$/, (m) => `flex-wrap: ${m[1]};`],
+  [/^flex-\[(.+)\]$/, (m, jit) => `flex: ${jit.parseArbitraryValue(m[1])};`],
+  [/^basis-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `flex-basis: ${v};` : null;
+  }],
+  [/^order-(.+)$/, (m) => {
+    if (m[1].startsWith("[")) return `order: ${m[1].slice(1, -1)};`;
+    if (/^\d+$/.test(m[1])) return `order: ${m[1]};`;
+    return null;
+  }],
+  // Flex child
+  [/^flex-child-none$/, () => "flex: none;"],
+  [/^flex-child-noresize$/, () => "flex: 0;"],
+  [/^flex-child-1$/, () => "flex: 1;"],
+  [/^flex-child-auto$/, () => "flex: auto;"],
+  [/^flex-child-default$/, () => "flex: 0 0 auto;"],
+  [/^flex-child-initial$/, () => "flex: initial;"],
+  [/^flex-child-grow-(\d+)$/, (m) => `flex-grow: ${m[1]};`],
+  [/^flex-child-shrink-(\d+)$/, (m) => `flex-shrink: ${m[1]};`],
+  [/^flex-child-basis-(auto|0)$/, (m) => `flex-basis: ${m[1]};`],
+  [/^flex-child-order-(\d+|last)$/, (m) => `order: ${m[1] === "last" ? "9999" : m[1]};`],
+  // Align self
+  [/^align-self-(start|center|end|stretch|baseline|auto)$/, (m) => `align-self: ${m[1]};`],
+  // Overflow
+  [/^o-(hidden|scroll|auto|visible|clip)$/, (m) => `overflow: ${m[1]};`],
+  [/^o-x-(hidden|scroll|auto|visible|clip)$/, (m) => `overflow-x: ${m[1]};`],
+  [/^o-y-(hidden|scroll|auto|visible|clip)$/, (m) => `overflow-y: ${m[1]};`],
+  // Text
+  [/^t-(left|center|right|justify)$/, (m) => `text-align: ${m[1]};`],
+  [/^text-\[(.+)\]$/, (m, jit) => `font-size: ${jit.parseArbitraryValue(m[1])};`],
+  [/^leading-\[(.+)\]$/, (m, jit) => `line-height: ${jit.parseArbitraryValue(m[1])};`],
+  [/^tracking-\[(.+)\]$/, (m, jit) => `letter-spacing: ${jit.parseArbitraryValue(m[1])};`],
+  // Colors - transparency (bg-main-transp-50 → rgba(var(--main), 0.5))
+  [/^bg-(.+)-transp-(\d+)$/, (m) => {
+    const color = m[1];
+    const opacity = parseInt(m[2]) / 100;
+    if (colorNames.includes(color)) return `background: rgba(var(--${color}), ${opacity});`;
+    return null;
+  }],
+  [/^t-(.+)-transp-(\d+)$/, (m) => {
+    const color = m[1];
+    const opacity = parseInt(m[2]) / 100;
+    if (colorNames.includes(color)) return `color: rgba(var(--${color}), ${opacity});`;
+    return null;
+  }],
+  [/^fill-(.+)-transp-(\d+)$/, (m) => {
+    const color = m[1];
+    const opacity = parseInt(m[2]) / 100;
+    if (colorNames.includes(color)) return `fill: rgba(var(--${color}), ${opacity});`;
+    return null;
+  }],
+  // Gradient arbitrary: bg-grad-[135deg_main_white], bg-grad-[to-r_black_transparent]
+  [/^bg-grad-\[(.+)\]$/, (m, jit) => {
+    const parts = jit.parseArbitraryValue(m[1]).split(" ");
+    if (parts.length < 3) return null;
+    let dir2 = parts[0];
+    if (dir2.startsWith("to-")) {
+      const dirMap = { "t": "to top", "tr": "to top right", "r": "to right", "br": "to bottom right", "b": "to bottom", "bl": "to bottom left", "l": "to left", "tl": "to top left" };
+      dir2 = dirMap[dir2.slice(3)] || "to bottom";
+    }
+    const resolveGradColor = (c) => {
+      if (c === "transparent") return "transparent";
+      if (c.startsWith("#")) return c;
+      const match = c.match(/^([a-z]+)-(\d+)$/);
+      if (match && colorNames.includes(match[1])) return `rgba(var(--${match[1]}), ${parseInt(match[2]) / 100})`;
+      if (colorNames.includes(c)) return `rgb(var(--${c}))`;
+      return c;
+    };
+    const colors = parts.slice(1).map(resolveGradColor).join(", ");
+    return `background: linear-gradient(${dir2}, ${colors});`;
+  }],
+  // Colors (arbitrary) - ПЕРЕД named чтобы [#fff] не попал в named
+  [/^bg-\[(.+)\]$/, (m, jit) => `background: ${jit.parseArbitraryValue(m[1])};`],
+  [/^t-\[(.+)\]$/, (m, jit) => `color: ${jit.parseArbitraryValue(m[1])};`],
+  [/^fill-\[(.+)\]$/, (m, jit) => `fill: ${jit.parseArbitraryValue(m[1])};`],
+  [/^stroke-\[(.+)\]$/, (m, jit) => `stroke: ${jit.parseArbitraryValue(m[1])};`],
+  // Colors - named (bg-main, bg-main-medium, t-black, fill-white)
+  [/^bg-([a-z][\w-]*)$/, (m) => {
+    const v = resolveColor(m[1]);
+    return v ? `background: ${v};` : null;
+  }],
+  [/^t-([a-z][\w-]*)$/, (m) => {
+    const v = resolveColor(m[1]);
+    return v ? `color: ${v};` : null;
+  }],
+  [/^fill-([a-z][\w-]*)$/, (m) => {
+    const v = resolveColor(m[1]);
+    return v ? `fill: ${v};` : null;
+  }],
+  [/^stroke-([a-z][\w-]*)$/, (m) => {
+    const v = resolveColor(m[1]);
+    return v ? `stroke: ${v};` : null;
+  }],
+  // Transform (через CSS-переменные для комбинирования)
+  [/^translate-x-(.+)$/, (m, jit) => {
+    const v = handleNegative(m[1], jit);
+    return v ? `--m-tx: ${v};` : null;
+  }],
+  [/^translate-y-(.+)$/, (m, jit) => {
+    const v = handleNegative(m[1], jit);
+    return v ? `--m-ty: ${v};` : null;
+  }],
+  [/^translate-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `--m-tx: ${v}; --m-ty: ${v};` : null;
+  }],
+  [/^rotate-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `--m-rotate: ${v};` : null;
+  }],
+  [/^scale-x-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `--m-scale-x: ${v};` : null;
+  }],
+  [/^scale-y-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `--m-scale-y: ${v};` : null;
+  }],
+  [/^scale-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `--m-scale-x: ${v}; --m-scale-y: ${v};` : null;
+  }],
+  [/^skew-x-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `--m-skew-x: ${v};` : null;
+  }],
+  [/^skew-y-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `--m-skew-y: ${v};` : null;
+  }],
+  // Aspect ratio (aspect-16x9, aspect-4x3, aspect-1x1)
+  [/^aspect-(\d+)x(\d+)$/, (m) => `aspect-ratio: ${m[1]} / ${m[2]};`],
+  // Object fit
+  [/^object-fit-(cover|contain|fill|none|scale-down)$/, (m) => `object-fit: ${m[1]};`],
+  // Backdrop blur (bg-blur-medium, bg-blur-[10px])
+  [/^bg-blur-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `backdrop-filter: blur(${v});` : null;
+  }],
+  // Borders (box-shadow inset) - специфичные перед общими
+  // Side + color: br-t-green, br-l-red (1px default)
+  [/^br-(t|r|b|l)-(.+)-transp-(\d+)$/, (m) => {
+    const color = m[2];
+    const opacity = parseInt(m[3]) / 100;
+    if (!colorNames.includes(color)) return null;
+    const c = `rgba(var(--${color}), ${opacity})`;
+    if (m[1] === "t") return `box-shadow: inset 0 1px 0 0 ${c};`;
+    if (m[1] === "r") return `box-shadow: inset -1px 0 0 0 ${c};`;
+    if (m[1] === "b") return `box-shadow: inset 0 -1px 0 0 ${c};`;
+    if (m[1] === "l") return `box-shadow: inset 1px 0 0 0 ${c};`;
+    return null;
+  }],
+  [/^br-(t|r|b|l)-([a-z][\w-]*)$/, (m) => {
+    const v = resolveColor(m[2]);
+    if (!v) return null;
+    if (m[1] === "t") return `box-shadow: inset 0 1px 0 0 ${v};`;
+    if (m[1] === "r") return `box-shadow: inset -1px 0 0 0 ${v};`;
+    if (m[1] === "b") return `box-shadow: inset 0 -1px 0 0 ${v};`;
+    if (m[1] === "l") return `box-shadow: inset 1px 0 0 0 ${v};`;
+    return null;
+  }],
+  // Single sides with width: br-t-1px, br-r-2px, br-b-1px, br-l-1px
+  [/^br-t-(\d+)px$/, (m) => `box-shadow: inset 0 ${m[1]}px 0 0 var(--br-color, currentColor);`],
+  [/^br-r-(\d+)px$/, (m) => `box-shadow: inset -${m[1]}px 0 0 0 var(--br-color, currentColor);`],
+  [/^br-b-(\d+)px$/, (m) => `box-shadow: inset 0 -${m[1]}px 0 0 var(--br-color, currentColor);`],
+  [/^br-l-(\d+)px$/, (m) => `box-shadow: inset ${m[1]}px 0 0 0 var(--br-color, currentColor);`],
+  // All sides: br-1px, br-2px, br-[3px]
+  [/^br-(\d+)px$/, (m) => `box-shadow: inset 0 0 0 ${m[1]}px var(--br-color, currentColor);`],
+  [/^br-\[(\d+px)\]$/, (m) => `box-shadow: inset 0 0 0 ${m[1]} var(--br-color, currentColor);`],
+  // Border colors: br-grey, br-main, br-black-transp-50
+  [/^br-(.+)-transp-(\d+)$/, (m) => {
+    const color = m[1];
+    const opacity = parseInt(m[2]) / 100;
+    if (colorNames.includes(color)) return `--br-color: rgba(var(--${color}), ${opacity});`;
+    return null;
+  }],
+  [/^br-([a-z][\w-]*)$/, (m) => {
+    const v = resolveColor(m[1]);
+    return v ? `--br-color: ${v};` : null;
+  }],
+  // Opacity (opacity-50, opacity-[0.75])
+  [/^opacity-(\d+)$/, (m) => `opacity: ${parseInt(m[1]) / 100};`],
+  [/^opacity-\[(.+)\]$/, (m) => `opacity: ${m[1]};`],
+  // Box shadows: bs-{size}, bs-{color}, bs-{color}-{size}, bs-none, bs-[...]
+  // Sizes: nano, micro, thin, small, regular, medium, semi, big, extra
+  // Colors: any from colorNames (black, dark, main, etc.)
+  [/^bs-(nano|micro|thin|small|regular|medium|semi|big|extra)$/, (m) => {
+    const scale = { nano: 0.5, micro: 1, thin: 2, small: 3, regular: 4, medium: 5, semi: 6, big: 8, extra: 10 };
+    const s = scale[m[1]];
+    return `box-shadow: 0 ${s}px ${s * 2}px rgba(var(--dark),0.05), 0 ${s * 2}px ${s * 4}px rgba(var(--dark),0.08), 0 ${s * 3}px ${s * 6}px rgba(var(--dark),0.10);`;
+  }],
+  [/^bs-([a-z]+)-(nano|micro|thin|small|regular|medium|semi|big|extra)$/, (m) => {
+    const color = m[1];
+    if (!colorNames.includes(color)) return null;
+    const scale = { nano: 0.5, micro: 1, thin: 2, small: 3, regular: 4, medium: 5, semi: 6, big: 8, extra: 10 };
+    const s = scale[m[2]];
+    return `box-shadow: 0 ${s}px ${s * 2}px rgba(var(--${color}),0.05), 0 ${s * 2}px ${s * 4}px rgba(var(--${color}),0.08), 0 ${s * 3}px ${s * 6}px rgba(var(--${color}),0.10);`;
+  }],
+  [/^bs-([a-z]+)$/, (m) => {
+    if (!colorNames.includes(m[1])) return null;
+    return `box-shadow: 0 4px 8px rgba(var(--${m[1]}),0.05), 0 8px 16px rgba(var(--${m[1]}),0.08), 0 12px 24px rgba(var(--${m[1]}),0.10);`;
+  }],
+  [/^bs-none$/, () => "box-shadow: none;"],
+  [/^bs-\[(.+)\]$/, (m, jit) => `box-shadow: ${jit.parseArbitraryValue(m[1])};`],
+  // Transitions: ease-{type}, ease-{type}-{ms}, duration-{ms}, delay-{ms}
+  [/^ease-([a-z-]+)-(\d+)$/, (m) => {
+    const easing = easings[m[1]];
+    return easing ? `transition: all ${parseInt(m[2]) / 1e3}s ${easing};` : null;
+  }],
+  [/^ease-([a-z-]+)$/, (m) => {
+    const easing = easings[m[1]];
+    return easing ? `transition: all 0.33s ${easing};` : null;
+  }],
+  [/^duration-(\d+)$/, (m) => `transition-duration: ${parseInt(m[1]) / 1e3}s;`],
+  [/^delay-(\d+)$/, (m) => `transition-delay: ${parseInt(m[1]) / 1e3}s;`],
+  // Pointer events
+  [/^no-events$/, () => "pointer-events: none;"],
+  // Width/Height с min() (w-m-66r → width: min(100%, 66rem))
+  [/^w-m-(\d+)r$/, (m) => `width: min(100%, ${m[1]}rem);`],
+  [/^h-m-(\d+)r$/, (m) => `height: min(100%, ${m[1]}rem);`],
+  // Font weight (fw-bold, fw-500, fw-[600])
+  [/^fw-(bold|demi|semi|medium|regular|light)$/, (m) => {
+    const map = { bold: 900, demi: 700, semi: 600, medium: 500, regular: 400, light: 300 };
+    return `font-weight: ${map[m[1]]};`;
+  }],
+  [/^fw-\[(.+)\]$/, (m) => `font-weight: ${m[1]};`],
+  [/^fw-(\d+)$/, (m) => `font-weight: ${m[1]};`],
+  // White-space (ws-nowrap, ws-pre-line)
+  [/^ws-(nowrap|normal|pre|pre-line|pre-wrap|break-spaces)$/, (m) => `white-space: ${m[1]};`],
+  // Line-height (lh-medium, lh-125, lh-[1.75])
+  [/^lh-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `line-height: ${v};` : null;
+  }],
+  // Text transform
+  [/^uppercase$/, () => "text-transform: uppercase;"],
+  [/^lowercase$/, () => "text-transform: lowercase;"],
+  [/^capitalize$/, () => "text-transform: capitalize;"],
+  // Text decoration
+  [/^underline$/, () => "text-decoration: underline;"],
+  [/^line-through$/, () => "text-decoration: line-through;"],
+  // User select
+  [/^select-none$/, () => "-webkit-user-select: none; user-select: none;"],
+  // Truncate (truncate, line-clamp-1, line-clamp-[5])
+  [/^truncate$/, () => "overflow: hidden; text-overflow: ellipsis; white-space: nowrap;"],
+  [/^line-clamp-(\d+)$/, (m) => `display: -webkit-box; -webkit-box-orient: vertical; overflow: hidden; -webkit-line-clamp: ${m[1]};`],
+  // Cursor (cursor-pointer, cursor-move, cursor-grab, etc.)
+  [/^cursor-(pointer|move|text|help|wait|crosshair|not-allowed|grab|grabbing|default|none|auto)$/, (m) => `cursor: ${m[1]};`],
+  [/^cursor-(ns|ew|ne|nw|se|sw|n|e|s|w)-resize$/, (m) => `cursor: ${m[1]}-resize;`],
+  // Icon sizes (i-extra, i-big, i-medium, etc.) - используют CSS переменные
+  [/^i-(extra|big|semi|medium|regular|small|thin|micro|nano)$/, (m) => `width: var(--${m[1]}); height: var(--${m[1]});`],
+  // Flex shrink (flex-shrink-0, flex-shrink-1)
+  [/^flex-shrink-(\d+)$/, (m) => `flex-shrink: ${m[1]};`],
+  // Scroll snap type (scroll-snap-x-mandatory, scroll-snap-y-proximity)
+  [/^scroll-snap-(x|y)-(mandatory|proximity)$/, (m) => `scroll-snap-type: ${m[1]} ${m[2]};`],
+  // Scroll snap align (scroll-snap-start, scroll-snap-center)
+  [/^scroll-snap-(start|end|center|none)$/, (m) => `scroll-snap-align: ${m[1]};`],
+  // Scroll behavior (scroll-smooth, scroll-auto)
+  [/^scroll-(auto|smooth)$/, (m) => `scroll-behavior: ${m[1]};`],
+  // Scroll padding (scroll-pd-medium, scroll-pd-t-small) - через resolveValue
+  [/^scroll-pd-(t|r|b|l)-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[2], jit);
+    return v ? `scroll-padding-${dir[m[1]]}: ${v};` : null;
+  }],
+  [/^scroll-pd-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `scroll-padding: ${v};` : null;
+  }],
+  // Scroll margin (scroll-mn-medium, scroll-mn-t-small) - через resolveValue
+  [/^scroll-mn-(t|r|b|l)-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[2], jit);
+    return v ? `scroll-margin-${dir[m[1]]}: ${v};` : null;
+  }],
+  [/^scroll-mn-(.+)$/, (m, jit) => {
+    const v = resolveValue(m[1], jit);
+    return v ? `scroll-margin: ${v};` : null;
+  }],
+  // Overscroll (overscroll-x-contain, overscroll-none)
+  [/^overscroll-(x|y)-(auto|contain|none)$/, (m) => `overscroll-behavior-${m[1]}: ${m[2]};`],
+  [/^overscroll-(auto|contain|none)$/, (m) => `overscroll-behavior: ${m[1]};`],
+  // Scroll hide (scroll-hide)
+  [/^scroll-hide$/, () => `-ms-overflow-style: none; scrollbar-width: none;`]
+];
+const variants = [
+  // ========================================
+  // RESPONSIVE BREAKPOINTS
+  // ========================================
+  {
+    name: "mobile",
+    wrapper: (selector, css, jit) => `@media (max-width: 640px) { .${selector} { ${css} } }`
+  },
+  {
+    name: "tablet",
+    wrapper: (selector, css, jit) => `@media (min-width: 641px) and (max-width: 1024px) { .${selector} { ${css} } }`
+  },
+  {
+    name: "desktop",
+    wrapper: (selector, css, jit) => `@media (min-width: 1025px) and (max-width: 1440px) { .${selector} { ${css} } }`
+  },
+  {
+    name: "widescreen",
+    wrapper: (selector, css, jit) => `@media (min-width: 1441px) { .${selector} { ${css} } }`
+  },
+  // ========================================
+  // PSEUDO-CLASSES
+  // ========================================
+  {
+    name: "hover",
+    wrapper: (selector, css) => `.${selector}:hover { ${css} }`
+  },
+  {
+    name: "focus",
+    wrapper: (selector, css) => `.${selector}:focus { ${css} }`
+  },
+  {
+    name: "active",
+    wrapper: (selector, css) => `.${selector}:active { ${css} }`
+  },
+  {
+    name: "disabled",
+    wrapper: (selector, css) => `.${selector}:disabled { ${css} }`
+  },
+  {
+    name: "first",
+    wrapper: (selector, css) => `.${selector}:first-child { ${css} }`
+  },
+  {
+    name: "last",
+    wrapper: (selector, css) => `.${selector}:last-child { ${css} }`
+  },
+  {
+    name: "odd",
+    wrapper: (selector, css) => `.${selector}:nth-child(odd) { ${css} }`
+  },
+  {
+    name: "even",
+    wrapper: (selector, css) => `.${selector}:nth-child(even) { ${css} }`
+  },
+  // ========================================
+  // COLOR SCHEME
+  // ========================================
+  {
+    name: "dark",
+    wrapper: (selector, css) => `@media (prefers-color-scheme: dark) { .${selector} { ${css} } }`
+  },
+  {
+    name: "light",
+    wrapper: (selector, css) => `@media (prefers-color-scheme: light) { .${selector} { ${css} } }`
+  },
+  // ========================================
+  // GROUP VARIANTS
+  // ========================================
+  {
+    name: "group-hover",
+    wrapper: (selector, css) => `.group:hover .${selector} { ${css} }`
+  },
+  // ========================================
+  // PRINT
+  // ========================================
+  {
+    name: "print",
+    wrapper: (selector, css) => `@media print { .${selector} { ${css} } }`
+  }
+];
+const TOKEN_REGEX = /[A-Za-z][A-Za-z0-9_:-]*(?:\[[^\]]+\])?/g;
+const CLASS_ATTR_REGEX = /class(?:Name)?=["'`]([^"'`]+)["'`]/g;
+const DYNAMIC_CLASS_REGEX = /:class=["'`{[]([^"'`]+)["'`}\]]/g;
+const BLOCKLIST = /* @__PURE__ */ new Set([
+  // JS keywords
+  "import",
+  "export",
+  "from",
+  "const",
+  "let",
+  "var",
+  "function",
+  "return",
+  "if",
+  "else",
+  "for",
+  "while",
+  "switch",
+  "case",
+  "break",
+  "continue",
+  "true",
+  "false",
+  "null",
+  "undefined",
+  "this",
+  "new",
+  "class",
+  "extends",
+  "async",
+  "await",
+  "try",
+  "catch",
+  "finally",
+  "throw",
+  "typeof",
+  "instanceof",
+  "default",
+  "delete",
+  "do",
+  "in",
+  "of",
+  "void",
+  "with",
+  "yield",
+  // HTML tags
+  "div",
+  "span",
+  "template",
+  "script",
+  "style",
+  "head",
+  "body",
+  "html",
+  "section",
+  "article",
+  "header",
+  "footer",
+  "nav",
+  "aside",
+  "main",
+  "form",
+  "input",
+  "button",
+  "select",
+  "option",
+  "textarea",
+  "label",
+  "table",
+  "thead",
+  "tbody",
+  "tfoot",
+  "tr",
+  "th",
+  "td",
+  "ul",
+  "ol",
+  "li",
+  "dl",
+  "dt",
+  "dd",
+  "a",
+  "p",
+  "h1",
+  "h2",
+  "h3",
+  "h4",
+  "h5",
+  "h6",
+  "img",
+  "video",
+  "audio",
+  "canvas",
+  "svg",
+  "path",
+  "slot",
+  "component",
+  "transition",
+  "keep-alive",
+  // Vue
+  "ref",
+  "reactive",
+  "computed",
+  "watch",
+  "onMounted",
+  "onUnmounted",
+  "defineProps",
+  "defineEmits",
+  "defineExpose",
+  "withDefaults",
+  // Common
+  "props",
+  "emit",
+  "attrs",
+  "slots",
+  "setup",
+  "data",
+  "methods",
+  "mounted"
+]);
+function isValidToken(token) {
+  if (token.length < 2) return false;
+  if (BLOCKLIST.has(token)) return false;
+  if (token.includes("...")) return false;
+  if (token.includes("[]")) return false;
+  if (/^\d+$/.test(token)) return false;
+  if (/^\d/.test(token)) return false;
+  if (/^[a-z]+$/i.test(token) && token.length > 10) return false;
+  return true;
+}
+function extractTokens(content, filename = "") {
+  const tokens = /* @__PURE__ */ new Set();
+  for (const match of content.matchAll(CLASS_ATTR_REGEX)) {
+    const classString = match[1];
+    const classes = classString.split(/\s+/).filter(Boolean);
+    for (const cls of classes) {
+      if (isValidToken(cls)) {
+        tokens.add(cls);
+      }
+    }
+  }
+  for (const match of content.matchAll(DYNAMIC_CLASS_REGEX)) {
+    const binding = match[1];
+    const bindingTokens = binding.match(TOKEN_REGEX) || [];
+    for (const cls of bindingTokens) {
+      if (isValidToken(cls)) {
+        tokens.add(cls);
+      }
+    }
+    const stringLiterals = binding.match(/['"]([^'"]+)['"]/g) || [];
+    for (const literal of stringLiterals) {
+      const cleaned = literal.slice(1, -1);
+      const classes = cleaned.split(/\s+/).filter(Boolean);
+      for (const cls of classes) {
+        if (isValidToken(cls)) {
+          tokens.add(cls);
+        }
+      }
+    }
+  }
+  for (const match of content.matchAll(TOKEN_REGEX)) {
+    const token = match[0];
+    if (isValidToken(token)) {
+      tokens.add(token);
+    }
+  }
+  return tokens;
+}
+const { VirtualModulesPlugin } = experiments;
+const PLUGIN_NAME = "MartyrsJitPlugin";
+const VIRTUAL_MODULE_ID = "martyrs-jit.css";
+const VIRTUAL_MODULE_PATH = "node_modules/.martyrs/__martyrs.css";
+const LAYER_PLACEHOLDER = "#--martyrs--{layer:__ALL__}";
+const LAYER_PLACEHOLDER_RE = /#--martyrs--\s*\{\s*layer\s*:\s*(.+?)\s*;?\s*\}/g;
+class MartyrsJitPlugin {
+  constructor(options = {}) {
+    this.options = {
+      extensions: options.extensions || [".vue", ".js", ".jsx", ".ts", ".tsx"],
+      include: options.include || ["src"],
+      exclude: options.exclude || ["node_modules", "dist", ".git"],
+      verbose: options.verbose || false,
+      ...options
+    };
+    this.jit = new MartyrsJIT();
+    for (const [pattern, handler] of rules) {
+      this.jit.addRule(pattern, handler);
+    }
+    for (const variant of variants) {
+      this.jit.addVariant(variant.name, variant.wrapper);
+    }
+    this.tokensByFile = /* @__PURE__ */ new Map();
+    this.virtualModules = null;
+  }
+  apply(compiler) {
+    const projectRoot = compiler.context;
+    this.virtualModules = new VirtualModulesPlugin({
+      [VIRTUAL_MODULE_PATH]: LAYER_PLACEHOLDER
+    });
+    this.virtualModules.apply(compiler);
+    compiler.options.resolve = compiler.options.resolve || {};
+    compiler.options.resolve.alias = compiler.options.resolve.alias || {};
+    compiler.options.resolve.alias[VIRTUAL_MODULE_ID] = path.join(projectRoot, VIRTUAL_MODULE_PATH);
+    const loaderPath = path.resolve(import.meta.dirname, "loader.js");
+    const extensionsRegex = new RegExp(
+      `\\.(${this.options.extensions.map((e) => e.slice(1)).join("|")})$`
+    );
+    compiler.options.module = compiler.options.module || {};
+    compiler.options.module.rules = compiler.options.module.rules || [];
+    compiler.options.module.rules.unshift({
+      test: extensionsRegex,
+      enforce: "pre",
+      use: [{
+        loader: loaderPath,
+        options: {
+          plugin: this,
+          include: this.options.include,
+          exclude: this.options.exclude
+        }
+      }]
+    });
+    compiler.hooks.thisCompilation.tap(PLUGIN_NAME, (compilation) => {
+      compilation.hooks.processAssets.tap(
+        {
+          name: PLUGIN_NAME,
+          stage: compilation.constructor.PROCESS_ASSETS_STAGE_OPTIMIZE_SIZE
+        },
+        (assets) => {
+          const startTime = performance.now();
+          const css = this.generateCSS();
+          const duration = performance.now() - startTime;
+          for (const [filename, asset] of Object.entries(assets)) {
+            if (!filename.endsWith(".css") && !filename.endsWith(".js")) {
+              continue;
+            }
+            let source = asset.source().toString();
+            let replaced = false;
+            source = source.replace(LAYER_PLACEHOLDER_RE, () => {
+              replaced = true;
+              return css;
+            });
+            if (source.includes("#--martyrs--")) {
+              source = source.replace(
+                /#--martyrs--[^}]*\{[^}]*layer[^}]*:[^}]*__ALL__[^}]*;?\s*\}/g,
+                css.replace(/\\/g, "\\\\").replace(/"/g, '\\"')
+              );
+              replaced = true;
+            }
+            if (replaced) {
+              const { RawSource } = compiler.webpack.sources;
+              compilation.updateAsset(filename, new RawSource(source));
+              console.log(`[MartyrsJIT] ${this.tokens.size} tokens in ${duration.toFixed(2)}ms`);
+            }
+          }
+        }
+      );
+    });
+    compiler.hooks.watchRun.tap(PLUGIN_NAME, (compiler2) => {
+      if (compiler2.removedFiles) {
+        for (const file of compiler2.removedFiles) {
+          this.tokensByFile.delete(file);
+        }
+      }
+      this.jit.reset();
+    });
+  }
+  /**
+   * Извлекает токены из файла (вызывается из loader)
+   */
+  extractFromFile(content, filename) {
+    const isIncluded = this.options.include.some(
+      (dir2) => filename.includes(`/${dir2}/`) || filename.includes(`\\${dir2}\\`) || filename.includes(dir2)
+    );
+    const isExcluded = this.options.exclude.some(
+      (dir2) => filename.includes(dir2)
+    );
+    if (!isIncluded || isExcluded) {
+      return;
+    }
+    const fileTokens = extractTokens(content, filename);
+    this.tokensByFile.set(filename, new Set(fileTokens));
+  }
+  /**
+   * Собирает все токены из всех файлов (дедупликация через Set)
+   */
+  get tokens() {
+    const allTokens = /* @__PURE__ */ new Set();
+    for (const tokens of this.tokensByFile.values()) {
+      for (const t of tokens) allTokens.add(t);
+    }
+    return allTokens;
+  }
+  /**
+   * Генерирует CSS
+   */
+  generateCSS() {
+    const tokens = Array.from(this.tokens);
+    const css = this.jit.generate(tokens);
+    return `/* Martyrs JIT - ${tokens.length} tokens */
+@layer base, components, utilities;
+@layer utilities {
+${css}
+}`;
+  }
+}
 const baseConfig = (projectRoot) => {
   return {
     context: projectRoot,
@@ -786,6 +1944,12 @@ const baseConfig = (projectRoot) => {
     },
     plugins: [
       ...process.env.BUNDLE_ANALYZER ? [new RsdoctorRspackPlugin(), new BundleAnalyzerPlugin()] : [],
+      // Martyrs JIT CSS Engine
+      new MartyrsJitPlugin({
+        include: ["src", "martyrs"],
+        extensions: [".vue", ".js", ".jsx", ".ts", ".tsx"],
+        verbose: process.env.NODE_ENV !== "production"
+      }),
       new VueLoaderPlugin(),
       // Используем CssExtractRspackPlugin в обоих режимах
       new rspack$2.CssExtractRspackPlugin({
@@ -869,41 +2033,15 @@ const clientConfig = (projectRoot) => {
           all: false,
           assets: true,
           chunks: true,
-          modules: true,
+          modules: false,
+          // не нужен - используем assetsByChunkName
           entrypoints: true,
-          chunkModules: true,
-          assetsByChunkName: true
+          chunkModules: false,
+          // экономит ~20MB
+          assetsByChunkName: true,
+          publicPath: true
         }
       }),
-      new PurgeCSSPlugin({
-        paths: glob.sync([
-          path.join(projectRoot, "src/**/*.vue"),
-          path.join(projectRoot, "src/**/*.js"),
-          path.join(projectRoot, "martyrs/src/**/*.vue"),
-          path.join(projectRoot, "martyrs/src/**/*.js"),
-          path.join(projectRoot, "/node_modules/@ozdao/martyrs/**/*.css"),
-          path.join(projectRoot, "/node_modules/@ozdao/martyrs/**/*.scss"),
-          path.join(projectRoot, "/node_modules/@ozdao/martyrs/src/**/*.vue"),
-          path.join(projectRoot, "/node_modules/@ozdao/martyrs/src/**/*.js"),
-          path.join(projectRoot, "/node_modules/@vuepic/vue-datepicker/**/*.js")
-        ]),
-        safelist: {
-          standard: ["safelisted", /^html/, /^:root/],
-          deep: [/^safelisted-deep-/, /^html/, /^:root/],
-          greedy: [/^data-v-/, /\[data-v-.*\]/, /\[data-v-[a-zA-Z0-9]*\]/]
-        },
-        rejected: true,
-        extractors: [
-          {
-            extractor: (content) => {
-              const normalClasses = content.match(/[A-Za-z0-9-_:/]+/g) || [];
-              const scopedAttrs = content.match(/\[data-v-[a-zA-Z0-9]*\]/g) || [];
-              return [...normalClasses, ...scopedAttrs];
-            },
-            extensions: ["vue", "js", "css", "scss"]
-          }
-        ]
-      }),
       // PWA PWA PWA PWA PWA
       // Simple RspackManifestPlugin configuration
       new RspackManifestPlugin({
@@ -1022,12 +2160,23 @@ const clientConfig = (projectRoot) => {
       ]
     },
     stats: {
+      preset: "normal",
       assets: true,
-      chunks: true,
-      modules: true,
-      ids: true,
+      assetsSpace: 15,
+      chunks: false,
+      chunkModules: false,
+      modules: false,
+      children: false,
       entrypoints: true,
-      chunkModules: true
+      timings: true,
+      colors: true,
+      version: true,
+      hash: false,
+      groupAssetsByChunk: false,
+      groupAssetsByEmitStatus: false,
+      groupAssetsByInfo: false,
+      groupAssetsByPath: true,
+      groupModulesByPath: false
     }
   };
   return merge(baseConfig(projectRoot), config);