Hugging Face's logo

Spaces:
danhtran2mind-spaces-1
/
License-Plate-Detector-OCR
Sleeping

App Files Community
danhtran2mind commited on
Commit
2105e11
·
verified ·
1 Parent(s): 5134483

Upload 3 files

Browse files
Files changed (2) hide show
  1. apps/gradio_app/static/old-styles.css +100 -0
  2. apps/gradio_app/static/styles.css +480 -88
apps/gradio_app/static/old-styles.css ADDED
@@ -0,0 +1,100 @@
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
+ /* General body styling */
2
+ .gradio-container {
3
+ background: linear-gradient(180deg, #f9fafb, #f1efef);
4
+ font-family: 'Quicksand', ui-sans-serif, sans-serif;
5
+ color: #6b46c1; /* Purple-800 for text (neutral hue) */
6
+ font-size: 16px; /* Medium text size */
7
+ font-weight: 400;
8
+ }
9
+
10
+ /* Dark mode background */
11
+ @media (prefers-color-scheme: dark) {
12
+ .gradio-container {
13
+ background: linear-gradient(180deg, #1f2937, #111827);
14
+ color: #d6bcfa; /* Lighter purple for dark mode */
15
+ }
16
+ }
17
+
18
+ /* Block styling (containers for components) */
19
+ .block {
20
+ border: 1px solid #e9d8fd; /* Purple-200 for borders */
21
+ border-radius: 8px; /* Medium radius */
22
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); /* Small shadow */
23
+ padding: 16px; /* Medium spacing */
24
+ background: #f1efef;
25
+ }
26
+
27
+ /* Input fields */
28
+ input[type="text"], textarea {
29
+ background: #faf5ff; /* Purple-50 for input background */
30
+ border: 1px solid #e9d8fd; /* Purple-200 for borders */
31
+ border-radius: 8px;
32
+ padding: 8px;
33
+ font-family: 'Quicksand', ui-sans-serif, sans-serif;
34
+ font-size: 16px;
35
+ color: #6b46c1;
36
+ box-shadow: none;
37
+ }
38
+ input[type="text"]:focus, textarea:focus {
39
+ outline: none;
40
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); /* Small shadow on focus */
41
+ border-color: #48bb78; /* Green-400 for focus */
42
+ }
43
+
44
+ /* Primary button */
45
+ button.primary {
46
+ background: #48bb78; /* Green-400 */
47
+ color: #f1efef;
48
+ border: none;
49
+ border-radius: 8px;
50
+ padding: 8px 16px;
51
+ font-family: 'Quicksand', ui-sans-serif, sans-serif;
52
+ font-size: 16px;
53
+ font-weight: 500;
54
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
55
+ cursor: pointer;
56
+ }
57
+ button.primary:hover {
58
+ background: #ed8936; /* Orange-400 for hover */
59
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Medium shadow on hover */
60
+ }
61
+
62
+ /* Secondary button */
63
+ button.secondary {
64
+ color: #48bb78; /* Green-400 for text */
65
+ border: 1px solid #48bb78; /* Green-400 for border */
66
+ border-radius: 8px;
67
+ padding: 8px 16px;
68
+ font-family: 'Quicksand', ui-sans-serif, sans-serif;
69
+ font-size: 16px;
70
+ font-weight: 500;
71
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
72
+ cursor: pointer;
73
+ }
74
+ button.secondary:hover {
75
+ background: #ed8936; /* Orange-400 for hover */
76
+ color: #48bb78;
77
+ box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
78
+ }
79
+
80
+ /* Slider styling */
81
+ input[type="range"] {
82
+ accent-color: #ed8936; /* Orange-400 for slider */
83
+ }
84
+ @media (prefers-color-scheme: dark) {
85
+ input[type="range"] {
86
+ accent-color: #f6ad55; /* Orange-600 for dark mode */
87
+ }
88
+ }
89
+
90
+ /* Markdown headers */
91
+ h2 {
92
+ font-weight: 500;
93
+ color: #6b46c1; /* Purple-800 */
94
+ margin-bottom: 16px;
95
+ }
96
+
97
+ /* Code or monospace elements */
98
+ code, pre {
99
+ font-family: 'IBM Plex Mono', ui-monospace, monospace;
100
+ }
apps/gradio_app/static/styles.css CHANGED
@@ -1,100 +1,492 @@
1
- /* General body styling */
2
- .gradio-container {
3
- background: linear-gradient(180deg, #f9fafb, #f1efef);
4
- font-family: 'Quicksand', ui-sans-serif, sans-serif;
5
- color: #6b46c1; /* Purple-800 for text (neutral hue) */
6
- font-size: 16px; /* Medium text size */
7
- font-weight: 400;
8
  }
9
-
10
- /* Dark mode background */
11
- @media (prefers-color-scheme: dark) {
12
- .gradio-container {
13
- background: linear-gradient(180deg, #1f2937, #111827);
14
- color: #d6bcfa; /* Lighter purple for dark mode */
15
- }
16
  }
17
-
18
- /* Block styling (containers for components) */
19
- .block {
20
- border: 1px solid #e9d8fd; /* Purple-200 for borders */
21
- border-radius: 8px; /* Medium radius */
22
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05); /* Small shadow */
23
- padding: 16px; /* Medium spacing */
24
- background: #f1efef;
25
  }
26
-
27
- /* Input fields */
28
- input[type="text"], textarea {
29
- background: #faf5ff; /* Purple-50 for input background */
30
- border: 1px solid #e9d8fd; /* Purple-200 for borders */
31
- border-radius: 8px;
32
- padding: 8px;
33
- font-family: 'Quicksand', ui-sans-serif, sans-serif;
34
- font-size: 16px;
35
- color: #6b46c1;
36
- box-shadow: none;
37
- }
38
- input[type="text"]:focus, textarea:focus {
39
- outline: none;
40
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); /* Small shadow on focus */
41
- border-color: #48bb78; /* Green-400 for focus */
42
  }
