CSS · 1480 bytes Raw Blame History
1 @import "tailwindcss";
2
3 :root {
4 --background: #ffffff;
5 --foreground: #171717;
6 }
7
8 @theme inline {
9 --color-background: var(--background);
10 --color-foreground: var(--foreground);
11 --font-sans: var(--font-geist-sans);
12 --font-mono: var(--font-geist-mono);
13 }
14
15 @media (prefers-color-scheme: dark) {
16 :root {
17 --background: #0a0a0a;
18 --foreground: #ededed;
19 }
20 }
21
22 body {
23 background: var(--background);
24 color: var(--foreground);
25 font-family: Arial, Helvetica, sans-serif;
26 }
27
28 /* Custom terminal font class */
29 .font-terminal {
30 font-family: var(--font-terminal, 'Anonymous Pro', 'Courier New', monospace);
31 }
32
33 /* Hide Next.js dev indicator */
34 [data-nextjs-portal] {
35 display: none !important;
36 }
37
38 /* Custom scrollbar for terminal */
39 .scrollbar-thin {
40 scrollbar-width: thin;
41 }
42
43 .scrollbar-thumb-gray-700::-webkit-scrollbar {
44 width: 8px;
45 }
46
47 .scrollbar-thumb-gray-700::-webkit-scrollbar-track {
48 background: #1f2937;
49 }
50
51 .scrollbar-thumb-gray-700::-webkit-scrollbar-thumb {
52 background-color: #374151;
53 border-radius: 4px;
54 }
55
56 .scrollbar-thumb-gray-700::-webkit-scrollbar-thumb:hover {
57 background-color: #4b5563;
58 }
59
60 /* Terminal cursor blink animation */
61 @keyframes blink {
62 0%, 50% { opacity: 1; }
63 51%, 100% { opacity: 0; }
64 }
65
66 /* Mole falling animation */
67 @keyframes moleFall {
68 0% {
69 transform: translateY(0);
70 opacity: 1;
71 }
72 100% {
73 transform: translateY(800px);
74 opacity: 0;
75 }
76 }
77
78 .mole-death {
79 animation: moleFall 1.5s ease-in forwards;
80 }