/* ═══════════════════════════════════════════════════════════════════
   Chrome CSS Custom Property Fixes
   ═══════════════════════════════════════════════════════════════════
   This file MUST load BEFORE Tailwind CSS (app.css).
   
   Tailwind v4.2.1 uses --spacing for ALL spacing utilities but only
   defines it inside a @supports block that Chrome doesn't match.
   Chrome needs @property to be declared BEFORE any calc(var(--spacing) * N).
   
   @property rules are NOT layerable — they must be at document root.
   ═══════════════════════════════════════════════════════════════════ */

@property --spacing {
  syntax: "<length>";
  inherits: true;
  initial-value: 0.25rem;
}

/* Transform defaults */
@property --tw-translate-x {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-y {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-translate-z {
  syntax: "*";
  inherits: false;
  initial-value: 0;
}

@property --tw-scale-x {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-scale-y {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

@property --tw-scale-z {
  syntax: "*";
  inherits: false;
  initial-value: 1;
}

/* :root fallback for browsers that don't support @property */
:root {
  --spacing: 0.25rem;
}