/* ========================================
   CROSS-PLATFORM COMPATIBILITY CSS
   Ensures consistent appearance across all devices and OS
   ======================================== */

/* ===== CSS RESET & NORMALIZATION ===== */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* ===== iOS SPECIFIC FIXES ===== */

/* Prevent iOS text size adjustment */
html {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

/* Fix iOS font rendering - consistent across all iOS versions */
body {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

/* iOS Safe Area Support (notches, home indicators) */
@supports (padding: max(0px)) {
  .mobile-header {
    padding-left: max(12px, env(safe-area-inset-left));
    padding-right: max(12px, env(safe-area-inset-right));
    padding-top: max(10px, env(safe-area-inset-top));
  }
  
  .main-content {
    padding-bottom: max(60px, env(safe-area-inset-bottom));
  }
  
  .sidebar {
    padding-top: max(20px, env(safe-area-inset-top));
    padding-bottom: max(20px, env(safe-area-inset-bottom));
  }
}

/* Fix iOS scrolling momentum */
.scroll-container,
.grid,
.main-content,
#mobileFiltersPanel {
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

/* ===== FONT RENDERING CONSISTENCY ===== */

/* Ensure consistent font rendering across all platforms */
body,
input,
textarea,
select,
button {
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen', 'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Fix font weight consistency */
h1, h2, h3, h4, h5, h6 {
  font-weight: 700;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ===== COLOR CONSISTENCY ===== */

/* Force consistent color rendering */
* {
  color-scheme: dark;
}

/* Ensure consistent background colors */
body {
  background-color: #0b1020 !important;
  -webkit-tap-highlight-color: rgba(106, 183, 255, 0.2);
}

/* ===== BORDER & SHADOW CONSISTENCY ===== */

/* Consistent border rendering */
* {
  border-color: rgba(255, 255, 255, 0.15);
}

/* Consistent shadow rendering across platforms */
.card,
.panel,
.glass-panel {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ===== BACKDROP FILTER FALLBACKS ===== */

/* Fallback for browsers that don't support backdrop-filter */
@supports not (backdrop-filter: blur(20px)) {
  .glass-panel,
  .panel,
  .mobile-header {
    background: rgba(17, 26, 34, 0.95) !important;
  }
}

/* iOS specific backdrop filter fixes */
@supports (-webkit-backdrop-filter: blur(20px)) {
  .glass-panel,
  .panel,
  .mobile-header {
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    backdrop-filter: blur(20px) saturate(180%);
  }
}

/* ===== BUTTON & INPUT CONSISTENCY ===== */

/* Remove iOS input styling */
input,
textarea,
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: 8px;
}

/* Consistent button styling */
button {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border: none;
  background: transparent;
  cursor: pointer;
  touch-action: manipulation;
}

/* ===== SCROLLBAR CONSISTENCY ===== */

/* Custom scrollbars for all platforms */
::-webkit-scrollbar {
  width: 8px;
  height: 8px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: #4a5568;
  border-radius: 4px;
  -webkit-border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #718096;
}

/* Firefox scrollbar */
* {
  scrollbar-width: thin;
  scrollbar-color: #4a5568 transparent;
}

/* ===== iOS VERSION SPECIFIC FIXES ===== */

/* Older iOS (< iOS 14) - disable backdrop filter for performance */
@supports not (backdrop-filter: blur(1px)) {
  .glass-panel,
  .panel,
  .mobile-header,
  .filtersBar,
  .classBar {
    background: rgba(17, 26, 34, 0.98) !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
  }
}

/* Newer iOS (iOS 14+) - enable backdrop filter */
@supports (backdrop-filter: blur(1px)) {
  .glass-panel,
  .panel,
  .mobile-header {
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    backdrop-filter: blur(20px) saturate(180%);
  }
}

/* ===== TRANSFORM & TRANSITION CONSISTENCY ===== */

/* Hardware acceleration for better performance */
.card,
.sidebar,
.mobile-header,
.filtersBar {
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
  will-change: transform;
}

/* Consistent transitions */
* {
  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
  -webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ===== IMAGE RENDERING ===== */

/* Consistent image rendering */
img {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
}

/* ===== FLEXBOX CONSISTENCY ===== */

/* Ensure flexbox works consistently */
.flex,
[class*="flex"] {
  display: -webkit-flex;
  display: flex;
}

/* ===== GRID CONSISTENCY ===== */

/* Ensure CSS Grid works consistently */
.grid,
[class*="grid"] {
  display: -webkit-grid;
  display: grid;
}

/* ===== TOUCH TARGETS ===== */

/* Ensure minimum touch target size (iOS HIG: 44x44pt) - ONLY on mobile/touch devices */
@media (max-width: 932px), (pointer: coarse) {
  button,
  a,
  input[type="button"],
  input[type="submit"],
  .chip,
  .nav-item {
    min-height: 44px;
    min-width: 44px;
    touch-action: manipulation;
    -webkit-tap-highlight-color: rgba(106, 183, 255, 0.2);
  }
}

/* Desktop: no min-height restrictions */
@media (min-width: 933px) and (pointer: fine) {
  button,
  .chip,
  .nav-item {
    min-height: auto;
    min-width: auto;
  }
}

/* ===== FOCUS STATES ===== */

/* Consistent focus indicators */
*:focus {
  outline: 2px solid rgba(106, 183, 255, 0.5);
  outline-offset: 2px;
  -webkit-outline: 2px solid rgba(106, 183, 255, 0.5);
}

/* Remove default iOS focus ring */
*:focus:not(:focus-visible) {
  outline: none;
}

/* ===== Z-INDEX CONSISTENCY ===== */

/* Ensure consistent stacking context */
.mobile-header {
  z-index: 1100;
}

.sidebar {
  z-index: 1000;
}

#mobileFiltersPanel {
  z-index: 1200;
}

.modal {
  z-index: 1300;
}

/* ===== VIEWPORT FIXES ===== */

/* Fix iOS viewport height issues */
html {
  height: -webkit-fill-available;
}

body {
  min-height: 100vh;
  min-height: -webkit-fill-available;
}

/* ===== SPECIFIC iOS VERSION FIXES ===== */

/* iOS 12 and older - disable advanced features */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @supports not (backdrop-filter: blur(1px)) {
    /* Older iOS - use solid backgrounds */
    .glass-panel,
    .panel,
    .mobile-header {
      background: rgba(17, 26, 34, 0.98) !important;
    }
    
    /* Disable complex animations */
    * {
      animation: none !important;
      transition: none !important;
    }
    
    /* Allow sidebar transition only */
    .sidebar {
      transition: left 0.3s ease !important;
    }
  }
}

/* iOS 13+ - enable backdrop filters */
@supports (-webkit-backdrop-filter: blur(1px)) {
  .glass-panel,
  .panel,
  .mobile-header {
    -webkit-backdrop-filter: blur(20px) saturate(180%);
  }
}

/* iOS 14+ - full feature support */
@supports (backdrop-filter: blur(1px)) and (padding: max(0px)) {
  .glass-panel,
  .panel,
  .mobile-header {
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
  }
}

/* ===== SAFARI SPECIFIC FIXES ===== */

/* Fix Safari rendering issues */
@supports (-webkit-appearance: none) {
  /* Safari-specific fixes */
  input[type="text"],
  input[type="email"],
  input[type="password"],
  textarea {
    -webkit-appearance: none;
    border-radius: 8px;
  }
  
  /* Fix Safari button styling */
  button {
    -webkit-appearance: none;
  }
}

/* ===== WINDOWS SPECIFIC FIXES ===== */

/* Windows font rendering - optimize for ClearType */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
  body {
    -ms-font-feature-settings: normal;
    font-feature-settings: normal;
  }
}

/* Windows detection and fixes */
@supports (-ms-ime-align: auto) {
  /* Windows Edge/IE specific */
  body {
    -ms-font-feature-settings: normal;
    font-feature-settings: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
  }
}

/* Windows font rendering optimization - applied globally but refined by windows-compatibility class */
body {
  /* Force consistent font rendering on Windows */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}

/* Windows-specific DPI scaling fixes - ONLY for Windows */
@media screen and (-webkit-min-device-pixel-ratio: 1.25),
       screen and (min-resolution: 120dpi) {
  /* High DPI Windows displays - only apply when windows-compatibility class is present */
  .windows-compatibility body {
    font-size: 14px !important;
  }
  
  .windows-compatibility .chip, 
  .windows-compatibility .btn, 
  .windows-compatibility button {
    font-size: 13px !important;
    padding: 6px 10px !important;
  }
  
  .windows-compatibility input, 
  .windows-compatibility textarea, 
  .windows-compatibility select {
    font-size: 14px !important;
  }
}

/* Windows Chrome/Edge specific fixes - ONLY for Windows */
@supports (-webkit-appearance: none) and (not (-moz-appearance: none)) {
  /* Windows Chrome/Edge - only apply when windows-compatibility class is present */
  .windows-compatibility body {
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
  }
  
  /* Fix Windows Chrome input styling */
  .windows-compatibility input, 
  .windows-compatibility textarea, 
  .windows-compatibility select {
    -webkit-appearance: none;
    appearance: none;
  }
  
  /* Fix Windows Chrome button styling */
  .windows-compatibility button {
    -webkit-appearance: none;
    appearance: none;
  }
}

/* Windows Firefox specific fixes - ONLY for Windows */
@-moz-document url-prefix() {
  /* Windows Firefox - only apply when windows-compatibility class is present */
  .windows-compatibility body {
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
  }
  
  /* Fix Windows Firefox spacing */
  .windows-compatibility * {
    box-sizing: border-box !important;
  }
  
  /* Fix Windows Firefox line-height */
  .windows-compatibility p, 
  .windows-compatibility span, 
  .windows-compatibility div, 
  .windows-compatibility a, 
  .windows-compatibility li {
    line-height: 1.4 !important;
  }
}

/* Prevent Windows from adding extra gaps - Comprehensive Windows fixes */
.windows-compatibility,
.windows-compatibility body {
  /* Force consistent font rendering on Windows */
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
}

/* Windows-specific line-height fixes - prevent extra spacing */
.windows-compatibility p,
.windows-compatibility span,
.windows-compatibility div,
.windows-compatibility a,
.windows-compatibility li,
.windows-compatibility td,
.windows-compatibility th,
.windows-compatibility button,
.windows-compatibility input,
.windows-compatibility textarea,
.windows-compatibility select {
  line-height: 1.4 !important;
}

.windows-compatibility h1,
.windows-compatibility h2,
.windows-compatibility h3,
.windows-compatibility h4,
.windows-compatibility h5,
.windows-compatibility h6 {
  line-height: 1.2 !important;
}

/* Fix Windows padding/margin inconsistencies */
.windows-compatibility * {
  box-sizing: border-box !important;
}

/* Windows-specific font size normalization */
.windows-compatibility body {
  font-size: 14px !important;
}

/* Fix Windows button/input sizing */
.windows-compatibility button,
.windows-compatibility input,
.windows-compatibility textarea,
.windows-compatibility select {
  font-size: 14px !important;
  line-height: 1.4 !important;
  padding: 8px 12px !important;
  box-sizing: border-box !important;
  min-height: auto !important;
}

/* Fix Windows chip/button spacing */
.windows-compatibility .chip,
.windows-compatibility .btn,
.windows-compatibility button {
  padding: 6px 12px !important;
  line-height: 1.3 !important;
  min-height: auto !important;
  box-sizing: border-box !important;
  margin: 0 !important;
}

/* Fix Windows card spacing */
.windows-compatibility .card {
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

/* Fix Windows grid gaps */
.windows-compatibility .grid {
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
}

/* Fix Windows filter bar spacing */
.windows-compatibility .filtersBar,
.windows-compatibility .classBar {
  padding: 10px 12px !important;
  margin: 12px 0 !important;
  gap: 6px 10px !important;
  box-sizing: border-box !important;
}

/* Fix Windows sidebar spacing */
.windows-compatibility .sidebar {
  padding: 20px !important;
  box-sizing: border-box !important;
}

/* Fix Windows navigation item spacing */
.windows-compatibility .nav-item {
  padding: 12px 16px !important;
  margin-bottom: 4px !important;
  line-height: 1.3 !important;
  box-sizing: border-box !important;
}

/* Fix Windows input field sizing */
.windows-compatibility input[type="text"],
.windows-compatibility input[type="email"],
.windows-compatibility input[type="password"],
.windows-compatibility input[type="search"],
.windows-compatibility textarea {
  padding: 8px 12px !important;
  line-height: 1.4 !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
  min-height: auto !important;
}

/* Fix Windows select dropdown sizing */
.windows-compatibility select {
  padding: 8px 12px !important;
  line-height: 1.4 !important;
  font-size: 14px !important;
  box-sizing: border-box !important;
  min-height: auto !important;
}

/* Prevent Windows from making things bigger */
.windows-compatibility * {
  max-width: 100% !important;
}

/* Fix Windows text rendering - prevent blurry text */
.windows-compatibility body,
.windows-compatibility p,
.windows-compatibility span,
.windows-compatibility div,
.windows-compatibility a,
.windows-compatibility li,
.windows-compatibility button,
.windows-compatibility input,
.windows-compatibility textarea,
.windows-compatibility select {
  -webkit-font-smoothing: antialiased !important;
  -moz-osx-font-smoothing: grayscale !important;
  text-rendering: optimizeLegibility !important;
  transform: translateZ(0);
  -webkit-transform: translateZ(0);
}

/* Fix Windows image rendering */
.windows-compatibility img {
  image-rendering: -webkit-optimize-contrast !important;
  image-rendering: crisp-edges !important;
  -ms-interpolation-mode: bicubic !important;
}

/* Fix Windows border rendering */
.windows-compatibility * {
  border-width: 1px !important;
}

/* Fix Windows shadow rendering */
.windows-compatibility .card,
.windows-compatibility .panel,
.windows-compatibility .glass-panel {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
  -webkit-box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2) !important;
}

/* Fix Windows backdrop filter fallback */
.windows-compatibility .glass-panel,
.windows-compatibility .panel,
.windows-compatibility .mobile-header,
.windows-compatibility .filtersBar,
.windows-compatibility .classBar {
  background: rgba(17, 26, 34, 0.95) !important;
}

/* Additional Windows-specific fixes for common issues */
.windows-compatibility .filtersBar .chip {
  height: 18px !important;
  min-height: 18px !important;
  max-height: 18px !important;
  line-height: 1 !important;
  padding: 2px 6px !important;
}

.windows-compatibility .classBar .chip {
  padding: 6px 12px !important;
  line-height: 1.3 !important;
  min-height: auto !important;
}

.windows-compatibility .main-content {
  padding: 20px !important;
  box-sizing: border-box !important;
}

/* Fix Windows meta text spacing in cards */
.windows-compatibility .card .meta {
  padding: 10px 12px !important;
}

.windows-compatibility .card .name {
  line-height: 1.2 !important;
  margin-bottom: 4px !important;
}

.windows-compatibility .card .sub {
  line-height: 1.3 !important;
  margin-bottom: 4px !important;
}

.windows-compatibility .card .stats {
  line-height: 1.4 !important;
  gap: 10px !important;
}

/* ===== ANDROID SPECIFIC FIXES ===== */

/* Android Chrome specific */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  @supports (-webkit-appearance: none) and (not (backdrop-filter: blur(1px))) {
    /* Android fallbacks */
    .glass-panel,
    .panel {
      background: rgba(17, 26, 34, 0.95) !important;
    }
  }
}

/* ===== COLOR PROFILE CONSISTENCY ===== */

/* Ensure consistent color rendering */
* {
  color-interpolation-filters: sRGB;
  -webkit-color-correction: sRGB;
}

/* ===== TEXT RENDERING ===== */

/* Consistent text rendering across platforms */
p, span, div, a, li, td, th {
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ===== MEDIA QUERY CONSISTENCY ===== */

/* Ensure media queries work consistently */
@media (max-width: 768px) {
  /* Force hardware acceleration on mobile */
  .card,
  .sidebar,
  .mobile-header {
    transform: translateZ(0);
    -webkit-transform: translateZ(0);
  }
  
  /* Consistent touch handling */
  * {
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    user-select: none;
  }
  
  /* Allow text selection in inputs */
  input,
  textarea {
    -webkit-user-select: text;
    user-select: text;
  }
}

/* ===== FIX SPECIFIC iOS RENDERING BUGS ===== */

/* Fix iOS 15+ specific rendering issues */
@supports (-webkit-touch-callout: none) {
  /* iOS specific */
  body {
    -webkit-tap-highlight-color: rgba(106, 183, 255, 0.2);
  }
  
  /* Fix iOS input zoom - prevents automatic zoom on focus */
  input[type="text"],
  input[type="email"],
  input[type="password"],
  input[type="search"],
  textarea,
  select {
    font-size: 16px !important; /* Prevents zoom on focus */
  }
}

/* ===== iOS VERSION DETECTION & FIXES ===== */

/* Detect older iOS versions and apply performance optimizations */
@media screen and (-webkit-min-device-pixel-ratio: 0) {
  /* Older iOS (< iOS 13) - disable backdrop filter */
  @supports not (-webkit-backdrop-filter: blur(1px)) {
    .glass-panel,
    .panel,
    .mobile-header,
    .filtersBar,
    .classBar {
      background: rgba(17, 26, 34, 0.98) !important;
      -webkit-backdrop-filter: none !important;
      backdrop-filter: none !important;
    }
    
    /* Reduce animations for better performance */
    *:not(.sidebar):not(.sidebar *) {
      animation-duration: 0.15s !important;
      transition-duration: 0.15s !important;
    }
  }
  
  /* iOS 13+ - enable backdrop filters with fallback */
  @supports (-webkit-backdrop-filter: blur(1px)) {
    .glass-panel,
    .panel,
    .mobile-header {
      -webkit-backdrop-filter: blur(20px) saturate(180%);
      background: rgba(17, 26, 34, 0.85);
    }
  }
  
  /* iOS 14+ - full backdrop filter support */
  @supports (backdrop-filter: blur(1px)) {
    .glass-panel,
    .panel,
    .mobile-header {
      backdrop-filter: blur(20px) saturate(180%);
      -webkit-backdrop-filter: blur(20px) saturate(180%);
    }
  }
}

/* ===== CONSISTENT SPACING ===== */

/* Use rem for consistent spacing across devices */
:root {
  --spacing-unit: 1rem;
  --spacing-xs: 0.25rem;
  --spacing-sm: 0.5rem;
  --spacing-md: 1rem;
  --spacing-lg: 1.5rem;
  --spacing-xl: 2rem;
}

/* ===== FIX iOS SAFE AREA ISSUES ===== */

/* Handle iPhone notches and home indicators */
@supports (padding: env(safe-area-inset-top)) {
  .mobile-header {
    padding-top: calc(10px + env(safe-area-inset-top));
  }
  
  .main-content {
    padding-bottom: calc(60px + env(safe-area-inset-bottom));
  }
  
  .sidebar {
    padding-top: calc(20px + env(safe-area-inset-top));
    padding-bottom: calc(20px + env(safe-area-inset-bottom));
  }
  
  #mobileFiltersPanel {
    padding-top: calc(12px + env(safe-area-inset-top));
    padding-bottom: calc(80px + env(safe-area-inset-bottom));
  }
}

/* ===== FIX iOS STATUS BAR ===== */

/* Ensure content doesn't go under status bar */
@supports (padding: env(safe-area-inset-top)) {
  body {
    padding-top: env(safe-area-inset-top);
  }
}

/* ===== CONSISTENT OPACITY ===== */

/* Fix opacity rendering differences */
.panel,
.glass-panel,
.mobile-header {
  opacity: 1;
  -webkit-opacity: 1;
}

/* ===== FIX iOS ROUNDED CORNERS ===== */

/* Consistent border radius */
.card,
.panel,
.button,
.chip {
  border-radius: 12px;
  -webkit-border-radius: 12px;
  overflow: hidden;
}

/* ===== FIX iOS TEXT SELECTION ===== */

/* Consistent text selection */
::selection {
  background: rgba(106, 183, 255, 0.3);
  color: #ffffff;
}

::-moz-selection {
  background: rgba(106, 183, 255, 0.3);
  color: #ffffff;
}

/* ===== ADDITIONAL iOS CONSISTENCY FIXES ===== */

/* Force consistent rendering across iOS versions */
@supports (-webkit-touch-callout: none) {
  /* Fix iOS font weight rendering */
  body,
  p,
  span,
  div,
  a,
  button {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-smoothing: antialiased;
  }
  
  /* Fix iOS button rendering */
  button,
  .btn,
  input[type="button"],
  input[type="submit"] {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 8px;
  }
  
  /* Fix iOS input rendering */
  input,
  textarea,
  select {
    -webkit-appearance: none;
    appearance: none;
    border-radius: 8px;
  }
  
  /* Consistent colors across iOS versions */
  * {
    color: inherit;
  }
  
  /* Fix iOS background rendering */
  body {
    background-color: #0b1020;
    -webkit-background-size: cover;
    background-size: cover;
  }
}

/* ===== FIX iOS SAFARI SPECIFIC ISSUES ===== */

/* Safari on iOS - ensure consistent rendering */
@supports (-webkit-appearance: none) and (-webkit-touch-callout: none) {
  /* Fix Safari font rendering */
  * {
    -webkit-font-feature-settings: normal;
    font-feature-settings: normal;
  }
  
  /* Fix Safari transform rendering */
  .card,
  .sidebar,
  .mobile-header {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
  }
  
  /* Fix Safari backdrop filter */
  @supports (-webkit-backdrop-filter: blur(1px)) {
    .glass-panel,
    .panel,
    .mobile-header {
      -webkit-backdrop-filter: blur(20px) saturate(180%);
    }
  }
}

/* ===== ENSURE CONSISTENT COLORS ===== */

/* Force consistent color rendering */
* {
  color-scheme: dark;
  -webkit-color-correction: sRGB;
  color-interpolation-filters: sRGB;
}

/* ===== FIX iOS VIEWPORT HEIGHT ===== */

/* Fix iOS viewport height calculation */
@supports (-webkit-touch-callout: none) {
  html {
    height: -webkit-fill-available;
  }
  
  body {
    min-height: 100vh;
    min-height: -webkit-fill-available;
  }
  
  .main-content {
    min-height: calc(100vh - 56px);
    min-height: calc(-webkit-fill-available - 56px);
  }
}