* {
       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);
   }

   .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)
   }

   .ticker-scroll {
       animation: tickerScroll 30s linear infinite;
   }

   @keyframes tickerScroll {
       0% {
           transform: translateX(0)
       }

       100% {
           transform: translateX(-50%)
       }
   }

   .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;
   }

   input[type="number"]::-webkit-inner-spin-button,
   input[type="number"]::-webkit-outer-spin-button {
       -webkit-appearance: none;
       margin: 0;
   }

   .depth-bar {
       position: relative;
   }

   .depth-bar-bg {
       position: absolute;
       top: 0;
       bottom: 0;
       opacity: 0.12;
       z-index: 0;
   }

   .depth-bar>* {
       position: relative;
       z-index: 1;
   }

   .price-flash-up {
       animation: flashUp 0.6s ease;
   }

   .price-flash-down {
       animation: flashDown 0.6s ease;
   }

   @keyframes flashUp {
       0% {
           background: rgba(34, 197, 94, 0.25)
       }

       100% {
           background: transparent
       }
   }

   @keyframes flashDown {
       0% {
           background: rgba(239, 68, 68, 0.25)
       }

       100% {
           background: transparent
       }
   }

   .range-slider {
       -webkit-appearance: none;
       appearance: none;
       height: 6px;
       border-radius: 3px;
       background: #e2e8f0;
       outline: none;
   }

   .dark .range-slider {
       background: #334155;
   }

   .range-slider::-webkit-slider-thumb {
       -webkit-appearance: none;
       appearance: none;
       width: 18px;
       height: 18px;
       border-radius: 50%;
       background: #3b82f6;
       cursor: pointer;
       border: 3px solid white;
       box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
   }

   .dark .range-slider::-webkit-slider-thumb {
       border-color: #1e293b;
   }

   .range-slider::-moz-range-thumb {
       width: 18px;
       height: 18px;
       border-radius: 50%;
       background: #3b82f6;
       cursor: pointer;
       border: 3px solid white;
       box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
   }

   .hide-scrollbar::-webkit-scrollbar {
       display: none;
   }

   .hide-scrollbar {
       -ms-overflow-style: none;
       scrollbar-width: none;
   }