/* ============================================================
   MONOPOLY BOARD - Arbitrary Value Classes for Production
   
   Tailwind CSS safelist does NOT support arbitrary value classes.
   This file manually defines ALL classes that use [value] syntax
   so they are always included in the production CSS bundle.
   ============================================================ */

/* Width (vmin) */
.w-\[0\.8vmin\]  { width: 0.8vmin; }
.w-\[0\.9vmin\]  { width: 0.9vmin; }
.w-\[1\.2vmin\]  { width: 1.2vmin; }
.w-\[1\.8vmin\]  { width: 1.8vmin; }
.w-\[3\.2vmin\]  { width: 3.2vmin; }
.w-\[3\.5vmin\]  { width: 3.5vmin; }
.w-\[4vmin\]     { width: 4vmin; }
.w-\[4\.5vmin\]  { width: 4.5vmin; }
.w-\[5\.5vmin\]  { width: 5.5vmin; }
.w-\[22vmin\]    { width: 22vmin; }
.w-\[28vmin\]    { width: 28vmin; }
.w-\[115vmin\]   { width: 115vmin; }
.w-\[135vmin\]   { width: 135vmin; }

/* Height (vmin) */
.h-\[0\.4vmin\]  { height: 0.4vmin; }
.h-\[0\.8vmin\]  { height: 0.8vmin; }
.h-\[0\.9vmin\]  { height: 0.9vmin; }
.h-\[1\.2vmin\]  { height: 1.2vmin; }
.h-\[1\.8vmin\]  { height: 1.8vmin; }
.h-\[3\.5vmin\]  { height: 3.5vmin; }
.h-\[3\.8vmin\]  { height: 3.8vmin; }
.h-\[4vmin\]     { height: 4vmin; }
.h-\[4\.5vmin\]  { height: 4.5vmin; }
.h-\[5\.5vmin\]  { height: 5.5vmin; }
.h-\[75vmin\]    { height: 75vmin; }
.h-\[85vmin\]    { height: 85vmin; }

/* Font size (vmin) */
.text-\[0\.65vmin\] { font-size: 0.65vmin; }
.text-\[0\.8vmin\]  { font-size: 0.8vmin; }
.text-\[0\.9vmin\]  { font-size: 0.9vmin; }
.text-\[1vmin\]     { font-size: 1vmin; }
.text-\[1\.0vmin\]  { font-size: 1.0vmin; }
.text-\[1\.1vmin\]  { font-size: 1.1vmin; }
.text-\[1\.4vmin\]  { font-size: 1.4vmin; }
.text-\[1\.6vmin\]  { font-size: 1.6vmin; }
.text-\[1\.8vmin\]  { font-size: 1.8vmin; }

/* Padding (vmin) */
.p-\[0\.3vmin\]   { padding: 0.3vmin; }
.p-\[0\.5vmin\]   { padding: 0.5vmin; }
.p-\[1vmin\]      { padding: 1vmin; }
.p-\[2vmin\]      { padding: 2vmin; }
.px-\[0\.8vmin\]  { padding-left: 0.8vmin; padding-right: 0.8vmin; }
.px-\[1\.2vmin\]  { padding-left: 1.2vmin; padding-right: 1.2vmin; }
.px-\[1\.5vmin\]  { padding-left: 1.5vmin; padding-right: 1.5vmin; }
.py-\[0\.2vmin\]  { padding-top: 0.2vmin; padding-bottom: 0.2vmin; }
.pt-\[0\.4vmin\]  { padding-top: 0.4vmin; }
.pb-\[0\.8vmin\]  { padding-bottom: 0.8vmin; }

/* Margin (vmin) */
.mb-\[0\.05vmin\] { margin-bottom: 0.05vmin; }
.mb-\[0\.1vmin\]  { margin-bottom: 0.1vmin; }
.mb-\[0\.2vmin\]  { margin-bottom: 0.2vmin; }

/* Gap (vmin) */
.gap-\[0\.4vmin\] { gap: 0.4vmin; }
.gap-\[1\.5vmin\] { gap: 1.5vmin; }

/* Max height */
.max-h-\[30vmin\] { max-height: 30vmin; }

/* Border radius (vmin) */
.rounded-\[1vmin\]    { border-radius: 1vmin; }
.rounded-\[1\.2vmin\] { border-radius: 1.2vmin; }

/* Ring width (vmin) */
.ring-\[0\.4vmin\] { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0.4vmin + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); }
.ring-\[0\.6vmin\] { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0.6vmin + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); }

