/* Fallback CSS for critical styles */
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
  background-color: #ffffff;
  color: #171717;
  line-height: 1.6;
  min-height: 100vh;
}

.min-h-screen { min-height: 100vh; }
.bg-white { background-color: #ffffff !important; }
.text-white { color: #ffffff !important; }
.p-4 { padding: 1rem !important; }
.p-8 { padding: 2rem !important; }
.mb-4 { margin-bottom: 1rem !important; }
.mb-8 { margin-bottom: 2rem !important; }
.rounded-lg { border-radius: 0.5rem !important; }
.rounded-xl { border-radius: 0.75rem !important; }
.shadow-lg { box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important; }
.flex { display: flex !important; }
.items-center { align-items: center !important; }
.justify-center { justify-content: center !important; }
.gap-2 { gap: 0.5rem !important; }
.gap-3 { gap: 0.75rem !important; }
.text-center { text-align: center !important; }
.font-bold { font-weight: 700 !important; }
.font-semibold { font-weight: 600 !important; }
.text-lg { font-size: 1.125rem !important; }
.text-xl { font-size: 1.25rem !important; }
.text-2xl { font-size: 1.5rem !important; }
.text-3xl { font-size: 1.875rem !important; }
.text-4xl { font-size: 2.25rem !important; }
.max-w-2xl { max-width: 42rem !important; }
.mx-auto { margin-left: auto !important; margin-right: auto !important; }

/* Background gradients */
.bg-gradient-to-br {
  background: linear-gradient(to bottom right, #fff7ed, #fefce8) !important;
}

/* Button styles */
.bg-orange-500 { background-color: #f97316 !important; }
.bg-orange-600 { background-color: #ea580c !important; }

.inline-flex {
  display: inline-flex !important;
}

.hover\:bg-orange-600:hover { 
  background-color: #ea580c !important; 
}

.transition-all { 
  transition: all 0.2s ease !important; 
}

.shadow-md {
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06) !important;
}

.hover\:shadow-lg:hover {
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05) !important;
}

.font-medium {
  font-weight: 500 !important;
}

.duration-200 {
  transition-duration: 0.2s !important;
}

.group:hover .group-hover\:-translate-x-1 {
  transform: translateX(-0.25rem) !important;
}

.w-4 { width: 1rem !important; }
.h-4 { height: 1rem !important; }

/* Dark mode */
html.dark body {
  background-color: #0a0a0a !important;
  color: #ededed !important;
}

html.dark .dark\:bg-orange-600 { 
  background-color: #ea580c !important; 
}

html.dark .dark\:hover\:bg-orange-700:hover { 
  background-color: #c2410c !important; 
}