43
-
44
- /* Primary button */
45
- button.primary {
46
- background: #48bb78; /* Green-400 */
47
- color: #f1efef;
48
- border: none;
49
- border-radius: 8px;
50
- padding: 8px 16px;
51
- font-family: 'Quicksand', ui-sans-serif, sans-serif;
52
- font-size: 16px;
53
- font-weight: 500;
54
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
55
- cursor: pointer;
56
- }
57
- button.primary:hover {
58
- background: #ed8936; /* Orange-400 for hover */
59
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Medium shadow on hover */
60
  }
61
-
62
- /* Secondary button */
63
- button.secondary {
64
- color: #48bb78; /* Green-400 for text */
65
- border: 1px solid #48bb78; /* Green-400 for border */
66
- border-radius: 8px;
67
- padding: 8px 16px;
68
- font-family: 'Quicksand', ui-sans-serif, sans-serif;
69
- font-size: 16px;
70
- font-weight: 500;
71
- box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
72
- cursor: pointer;
73
- }
74
- button.secondary:hover {
75
- background: #ed8936; /* Orange-400 for hover */
76
- color: #48bb78;
77
- box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
78
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
79
 
80
- /* Slider styling */
81
- input[type="range"] {
82
- accent-color: #ed8936; /* Orange-400 for slider */
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
83
  }
84
- @media (prefers-color-scheme: dark) {
85
- input[type="range"] {
86
- accent-color: #f6ad55; /* Orange-600 for dark mode */
87
- }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
88
  }
89
 
90
- /* Markdown headers */
91
- h2 {
92
- font-weight: 500;
93
- color: #6b46c1; /* Purple-800 */
94
- margin-bottom: 16px;
 
 
 
 
 
 
 
 
95
  }
 
 
 
 
 
 
 
 
 
 
 
 
96
 
97
- /* Code or monospace elements */
98
- code, pre {
99
- font-family: 'IBM Plex Mono', ui-monospace, monospace;
100
- }
 
1
+ /* @import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap'); */
2
+ /* ─── palette ───────────────────────────────────────────── */
3
+ body, .gradio-container {
4
+ font-family: 'Inter', sans-serif;
5
+ background: #FFFBF7;
6
+ color: #0F172A;
 
7
  }
8
+ a {
9
+ color: #F97316;
10
+ text-decoration: none;
11
+ font-weight: 600;
 
 
 
12
  }
13
+ a:hover { color: #C2410C; }
14
+ /* ─── headline ──────────────────────────────────────────── */
15
+ #titlebar {
16
+ text-align: center;
17
+ margin-top: 2.4rem;
18
+ margin-bottom: .9rem;
 
 
19
  }
20
+ /* ─── card look ─────────────────────────────────────────── */
21
+ .gr-block,
22
+ .gr-box,
23
+ .gr-row,
24
+ #cite-wrapper {
25
+ border: 1px solid #F8C89B;
26
+ border-radius: 10px;
27
+ background: #fff;
28
+ box-shadow: 0 3px 6px rgba(0, 0, 0, .05);
 
 
 
 
 
 
 
29
  }