/* Scale transforms */
.scale-\[0\.75\]  { --tw-scale-x: 0.75; --tw-scale-y: 0.75; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.scale-\[0\.8\]   { --tw-scale-x: 0.8; --tw-scale-y: 0.8; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.scale-\[1\.02\]  { --tw-scale-x: 1.02; --tw-scale-y: 1.02; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.scale-\[1\.08\]  { --tw-scale-x: 1.08; --tw-scale-y: 1.08; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.scale-\[1\.15\]  { --tw-scale-x: 1.15; --tw-scale-y: 1.15; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.scale-\[1\.5\]   { --tw-scale-x: 1.5; --tw-scale-y: 1.5; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }

/* Rotate transforms */
.rotate-\[135deg\]   { --tw-rotate: 135deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.rotate-\[45deg\]    { --tw-rotate: 45deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.-rotate-\[135deg\]  { --tw-rotate: -135deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }
.-rotate-\[45deg\]   { --tw-rotate: -45deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }

/* Grayscale */
.grayscale-\[0\.2\] { --tw-grayscale: grayscale(0.2); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); }

/* Letter spacing */
.tracking-\[0\.2em\] { letter-spacing: 0.2em; }
.tracking-\[0\.4em\] { letter-spacing: 0.4em; }

/* Dynamic player background with opacity */
.bg-rose-50\/80     { background-color: rgb(255 241 242 / 0.8); }
.bg-indigo-50\/80   { background-color: rgb(238 242 255 / 0.8); }
.bg-emerald-50\/80  { background-color: rgb(236 253 245 / 0.8); }
.bg-amber-50\/80    { background-color: rgb(255 251 235 / 0.8); }
.bg-orange-50\/80   { background-color: rgb(255 247 237 / 0.8); }
.bg-purple-50\/80   { background-color: rgb(250 245 255 / 0.8); }

/* ============================================================
   ADDITIONAL CLASSES - Percentage, Z-index, Border, etc.
   ============================================================ */

/* Percentage-based padding (BoardTile content positioning) */
.pt-\[18\%\]  { padding-top: 18%; }
.pt-\[22\%\]  { padding-top: 22%; }
.pt-\[25\%\]  { padding-top: 25%; }

/* Percentage-based width/height (BoardTile bars & buildings) */
.h-\[12\%\]   { height: 12%; }
.w-\[12\%\]   { width: 12%; }
.h-\[15\%\]   { height: 15%; }
.h-\[22\%\]   { height: 22%; }
.w-\[22\%\]   { width: 22%; }
.w-\[80\%\]   { width: 80%; }
.w-\[88\%\]   { width: 88%; }
.w-\[95\%\]   { width: 95%; }
.w-\[96\%\]   { width: 96%; }
.w-\[98\%\]   { width: 98%; }

/* Percentage-based positioning */
.top-\[40\%\]  { top: 40%; }
.top-\[45\%\]  { top: 45%; }

/* Z-index (arbitrary) */
.z-\[60\]      { z-index: 60; }
.z-\[100\]     { z-index: 100; }
.z-\[999\]     { z-index: 999; }
.z-\[2000\]    { z-index: 2000; }
.z-\[3000\]    { z-index: 3000; }
.z-\[4000\]    { z-index: 4000; }
.z-\[5000\]    { z-index: 5000; }
.z-\[99999\]   { z-index: 99999; }

/* Ring pixel widths */
.ring-\[6px\]  { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(6px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); }
.ring-\[8px\]  { --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color); --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(8px + var(--tw-ring-offset-width)) var(--tw-ring-color); box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000); }

/* Border widths (arbitrary) */
.border-\[0\.5px\] { border-width: 0.5px; }
.border-\[4px\]    { border-width: 4px; }
.border-\[6px\]    { border-width: 6px; }
.border-\[8px\]    { border-width: 8px; }
.border-\[10px\]   { border-width: 10px; }

/* Border radius (arbitrary) */
.rounded-\[2\.5rem\] { border-radius: 2.5rem; }
.rounded-\[3rem\]    { border-radius: 3rem; }

/* Background color (arbitrary hex) */
.bg-\[\#f9fafb\] { background-color: #f9fafb; }
.bg-\[\#fef200\] { background-color: #fef200; }

/* Blur (arbitrary) */
.blur-\[4px\] { --tw-blur: blur(4px); filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow); }

/* Hover rotation for BoardCenter logo */
.hover\:-rotate-\[40deg\]:hover { --tw-rotate: -40deg; transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y)); }

/* Shadow (arbitrary) */
.shadow-\[0_20px_40px_rgba\(0\,0\,0\,0\.2\)\] { box-shadow: 0 20px 40px rgba(0,0,0,0.2); }

/* DynamicEnvironment - width percentage */
.w-\[12\%\] { width: 12%; }