HackHive/index.css at main · random-unknown-username/HackHive · GitHub

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
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;700&family=JetBrains+Mono:wght@400;700&display=swap');
@import "tailwindcss";

/* Tailwind v4 design tokens used throughout the handmade terminal-style UI. */
@theme {
  --font-sans: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
  --font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, monospace;
}

html {
  min-height: 100%;
  scroll-behavior: smooth;
  scroll-padding-top: 100px;
  overflow-x: clip;
}

@keyframes sweep {
  0% { translate: -100% 0; }
  100% { translate: 200% 0; }
}

@keyframes pulse-opacity {
  0%, 100% { opacity: 0.05; }
  50% { opacity: 0.15; }
}

@keyframes cursor-bee-wing-left {
  0%, 100% { transform: rotate(-10deg) scaleY(1); }
  50% { transform: rotate(18deg) scaleY(0.5); }
}

@keyframes cursor-bee-wing-right {
  0%, 100% { transform: rotate(8deg) scaleY(1); }
  50% { transform: rotate(-16deg) scaleY(0.52); }
}

body {
  background-color: #000;
  color: #fff;
  cursor: none;
  margin: 0;
  min-height: 100%;
  overflow-x: clip;
}

#root {
  min-height: 100%;
  overflow-x: clip;
}

.page-shift-clip {
  overflow: clip;
  padding-block: 48px;
  margin-block: -48px;
}

.cursor-bee {
  transform-origin: center;
  filter: saturate(1.12) contrast(1.05);
}

.cursor-bee-wing {
  transform-box: fill-box;
  transform-origin: 12% 82%;
  will-change: transform;
}

.cursor-bee-wing-left {
  animation: cursor-bee-wing-left 82ms linear infinite;
}

.cursor-bee-wing-right {
  animation: cursor-bee-wing-right 82ms linear infinite;
}

.mask-gradient {
  mask-image: linear-gradient(to right, black 80%, transparent 100%);
  -webkit-mask-image: linear-gradient(to right, black 80%, transparent 100%);
}

.no-scrollbar::-webkit-scrollbar {
  display: none;
}

.no-scrollbar {
  -ms-overflow-style: none;
  scrollbar-width: none;
}

@media (pointer: coarse) {
  body {
    cursor: auto;
  }
}

@keyframes wandering-bee-wing-left {
  0%, 100% { transform: rotate(-18deg) scaleY(1); }
  50% { transform: rotate(20deg) scaleY(0.5); }
}

@keyframes wandering-bee-wing-right {
  0%, 100% { transform: rotate(16deg) scaleY(1); }
  50% { transform: rotate(-18deg) scaleY(0.55); }
}

.wandering-bee-wing {
  transform-box: fill-box;
  will-change: transform;
}

.wandering-bee-wing-left {
  transform-origin: 13px 9px;
  animation: wandering-bee-wing-left 40ms linear infinite;
}

.wandering-bee-wing-right {
  transform-origin: 15px 9px;
  animation: wandering-bee-wing-right 40ms linear infinite;
}

@keyframes dust-pulse {
  0%, 100% { transform: scale(1); opacity: 0.2; }
  50% { transform: scale(1.3); opacity: 0.8; }
}

@keyframes rotate-clockwise {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.rendering-pixelated {
  image-rendering: pixelated;
  image-rendering: crisp-edges;
}