1import fs from 'node:fs';
2import path from 'node:path';
3 
4import { profileStep, recordProfileEvent } from '../../profile/profiler.mjs';
5import { parseAnyColor, resolveLengthPx, resolveVarRefs } from '../../rules/checks.mjs';
6 
7// ---------------------------------------------------------------------------
8// jsdom CSS-variable border override map
9// ---------------------------------------------------------------------------
10//
11// jsdom's CSSOM silently drops any border shorthand that contains a var()
12// reference — the computed style for the element then shows empty width,
13// empty style, and a default black color. That's enough to hide the most
14// common real-world side-tab pattern in AI-generated pages:
15//
16//   :root { --brand: #87a8ff; }
17//   .card { border-left: 5px solid var(--brand); border-radius: 4px; }
18//
19// Real browsers (and therefore the browser detector path) resolve var()
20// natively, so this only affects the Node jsdom path.
21//
22// This pre-pass walks the stylesheets, finds any rule whose per-side or
23// all-sides border property contains var(), resolves the var() against
24// :root-level custom properties (read from the documentElement's computed
25// style, which jsdom DOES handle correctly), and attaches the resolved
26// width+color to every element that matches the rule's selector. The
27// Node-side `checkElementBorders` adapter consumes that map as a fallback
28// whenever jsdom's computed style came back empty.
29//
30// Limitations (intentional, to keep the pass simple):
31//   * Only :root-level custom properties are resolved. Scoped overrides on
32//     descendants are not tracked — uncommon in practice and would require
33//     a per-element cascade walk.
34//   * @media / @supports wrapped rules are ignored (jsdom often mishandles
35//     these anyway).
36//   * The fallback only fills sides that jsdom left empty, so any rule
37//     whose border parses normally still wins via the computed style.
38 
39const BORDER_SHORTHAND_RE = /^(\d+(?:\.\d+)?)px\s+(solid|dashed|dotted|double|groove|ridge|inset|outset)\s+(.+)$/i;
40 
41// isNeutralColor only understands rgba()/oklch()/lch()/lab()/hsl()/hwb().
42// CSS variables typically hold hex or named colors, so normalize those to
43// rgb() before handing the value off to the shared check. Anything we don't
44// recognise is passed through unchanged — isNeutralColor then treats it as
45// non-neutral, which is the safer default (matches the oklch-era bugfix).
46const NAMED_COLORS = {
47  white: [255, 255, 255], black: [0, 0, 0], gray: [128, 128, 128],
48  grey: [128, 128, 128], silver: [192, 192, 192], red: [255, 0, 0],
49  green: [0, 128, 0], blue: [0, 0, 255], yellow: [255, 255, 0],
50};
51 
52function normalizeColorForCheck(value) {
53  if (!value) return value;
54  const v = value.trim();
55  const hex6 = v.match(/^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i);
56  if (hex6) {
57    const [r, g, b] = [parseInt(hex6[1], 16), parseInt(hex6[2], 16), parseInt(hex6[3], 16)];
58    return `rgb(${r}, ${g}, ${b})`;
59  }
60  const hex3 = v.match(/^#([0-9a-f])([0-9a-f])([0-9a-f])$/i);
61  if (hex3) {
62    const [r, g, b] = [
63      parseInt(hex3[1] + hex3[1], 16),
64      parseInt(hex3[2] + hex3[2], 16),
65      parseInt(hex3[3] + hex3[3], 16),
66    ];
67    return `rgb(${r}, ${g}, ${b})`;
68  }
69  const named = NAMED_COLORS[v.toLowerCase()];
70  if (named) return `rgb(${named[0]}, ${named[1]}, ${named[2]})`;
71  return v;
72}
73 
74function buildBorderOverrideMap(document, window) {
75  const map = new Map();
76  const rootStyle = window.getComputedStyle(document.documentElement);
77 
78  function resolveVar(value, depth = 0) {
79    if (!value || depth > 10 || !value.includes('var(')) return value;
80    return value.replace(
81      /var\(\s*(--[\w-]+)\s*(?:,\s*([^)]+))?\s*\)/g,
82      (_, name, fallback) => {
83        const v = rootStyle.getPropertyValue(name).trim();
84        if (v) return resolveVar(v, depth + 1);
85        if (fallback) return resolveVar(fallback.trim(), depth + 1);
86        return '';
87      }
88    );
89  }
90 
91  function parseShorthand(text) {
92    const m = text.trim().match(BORDER_SHORTHAND_RE);
93    if (!m) return null;
94    return { width: parseFloat(m[1]), color: normalizeColorForCheck(m[3]) };
95  }
96 
97  // Read from the per-property accessors on rule.style. jsdom preserves
98  // each border-* shorthand it parsed, even when the overall cssText has
99  // been truncated (e.g. a `border: 1px solid var(...)` followed by a
100  // `border-left: ...` loses the first declaration but keeps the second).
101  const SIDE_PROPS = [
102    ['borderLeft', 'Left'],
103    ['borderRight', 'Right'],
104    ['borderTop', 'Top'],
105    ['borderBottom', 'Bottom'],
106    ['borderInlineStart', 'Left'],
107    ['borderInlineEnd', 'Right'],
108  ];
109 
110  for (const sheet of document.styleSheets) {
111    let rules;
112    try { rules = sheet.cssRules || []; } catch { continue; }
113    for (const rule of rules) {
114      // CSSStyleRule only; skip @media / @keyframes / @supports wrappers.
115      if (rule.type !== 1 || !rule.style || !rule.selectorText) continue;
116 
117      const perSide = {};
118 
119      for (const [prop, side] of SIDE_PROPS) {
120        const val = rule.style[prop];
121        if (!val || !val.includes('var(')) continue;
122        const parsed = parseShorthand(resolveVar(val));
123        if (parsed && parsed.color) perSide[side] = parsed;
124      }
125 
126      // Uniform `border: <w> <style> var(...)` applies to every side the
127      // per-side map didn't already claim.
128      const borderAll = rule.style.border;
129      if (borderAll && borderAll.includes('var(')) {
130        const parsed = parseShorthand(resolveVar(borderAll));
131        if (parsed && parsed.color) {
132          for (const s of ['Top', 'Right', 'Bottom', 'Left']) {
133            if (!perSide[s]) perSide[s] = parsed;
134          }
135        }
136      }
137 
138      // Longhand `border-*-color: var(...)` with width/style in separate
139      // declarations. Rare in AI-generated pages, but cheap to cover.
140      for (const [prop, side] of [
141        ['borderLeftColor', 'Left'],
142        ['borderRightColor', 'Right'],
143        ['borderTopColor', 'Top'],
144        ['borderBottomColor', 'Bottom'],
145      ]) {
146        const val = rule.style[prop];
147        if (!val || !val.includes('var(')) continue;
148        const resolved = resolveVar(val).trim();
149        if (!resolved) continue;
150        // Width may or may not come from this rule — that's fine; the
151        // adapter only substitutes the color when jsdom left it as a
152        // literal var() string.
153        if (!perSide[side]) perSide[side] = { width: 0, color: normalizeColorForCheck(resolved) };
154      }
155 
156      if (Object.keys(perSide).length === 0) continue;
157 
158      let matched;
159      try { matched = document.querySelectorAll(rule.selectorText); }
160      catch { continue; }
161 
162      for (const el of matched) {
163        const existing = map.get(el);
164        if (existing) {
165          // Later rules overwrite earlier ones — approximates source-order
166          // cascade for equal-specificity rules and is good enough for the
167          // uncontested var()-dropped sides we're trying to recover.
168          Object.assign(existing, perSide);
169        } else {
170          map.set(el, { ...perSide });
171        }
172      }
173    }
174  }
175 
176  return map;
177}
178 
179// Strip `@layer NAME { … }` wrappers from a CSS / HTML source, leaving
180// the inner rules as flat CSS. jsdom doesn't implement CSS @layer, so
181// any rule inside a layer block becomes invisible to getComputedStyle.
182// Tailwind v4 makes this ubiquitous: every utility class lives in
183// `@layer utilities`, and Preflight lives in `@layer base`. Without
184// unwrapping, every Tailwind-styled element returns empty computed
185// styles. We walk the source character-by-character, balancing braces
186// so we correctly handle nested style rules inside the layer block.
187function unwrapCssAtLayer(source) {
188  if (!source || !source.includes('@layer')) return source;
189  // Find `@layer <name>? {` openers. The match starts at the @, and
190  // we then balance braces from the opening { onward.
191  const re = /@layer\b[^{;]*\{/g;
192  let out = '';
193  let lastIdx = 0;
194  let m;
195  while ((m = re.exec(source)) !== null) {
196    const openStart = m.index;
197    const openEnd = m.index + m[0].length; // position right after `{`
198    let depth = 1;
199    let i = openEnd;
200    while (i < source.length && depth > 0) {
201      const c = source.charCodeAt(i);
202      if (c === 0x7b /* { */) depth++;
203      else if (c === 0x7d /* } */) depth--;
204      i++;
205    }
206    if (depth !== 0) {
207      // Unbalanced — bail and return source unchanged.
208      return source;
209    }
210    // Emit everything before the @layer, then the inner contents
211    // (between the opening { and the matched closing }), then advance.
212    out += source.slice(lastIdx, openStart);
213    out += source.slice(openEnd, i - 1); // i-1 = position of the closing }
214    lastIdx = i;
215    re.lastIndex = i;
216  }
217  out += source.slice(lastIdx);
218  return out;
219}
220 
221// ---------------------------------------------------------------------------
222// Static HTML/CSS detection (default for local HTML files)
223// ---------------------------------------------------------------------------
224 
225const STATIC_INHERITED_PROPS = new Set([
226  'color', 'fontFamily', 'fontSize', 'fontStyle', 'fontWeight',
227  'lineHeight', 'letterSpacing', 'textTransform', 'textAlign', 'hyphens',
228  'webkitHyphens',
229]);
230 
231const STATIC_DEFAULT_STYLE = {
232  color: 'rgb(0, 0, 0)',
233  backgroundColor: 'rgba(0, 0, 0, 0)',
234  backgroundImage: 'none',
235  borderTopWidth: '0px',
236  borderRightWidth: '0px',
237  borderBottomWidth: '0px',
238  borderLeftWidth: '0px',
239  borderTopColor: 'rgb(0, 0, 0)',
240  borderRightColor: 'rgb(0, 0, 0)',
241  borderBottomColor: 'rgb(0, 0, 0)',
242  borderLeftColor: 'rgb(0, 0, 0)',
243  borderRadius: '0px',
244  outlineWidth: '0px',
245  outlineColor: 'rgb(0, 0, 0)',
246  outlineStyle: 'none',
247  boxShadow: 'none',
248  fontFamily: '',
249  fontSize: '16px',
250  fontStyle: 'normal',
251  fontWeight: '400',
252  lineHeight: 'normal',
253  letterSpacing: 'normal',
254  textTransform: 'none',
255  textAlign: 'start',
256  hyphens: 'manual',
257  webkitHyphens: 'manual',
258  transitionProperty: '',
259  transitionTimingFunction: '',
260  animationName: '',
261  animationTimingFunction: '',
262  webkitBackgroundClip: '',
263  backgroundClip: '',
264  width: '',
265  height: '',
266  paddingTop: '0px',
267  paddingRight: '0px',
268  paddingBottom: '0px',
269  paddingLeft: '0px',
270  marginTop: '0px',
271  marginRight: '0px',
272  marginBottom: '0px',
273  marginLeft: '0px',
274  position: 'static',
275  visibility: 'visible',
276  top: 'auto',
277  right: 'auto',
278  bottom: 'auto',
279  left: 'auto',
280  inset: '',
281  display: '',
282  overflow: 'visible',
283  overflowX: 'visible',
284  overflowY: 'visible',
285};
286 
287const STATIC_PROP_MAP = {
288  'background-color': 'backgroundColor',
289  'background-image': 'backgroundImage',
290  'background-clip': 'backgroundClip',
291  '-webkit-background-clip': 'webkitBackgroundClip',
292  'border-radius': 'borderRadius',
293  'border-top-width': 'borderTopWidth',
294  'border-right-width': 'borderRightWidth',
295  'border-bottom-width': 'borderBottomWidth',
296  'border-left-width': 'borderLeftWidth',
297  'border-top-color': 'borderTopColor',
298  'border-right-color': 'borderRightColor',
299  'border-bottom-color': 'borderBottomColor',
300  'border-left-color': 'borderLeftColor',
301  'outline-width': 'outlineWidth',
302  'outline-color': 'outlineColor',
303  'outline-style': 'outlineStyle',
304  'box-shadow': 'boxShadow',
305  'font-family': 'fontFamily',
306  'font-size': 'fontSize',
307  'font-style': 'fontStyle',
308  'font-weight': 'fontWeight',
309  'line-height': 'lineHeight',
310  'letter-spacing': 'letterSpacing',
311  'text-transform': 'textTransform',
312  'text-align': 'textAlign',
313  'hyphens': 'hyphens',
314  '-webkit-hyphens': 'webkitHyphens',
315  'transition-property': 'transitionProperty',
316  'transition-timing-function': 'transitionTimingFunction',
317  'animation-name': 'animationName',
318  'animation-timing-function': 'animationTimingFunction',
319  'width': 'width',
320  'height': 'height',
321  'padding-top': 'paddingTop',
322  'padding-right': 'paddingRight',
323  'padding-bottom': 'paddingBottom',
324  'padding-left': 'paddingLeft',
325  'margin-top': 'marginTop',
326  'margin-right': 'marginRight',
327  'margin-bottom': 'marginBottom',
328  'margin-left': 'marginLeft',
329  'position': 'position',
330  'visibility': 'visibility',
331  'top': 'top',
332  'right': 'right',
333  'bottom': 'bottom',
334  'left': 'left',
335  'inset': 'inset',
336  'display': 'display',
337  'overflow': 'overflow',
338  'overflow-x': 'overflowX',
339  'overflow-y': 'overflowY',
340};
341 
342const STATIC_NAMED_COLORS = {
343  black: { r: 0, g: 0, b: 0, a: 1 },
344  white: { r: 255, g: 255, b: 255, a: 1 },
345  transparent: { r: 0, g: 0, b: 0, a: 0 },
346  gray: { r: 128, g: 128, b: 128, a: 1 },
347  grey: { r: 128, g: 128, b: 128, a: 1 },
348  silver: { r: 192, g: 192, b: 192, a: 1 },
349  red: { r: 255, g: 0, b: 0, a: 1 },
350  green: { r: 0, g: 128, b: 0, a: 1 },
351  blue: { r: 0, g: 0, b: 255, a: 1 },
352};
353 
354function splitCssList(value) {
355  const parts = [];
356  let depth = 0, quote = '', start = 0;
357  for (let i = 0; i < value.length; i++) {
358    const ch = value[i];
359    if (quote) {
360      if (ch === quote && value[i - 1] !== '\\') quote = '';
361      continue;
362    }
363    if (ch === '"' || ch === "'") { quote = ch; continue; }
364    if (ch === '(' || ch === '[') depth++;
365    else if (ch === ')' || ch === ']') depth = Math.max(0, depth - 1);
366    else if (ch === ',' && depth === 0) {
367      parts.push(value.slice(start, i).trim());
368      start = i + 1;
369    }
370  }
371  const tail = value.slice(start).trim();
372  if (tail) parts.push(tail);
373  return parts;
374}
375 
376function splitCssTokens(value) {
377  const tokens = [];
378  let depth = 0, quote = '', current = '';
379  for (let i = 0; i < value.length; i++) {
380    const ch = value[i];
381    if (quote) {
382      current += ch;
383      if (ch === quote && value[i - 1] !== '\\') quote = '';
384      continue;
385    }
386    if (ch === '"' || ch === "'") { quote = ch; current += ch; continue; }
387    if (ch === '(') { depth++; current += ch; continue; }
388    if (ch === ')') { depth = Math.max(0, depth - 1); current += ch; continue; }
389    if (/\s/.test(ch) && depth === 0) {
390      if (current) { tokens.push(current); current = ''; }
391      continue;
392    }
393    current += ch;
394  }
395  if (current) tokens.push(current);
396  return tokens;
397}
398 
399function cssPropToCamel(prop) {
400  if (!prop) return prop;
401  const mapped = STATIC_PROP_MAP[prop];
402  if (mapped) return mapped;
403  return prop.replace(/-([a-z])/g, (_m, ch) => ch.toUpperCase());
404}
405 
406function staticColorToCss(c) {
407  if (!c) return '';
408  if (c.a != null && c.a < 1) return `rgba(${c.r}, ${c.g}, ${c.b}, ${Number(c.a.toFixed(3))})`;
409  return `rgb(${c.r}, ${c.g}, ${c.b})`;
410}
411 
412function parseStaticColor(value) {
413  const parsed = parseAnyColor(value);
414  if (parsed) return parsed;
415  const named = STATIC_NAMED_COLORS[String(value || '').trim().toLowerCase()];
416  return named ? { ...named } : null;
417}
418 
419function extractStaticColor(value) {
420  if (!value) return '';
421  const raw = String(value).trim();
422  if (/^var\(/i.test(raw)) return raw;
423  const colorLike = raw.match(/(?:rgba?\([^)]+\)|oklch\([^)]+\)|oklab\([^)]+\)|lch\([^)]+\)|lab\([^)]+\)|hsla?\([^)]+\)|hwb\([^)]+\)|#[0-9a-f]{3,8}\b|\b(?:black|white|gray|grey|silver|red|green|blue|transparent)\b)/i);
424  if (!colorLike) return '';
425  return colorLike[0];
426}
427 
428function normalizeStaticCssValue(prop, value, customProps, parentStyle, currentStyle = null) {
429  let resolved = resolveVarRefs(String(value || '').trim(), customProps);
430  if (resolved === 'inherit') return parentStyle?.[prop] || STATIC_DEFAULT_STYLE[prop] || '';
431  const isModernBorderColor = /^border[A-Z][a-z]+Color$/.test(prop) && /^(?:oklch|oklab|lch|lab|hsl|hwb)\(/i.test(resolved);
432  if (!isModernBorderColor && (/color$/i.test(prop) || prop === 'color' || prop === 'backgroundColor')) {
433    const parsed = parseStaticColor(resolved);
434    if (parsed) resolved = staticColorToCss(parsed);
435  }
436  if (prop === 'fontSize') {
437    const base = parseFloat(parentStyle?.fontSize) || 16;
438    const px = resolveLengthPx(resolved, base);
439    if (px != null) resolved = `${px}px`;
440  }
441  if (prop === 'letterSpacing') {
442    const base = parseFloat(currentStyle?.fontSize || parentStyle?.fontSize) || 16;
443    const px = resolveLengthPx(resolved, base);
444    if (px != null) resolved = `${px}px`;
445  }
446  if (prop === 'lineHeight' && resolved !== 'normal') {
447    const base = parseFloat(currentStyle?.fontSize || parentStyle?.fontSize) || 16;
448    const px = resolveLengthPx(resolved, base);
449    if (px != null) resolved = `${px}px`;
450  }
451  return resolved;
452}
453 
454function expandStaticBoxValues(tokens) {
455  if (tokens.length === 0) return ['0px', '0px', '0px', '0px'];
456  if (tokens.length === 1) return [tokens[0], tokens[0], tokens[0], tokens[0]];
457  if (tokens.length === 2) return [tokens[0], tokens[1], tokens[0], tokens[1]];
458  if (tokens.length === 3) return [tokens[0], tokens[1], tokens[2], tokens[1]];
459  return [tokens[0], tokens[1], tokens[2], tokens[3]];
460}
461 
462function parseStaticBorder(value) {
463  const tokens = splitCssTokens(value);
464  let width = '', color = '';
465  for (const token of tokens) {
466    if (!width && /^-?[\d.]+(?:px|rem|em|%)$/.test(token)) width = token;
467    if (!color) color = extractStaticColor(token);
468  }
469  return { width, color };
470}
471 
472function parseStaticFont(value) {
473  const out = [];
474  const slashParts = value.match(/(?:^|\s)([\d.]+(?:px|rem|em|%))(?:\/([^\s]+))?/);
475  if (/\bitalic\b/i.test(value)) out.push(['fontStyle', 'italic']);
476  const weight = value.match(/\b([1-9]00|bold|normal|lighter|bolder)\b/i);
477  if (weight) out.push(['fontWeight', weight[1]]);
478  if (slashParts) {
479    out.push(['fontSize', slashParts[1]]);
480    if (slashParts[2]) out.push(['lineHeight', slashParts[2]]);
481    const familyStart = value.indexOf(slashParts[0]) + slashParts[0].length;
482    const family = value.slice(familyStart).trim();
483    if (family) out.push(['fontFamily', family]);
484  }
485  return out;
486}
487 
488function parseStaticTransition(value) {
489  const props = [];
490  const timings = [];
491  for (const item of splitCssList(value)) {
492    const tokens = splitCssTokens(item);
493    const timing = tokens.find(token => /^(?:ease|linear|step-|cubic-bezier\()/i.test(token));
494    if (timing) timings.push(timing);
495    const prop = tokens.find(token => /^[a-z-]+$/i.test(token) && !/^(?:ease|linear|infinite|alternate|forwards|backwards|both|normal|none)$/.test(token) && !/s$/.test(token));
496    if (prop) props.push(prop);
497  }
498  return {
499    property: props.join(', '),
500    timing: timings.join(', '),
501  };
502}
503 
504function parseStaticAnimation(value) {
505  const names = [];
506  const timings = [];
507  for (const item of splitCssList(value)) {
508    const tokens = splitCssTokens(item);
509    const timing = tokens.find(token => /^(?:ease|linear|step-|cubic-bezier\()/i.test(token));
510    if (timing) timings.push(timing);
511    const name = tokens.find(token =>
512      /^[a-z_-][\w-]*$/i.test(token) &&
513      !/^(?:ease|linear|infinite|alternate|forwards|backwards|both|normal|none|running|paused)$/.test(token)
514    );
515    if (name) names.push(name);
516  }
517  return {
518    name: names.join(', '),
519    timing: timings.join(', '),
520  };
521}
522 
523function expandStaticDeclaration(prop, value) {
524  const p = prop.toLowerCase();
525  const v = String(value || '').trim();
526  if (!v) return [];
527  if (p.startsWith('--')) return [[p, v]];
528  if (p === 'background') {
529    const out = [];
530    const hasImage = /gradient|url\(/i.test(v);
531    if (hasImage) out.push(['backgroundImage', v]);
532    const beforeImage = hasImage ? v.split(/(?:repeating-)?(?:linear|radial|conic)-gradient\(|url\(/i)[0] : v;
533    const color = extractStaticColor(hasImage ? beforeImage : v);
534    if (color) out.push(['backgroundColor', color]);
535    return out;
536  }
537  if (p === 'border') {
538    const parsed = parseStaticBorder(v);
539    const out = [];
540    for (const side of ['Top', 'Right', 'Bottom', 'Left']) {
541      if (parsed.width) out.push([`border${side}Width`, parsed.width]);
542      if (parsed.color) out.push([`border${side}Color`, parsed.color]);
543    }
544    return out;
545  }
546  if (p === 'outline') {
547    // `outline` shorthand: width | style | color, in any order. Reuse the
548    // border parser for width + color, then sniff a style keyword from the
549    // tokens (solid|dashed|...). `outline: 0` (single-token zero) zeros
550    // the width and effectively hides the outline.
551    const tokens = splitCssTokens(v);
552    const parsed = parseStaticBorder(v);
553    const styleToken = tokens.find(t =>
554      /^(none|hidden|solid|dashed|dotted|double|groove|ridge|inset|outset)$/i.test(t)
555    );
556    const out = [];
557    if (parsed.width) out.push(['outlineWidth', parsed.width]);
558    if (parsed.color) out.push(['outlineColor', parsed.color]);
559    if (styleToken) out.push(['outlineStyle', styleToken.toLowerCase()]);
560    // `outline: 0` with no other tokens: explicit zero width.
561    if (!parsed.width && /^0(?:px|rem|em|%)?$/.test(v.trim())) {
562      out.push(['outlineWidth', '0px']);
563    }
564    return out;
565  }
566  const sideMatch = p.match(/^border-(top|right|bottom|left)$/);
567  if (sideMatch) {
568    const parsed = parseStaticBorder(v);
569    const side = sideMatch[1][0].toUpperCase() + sideMatch[1].slice(1);
570    return [
571      ...(parsed.width ? [[`border${side}Width`, parsed.width]] : []),
572      ...(parsed.color ? [[`border${side}Color`, parsed.color]] : []),
573    ];
574  }
575  if (p === 'border-width') {
576    const vals = expandStaticBoxValues(splitCssTokens(v));
577    return [
578      ['borderTopWidth', vals[0]],
579      ['borderRightWidth', vals[1]],
580      ['borderBottomWidth', vals[2]],
581      ['borderLeftWidth', vals[3]],
582    ];
583  }
584  if (p === 'border-color') {
585    const vals = expandStaticBoxValues(splitCssTokens(v));
586    return [
587      ['borderTopColor', vals[0]],
588      ['borderRightColor', vals[1]],
589      ['borderBottomColor', vals[2]],
590      ['borderLeftColor', vals[3]],
591    ];
592  }
593  if (p === 'padding') {
594    const vals = expandStaticBoxValues(splitCssTokens(v));
595    return [
596      ['paddingTop', vals[0]],
597      ['paddingRight', vals[1]],
598      ['paddingBottom', vals[2]],
599      ['paddingLeft', vals[3]],
600    ];
601  }
602  if (p === 'margin') {
603    const vals = expandStaticBoxValues(splitCssTokens(v));
604    return [
605      ['marginTop', vals[0]],
606      ['marginRight', vals[1]],
607      ['marginBottom', vals[2]],
608      ['marginLeft', vals[3]],
609    ];
610  }
611  if (p === 'font') return parseStaticFont(v);
612  if (p === 'transition') {
613    const parsed = parseStaticTransition(v);
614    return [
615      ...(parsed.property ? [['transitionProperty', parsed.property]] : []),
616      ...(parsed.timing ? [['transitionTimingFunction', parsed.timing]] : []),
617    ];
618  }
619  if (p === 'animation') {
620    const parsed = parseStaticAnimation(v);
621    return [
622      ...(parsed.name ? [['animationName', parsed.name]] : []),
623      ...(parsed.timing ? [['animationTimingFunction', parsed.timing]] : []),
624    ];
625  }
626  const mapped = cssPropToCamel(p);
627  if (STATIC_DEFAULT_STYLE[mapped] != null || STATIC_INHERITED_PROPS.has(mapped)) {
628    return [[mapped, v]];
629  }
630  return [];
631}
632 
633function compareStaticPriority(a, b) {
634  if (!a) return true;
635  if (!!b.important !== !!a.important) return !!b.important;
636  if (!!b.inline !== !!a.inline) return !!b.inline;
637  for (let i = 0; i < 3; i++) {
638    if ((b.specificity[i] || 0) !== (a.specificity[i] || 0)) {
639      return (b.specificity[i] || 0) > (a.specificity[i] || 0);
640    }
641  }
642  return b.order >= a.order;
643}
644 
645function staticSpecificity(selector) {
646  const noWhere = selector.replace(/:where\([^)]*\)/g, '');
647  const ids = (noWhere.match(/#[\w-]+/g) || []).length;
648  const classes = (noWhere.match(/\.[\w-]+|\[[^\]]+\]|:(?!:)[\w-]+(?:\([^)]*\))?/g) || []).length;
649  const stripped = noWhere
650    .replace(/#[\w-]+/g, ' ')
651    .replace(/\.[\w-]+|\[[^\]]+\]|:{1,2}[\w-]+(?:\([^)]*\))?/g, ' ')
652    .replace(/[*>+~(),]/g, ' ');
653  const types = (stripped.match(/\b[a-zA-Z][\w-]*\b/g) || []).length;
654  return [ids, classes, types];
655}
656 
657function applyStaticDeclaration(specified, node, prop, value, meta) {
658  let map = specified.get(node);
659  if (!map) { map = new Map(); specified.set(node, map); }
660  for (const [expandedProp, expandedValue] of expandStaticDeclaration(prop, value)) {
661    const existing = map.get(expandedProp);
662    const next = { ...meta, prop: expandedProp, value: expandedValue };
663    if (compareStaticPriority(existing, next)) map.set(expandedProp, next);
664  }
665}
666 
667function parseStaticStyleAttribute(styleText, orderBase = 0) {
668  const decls = [];
669  for (const part of String(styleText || '').split(';')) {
670    const idx = part.indexOf(':');
671    if (idx <= 0) continue;
672    const prop = part.slice(0, idx).trim();
673    let value = part.slice(idx + 1).trim();
674    const important = /!important\s*$/i.test(value);
675    value = value.replace(/\s*!important\s*$/i, '').trim();
676    decls.push({ prop, value, important, order: orderBase + decls.length });
677  }
678  return decls;
679}
680 
681function collectStaticCssRules(cssText, csstree) {
682  const rules = [];
683  let ast;
684  try {
685    ast = csstree.parse(cssText, { positions: false, parseValue: true, parseCustomProperty: false });
686  } catch {
687    return rules;
688  }
689  let order = 0;
690  const walkList = (list, atRuleStack = []) => {
691    list?.forEach?.(node => {
692      if (node.type === 'Rule' && node.block) {
693        if (atRuleStack.some(name => /keyframes$/i.test(name))) return;
694        const selectorText = csstree.generate(node.prelude).trim();
695        const declarations = [];
696        node.block.children?.forEach?.(child => {
697          if (child.type !== 'Declaration') return;
698          declarations.push({
699            prop: child.property,
700            value: csstree.generate(child.value).trim(),
701            important: !!child.important,
702          });
703        });
704        for (const selector of splitCssList(selectorText)) {
705          if (selector) rules.push({ selector, declarations, specificity: staticSpecificity(selector), order: order++ });
706        }
707        return;
708      }
709      if (node.type === 'Atrule' && node.block) {
710        const name = String(node.name || '').toLowerCase();
711        if (name === 'media' || name === 'supports' || name === 'layer') {
712          walkList(node.block.children, [...atRuleStack, name]);
713        }
714      }
715    });
716  };
717  walkList(ast.children);
718  return rules;
719}
720 
721class StaticElement {
722  constructor(node, doc) {
723    this.node = node;
724    this._doc = doc;
725    this.nodeType = 1;
726    this.tagName = String(node.name || '').toUpperCase();
727    this.nodeName = this.tagName;
728  }
729  get parentElement() {
730    let cur = this.node.parent;
731    while (cur && cur.type !== 'tag') cur = cur.parent;
732    return cur ? this._doc.wrap(cur) : null;
733  }
734  get previousElementSibling() {
735    let cur = this.node.prev;
736    while (cur && cur.type !== 'tag') cur = cur.prev;
737    return cur ? this._doc.wrap(cur) : null;
738  }
739  get children() {
740    return (this.node.children || []).filter(child => child.type === 'tag').map(child => this._doc.wrap(child));
741  }
742  get childNodes() {
743    return (this.node.children || []).map(child => {
744      if (child.type === 'text') return { nodeType: 3, textContent: child.data || '' };
745      if (child.type === 'tag') return this._doc.wrap(child);
746      return { nodeType: 8, textContent: child.data || '' };
747    });
748  }
749  get textContent() {
750    return this._doc.domutils.textContent(this.node);
751  }
752  get className() {
753    return this.getAttribute('class') || '';
754  }
755  get id() {
756    return this.getAttribute('id') || '';
757  }
758  getAttribute(name) {
759    return this.node.attribs?.[name] ?? null;
760  }
761  querySelector(selector) {
762    try {
763      const found = this._doc.selectOne(selector, this.node.children || []);
764      return found ? this._doc.wrap(found) : null;
765    } catch {
766      return null;
767    }
768  }
769  querySelectorAll(selector) {
770    try {
771      return this._doc.selectAll(selector, this.node.children || []).map(node => this._doc.wrap(node));
772    } catch {
773      return [];
774    }
775  }
776  closest(selector) {
777    let cur = this.node;
778    while (cur && cur.type === 'tag') {
779      try {
780        if (this._doc.is(cur, selector)) return this._doc.wrap(cur);
781      } catch {
782        return null;
783      }
784      cur = cur.parent;
785      while (cur && cur.type !== 'tag') cur = cur.parent;
786    }
787    return null;
788  }
789  contains(other) {
790    let cur = other?.node || null;
791    while (cur) {
792      if (cur === this.node) return true;
793      cur = cur.parent;
794    }
795    return false;
796  }
797}
798 
799class StaticDocument {
800  constructor(root, modules) {
801    this.root = root;
802    this.selectAll = modules.selectAll;
803    this.selectOne = modules.selectOne;
804    this.is = modules.is;
805    this.domutils = modules.domutils;
806    this._wrappers = new WeakMap();
807    this._styleMap = new WeakMap();
808  }
809  wrap(node) {
810    let wrapped = this._wrappers.get(node);
811    if (!wrapped) {
812      wrapped = new StaticElement(node, this);
813      this._wrappers.set(node, wrapped);
814    }
815    return wrapped;
816  }
817  querySelectorAll(selector) {
818    try {
819      return this.selectAll(selector, this.root.children || []).map(node => this.wrap(node));
820    } catch {
821      return [];
822    }
823  }
824  querySelector(selector) {
825    try {
826      const found = this.selectOne(selector, this.root.children || []);
827      return found ? this.wrap(found) : null;
828    } catch {
829      return null;
830    }
831  }
832  get documentElement() {
833    return this.querySelector('html');
834  }
835  get body() {
836    return this.querySelector('body');
837  }
838  setStyle(node, style) {
839    this._styleMap.set(node, style);
840  }
841  getStyle(el) {
842    return this._styleMap.get(el.node) || makeStaticStyle();
843  }
844}
845 
846function makeStaticStyle(values = {}) {
847  const style = { ...STATIC_DEFAULT_STYLE, ...values };
848  style.getPropertyValue = (prop) => {
849    const key = cssPropToCamel(prop);
850    return style[key] || style[prop] || '';
851  };
852  return style;
853}
854 
855function buildStaticWindow(staticDoc) {
856  return {
857    document: staticDoc,
858    getComputedStyle: (el) => staticDoc.getStyle(el),
859  };
860}
861 
862function collectStaticCssText(root, fileDir, profile, filePath, modules) {
863  const styleTexts = [];
864  for (const styleEl of modules.selectAll('style', root.children || [])) {
865    styleTexts.push(modules.domutils.textContent(styleEl));
866  }
867  const links = modules.selectAll('link', root.children || []);
868  for (const link of links) {
869    const rel = link.attribs?.rel || '';
870    const href = link.attribs?.href || '';
871    if (!/\bstylesheet\b/i.test(rel) || !href || /^(https?:)?\/\//i.test(href)) continue;
872    const cssPath = path.resolve(fileDir, href);
873    try {
874      const css = profileStep(profile, {
875        engine: 'static-html',
876        phase: 'preprocess',
877        ruleId: 'inline-linked-stylesheet',
878        target: filePath,
879        detail: href,
880      }, () => fs.readFileSync(cssPath, 'utf-8'));
881      styleTexts.push(css);
882    } catch { /* skip unreadable */ }
883  }
884  return styleTexts.join('\n');
885}
886 
887function buildStaticStyleMap(root, staticDoc, cssText, modules, profile, filePath) {
888  const specified = new Map();
889  const allNodes = modules.selectAll('*', root.children || []);
890  const rules = profileStep(profile, {
891    engine: 'static-html',
892    phase: 'parse-css',
893    ruleId: 'css-rules',
894    target: filePath,
895  }, () => collectStaticCssRules(cssText, modules.csstree));
896 
897  profileStep(profile, {
898    engine: 'static-html',
899    phase: 'selector-match',
900    ruleId: 'css-selectors',
901    target: filePath,
902  }, () => {
903    for (const rule of rules) {
904      let matched;
905      try {
906        matched = modules.selectAll(rule.selector, root.children || []);
907      } catch {
908        recordProfileEvent(profile, {
909          engine: 'static-html',
910          phase: 'selector-match',
911          ruleId: 'unsupported-selector',
912          target: filePath,
913          ms: 0,
914          findings: 0,
915          detail: rule.selector,
916        });
917        continue;
918      }
919      for (const node of matched) {
920        for (const decl of rule.declarations) {
921          applyStaticDeclaration(specified, node, decl.prop, decl.value, {
922            important: decl.important,
923            specificity: rule.specificity,
924            order: rule.order,
925            inline: false,
926          });
927        }
928      }
929    }
930 
931    let inlineOrder = rules.length + 1;
932    for (const node of allNodes) {
933      const styleText = node.attribs?.style;
934      if (!styleText) continue;
935      for (const decl of parseStaticStyleAttribute(styleText, inlineOrder)) {
936        applyStaticDeclaration(specified, node, decl.prop, decl.value, {
937          important: decl.important,
938          specificity: [1, 0, 0],
939          order: decl.order,
940          inline: true,
941        });
942      }
943      inlineOrder += 1000;
944    }
945  });
946 
947  const computeNode = (node, parentStyle = null, parentCustom = new Map()) => {
948    const specifiedMap = specified.get(node) || new Map();
949    const customProps = new Map(parentCustom);
950    for (const [prop, decl] of specifiedMap) {
951      if (prop.startsWith('--')) customProps.set(prop, resolveVarRefs(decl.value, customProps));
952    }
953    const values = {};
954    for (const prop of Object.keys(STATIC_DEFAULT_STYLE)) {
955      if (STATIC_INHERITED_PROPS.has(prop) && parentStyle?.[prop] != null) values[prop] = parentStyle[prop];
956      else values[prop] = STATIC_DEFAULT_STYLE[prop];
957    }
958    for (const [prop, decl] of specifiedMap) {
959      if (prop.startsWith('--')) continue;
960      values[prop] = normalizeStaticCssValue(prop, decl.value, customProps, parentStyle, values);
961    }
962    const style = makeStaticStyle(values);
963    staticDoc.setStyle(node, style);
964    for (const child of node.children || []) {
965      if (child.type === 'tag') computeNode(child, style, customProps);
966    }
967  };
968 
969  profileStep(profile, {
970    engine: 'static-html',
971    phase: 'cascade',
972    ruleId: 'compute-styles',
973    target: filePath,
974  }, () => {
975    for (const child of root.children || []) {
976      if (child.type === 'tag') computeNode(child);
977    }
978  });
979}
980 
981export {
982  BORDER_SHORTHAND_RE,
983  NAMED_COLORS,
984  normalizeColorForCheck,
985  buildBorderOverrideMap,
986  unwrapCssAtLayer,
987  STATIC_INHERITED_PROPS,
988  STATIC_DEFAULT_STYLE,
989  STATIC_PROP_MAP,
990  STATIC_NAMED_COLORS,
991  splitCssList,
992  splitCssTokens,
993  cssPropToCamel,
994  staticColorToCss,
995  parseStaticColor,
996  extractStaticColor,
997  normalizeStaticCssValue,
998  expandStaticBoxValues,
999  parseStaticBorder,
1000  parseStaticFont,
1001  parseStaticTransition,
1002  parseStaticAnimation,
1003  expandStaticDeclaration,
1004  compareStaticPriority,
1005  staticSpecificity,
1006  applyStaticDeclaration,
1007  parseStaticStyleAttribute,
1008  collectStaticCssRules,
1009  StaticElement,
1010  StaticDocument,
1011  makeStaticStyle,
1012  buildStaticWindow,
1013  collectStaticCssText,
1014  buildStaticStyleMap,
1015};
1016