body {
      box-sizing: border-box;
    }
    html, body {
      height: 100%;
    }
    
    :focus-visible {
      outline: 2px solid #8b86be;
      outline-offset: 2px;
    }
    
    .card-modern {
      transition: all 0.4s cubic-bezier(0.34, 1.56, 0.64, 1);
    }
    
    .card-modern:hover {
      transform: translateY(-4px) scale(1.01);
      box-shadow: 0 20px 40px rgba(139, 134, 190, 0.15);
    }
    
    .card-modern:active {
      transform: translateY(-1px) scale(0.99);
      transition: all 0.1s ease;
    }
    
    .glass {
      backdrop-filter: blur(20px) saturate(180%);
      -webkit-backdrop-filter: blur(20px) saturate(180%);
      background: rgba(255, 255, 255, 0.75);
      border: 1px solid rgba(255, 255, 255, 0.3);
    }
    
    .glass-dark {
      backdrop-filter: blur(20px) saturate(180%);
      -webkit-backdrop-filter: blur(20px) saturate(180%);
      background: rgba(17, 24, 39, 0.75);
      border: 1px solid rgba(255, 255, 255, 0.1);
    }
    
    .smooth-scroll {
      scroll-behavior: smooth;
      -webkit-overflow-scrolling: touch;
    }
    
    .custom-scrollbar::-webkit-scrollbar {
      width: 4px;
    }
    
    .custom-scrollbar::-webkit-scrollbar-track {
      background: transparent;
    }
    
    .custom-scrollbar::-webkit-scrollbar-thumb {
      background: linear-gradient(180deg, rgba(139, 134, 190, 0.4), rgba(134, 171, 186, 0.4));
      border-radius: 10px;
    }
    
    .custom-scrollbar::-webkit-scrollbar-thumb:hover {
      background: linear-gradient(180deg, rgba(139, 134, 190, 0.6), rgba(134, 171, 186, 0.6));
    }
    
    @keyframes fadeSlideUp {
      from {
        opacity: 0;
        transform: translateY(20px);
      }
      to {
        opacity: 1;
        transform: translateY(0);
      }
    }
    
    .fade-slide-up {
      animation: fadeSlideUp 0.5s cubic-bezier(0.34, 1.56, 0.64, 1);
    }
    
    @keyframes scaleFade {
      from {
        opacity: 0;
        transform: scale(0.95);
      }
      to {
        opacity: 1;
        transform: scale(1);
      }
    }
    
    .scale-fade {
      animation: scaleFade 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
    }
    
    @keyframes shimmer {
      0% {
        background-position: -1000px 0;
      }
      100% {
        background-position: 1000px 0;
      }
    }
    
    .shimmer {
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
      background-size: 1000px 100%;
      animation: shimmer 2s infinite;
    }
    
    @keyframes pulseGlow {
      0%, 100% {
        box-shadow: 0 0 20px rgba(139, 134, 190, 0.3);
      }
      50% {
        box-shadow: 0 0 30px rgba(139, 134, 190, 0.5);
      }
    }
    
    .pulse-glow {
      animation: pulseGlow 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
    }
    
    .btn-press {
      transition: all 0.15s cubic-bezier(0.4, 0, 0.2, 1);
    }
    
    .btn-press:active {
      transform: scale(0.95);
    }
    
    @keyframes float {
      0%, 100% {
        transform: translateY(0px);
      }
      50% {
        transform: translateY(-10px);
      }
    }
    
    .float {
      animation: float 3s ease-in-out infinite;
    }
    
    @keyframes gradientShift {
      0% {
        background-position: 0% 50%;
      }
      50% {
        background-position: 100% 50%;
      }
      100% {
        background-position: 0% 50%;
      }
    }
    
    .animated-gradient {
      background: linear-gradient(135deg, #8b86be, #86abba, #ecb761, #deb0bd, #cbd690);
      background-size: 400% 400%;
      animation: gradientShift 15s ease infinite;
    }
    
    @keyframes floatOrb {
      0%, 100% {
        transform: translate(0, 0) scale(1);
        opacity: 0.6;
      }
      33% {
        transform: translate(30px, -30px) scale(1.1);
        opacity: 0.8;
      }
      66% {
        transform: translate(-20px, 20px) scale(0.9);
        opacity: 0.7;
      }
    }
    
    .float-orb-1 {
      animation: floatOrb 8s ease-in-out infinite;
    }
    
    .float-orb-2 {
      animation: floatOrb 10s ease-in-out infinite 2s;
    }
    
    .float-orb-3 {
      animation: floatOrb 12s ease-in-out infinite 4s;
    }
    
    .text-glow {
      text-shadow: 0 0 20px rgba(255, 255, 255, 0.5),
                   0 0 40px rgba(255, 255, 255, 0.3),
                   0 0 60px rgba(255, 255, 255, 0.2);
    }
    
    .tab-transition {
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }
    
    .input-glow:focus {
      box-shadow: 0 0 0 3px rgba(139, 134, 190, 0.1);
    }