Hugging Face's logo

Spaces:
introspector
/
retro-sync-server
Build error

App Files Community
retro-sync-server
File size: 3,075 Bytes
1295969
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
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
135
136
137
138
@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@300;400;500;600;700&family=JetBrains+Mono:wght@300;400;500;600&display=swap');

@tailwind base;
@tailwind components;
@tailwind utilities;

@layer base {
  :root {
    --background: 240 10% 2%;
    --foreground: 0 0% 95%;

    --card: 240 10% 4%;
    --card-foreground: 0 0% 95%;

    --popover: 240 10% 4%;
    --popover-foreground: 0 0% 95%;

    /* Neon Green / Cypherpunk */
    --primary: 142 70% 50%;
    --primary-foreground: 240 10% 2%;

    --secondary: 240 6% 10%;
    --secondary-foreground: 0 0% 80%;

    --muted: 240 6% 10%;
    --muted-foreground: 240 5% 55%;

    /* Electric Violet */
    --accent: 270 100% 60%;
    --accent-foreground: 0 0% 98%;

    --destructive: 0 84% 60%;
    --destructive-foreground: 0 0% 98%;

    --border: 240 10% 12%;
    --input: 240 10% 12%;
    --ring: 142 70% 50%;

    --radius: 0px;

    /* Custom tokens */
    --glow-primary: 142 70% 50%;
    --glow-accent: 270 100% 60%;
    --surface-glass: 240 10% 4%;
  }
}

@layer base {
  * {
    @apply border-border;
  }

  body {
    @apply bg-background text-foreground font-sans antialiased selection:bg-primary selection:text-primary-foreground;
    background-image: 
      radial-gradient(circle at 50% 50%, hsl(var(--primary) / 0.03), transparent 50%),
      linear-gradient(hsl(var(--background)), hsl(var(--background)));
  }

  h1, h2, h3, h4, h5, h6 {
    @apply font-bold tracking-tight;
    font-family: 'Space Grotesk', system-ui, sans-serif;
  }
}

@layer utilities {
  .text-gradient-primary {
    @apply bg-clip-text text-transparent;
    background-image: linear-gradient(135deg, hsl(var(--primary)), hsl(var(--accent)));
  }

  .glow-primary {
    box-shadow: 0 0 20px -5px hsl(var(--glow-primary) / 0.5),
                0 0 40px -10px hsl(var(--glow-primary) / 0.3);
  }

  .glow-border {
    border-color: hsl(var(--primary) / 0.5);
    box-shadow: 0 0 10px -2px hsl(var(--primary) / 0.3);
  }

  .glass {
    background: hsl(var(--surface-glass) / 0.8);
    backdrop-filter: blur(12px);
    border: 1px solid hsl(var(--border));
  }

  .grid-pattern {
    background-image: 
      linear-gradient(hsl(var(--border) / 0.15) 1px, transparent 1px),
      linear-gradient(90deg, hsl(var(--border) / 0.15) 1px, transparent 1px);
    background-size: 60px 60px;
  }

  .scanline {
    position: relative;
    overflow: hidden;
  }

  .scanline::before {
    content: " ";
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: linear-gradient(
      rgba(18, 16, 16, 0) 50%,
      rgba(0, 0, 0, 0.06) 50%
    );
    z-index: 99;
    background-size: 100% 4px;
    pointer-events: none;
  }

  .terminal-cursor::after {
    content: "_";
    animation: blink 1s step-end infinite;
  }

  @keyframes blink {
    from, to { opacity: 1; }
    50% { opacity: 0; }
  }

  /* Editorial offset utility */
  .offset-right {
    margin-left: auto;
    margin-right: 0;
  }

  .offset-left {
    margin-left: 0;
    margin-right: auto;
  }
}