  * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
  }

  body {
      font-family: 'Inter', sans-serif;
  }

  .font-jakarta {
      font-family: 'Plus Jakarta Sans', sans-serif;
  }

  .font-mono {
      font-family: 'JetBrains Mono', monospace;
  }

  ::-webkit-scrollbar {
      width: 6px;
      height: 6px;
  }

  ::-webkit-scrollbar-track {
      background: transparent;
  }

  ::-webkit-scrollbar-thumb {
      background: #cbd5e1;
      border-radius: 3px;
  }

  .dark ::-webkit-scrollbar-thumb {
      background: #475569;
  }

  .sidebar-link {
      transition: all 0.2s ease;
  }

  .sidebar-link:hover {
      background: rgba(59, 130, 246, 0.08);
  }

  .sidebar-link.active {
      background: rgba(59, 130, 246, 0.12);
      color: #3b82f6;
      border-right: 3px solid #3b82f6;
  }

  .dark .sidebar-link:hover {
      background: rgba(59, 130, 246, 0.15);
  }

  .dark .sidebar-link.active {
      background: rgba(59, 130, 246, 0.2);
  }

  .card-hover {
      transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  }

  .card-hover:hover {
      transform: translateY(-2px);
      box-shadow: 0 12px 24px -8px rgba(0, 0, 0, 0.12);
  }

  .dark .card-hover:hover {
      box-shadow: 0 12px 24px -8px rgba(0, 0, 0, 0.4);
  }

  .fade-in {
      animation: fadeIn 0.4s ease forwards;
  }

  .slide-up {
      animation: slideUp 0.4s ease forwards;
  }

  .scale-in {
      animation: scaleIn 0.3s ease forwards;
  }

  @keyframes fadeIn {
      from {
          opacity: 0
      }

      to {
          opacity: 1
      }
  }

  @keyframes slideUp {
      from {
          opacity: 0;
          transform: translateY(16px)
      }

      to {
          opacity: 1;
          transform: translateY(0)
      }
  }

  @keyframes scaleIn {
      from {
          opacity: 0;
          transform: scale(0.95)
      }

      to {
          opacity: 1;
          transform: scale(1)
      }
  }

  @media(prefers-reduced-motion:reduce) {

      .fade-in,
      .slide-up,
      .scale-in {
          animation: none
      }
  }

  .overlay {
      background: rgba(0, 0, 0, 0.5);
      backdrop-filter: blur(4px)
  }

  .pulse-dot {
      animation: pulseDot 2s ease-in-out infinite;
  }

  @keyframes pulseDot {

      0%,
      100% {
          opacity: 1
      }

      50% {
          opacity: 0.4
      }
  }

  .glass-effect {
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
  }

  input[type="search"]::-webkit-search-cancel-button {
      -webkit-appearance: none;
  }

  .hide-scrollbar::-webkit-scrollbar {
      display: none;
  }

  .hide-scrollbar {
      -ms-overflow-style: none;
      scrollbar-width: none;
  }

  .heatmap-cell {
      transition: all 0.2s;
  }

  .heatmap-cell:hover {
      filter: brightness(1.1);
      transform: scale(1.05);
      border-radius: 4px;
      z-index: 10;
      position: relative;
  }