30
+ .gr-gallery-item { background: #fff; }
31
+ /* ─── controls / inputs ─────────────────────────────────── */
32
+ .gr-button-primary,
33
+ #copy-btn {
34
+ background: linear-gradient(90deg, #F97316 0%, #C2410C 100%);
35
+ border: none;
36
+ color: #fff;
37
+ border-radius: 6px;
38
+ font-weight: 600;
39
+ transition: transform .12s ease, box-shadow .12s ease;
 
 
 
 
 
 
 
40
  }
41
+ .gr-button-primary:hover,
42
+ #copy-btn:hover {
43
+ transform: translateY(-2px);
44
+ box-shadow: 0 4px 12px rgba(249, 115, 22, .35);
45
+ }
46
+ .gr-dropdown input {
47
+ border: 1px solid #F9731699;
48
+ }
49
+ .preview img,
50
+ .preview canvas { object-fit: contain !important; }
51
+ /* ─── hero section ─────────────────────────────────────── */
52
+ #hero-wrapper { text-align: center; }
53
+ #hero-badge {
54
+ display: inline-block;
55
+ padding: .85rem 1.2rem;
56
+ border-radius: 8px;
57
+ background: #FFEAD2;
58
+ border: 1px solid #F9731655;
59
+ font-size: .95rem;
60
+ font-weight: 600;
61
+ margin-bottom: .5rem;
62
+ }
63
+ #hero-links {
64
+ font-size: .95rem;
65
+ font-weight: 600;
66
+ margin-bottom: 1.6rem;
67
+ }
68
+ #hero-links img {
69
+ height: 22px;
70
+ vertical-align: middle;
71
+ margin-left: .55rem;
72
+ }
73
+ /* ─── score area ───────────────────────────────────────── */
74
+ #score-area {
75
+ text-align: center;
76
+ }
77
+ .title-container {
78
+ display: flex;
79
+ align-items: center;
80
+ gap: 12px;
81
+ justify-content: center;
82
+ margin-bottom: 10px;
83
+ text-align: center;
84
+ }
85
+ .match-badge {
86
+ display: inline-block;
87
+ padding: .35rem .9rem;
88
+ border-radius: 9999px;
89
+ font-weight: 600;
90
+ font-size: 1.25rem;
91
+ }
92
+ /* ─── citation card ────────────────────────────────────── */
93
+ #cite-wrapper {
94
+ position: relative;
95
+ padding: .9rem 1rem;
96
+ margin-top: 2rem;
97
+ }
98
+ #cite-wrapper code {
99
+ font-family: SFMono-Regular, Consolas, monospace;
100
+ font-size: .84rem;
101
+ white-space: pre-wrap;
102
+ color: #0F172A;
103
+ }
104
+ #copy-btn {
105
+ position: absolute;
106
+ top: .55rem;
107
+ right: .6rem;
108
+ padding: .18rem .7rem;
109
+ font-size: .72rem;
110
+ line-height: 1;
111
  }
