@import "tailwindcss";

@source "../node_modules/streamdown/dist/*.js";

@layer base {
  html,
  body {
    font-size: 17px;
    height: 100%;
    overflow: hidden;
    background: #0a0a0a;
    color: #f0f0f0;
  }

  #root {
    height: 100%;
  }

  * {
    scrollbar-width: thin;
    scrollbar-color: transparent transparent;
  }

  *:hover {
    scrollbar-color: #3a3a3a transparent;
  }

  ::-webkit-scrollbar {
    width: 6px;
    height: 6px;
  }

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

  ::-webkit-scrollbar-thumb {
    background: transparent;
    border-radius: 3px;
  }

  *:hover::-webkit-scrollbar-thumb {
    background: #3a3a3a;
  }

  *:hover::-webkit-scrollbar-thumb:hover {
    background: #555555;
  }
}

@keyframes fade-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.animate-fade-in {
  animation: fade-in 0.5s ease-out both;
}