/* Custom styles that can't be achieved with Tailwind */ body { font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif; } /* Coin upload area styling */ #previewImage { max-width: 100%; border-radius: 0.5rem; } #coinImage + label:hover { background-color: #f8fafc; } /* Analysis results styling */ #results { min-height: 200px; transition: all 0.3s ease; } /* Animation for buttons */ button, a[href^="https://"] { transition: all 0.3s ease; transform: translateY(0); } button:hover, a[href^="https://"]:hover { transform: translateY(-2px); box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06); } /* Loading spinner */ @keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } .animate-spin { animation: spin 1s linear infinite; } /* Responsive adjustments */ @media (max-width: 640px) { .container { padding-left: 1rem; padding-right: 1rem; } }