File size: 2,038 Bytes
a0c836f | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 | @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
background: #f5f7fa;
color: #0f172a;
height: 100vh;
overflow: hidden;
-webkit-font-smoothing: antialiased;
}
#root { width: 100%; height: 100vh; }
button { font-family: inherit; }
input, textarea { font-family: inherit; }
/* slim, modern scrollbars */
*::-webkit-scrollbar { width: 9px; height: 9px; }
*::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 999px; }
*::-webkit-scrollbar-thumb:hover { background: #94a3b8; }
*::-webkit-scrollbar-track { background: transparent; }
/* shared animations */
@keyframes pop { 0% { opacity: 0; transform: scale(.9) } 100% { opacity: 1; transform: scale(1) } }
@keyframes popBig { 0% { opacity: 0; transform: scale(.4) } 60% { transform: scale(1.12) } 100% { opacity: 1; transform: scale(1) } }
@keyframes floatUp {
0% { opacity: 0; transform: translate(-50%, 6px) scale(.8); }
15% { opacity: 1; transform: translate(-50%, -2px) scale(1.05); }
100% { opacity: 0; transform: translate(-50%, -42px) scale(1); }
}
@keyframes fadeIn { from { opacity: 0 } to { opacity: 1 } }
@keyframes slideUp { from { opacity: 0; transform: translateY(14px) } to { opacity: 1; transform: translateY(0) } }
@keyframes bounce { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-5px) } }
@keyframes spin { to { transform: rotate(360deg) } }
@keyframes confettiFall {
0% { opacity: 1; transform: translateY(-10vh) rotate(0deg); }
100% { opacity: 0; transform: translateY(90vh) rotate(720deg); }
}
@keyframes badgeSpin {
0% { transform: rotate(-12deg) scale(.4); opacity: 0; }
55% { transform: rotate(6deg) scale(1.15); opacity: 1; }
100% { transform: rotate(0deg) scale(1); opacity: 1; }
}
.dm-fade-in { animation: fadeIn .3s ease both; }
.dm-slide-up { animation: slideUp .35s ease both; }
|