@four-leaf-studios/rl-overlay 1.0.5 → 1.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (53) hide show
  1. package/.github/copilot-instructions.md +70 -0
  2. package/dist/index.cjs.js +298 -10599
  3. package/dist/index.cjs.js.map +1 -1
  4. package/dist/index.esm.js +328 -10612
  5. package/dist/index.esm.js.map +1 -1
  6. package/dist/types/Overlay.d.ts +5 -6
  7. package/dist/types/OverlaySlot.d.ts +9 -0
  8. package/dist/types/index.d.ts +2 -0
  9. package/dist/types/registry.d.ts +2 -0
  10. package/package.json +12 -5
  11. package/src/Overlay.tsx +47 -41
  12. package/src/OverlaySlot.tsx +35 -0
  13. package/src/Player.tsx +1 -0
  14. package/src/PlayerBoost.tsx +4 -1
  15. package/src/Scoreboard.tsx +1 -0
  16. package/src/ScoreboardGameBox.tsx +2 -4
  17. package/src/ScoreboardSeriesBox.tsx +2 -3
  18. package/src/ScoreboardTeam.tsx +1 -0
  19. package/src/StatItem.tsx +4 -1
  20. package/src/TargetBoost.tsx +1 -0
  21. package/src/TargetPlayer.tsx +1 -0
  22. package/src/TargetPlayerLocation.tsx +1 -0
  23. package/src/TargetPlayerStats.tsx +1 -1
  24. package/src/Team.tsx +1 -0
  25. package/src/Timer.tsx +7 -4
  26. package/src/css/Florida_Tech.css +696 -0
  27. package/src/css/Horizon_Hues.css +618 -0
  28. package/src/css/Neo_Glass.css +674 -0
  29. package/src/css/Obsidian_Glide.css +646 -0
  30. package/src/css/RLCS_2024.css +566 -0
  31. package/src/css/RLCS_2025.css +524 -0
  32. package/src/css/Shaded_blocks.css +594 -0
  33. package/src/index.ts +2 -0
  34. package/src/registry.ts +19 -0
  35. package/src/types.d.ts +20 -0
  36. package/test-overlay/package-lock.json +2697 -0
  37. package/test-overlay/package.json +3 -0
  38. package/test-overlay/public/mock-css.css +259 -386
  39. package/test-overlay/src/App.jsx +78 -28
  40. package/tests/BroadcastContext.test.tsx +41 -0
  41. package/tests/Overlay.test.tsx +106 -0
  42. package/tests/OverlaySlot.test.tsx +79 -0
  43. package/tests/PlayerBoost.test.tsx +47 -0
  44. package/tests/Replay.test.tsx +29 -0
  45. package/tests/ScoreboardGameBox.test.tsx +35 -0
  46. package/tests/ScoreboardSeriesBox.test.tsx +48 -0
  47. package/tests/StatItem.test.tsx +33 -0
  48. package/tests/__mocks__/@four-leaf-studios/rl-socket-hook.ts +10 -0
  49. package/tests/fixtures.ts +96 -0
  50. package/tests/registry.test.ts +27 -0
  51. package/tests/setup.ts +1 -0
  52. package/tsconfig.json +16 -20
  53. package/vitest.config.ts +9 -0