112
+ /* ─── dark mode ────────────────────────────────────── */
113
+ .dark body,
114
+ .dark .gradio-container {
115
+ background-color: #332a22;
116
+ color: #e5e7eb;
117
+ }
118
+ .dark .gr-block,
119
+ .dark .gr-box,
120
+ .dark .gr-row {
121
+ background-color: #332a22;
122
+ border: 1px solid #4b5563;
123
+ }
124
+ .dark .gr-dropdown input {
125
+ background-color: #332a22;
126
+ color: #f1f5f9;
127
+ border: 1px solid #F97316aa;
128
+ }
129
+ .dark #hero-badge {
130
+ background: #334155;
131
+ border: 1px solid #F9731655;
132
+ color: #fefefe;
133
+ }
134
+ .dark #cite-wrapper {
135
+ background-color: #473f38;
136
+ }
137
+ .dark #bibtex {
138
+ color: #f8fafc !important;
139
+ }
140
+ .dark .card {
141
+ background-color: #473f38;
142
+ }
143
+ /* ─── switch logo for light/dark theme ─────────────── */
144
+ .logo-dark { display: none; }
145
+ .dark .logo-light { display: none; }
146
+ .dark .logo-dark { display: inline; }
147
+
148
+ /* https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap */
149
 
150
+ /* cyrillic-ext */
151
+ @font-face {
152
+ font-family: 'Inter';
153
+ font-style: normal;
154
+ font-weight: 400;
155
+ font-display: swap;
156
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7SUc.woff2) format('woff2');
157
+ unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
158
+ }
159
+ /* cyrillic */
160
+ @font-face {
161
+ font-family: 'Inter';
162
+ font-style: normal;
163
+ font-weight: 400;
164
+ font-display: swap;
165
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7SUc.woff2) format('woff2');
166
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
167
+ }
168
+ /* greek-ext */
169
+ @font-face {
170
+ font-family: 'Inter';
171
+ font-style: normal;
172
+ font-weight: 400;
173
+ font-display: swap;
174
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7SUc.woff2) format('woff2');
175
+ unicode-range: U+1F00-1FFF;
176
+ }
177
+ /* greek */
178
+ @font-face {
179
+ font-family: 'Inter';
180
+ font-style: normal;
181
+ font-weight: 400;
182
+ font-display: swap;
183
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7SUc.woff2) format('woff2');
184
+ unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
185
+ }
186
+ /* vietnamese */
187
+ @font-face {
188
+ font-family: 'Inter';
189
+ font-style: normal;
190
+ font-weight: 400;
191
+ font-display: swap;
192
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7SUc.woff2) format('woff2');
193
+ unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
194
+ }
195
+ /* latin-ext */
196
+ @font-face {
197
+ font-family: 'Inter';
198
+ font-style: normal;
199
+ font-weight: 400;
200
+ font-display: swap;
201
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
202
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
203
+ }
204
+ /* latin */
205
+ @font-face {
206
+ font-family: 'Inter';
207
+ font-style: normal;
208
+ font-weight: 400;
209
+ font-display: swap;
210
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
211
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
212
+ }
213
+ /* cyrillic-ext */
214
+ @font-face {
215
+ font-family: 'Inter';
216
+ font-style: normal;
217
+ font-weight: 500;
218
+ font-display: swap;
219
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7SUc.woff2) format('woff2');
220
+ unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
221
  }
