| @tailwind base; |
| @tailwind components; |
| @tailwind utilities; |
|
|
| |
| *, *::before, *::after { |
| box-sizing: border-box; |
| margin: 0; |
| padding: 0; |
| } |
|
|
| html { |
| scroll-behavior: smooth; |
| -webkit-font-smoothing: antialiased; |
| -moz-osx-font-smoothing: grayscale; |
| } |
|
|
| body { |
| background-color: #0a0c10; |
| color: #f8fafc; |
| font-family: 'Inter', system-ui, sans-serif; |
| min-height: 100vh; |
| } |
|
|
| |
| ::-webkit-scrollbar { |
| width: 6px; |
| height: 6px; |
| } |
| ::-webkit-scrollbar-track { |
| background: #0f1218; |
| } |
| ::-webkit-scrollbar-thumb { |
| background: #2e3847; |
| border-radius: 999px; |
| } |
| ::-webkit-scrollbar-thumb:hover { |
| background: #3d4d60; |
| } |
|
|
| |
| ::selection { |
| background: rgba(26, 107, 255, 0.35); |
| color: #fff; |
| } |
|
|
| |
| :focus-visible { |
| outline: 2px solid rgba(26, 107, 255, 0.6); |
| outline-offset: 2px; |
| border-radius: 4px; |
| } |
|
|
| |
| @layer utilities { |
| .text-balance { |
| text-wrap: balance; |
| } |
|
|
| .glow-brand { |
| box-shadow: 0 0 30px rgba(26, 107, 255, 0.25); |
| } |
|
|
| .glow-emerald { |
| box-shadow: 0 0 30px rgba(16, 185, 129, 0.2); |
| } |
|
|
| .shimmer { |
| background: linear-gradient( |
| 90deg, |
| rgba(255, 255, 255, 0) 0%, |
| rgba(255, 255, 255, 0.05) 50%, |
| rgba(255, 255, 255, 0) 100% |
| ); |
| background-size: 200% 100%; |
| animation: shimmer 2s linear infinite; |
| } |
| } |
|
|
| |
| @keyframes fadeIn { |
| from { opacity: 0; } |
| to { opacity: 1; } |
| } |
|
|
| @keyframes slideUp { |
| from { opacity: 0; transform: translateY(20px); } |
| to { opacity: 1; transform: translateY(0); } |
| } |
|
|
| @keyframes bounceSubtle { |
| 0%, 100% { transform: translateY(0); } |
| 50% { transform: translateY(-6px); } |
| } |
|
|
| @keyframes shimmer { |
| 0% { background-position: -200% 0; } |
| 100% { background-position: 200% 0; } |
| } |
|
|
| |
| .tabular-nums { |
| font-variant-numeric: tabular-nums; |
| } |
|
|
