66 lines
1.4 KiB
CSS
66 lines
1.4 KiB
CSS
@tailwind base;
|
|
@tailwind components;
|
|
@tailwind utilities;
|
|
|
|
:root {
|
|
--background: #0f172a;
|
|
--foreground: #e2e8f0;
|
|
}
|
|
|
|
body {
|
|
color: var(--foreground);
|
|
background: var(--background);
|
|
font-family: Arial, Helvetica, sans-serif;
|
|
}
|
|
|
|
@layer utilities {
|
|
.text-balance {
|
|
text-wrap: balance;
|
|
}
|
|
}
|
|
|
|
/* ─── Budget River Animations ─────────────────────────── */
|
|
|
|
@keyframes waterFlow {
|
|
0% { transform: translateY(-100%); }
|
|
100% { transform: translateY(100%); }
|
|
}
|
|
|
|
@keyframes riverCurrent {
|
|
0% { stroke-dashoffset: 0; }
|
|
100% { stroke-dashoffset: -24; }
|
|
}
|
|
|
|
@keyframes droplet {
|
|
0% { transform: translateY(0) scale(1); opacity: 0.8; }
|
|
80% { opacity: 0.4; }
|
|
100% { transform: translateY(50px) scale(0.2); opacity: 0; }
|
|
}
|
|
|
|
@keyframes ripple {
|
|
0% { r: 2; opacity: 0.6; }
|
|
100% { r: 14; opacity: 0; }
|
|
}
|
|
|
|
@keyframes waveFloat {
|
|
0%, 100% { transform: translateY(0); }
|
|
50% { transform: translateY(-3px); }
|
|
}
|
|
|
|
@keyframes poolWave {
|
|
0% { d: path("M0,8 Q15,4 30,8 T60,8 T90,8 V20 H0 Z"); }
|
|
50% { d: path("M0,8 Q15,12 30,8 T60,8 T90,8 V20 H0 Z"); }
|
|
100% { d: path("M0,8 Q15,4 30,8 T60,8 T90,8 V20 H0 Z"); }
|
|
}
|
|
|
|
@keyframes shimmer {
|
|
0% { opacity: 0.3; }
|
|
50% { opacity: 0.7; }
|
|
100% { opacity: 0.3; }
|
|
}
|
|
|
|
@keyframes mergeSplash {
|
|
0% { rx: 2; ry: 1; opacity: 0.5; }
|
|
100% { rx: 20; ry: 4; opacity: 0; }
|
|
}
|