222
+ /* cyrillic */
223
+ @font-face {
224
+ font-family: 'Inter';
225
+ font-style: normal;
226
+ font-weight: 500;
227
+ font-display: swap;
228
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7SUc.woff2) format('woff2');
229
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
230
+ }
231
+ /* greek-ext */
232
+ @font-face {
233
+ font-family: 'Inter';
234
+ font-style: normal;
235
+ font-weight: 500;
236
+ font-display: swap;
237
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7SUc.woff2) format('woff2');
238
+ unicode-range: U+1F00-1FFF;
239
+ }
240
+ /* greek */
241
+ @font-face {
242
+ font-family: 'Inter';
243
+ font-style: normal;
244
+ font-weight: 500;
245
+ font-display: swap;
246
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7SUc.woff2) format('woff2');
247
+ unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
248
+ }
249
+ /* vietnamese */
250
+ @font-face {
251
+ font-family: 'Inter';
252
+ font-style: normal;
253
+ font-weight: 500;
254
+ font-display: swap;
255
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7SUc.woff2) format('woff2');
256
+ unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
257
+ }
258
+ /* latin-ext */
259
+ @font-face {
260
+ font-family: 'Inter';
261
+ font-style: normal;
262
+ font-weight: 500;
263
+ font-display: swap;
264
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
265
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
266
+ }
267
+ /* latin */
268
+ @font-face {
269
+ font-family: 'Inter';
270
+ font-style: normal;
271
+ font-weight: 500;
272
+ font-display: swap;
273
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
274
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
275
+ }
276
+ /* cyrillic-ext */
277
+ @font-face {
278
+ font-family: 'Inter';
279
+ font-style: normal;
280
+ font-weight: 600;
281
+ font-display: swap;
282
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7SUc.woff2) format('woff2');
283
+ unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
284
+ }
285
+ /* cyrillic */
286
+ @font-face {
287
+ font-family: 'Inter';
288
+ font-style: normal;
289
+ font-weight: 600;
290
+ font-display: swap;
291
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7SUc.woff2) format('woff2');
292
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
293
+ }
294
+ /* greek-ext */
295
+ @font-face {
296
+ font-family: 'Inter';
297
+ font-style: normal;
298
+ font-weight: 600;
299
+ font-display: swap;
300
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7SUc.woff2) format('woff2');
301
+ unicode-range: U+1F00-1FFF;
302
+ }
303
+ /* greek */
304
+ @font-face {
305
+ font-family: 'Inter';
306
+ font-style: normal;
307
+ font-weight: 600;
308
+ font-display: swap;
309
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7SUc.woff2) format('woff2');
310
+ unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
311
+ }
312
+ /* vietnamese */
313
+ @font-face {
314
+ font-family: 'Inter';
315
+ font-style: normal;
316
+ font-weight: 600;
317
+ font-display: swap;
318
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7SUc.woff2) format('woff2');
319
+ unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
320
+ }
321
+ /* latin-ext */
322
+ @font-face {
323
+ font-family: 'Inter';
324
+ font-style: normal;
325
+ font-weight: 600;
326
+ font-display: swap;
327
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
328
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
329
+ }
330
+ /* latin */
331
+ @font-face {
332
+ font-family: 'Inter';
333
+ font-style: normal;
334
+ font-weight: 600;
335
+ font-display: swap;
336
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
337
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
338
+ }
339
+ /* cyrillic-ext */
340
+ @font-face {
341
+ font-family: 'Inter';
342
+ font-style: normal;
343
+ font-weight: 700;
344
+ font-display: swap;
345
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7SUc.woff2) format('woff2');
346
+ unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
347
+ }
348
+ /* cyrillic */
349
+ @font-face {
350
+ font-family: 'Inter';
351
+ font-style: normal;
352
+ font-weight: 700;
353
+ font-display: swap;
354
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7SUc.woff2) format('woff2');
355
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
356
+ }
357
+ /* greek-ext */
358
+ @font-face {
359
+ font-family: 'Inter';
360
+ font-style: normal;
361
+ font-weight: 700;
362
+ font-display: swap;
363
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7SUc.woff2) format('woff2');
364
+ unicode-range: U+1F00-1FFF;
365
+ }
366
+ /* greek */
367
+ @font-face {
368
+ font-family: 'Inter';
369
+ font-style: normal;
370
+ font-weight: 700;
371
+ font-display: swap;
372
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7SUc.woff2) format('woff2');
373
+ unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
374
+ }
375
+ /* vietnamese */
376
+ @font-face {
377
+ font-family: 'Inter';
378
+ font-style: normal;
379
+ font-weight: 700;
380
+ font-display: swap;
381
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7SUc.woff2) format('woff2');
382
+ unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
383
+ }
384
+ /* latin-ext */
385
+ @font-face {
386
+ font-family: 'Inter';
387
+ font-style: normal;
388
+ font-weight: 700;
389
+ font-display: swap;
390
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
391
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
392
+ }
393
+ /* latin */
394
+ @font-face {
395
+ font-family: 'Inter';
396
+ font-style: normal;
397
+ font-weight: 700;
398
+ font-display: swap;
399
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
400
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
401
+ }
402
+ /* cyrillic-ext */
403
+ @font-face {
404
+ font-family: 'Inter';
405
+ font-style: normal;
406
+ font-weight: 800;
407
+ font-display: swap;
408
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2JL7SUc.woff2) format('woff2');
409
+ unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
410
+ }
411
+ /* cyrillic */
412
+ @font-face {
413
+ font-family: 'Inter';
414
+ font-style: normal;
415
+ font-weight: 800;
416
+ font-display: swap;
417
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa0ZL7SUc.woff2) format('woff2');
418
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
419
+ }
420
+ /* greek-ext */
421
+ @font-face {
422
+ font-family: 'Inter';
423
+ font-style: normal;
424
+ font-weight: 800;
425
+ font-display: swap;
426
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2ZL7SUc.woff2) format('woff2');
427
+ unicode-range: U+1F00-1FFF;
428
+ }
429
+ /* greek */
430
+ @font-face {
431
+ font-family: 'Inter';
432
+ font-style: normal;
433
+ font-weight: 800;
434
+ font-display: swap;
435
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1pL7SUc.woff2) format('woff2');
436
+ unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
437
+ }
438
+ /* vietnamese */
439
+ @font-face {
440
+ font-family: 'Inter';
441
+ font-style: normal;
442
+ font-weight: 800;
443
+ font-display: swap;
444
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa2pL7SUc.woff2) format('woff2');
445
+ unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
446
+ }
447
+ /* latin-ext */
448
+ @font-face {
449
+ font-family: 'Inter';
450
+ font-style: normal;
451
+ font-weight: 800;
452
+ font-display: swap;
453
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa25L7SUc.woff2) format('woff2');
454
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
455
+ }
456
+ /* latin */
457
+ @font-face {
458
+ font-family: 'Inter';
459
+ font-style: normal;
460
+ font-weight: 800;
461
+ font-display: swap;
462
+ src: url(https://fonts.gstatic.com/s/inter/v19/UcC73FwrK3iLTeHuS_nVMrMxCp50SjIa1ZL7.woff2) format('woff2');
463
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
464
  }
465
 
466
+ /* title_css */
467
+ #title {
468
+ font-size: 2.6rem;
469
+ font-weight: 800;
470
+ margin: 0;
471
+ line-height: 1.25;
472
+ color: #0F172A;
473
+ }
474
+ /* brand class is passed in title parameter */
475
+ #title .brand {
476
+ background: linear-gradient(90deg, #F97316 0%, #C2410C 90%);
477
+ -webkit-background-clip: text;
478
+ color: transparent;
479
  }
480
+ .dark #title {
481
+ color: #f8fafc;
482
+ }
483
+ .title-container {
484
+ display: flex;
485
+ align-items: center;
486
+ gap: 12px;
487
+ justify-content: center;
488
+ margin-bottom: 10px;
489
+ text-align: center;
490
+ }
491
+
492