@@ -0,0 +1,646 @@
1
+ /* ObsidianGlide Theme */
2
+ /* latin */
3
+ @font-face {
4
+ font-family: "Aldrich";
5
+ font-style: normal;
6
+ font-weight: 400;
7
+ font-display: swap;
8
+ src: url(https://fonts.gstatic.com/s/aldrich/v21/MCoTzAn-1s3IGyJMVacY3w.woff2)
9
+ format("woff2");
10
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
11
+ U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
12
+ U+2212, U+2215, U+FEFF, U+FFFD;
13
+ }
14
+ /* vietnamese */
15
+ @font-face {
16
+ font-family: "Big Shoulders Text";
17
+ font-style: normal;
18
+ font-weight: 100 900;
19
+ font-display: swap;
20
+ src: url(https://fonts.gstatic.com/s/bigshoulderstext/v24/55xxezRtP9G3CGPIf49hxc8P0eytUxBclIZ6cMI.woff2)
21
+ format("woff2");
22
+ unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
23
+ U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
24
+ U+1EA0-1EF9, U+20AB;
25
+ }
26
+ /* latin-ext */
27
+ @font-face {
28
+ font-family: "Big Shoulders Text";
29
+ font-style: normal;
30
+ font-weight: 100 900;
31
+ font-display: swap;
32
+ src: url(https://fonts.gstatic.com/s/bigshoulderstext/v24/55xxezRtP9G3CGPIf49hxc8P0eytUxBclYZ6cMI.woff2)
33
+ format("woff2");
34
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
35
+ U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
36
+ U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
37
+ }
38
+ /* latin */
39
+ @font-face {
40
+ font-family: "Big Shoulders Text";
41
+ font-style: normal;
42
+ font-weight: 100 900;
43
+ font-display: swap;
44
+ src: url(https://fonts.gstatic.com/s/bigshoulderstext/v24/55xxezRtP9G3CGPIf49hxc8P0eytUxBcm4Z6.woff2)
45
+ format("woff2");
46
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
47
+ U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
48
+ U+2212, U+2215, U+FEFF, U+FFFD;
49
+ }
50
+ /* vietnamese */
51
+ @font-face {
52
+ font-family: "Reddit Mono";
53
+ font-style: normal;
54
+ font-weight: 200 900;
55
+ font-display: swap;
56
+ src: url(https://fonts.gstatic.com/s/redditmono/v3/oPWL_kRmmu4oQ88oo13o4-rERjtPRw.woff2)
57
+ format("woff2");
58
+ unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
59
+ U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
60
+ U+1EA0-1EF9, U+20AB;
61
+ }
62
+ /* latin-ext */
63
+ @font-face {
64
+ font-family: "Reddit Mono";
65
+ font-style: normal;
66
+ font-weight: 200 900;
67
+ font-display: swap;
68
+ src: url(https://fonts.gstatic.com/s/redditmono/v3/oPWL_kRmmu4oQ88oo13o4-rFRjtPRw.woff2)
69
+ format("woff2");
70
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
71
+ U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
72
+ U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
73
+ }
74
+ /* latin */
75
+ @font-face {
76
+ font-family: "Reddit Mono";
77
+ font-style: normal;
78
+ font-weight: 200 900;
79
+ font-display: swap;
80
+ src: url(https://fonts.gstatic.com/s/redditmono/v3/oPWL_kRmmu4oQ88oo13o4-rLRjs.woff2)
81
+ format("woff2");
82
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
83
+ U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
84
+ U+2212, U+2215, U+FEFF, U+FFFD;
85
+ }
86
+ /* cyrillic-ext */
87
+ @font-face {
88
+ font-family: "Roboto Slab";
89
+ font-style: normal;
90
+ font-weight: 100 900;
91
+ font-display: swap;
92
+ src: url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufA5qW54A.woff2)
93
+ format("woff2");
94
+ unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F,
95
+ U+FE2E-FE2F;
96
+ }
97
+ /* cyrillic */
98
+ @font-face {
99
+ font-family: "Roboto Slab";
100
+ font-style: normal;
101
+ font-weight: 100 900;
102
+ font-display: swap;
103
+ src: url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufJ5qW54A.woff2)
104
+ format("woff2");
105
+ unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
106
+ }
107
+ /* greek-ext */
108
+ @font-face {
109
+ font-family: "Roboto Slab";
110
+ font-style: normal;
111
+ font-weight: 100 900;
112
+ font-display: swap;
113
+ src: url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufB5qW54A.woff2)
114
+ format("woff2");
115
+ unicode-range: U+1F00-1FFF;
116
+ }
117
+ /* greek */
118
+ @font-face {
119
+ font-family: "Roboto Slab";
120
+ font-style: normal;
121
+ font-weight: 100 900;
122
+ font-display: swap;
123
+ src: url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufO5qW54A.woff2)
124
+ format("woff2");
125
+ unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1,
126
+ U+03A3-03FF;
127
+ }
128
+ /* vietnamese */
129
+ @font-face {
130
+ font-family: "Roboto Slab";
131
+ font-style: normal;
132
+ font-weight: 100 900;
133
+ font-display: swap;
134
+ src: url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufC5qW54A.woff2)
135
+ format("woff2");
136
+ unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1,
137
+ U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329,
138
+ U+1EA0-1EF9, U+20AB;
139
+ }
140
+ /* latin-ext */
141
+ @font-face {
142
+ font-family: "Roboto Slab";
143
+ font-style: normal;
144
+ font-weight: 100 900;
145
+ font-display: swap;
146
+ src: url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufD5qW54A.woff2)
147
+ format("woff2");
148
+ unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF,
149
+ U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020,
150
+ U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
151
+ }
152
+ /* latin */
153
+ @font-face {
154
+ font-family: "Roboto Slab";
155
+ font-style: normal;
156
+ font-weight: 100 900;
157
+ font-display: swap;
158
+ src: url(https://fonts.gstatic.com/s/robotoslab/v34/BngMUXZYTXPIvIBgJJSb6ufN5qU.woff2)
159
+ format("woff2");
160
+ unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA,
161
+ U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193,
162
+ U+2212, U+2215, U+FEFF, U+FFFD;
163
+ }
164
+
165
+ /* Default overlay variable */
166
+ .overlay {
167
+ --fallback-darker-mutual: black;
168
+ }
169
+
170
+ /* Global font override */
171
+ body,
172
+ .overlay {
173
+ font-family: "Big Shoulders Text", sans-serif;
174
+ }
175
+
176
+ .main_bar {
177
+ background: #1b1e1f;
178
+ width: fit-content;
179
+ height: 80px;
180
+ border-radius: 14px;
181
+ }
182
+
183
+ .name_box {
184
+ font-size: 42px;
185
+ height: 77px;
186
+ width: 250px;
187
+ padding-left: 10px;
188
+ padding-right: 10px;
189
+ line-height: 0.9;
190
+ height: calc(100% - 20px);
191
+ margin: 10px;
192
+ border-radius: 10px;
193
+ overflow: hidden;
194
+ }
195
+
196
+ .left_name_box {
197
+ background: linear-gradient(
198
+ to bottom,
199
+ var(--team-left-primary-dark),
200
+ var(--team-left-primary),
201
+ var(--team-left-primary-light)
202
+ );
203
+ }
204
+
205
+ .right_name_box {
206
+ background: linear-gradient(
207
+ to bottom,
208
+ var(--team-right-primary-dark),
209
+ var(--team-right-primary),
210
+ var(--team-right-primary-light)
211
+ );
212
+ }
213
+
214
+ .logo_box {
215
+ padding: 15px;
216
+ width: 80px;
217
+ height: 80px;
218
+ background: #1b1e1f;
219
+ }
220
+
221
+ .left_logo_box {
222
+ order: 3;
223
+ }
224
+
225
+ .right_logo_box {
226
+ order: 1;
227
+ }
228
+
229
+ .score_box {
230
+ font-size: 52px;
231
+ height: 80px;
232
+ width: 60px;
233
+ color: white;
234
+ font-weight: bold;
235
+ }
236
+
237
+ .left_score_box {
238
+ /* Empty */
239
+ }
240
+
241
+ .right_score_box {
242
+ order: 0;
243
+ }
244
+
245
+ .time_box {
246
+ color: white;
247
+ width: 100px;
248
+ font-size: 38px;
249
+ }
250
+
251
+ .bottom_bar {
252
+ height: 30px;
253
+ background-color: #1b1e1f;
254
+ margin-top: 5px;
255
+ border-radius: 7px;
256
+ }
257
+
258
+ .series_box {
259
+ width: 130px;
260
+ padding-left: 15px;
261
+ padding-right: 15px;
262
+ }
263
+
264
+ .left_series_box {
265
+ /* Empty */
266
+ }
267
+
268
+ .right_series_box {
269
+ flex-direction: row-reverse;
270
+ }
271
+
272
+ .series_score_box {
273
+ margin-left: auto;
274
+ margin-right: auto;
275
+ border-radius: 7px;
276
+ }
277
+
278
+ .series_score_box_point {
279
+ height: 18px;
280
+ width: 18px;
281
+ }
282
+
283
+ .series_score_box_empty {
284
+ height: 14px;
285
+ width: 14px;
286
+ border: 2px solid white;
287
+ }
288
+
289
+ .left_series_score_box_point {
290
+ background: linear-gradient(
291
+ to bottom,
292
+ var(--team-left-primary-dark),
293
+ var(--team-left-primary),
294
+ var(--team-left-primary-light)
295
+ );
296
+ }
297
+
298
+ .left_series_score_box_empty {
299
+ /* Empty */
300
+ }
301
+
302
+ .right_series_score_box_point {
303
+ background: linear-gradient(
304
+ to bottom,
305
+ var(--team-right-primary-dark),
306
+ var(--team-right-primary),
307
+ var(--team-right-primary-light)
308
+ );
309
+ }
310
+
311
+ .right_series_score_box_empty {
312
+ /* Empty */
313
+ }
314
+
315
+ .game_box {
316
+ font-size: 20px;
317
+ min-width: 150px;
318
+ padding-left: 15px;
319
+ padding-right: 15px;
320
+ }
321
+
322
+ .series_info_box {
323
+ background-color: #1b1e1f;
324
+ font-size: 20px;
325
+ min-width: 360px;
326
+ padding-left: 20px;
327
+ padding-right: 20px;
328
+ height: 30px;
329
+ text-transform: uppercase;
330
+ border-top-right-radius: 14px;
331
+ border-top-left-radius: 14px;
332
+ }
333
+
334
+ .team_box {
335
+ color: white;
336
+ position: absolute; /* changed */
337
+ top: 190px;
338
+ }
339
+
340
+ .left_team_box {
341
+ left: 10px;
342
+ }
343
+
344
+ .right_team_box {
345
+ right: 10px;
346
+ }
347
+
348
+ .player_box {
349
+ height: 43px;
350
+ width: 245px;
351
+ margin-bottom: 10px;
352
+ background-color: #1b1e1f;
353
+ border-radius: 12px;
354
+ }
355
+
356
+ .left_player_box {
357
+ /* Empty */
358
+ }
359
+
360
+ .right_player_box {
361
+ /* Empty */
362
+ }
363
+
364
+ .player_name {
365
+ font-size: 20px;
366
+ position: absolute;
367
+ top: 5px;
368
+ text-transform: uppercase;
369
+ text-overflow: ellipsis;
370
+ max-width: 190px;
371
+ white-space: nowrap;
372
+ overflow: hidden;
373
+ }
374
+
375
+ .left_player_name {
376
+ left: 10px;
377
+ }
378
+
379
+ .right_player_name {
380
+ right: 10px;
381
+ }
382
+
383
+ .player_boost {
384
+ font-size: 20px;
385
+ position: absolute;
386
+ top: 5px;
387
+ text-transform: uppercase;
388
+ }
389
+
390
+ .left_player_boost {
391
+ right: 10px;
392
+ }
393
+
394
+ .right_player_boost {
395
+ left: 10px;
396
+ }
397
+
398
+ .boost_meter {
399
+ width: 225px;
400
+ height: 6px;
401
+ margin-top: 30px;
402
+ margin-left: auto;
403
+ margin-right: auto;
404
+ border-radius: 3px;
405
+ }
406
+
407
+ .left_boost_meter {
408
+ /* Empty */
409
+ }
410
+
411
+ .right_boost_meter {
412
+ /* Empty */
413
+ }
414
+
415
+ .left_boost_meter_bar {
416
+ background: linear-gradient(
417
+ to right,
418
+ var(--team-left-primary-dark),
419
+ var(--team-left-primary),
420
+ var(--team-left-primary-light)
421
+ );
422
+ border-radius: 3px;
423
+ }
424
+
425
+ .right_boost_meter_bar {
426
+ background: linear-gradient(
427
+ to left,
428
+ var(--team-right-primary-dark),
429
+ var(--team-right-primary),
430
+ var(--team-right-primary-light)
431
+ );
432
+ border-radius: 3px;
433
+ }
434
+
435
+ .stat_box {
436
+ background-color: #1b1e1f;
437
+ height: 40px;
438
+ display: flex;
439
+ margin: 10px;
440
+ border-radius: 12px;
441
+ overflow: hidden;
442
+ padding-right: 10px;
443
+ }
444
+
445
+ .stat_box_player {
446
+ padding-left: 20px;
447
+ padding-right: 20px;
448
+ font-size: 28px;
449
+ height: 34px;
450
+ background: #fff;
451
+ color: #1b1e1f;
452
+ font-weight: 600;
453
+ text-transform: uppercase;
454
+ text-overflow: ellipsis;
455
+ width: 220px;
456
+ text-align: center;
457
+ white-space: nowrap;
458
+ overflow: hidden;
459
+ border-radius: 10px;
460
+ margin-left: 2px;
461
+ margin-right: 10px;
462
+ }
463
+
464
+ .stat_box_statistic {
465
+ display: flex;
466
+ justify-content: flex-end;
467
+ margin: auto;
468
+ white-space: nowrap;
469
+ padding-left: 10px;
470
+ padding-right: 10px;
471
+ font-size: 22px;
472
+ }
473
+
474
+ /* Renamed class */
475
+ .stat_box_statistic_value {
476
+ margin-right: 5px;
477
+ min-width: 25px;
478
+ text-align: right;
479
+ font-family: "Big Shoulders Text", sans-serif;
480
+ }
481
+
482
+ .stat_box_statistic_name {
483
+ /* Empty */
484
+ }
485
+
486
+ .stat_box_statistic_player_id,
487
+ .stat_box_statistic_player_team,
488
+ .stat_box_statistic_player_location,
489
+ .stat_box_statistic_player_touches {
490
+ display: none;
491
+ }
492
+
493
+ /* Target Boost (the circular meter) */
494
+ .target_boost {
495
+ font-size: 3rem;
496
+ font-weight: bold;
497
+ position: absolute;
498
+ bottom: 0;
499
+ right: 0;
500
+ margin-left: auto;
501
+ width: 200px;
502
+ height: 200px;
503
+ margin-bottom: 50px;
504
+ margin-right: 50px;
505
+ border-radius: 50%;
506
+ display: flex;
507
+ flex-direction: column;
508
+ align-items: center;
509
+ justify-content: center;
510
+ color: white;
511
+ overflow: hidden;
512
+ transition: opacity 0.3s ease, transform 0.3s ease;
513
+ }
514
+
515
+ .left_target_boost.target_boost {
516
+ color: var(--team-0-secondary);
517
+ }
518
+
519
+ .right_target_boost.target_boost {
520
+ color: var(--team-1-secondary);
521
+ }
522
+
523
+ .target_boost.entering {
524
+ animation: fadeIn 0.5s ease-in-out;
525
+ }
526
+
527
+ .target_boost.exiting {
528
+ animation: fadeOut 0.5s ease-in-out;
529
+ }
530
+
531
+ .left_target_boost {
532
+ border: 5px solid var(--team-left-mutual);
533
+ background: #07132d;
534
+ }
535
+
536
+ .right_target_boost {
537
+ border: 5px solid var(--team-left-mutual);
538
+ background: var(--team-left-mutual);
539
+ }
540
+
541
+ .target_boost_container {
542
+ width: 100%;
543
+ height: 100%;
544
+ display: flex;
545
+ flex-direction: column;
546
+ align-items: center;
547
+ justify-content: center;
548
+ border-radius: 50%;
549
+ }
550
+
551
+ .left_target_boost_container {
552
+ }
553
+
554
+ .right_target_boost_container {
555
+ }
556
+
557
+ .target_boost_meter {
558
+ position: absolute;
559
+ height: 100%;
560
+ width: 100%;
561
+ border-radius: 50%;
562
+ display: flex;
563
+ justify-content: center;
564
+ align-items: center;
565
+ transition: all 0.5s ease-in-out;
566
+ }
567
+
568
+ .left_target_boost_meter {
569
+ background: conic-gradient(
570
+ var(--team-left-primary-dark) calc(90deg * var(--target_boost) / 100),
571
+ var(--team-left-primary-light) calc(180deg * var(--target_boost) / 100),
572
+ var(--team-left-primary-light) calc(30deg * var(--target_boost) / 100),
573
+ var(--team-left-primary) calc(270deg * var(--target_boost) / 100),
574
+ var(--team-left-primary-dark) calc(360deg * var(--target_boost) / 100),
575
+ var(--fallback-darker-mutual) calc(0deg * var(--target_boost) / 100)
576
+ ) !important;
577
+ transition: all 0.5s ease-in-out;
578
+ }
579
+
580
+ .right_target_boost_meter {
581
+ background: conic-gradient(
582
+ var(--team-right-primary-dark) calc(90deg * var(--target_boost) / 100),
583
+ var(--team-right-primary-light) calc(180deg * var(--target_boost) / 100),
584
+ var(--team-right-primary-light) calc(30deg * var(--target_boost) / 100),
585
+ var(--team-right-primary) calc(270deg * var(--target_boost) / 100),
586
+ var(--team-right-primary-dark) calc(360deg * var(--target_boost) / 100),
587
+ var(--fallback-darker-mutual) calc(0deg * var(--target_boost) / 100)
588
+ ) !important;
589
+
590
+ transition: all 0.5s ease-in-out;
591
+ }
592
+
593
+ .target_boost_meter_inner {
594
+ position: absolute;
595
+ margin: auto;
596
+ width: 80%;
597
+ height: 80%;
598
+ border-radius: 50%;
599
+ z-index: 50;
600
+ }
601
+
602
+ .left_target_boost_meter_inner {
603
+ background: var(--team-left-mutual);
604
+ }
605
+
606
+ .right_target_boost_meter_inner {
607
+ background: var(--team-left-mutual);
608
+ }
609
+
610
+ .target_boost_svg {
611
+ position: absolute;
612
+ width: 100%;
613
+ height: 100%;
614
+ z-index: 500;
615
+ display: flex;
616
+ justify-content: center;
617
+ align-items: center;
618
+ }
619
+
620
+ .target_boost_svg_circle {
621
+ stroke-dasharray: 4 25%;
622
+ stroke-width: 41;
623
+ stroke-dashoffset: 18;
624
+ fill: transparent;
625
+ }
626
+
627
+ .left_target_boost_svg_circle {
628
+ stroke: var(--team-left-mutual);
629
+ }
630
+
631
+ .right_target_boost_svg_circle {
632
+ stroke: var(--team-left-mutual);
633
+ }
634
+
635
+ .target_boost_value {
636
+ position: absolute;
637
+ z-index: 500;
638
+ }
639
+
640
+ .left_target_boost_value {
641
+ color: var(--team-left-primary);
642
+ }
643
+
644
+ .right_target_boost_value {
645
+ color: var(--team-right-primary);
646
+ }