@learnpack/learnpack 5.0.335 → 5.0.340

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 (48) hide show
  1. package/bin/run +17 -17
  2. package/lib/commands/init.js +41 -41
  3. package/lib/commands/serve.js +589 -126
  4. package/lib/creatorDist/assets/index-BhqDgBS9.js +8448 -78631
  5. package/lib/creatorDist/assets/index-CjddKHB_.css +1 -1688
  6. package/lib/managers/config/exercise.js +2 -14
  7. package/lib/managers/readmeHistoryService.js +3 -1
  8. package/lib/managers/server/routes.js +2 -1
  9. package/lib/utils/configBuilder.js +2 -1
  10. package/lib/utils/creatorUtilities.js +14 -14
  11. package/lib/utils/exerciseFileOrder.d.ts +20 -0
  12. package/lib/utils/exerciseFileOrder.js +49 -0
  13. package/lib/utils/export/epub.js +26 -26
  14. package/lib/utils/readmeSanitizer.d.ts +8 -0
  15. package/lib/utils/readmeSanitizer.js +13 -0
  16. package/lib/utils/templates/epub/epub.css +146 -146
  17. package/lib/utils/templates/scorm/config/api.js +175 -175
  18. package/package.json +1 -1
  19. package/src/commands/init.ts +655 -655
  20. package/src/commands/publish.ts +670 -670
  21. package/src/commands/serve.ts +5853 -5216
  22. package/src/creator/eslint.config.js +28 -28
  23. package/src/creator/src/index.css +227 -227
  24. package/src/creator/src/utils/lib.ts +471 -471
  25. package/src/creatorDist/assets/index-BhqDgBS9.js +8448 -78631
  26. package/src/creatorDist/assets/index-CjddKHB_.css +1 -1688
  27. package/src/managers/config/exercise.ts +3 -15
  28. package/src/managers/readmeHistoryService.ts +3 -1
  29. package/src/managers/server/routes.ts +15 -6
  30. package/src/managers/session.ts +184 -184
  31. package/src/ui/_app/app.css +1 -1
  32. package/src/ui/_app/app.js +1950 -1878
  33. package/src/ui/app.tar.gz +0 -0
  34. package/src/utils/api.ts +675 -675
  35. package/src/utils/configBuilder.ts +102 -100
  36. package/src/utils/creatorUtilities.ts +536 -536
  37. package/src/utils/errors.ts +108 -108
  38. package/src/utils/exerciseFileOrder.ts +50 -0
  39. package/src/utils/export/epub.ts +553 -553
  40. package/src/utils/export/index.ts +4 -4
  41. package/src/utils/export/scorm.ts +121 -121
  42. package/src/utils/export/shared.ts +61 -61
  43. package/src/utils/export/types.ts +25 -25
  44. package/src/utils/export/zip.ts +55 -55
  45. package/src/utils/readmeSanitizer.ts +10 -0
  46. package/src/utils/rigoActions.ts +642 -642
  47. package/src/utils/templates/epub/epub.css +146 -146
  48. package/src/utils/templates/scorm/config/api.js +175 -175
@@ -1,1688 +1 @@
1
- /*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */
2
- @layer properties {
3
- @supports (((-webkit-hyphens: none)) and (not (margin-trim: inline))) or
4
- ((-moz-orient: inline) and (not (color: rgb(from red r g b)))) {
5
- *,
6
- :before,
7
- :after,
8
- ::backdrop {
9
- --tw-translate-x: 0;
10
- --tw-translate-y: 0;
11
- --tw-translate-z: 0;
12
- --tw-rotate-x: rotateX(0);
13
- --tw-rotate-y: rotateY(0);
14
- --tw-rotate-z: rotateZ(0);
15
- --tw-skew-x: skewX(0);
16
- --tw-skew-y: skewY(0);
17
- --tw-space-y-reverse: 0;
18
- --tw-space-x-reverse: 0;
19
- --tw-border-style: solid;
20
- --tw-gradient-position: initial;
21
- --tw-gradient-from: #0000;
22
- --tw-gradient-via: #0000;
23
- --tw-gradient-to: #0000;
24
- --tw-gradient-stops: initial;
25
- --tw-gradient-via-stops: initial;
26
- --tw-gradient-from-position: 0%;
27
- --tw-gradient-via-position: 50%;
28
- --tw-gradient-to-position: 100%;
29
- --tw-leading: initial;
30
- --tw-font-weight: initial;
31
- --tw-shadow: 0 0 #0000;
32
- --tw-shadow-color: initial;
33
- --tw-shadow-alpha: 100%;
34
- --tw-inset-shadow: 0 0 #0000;
35
- --tw-inset-shadow-color: initial;
36
- --tw-inset-shadow-alpha: 100%;
37
- --tw-ring-color: initial;
38
- --tw-ring-shadow: 0 0 #0000;
39
- --tw-inset-ring-color: initial;
40
- --tw-inset-ring-shadow: 0 0 #0000;
41
- --tw-ring-inset: initial;
42
- --tw-ring-offset-width: 0px;
43
- --tw-ring-offset-color: #fff;
44
- --tw-ring-offset-shadow: 0 0 #0000;
45
- --tw-duration: initial;
46
- --tw-ease: initial;
47
- }
48
- }
49
- }
50
- @layer theme {
51
- :root,
52
- :host {
53
- --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
54
- "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
55
- --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
56
- "Liberation Mono", "Courier New", monospace;
57
- --color-red-50: oklch(97.1% 0.013 17.38);
58
- --color-red-100: oklch(93.6% 0.032 17.717);
59
- --color-red-500: oklch(63.7% 0.237 25.331);
60
- --color-red-600: oklch(57.7% 0.245 27.325);
61
- --color-red-700: oklch(50.5% 0.213 27.518);
62
- --color-yellow-600: oklch(68.1% 0.162 75.834);
63
- --color-yellow-700: oklch(55.4% 0.135 66.442);
64
- --color-blue-50: oklch(97% 0.014 254.604);
65
- --color-blue-100: oklch(93.2% 0.032 255.585);
66
- --color-blue-200: oklch(88.2% 0.059 254.128);
67
- --color-blue-400: oklch(70.7% 0.165 254.624);
68
- --color-blue-500: oklch(62.3% 0.214 259.815);
69
- --color-blue-600: oklch(54.6% 0.245 262.881);
70
- --color-blue-700: oklch(48.8% 0.243 264.376);
71
- --color-blue-800: oklch(42.4% 0.199 265.638);
72
- --color-blue-900: oklch(37.9% 0.146 265.522);
73
- --color-gray-50: oklch(98.5% 0.002 247.839);
74
- --color-gray-100: oklch(96.7% 0.003 264.542);
75
- --color-gray-200: oklch(92.8% 0.006 264.531);
76
- --color-gray-300: oklch(87.2% 0.01 258.338);
77
- --color-gray-400: oklch(70.7% 0.022 261.325);
78
- --color-gray-500: oklch(55.1% 0.027 264.364);
79
- --color-gray-600: oklch(44.6% 0.03 256.802);
80
- --color-gray-700: oklch(37.3% 0.034 259.733);
81
- --color-gray-800: oklch(27.8% 0.033 256.848);
82
- --color-gray-900: oklch(21% 0.034 264.665);
83
- --color-black: #000;
84
- --color-white: #fff;
85
- --spacing: 0.25rem;
86
- --container-xs: 20rem;
87
- --container-sm: 24rem;
88
- --container-md: 28rem;
89
- --container-xl: 36rem;
90
- --text-xs: 0.75rem;
91
- --text-xs--line-height: calc(1 / 0.75);
92
- --text-sm: 0.875rem;
93
- --text-sm--line-height: calc(1.25 / 0.875);
94
- --text-lg: 1.125rem;
95
- --text-lg--line-height: calc(1.75 / 1.125);
96
- --text-xl: 1.25rem;
97
- --text-xl--line-height: calc(1.75 / 1.25);
98
- --text-2xl: 1.5rem;
99
- --text-2xl--line-height: calc(2 / 1.5);
100
- --text-4xl: 2.25rem;
101
- --text-4xl--line-height: calc(2.5 / 2.25);
102
- --text-7xl: 4.5rem;
103
- --text-7xl--line-height: 1;
104
- --font-weight-medium: 500;
105
- --font-weight-semibold: 600;
106
- --font-weight-bold: 700;
107
- --radius-md: 0.375rem;
108
- --radius-lg: 0.5rem;
109
- --radius-xl: 0.75rem;
110
- --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
111
- --animate-spin: spin 1s linear infinite;
112
- --animate-ping: ping 1s cubic-bezier(0, 0, 0.2, 1) infinite;
113
- --animate-pulse: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
114
- --default-transition-duration: 0.15s;
115
- --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
116
- --default-font-family: var(--font-sans);
117
- --default-mono-font-family: var(--font-mono);
118
- }
119
- }
120
- @layer base {
121
- *,
122
- :after,
123
- :before,
124
- ::backdrop {
125
- box-sizing: border-box;
126
- border: 0 solid;
127
- margin: 0;
128
- padding: 0;
129
- }
130
- ::file-selector-button {
131
- box-sizing: border-box;
132
- border: 0 solid;
133
- margin: 0;
134
- padding: 0;
135
- }
136
- html,
137
- :host {
138
- -webkit-text-size-adjust: 100%;
139
- -moz-tab-size: 4;
140
- tab-size: 4;
141
- line-height: 1.5;
142
- font-family: var(
143
- --default-font-family,
144
- ui-sans-serif,
145
- system-ui,
146
- sans-serif,
147
- "Apple Color Emoji",
148
- "Segoe UI Emoji",
149
- "Segoe UI Symbol",
150
- "Noto Color Emoji"
151
- );
152
- font-feature-settings: var(--default-font-feature-settings, normal);
153
- font-variation-settings: var(--default-font-variation-settings, normal);
154
- -webkit-tap-highlight-color: transparent;
155
- }
156
- hr {
157
- height: 0;
158
- color: inherit;
159
- border-top-width: 1px;
160
- }
161
- abbr:where([title]) {
162
- -webkit-text-decoration: underline dotted;
163
- text-decoration: underline dotted;
164
- }
165
- h1,
166
- h2,
167
- h3,
168
- h4,
169
- h5,
170
- h6 {
171
- font-size: inherit;
172
- font-weight: inherit;
173
- }
174
- a {
175
- color: inherit;
176
- -webkit-text-decoration: inherit;
177
- text-decoration: inherit;
178
- }
179
- b,
180
- strong {
181
- font-weight: bolder;
182
- }
183
- code,
184
- kbd,
185
- samp,
186
- pre {
187
- font-family: var(
188
- --default-mono-font-family,
189
- ui-monospace,
190
- SFMono-Regular,
191
- Menlo,
192
- Monaco,
193
- Consolas,
194
- "Liberation Mono",
195
- "Courier New",
196
- monospace
197
- );
198
- font-feature-settings: var(--default-mono-font-feature-settings, normal);
199
- font-variation-settings: var(
200
- --default-mono-font-variation-settings,
201
- normal
202
- );
203
- font-size: 1em;
204
- }
205
- small {
206
- font-size: 80%;
207
- }
208
- sub,
209
- sup {
210
- vertical-align: baseline;
211
- font-size: 75%;
212
- line-height: 0;
213
- position: relative;
214
- }
215
- sub {
216
- bottom: -0.25em;
217
- }
218
- sup {
219
- top: -0.5em;
220
- }
221
- table {
222
- text-indent: 0;
223
- border-color: inherit;
224
- border-collapse: collapse;
225
- }
226
- :-moz-focusring {
227
- outline: auto;
228
- }
229
- progress {
230
- vertical-align: baseline;
231
- }
232
- summary {
233
- display: list-item;
234
- }
235
- ol,
236
- ul,
237
- menu {
238
- list-style: none;
239
- }
240
- img,
241
- svg,
242
- video,
243
- canvas,
244
- audio,
245
- iframe,
246
- embed,
247
- object {
248
- vertical-align: middle;
249
- display: block;
250
- }
251
- img,
252
- video {
253
- max-width: 100%;
254
- height: auto;
255
- }
256
- button,
257
- input,
258
- select,
259
- optgroup,
260
- textarea {
261
- font: inherit;
262
- font-feature-settings: inherit;
263
- font-variation-settings: inherit;
264
- letter-spacing: inherit;
265
- color: inherit;
266
- opacity: 1;
267
- background-color: #0000;
268
- border-radius: 0;
269
- }
270
- ::file-selector-button {
271
- font: inherit;
272
- font-feature-settings: inherit;
273
- font-variation-settings: inherit;
274
- letter-spacing: inherit;
275
- color: inherit;
276
- opacity: 1;
277
- background-color: #0000;
278
- border-radius: 0;
279
- }
280
- :where(select:is([multiple], [size])) optgroup {
281
- font-weight: bolder;
282
- }
283
- :where(select:is([multiple], [size])) optgroup option {
284
- padding-inline-start: 20px;
285
- }
286
- ::file-selector-button {
287
- margin-inline-end: 4px;
288
- }
289
- ::placeholder {
290
- opacity: 1;
291
- }
292
- @supports (not ((-webkit-appearance: -apple-pay-button))) or
293
- (contain-intrinsic-size: 1px) {
294
- ::placeholder {
295
- color: currentColor;
296
- }
297
- @supports (color: color-mix(in lab, red, red)) {
298
- ::placeholder {
299
- color: color-mix(in oklab, currentcolor 50%, transparent);
300
- }
301
- }
302
- }
303
- textarea {
304
- resize: vertical;
305
- }
306
- ::-webkit-search-decoration {
307
- -webkit-appearance: none;
308
- }
309
- ::-webkit-date-and-time-value {
310
- min-height: 1lh;
311
- text-align: inherit;
312
- }
313
- ::-webkit-datetime-edit {
314
- display: inline-flex;
315
- }
316
- ::-webkit-datetime-edit-fields-wrapper {
317
- padding: 0;
318
- }
319
- ::-webkit-datetime-edit {
320
- padding-block: 0;
321
- }
322
- ::-webkit-datetime-edit-year-field {
323
- padding-block: 0;
324
- }
325
- ::-webkit-datetime-edit-month-field {
326
- padding-block: 0;
327
- }
328
- ::-webkit-datetime-edit-day-field {
329
- padding-block: 0;
330
- }
331
- ::-webkit-datetime-edit-hour-field {
332
- padding-block: 0;
333
- }
334
- ::-webkit-datetime-edit-minute-field {
335
- padding-block: 0;
336
- }
337
- ::-webkit-datetime-edit-second-field {
338
- padding-block: 0;
339
- }
340
- ::-webkit-datetime-edit-millisecond-field {
341
- padding-block: 0;
342
- }
343
- ::-webkit-datetime-edit-meridiem-field {
344
- padding-block: 0;
345
- }
346
- :-moz-ui-invalid {
347
- box-shadow: none;
348
- }
349
- button,
350
- input:where([type="button"], [type="reset"], [type="submit"]) {
351
- -webkit-appearance: button;
352
- -moz-appearance: button;
353
- appearance: button;
354
- }
355
- ::file-selector-button {
356
- -webkit-appearance: button;
357
- -moz-appearance: button;
358
- appearance: button;
359
- }
360
- ::-webkit-inner-spin-button {
361
- height: auto;
362
- }
363
- ::-webkit-outer-spin-button {
364
- height: auto;
365
- }
366
- [hidden]:where(:not([hidden="until-found"])) {
367
- display: none !important;
368
- }
369
- }
370
- @layer components;
371
- @layer utilities {
372
- .pointer-events-auto {
373
- pointer-events: auto;
374
- }
375
- .pointer-events-none {
376
- pointer-events: none;
377
- }
378
- .absolute {
379
- position: absolute;
380
- }
381
- .fixed {
382
- position: fixed;
383
- }
384
- .relative {
385
- position: relative;
386
- }
387
- .inset-0 {
388
- inset: calc(var(--spacing) * 0);
389
- }
390
- .-top-3 {
391
- top: calc(var(--spacing) * -3);
392
- }
393
- .top-0 {
394
- top: calc(var(--spacing) * 0);
395
- }
396
- .top-2 {
397
- top: calc(var(--spacing) * 2);
398
- }
399
- .right-2 {
400
- right: calc(var(--spacing) * 2);
401
- }
402
- .bottom-0 {
403
- bottom: calc(var(--spacing) * 0);
404
- }
405
- .bottom-2 {
406
- bottom: calc(var(--spacing) * 2);
407
- }
408
- .bottom-5 {
409
- bottom: calc(var(--spacing) * 5);
410
- }
411
- .bottom-10 {
412
- bottom: calc(var(--spacing) * 10);
413
- }
414
- .bottom-\[100\%\] {
415
- bottom: 100%;
416
- }
417
- .left-0 {
418
- left: calc(var(--spacing) * 0);
419
- }
420
- .left-1\/2 {
421
- left: 50%;
422
- }
423
- .left-2 {
424
- left: calc(var(--spacing) * 2);
425
- }
426
- .z-10 {
427
- z-index: 10;
428
- }
429
- .z-30 {
430
- z-index: 30;
431
- }
432
- .z-31 {
433
- z-index: 31;
434
- }
435
- .z-50 {
436
- z-index: 50;
437
- }
438
- .z-1000 {
439
- z-index: 1000;
440
- }
441
- .container {
442
- width: 100%;
443
- }
444
- @media (min-width: 40rem) {
445
- .container {
446
- max-width: 40rem;
447
- }
448
- }
449
- @media (min-width: 48rem) {
450
- .container {
451
- max-width: 48rem;
452
- }
453
- }
454
- @media (min-width: 64rem) {
455
- .container {
456
- max-width: 64rem;
457
- }
458
- }
459
- @media (min-width: 80rem) {
460
- .container {
461
- max-width: 80rem;
462
- }
463
- }
464
- @media (min-width: 96rem) {
465
- .container {
466
- max-width: 96rem;
467
- }
468
- }
469
- .m-0 {
470
- margin: calc(var(--spacing) * 0);
471
- }
472
- .mx-2 {
473
- margin-inline: calc(var(--spacing) * 2);
474
- }
475
- .mx-4 {
476
- margin-inline: calc(var(--spacing) * 4);
477
- }
478
- .mx-auto {
479
- margin-inline: auto;
480
- }
481
- .-mt-5 {
482
- margin-top: calc(var(--spacing) * -5);
483
- }
484
- .mt-1 {
485
- margin-top: calc(var(--spacing) * 1);
486
- }
487
- .mt-2 {
488
- margin-top: calc(var(--spacing) * 2);
489
- }
490
- .mt-3 {
491
- margin-top: calc(var(--spacing) * 3);
492
- }
493
- .mt-4 {
494
- margin-top: calc(var(--spacing) * 4);
495
- }
496
- .mt-5 {
497
- margin-top: calc(var(--spacing) * 5);
498
- }
499
- .mt-6 {
500
- margin-top: calc(var(--spacing) * 6);
501
- }
502
- .mt-10 {
503
- margin-top: calc(var(--spacing) * 10);
504
- }
505
- .mt-14 {
506
- margin-top: calc(var(--spacing) * 14);
507
- }
508
- .mr-1 {
509
- margin-right: calc(var(--spacing) * 1);
510
- }
511
- .mb-2 {
512
- margin-bottom: calc(var(--spacing) * 2);
513
- }
514
- .mb-3 {
515
- margin-bottom: calc(var(--spacing) * 3);
516
- }
517
- .mb-4 {
518
- margin-bottom: calc(var(--spacing) * 4);
519
- }
520
- .mb-5 {
521
- margin-bottom: calc(var(--spacing) * 5);
522
- }
523
- .mb-6 {
524
- margin-bottom: calc(var(--spacing) * 6);
525
- }
526
- .ml-2 {
527
- margin-left: calc(var(--spacing) * 2);
528
- }
529
- .ml-6 {
530
- margin-left: calc(var(--spacing) * 6);
531
- }
532
- .ml-auto {
533
- margin-left: auto;
534
- }
535
- .flex {
536
- display: flex;
537
- }
538
- .hidden {
539
- display: none;
540
- }
541
- .inline-flex {
542
- display: inline-flex;
543
- }
544
- .table {
545
- display: table;
546
- }
547
- .h-2 {
548
- height: calc(var(--spacing) * 2);
549
- }
550
- .h-4 {
551
- height: calc(var(--spacing) * 4);
552
- }
553
- .h-5 {
554
- height: calc(var(--spacing) * 5);
555
- }
556
- .h-6 {
557
- height: calc(var(--spacing) * 6);
558
- }
559
- .h-10 {
560
- height: calc(var(--spacing) * 10);
561
- }
562
- .h-12 {
563
- height: calc(var(--spacing) * 12);
564
- }
565
- .h-15 {
566
- height: calc(var(--spacing) * 15);
567
- }
568
- .h-20 {
569
- height: calc(var(--spacing) * 20);
570
- }
571
- .h-24 {
572
- height: calc(var(--spacing) * 24);
573
- }
574
- .h-60 {
575
- height: calc(var(--spacing) * 60);
576
- }
577
- .h-\[50vh\] {
578
- height: 50vh;
579
- }
580
- .h-\[85\%\] {
581
- height: 85%;
582
- }
583
- .h-\[150px\] {
584
- height: 150px;
585
- }
586
- .h-full {
587
- height: 100%;
588
- }
589
- .h-screen {
590
- height: 100vh;
591
- }
592
- .max-h-\[78vh\] {
593
- max-height: 78vh;
594
- }
595
- .max-h-\[300px\] {
596
- max-height: 300px;
597
- }
598
- .min-h-\[69vh\] {
599
- min-height: 69vh;
600
- }
601
- .min-h-screen {
602
- min-height: 100vh;
603
- }
604
- .w-2 {
605
- width: calc(var(--spacing) * 2);
606
- }
607
- .w-4 {
608
- width: calc(var(--spacing) * 4);
609
- }
610
- .w-4\/5 {
611
- width: 80%;
612
- }
613
- .w-5 {
614
- width: calc(var(--spacing) * 5);
615
- }
616
- .w-6 {
617
- width: calc(var(--spacing) * 6);
618
- }
619
- .w-10 {
620
- width: calc(var(--spacing) * 10);
621
- }
622
- .w-12 {
623
- width: calc(var(--spacing) * 12);
624
- }
625
- .w-15 {
626
- width: calc(var(--spacing) * 15);
627
- }
628
- .w-20 {
629
- width: calc(var(--spacing) * 20);
630
- }
631
- .w-100 {
632
- width: calc(var(--spacing) * 100);
633
- }
634
- .w-\[100px\] {
635
- width: 100px;
636
- }
637
- .w-\[280px\] {
638
- width: 280px;
639
- }
640
- .w-full {
641
- width: 100%;
642
- }
643
- .max-w-\[700px\] {
644
- max-width: 700px;
645
- }
646
- .max-w-md {
647
- max-width: var(--container-md);
648
- }
649
- .max-w-sm {
650
- max-width: var(--container-sm);
651
- }
652
- .max-w-xl {
653
- max-width: var(--container-xl);
654
- }
655
- .max-w-xs {
656
- max-width: var(--container-xs);
657
- }
658
- .min-w-\[250px\] {
659
- min-width: 250px;
660
- }
661
- .flex-1 {
662
- flex: 1;
663
- }
664
- .flex-grow {
665
- flex-grow: 1;
666
- }
667
- .-translate-x-1\/2 {
668
- --tw-translate-x: -50%;
669
- translate: var(--tw-translate-x) var(--tw-translate-y);
670
- }
671
- .-translate-x-full {
672
- --tw-translate-x: -100%;
673
- translate: var(--tw-translate-x) var(--tw-translate-y);
674
- }
675
- .translate-x-0 {
676
- --tw-translate-x: calc(var(--spacing) * 0);
677
- translate: var(--tw-translate-x) var(--tw-translate-y);
678
- }
679
- .transform {
680
- transform: var(--tw-rotate-x) var(--tw-rotate-y) var(--tw-rotate-z)
681
- var(--tw-skew-x) var(--tw-skew-y);
682
- }
683
- .animate-ping {
684
- animation: var(--animate-ping);
685
- }
686
- .animate-pulse {
687
- animation: var(--animate-pulse);
688
- }
689
- .animate-spin {
690
- animation: var(--animate-spin);
691
- }
692
- .cursor-not-allowed {
693
- cursor: not-allowed;
694
- }
695
- .cursor-pointer {
696
- cursor: pointer;
697
- }
698
- .resize {
699
- resize: both;
700
- }
701
- .list-disc {
702
- list-style-type: disc;
703
- }
704
- .flex-col {
705
- flex-direction: column;
706
- }
707
- .flex-row {
708
- flex-direction: row;
709
- }
710
- .flex-wrap {
711
- flex-wrap: wrap;
712
- }
713
- .items-center {
714
- align-items: center;
715
- }
716
- .items-start {
717
- align-items: flex-start;
718
- }
719
- .justify-between {
720
- justify-content: space-between;
721
- }
722
- .justify-center {
723
- justify-content: center;
724
- }
725
- .justify-end {
726
- justify-content: flex-end;
727
- }
728
- .justify-start {
729
- justify-content: flex-start;
730
- }
731
- .gap-1 {
732
- gap: calc(var(--spacing) * 1);
733
- }
734
- .gap-2 {
735
- gap: calc(var(--spacing) * 2);
736
- }
737
- .gap-3 {
738
- gap: calc(var(--spacing) * 3);
739
- }
740
- .gap-4 {
741
- gap: calc(var(--spacing) * 4);
742
- }
743
- :where(.space-y-2 > :not(:last-child)) {
744
- --tw-space-y-reverse: 0;
745
- margin-block-start: calc(
746
- calc(var(--spacing) * 2) * var(--tw-space-y-reverse)
747
- );
748
- margin-block-end: calc(
749
- calc(var(--spacing) * 2) * calc(1 - var(--tw-space-y-reverse))
750
- );
751
- }
752
- :where(.space-y-3 > :not(:last-child)) {
753
- --tw-space-y-reverse: 0;
754
- margin-block-start: calc(
755
- calc(var(--spacing) * 3) * var(--tw-space-y-reverse)
756
- );
757
- margin-block-end: calc(
758
- calc(var(--spacing) * 3) * calc(1 - var(--tw-space-y-reverse))
759
- );
760
- }
761
- :where(.space-y-6 > :not(:last-child)) {
762
- --tw-space-y-reverse: 0;
763
- margin-block-start: calc(
764
- calc(var(--spacing) * 6) * var(--tw-space-y-reverse)
765
- );
766
- margin-block-end: calc(
767
- calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse))
768
- );
769
- }
770
- :where(.space-x-2 > :not(:last-child)) {
771
- --tw-space-x-reverse: 0;
772
- margin-inline-start: calc(
773
- calc(var(--spacing) * 2) * var(--tw-space-x-reverse)
774
- );
775
- margin-inline-end: calc(
776
- calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse))
777
- );
778
- }
779
- .truncate {
780
- text-overflow: ellipsis;
781
- white-space: nowrap;
782
- overflow: hidden;
783
- }
784
- .overflow-hidden {
785
- overflow: hidden;
786
- }
787
- .overflow-x-auto {
788
- overflow-x: auto;
789
- }
790
- .overflow-y-auto {
791
- overflow-y: auto;
792
- }
793
- .rounded {
794
- border-radius: 0.25rem;
795
- }
796
- .rounded-\[50\%\] {
797
- border-radius: 50%;
798
- }
799
- .rounded-full {
800
- border-radius: 3.40282e38px;
801
- }
802
- .rounded-lg {
803
- border-radius: var(--radius-lg);
804
- }
805
- .rounded-md {
806
- border-radius: var(--radius-md);
807
- }
808
- .rounded-xl {
809
- border-radius: var(--radius-xl);
810
- }
811
- .border {
812
- border-style: var(--tw-border-style);
813
- border-width: 1px;
814
- }
815
- .border-2 {
816
- border-style: var(--tw-border-style);
817
- border-width: 2px;
818
- }
819
- .border-r {
820
- border-right-style: var(--tw-border-style);
821
- border-right-width: 1px;
822
- }
823
- .border-blue-200 {
824
- border-color: var(--color-blue-200);
825
- }
826
- .border-blue-500 {
827
- border-color: var(--color-blue-500);
828
- }
829
- .border-blue-600 {
830
- border-color: var(--color-blue-600);
831
- }
832
- .border-gray-200 {
833
- border-color: var(--color-gray-200);
834
- }
835
- .border-gray-300 {
836
- border-color: var(--color-gray-300);
837
- }
838
- .border-transparent {
839
- border-color: #0000;
840
- }
841
- .border-t-transparent {
842
- border-top-color: #0000;
843
- }
844
- .bg-black\/50 {
845
- background-color: #00000080;
846
- }
847
- @supports (color: color-mix(in lab, red, red)) {
848
- .bg-black\/50 {
849
- background-color: color-mix(
850
- in oklab,
851
- var(--color-black) 50%,
852
- transparent
853
- );
854
- }
855
- }
856
- .bg-black\/60 {
857
- background-color: #0009;
858
- }
859
- @supports (color: color-mix(in lab, red, red)) {
860
- .bg-black\/60 {
861
- background-color: color-mix(
862
- in oklab,
863
- var(--color-black) 60%,
864
- transparent
865
- );
866
- }
867
- }
868
- .bg-blue-50 {
869
- background-color: var(--color-blue-50);
870
- }
871
- .bg-blue-100 {
872
- background-color: var(--color-blue-100);
873
- }
874
- .bg-blue-400 {
875
- background-color: var(--color-blue-400);
876
- }
877
- .bg-blue-500 {
878
- background-color: var(--color-blue-500);
879
- }
880
- .bg-blue-600 {
881
- background-color: var(--color-blue-600);
882
- }
883
- .bg-gray-50 {
884
- background-color: var(--color-gray-50);
885
- }
886
- .bg-gray-100 {
887
- background-color: var(--color-gray-100);
888
- }
889
- .bg-gray-200 {
890
- background-color: var(--color-gray-200);
891
- }
892
- .bg-gray-300 {
893
- background-color: var(--color-gray-300);
894
- }
895
- .bg-gray-400 {
896
- background-color: var(--color-gray-400);
897
- }
898
- .bg-red-50 {
899
- background-color: var(--color-red-50);
900
- }
901
- .bg-red-100 {
902
- background-color: var(--color-red-100);
903
- }
904
- .bg-white {
905
- background-color: var(--color-white);
906
- }
907
- .bg-gradient-to-t {
908
- --tw-gradient-position: to top in oklab;
909
- background-image: linear-gradient(var(--tw-gradient-stops));
910
- }
911
- .from-white {
912
- --tw-gradient-from: var(--color-white);
913
- --tw-gradient-stops: var(
914
- --tw-gradient-via-stops,
915
- var(--tw-gradient-position),
916
- var(--tw-gradient-from) var(--tw-gradient-from-position),
917
- var(--tw-gradient-to) var(--tw-gradient-to-position)
918
- );
919
- }
920
- .to-transparent {
921
- --tw-gradient-to: transparent;
922
- --tw-gradient-stops: var(
923
- --tw-gradient-via-stops,
924
- var(--tw-gradient-position),
925
- var(--tw-gradient-from) var(--tw-gradient-from-position),
926
- var(--tw-gradient-to) var(--tw-gradient-to-position)
927
- );
928
- }
929
- .object-cover {
930
- object-fit: cover;
931
- }
932
- .p-1 {
933
- padding: calc(var(--spacing) * 1);
934
- }
935
- .p-2 {
936
- padding: calc(var(--spacing) * 2);
937
- }
938
- .p-3 {
939
- padding: calc(var(--spacing) * 3);
940
- }
941
- .p-4 {
942
- padding: calc(var(--spacing) * 4);
943
- }
944
- .p-6 {
945
- padding: calc(var(--spacing) * 6);
946
- }
947
- .p-8 {
948
- padding: calc(var(--spacing) * 8);
949
- }
950
- .p-10 {
951
- padding: calc(var(--spacing) * 10);
952
- }
953
- .px-2 {
954
- padding-inline: calc(var(--spacing) * 2);
955
- }
956
- .px-3 {
957
- padding-inline: calc(var(--spacing) * 3);
958
- }
959
- .px-4 {
960
- padding-inline: calc(var(--spacing) * 4);
961
- }
962
- .px-20 {
963
- padding-inline: calc(var(--spacing) * 20);
964
- }
965
- .py-1 {
966
- padding-block: calc(var(--spacing) * 1);
967
- }
968
- .py-1\.5 {
969
- padding-block: calc(var(--spacing) * 1.5);
970
- }
971
- .py-2 {
972
- padding-block: calc(var(--spacing) * 2);
973
- }
974
- .pr-2 {
975
- padding-right: calc(var(--spacing) * 2);
976
- }
977
- .pb-1 {
978
- padding-bottom: calc(var(--spacing) * 1);
979
- }
980
- .pb-20 {
981
- padding-bottom: calc(var(--spacing) * 20);
982
- }
983
- .pb-32 {
984
- padding-bottom: calc(var(--spacing) * 32);
985
- }
986
- .pl-5 {
987
- padding-left: calc(var(--spacing) * 5);
988
- }
989
- .text-center {
990
- text-align: center;
991
- }
992
- .text-left {
993
- text-align: left;
994
- }
995
- .font-sans {
996
- font-family: var(--font-sans);
997
- }
998
- .text-2xl {
999
- font-size: var(--text-2xl);
1000
- line-height: var(--tw-leading, var(--text-2xl--line-height));
1001
- }
1002
- .text-4xl {
1003
- font-size: var(--text-4xl);
1004
- line-height: var(--tw-leading, var(--text-4xl--line-height));
1005
- }
1006
- .text-7xl {
1007
- font-size: var(--text-7xl);
1008
- line-height: var(--tw-leading, var(--text-7xl--line-height));
1009
- }
1010
- .text-lg {
1011
- font-size: var(--text-lg);
1012
- line-height: var(--tw-leading, var(--text-lg--line-height));
1013
- }
1014
- .text-sm {
1015
- font-size: var(--text-sm);
1016
- line-height: var(--tw-leading, var(--text-sm--line-height));
1017
- }
1018
- .text-xl {
1019
- font-size: var(--text-xl);
1020
- line-height: var(--tw-leading, var(--text-xl--line-height));
1021
- }
1022
- .text-xs {
1023
- font-size: var(--text-xs);
1024
- line-height: var(--tw-leading, var(--text-xs--line-height));
1025
- }
1026
- .leading-none {
1027
- --tw-leading: 1;
1028
- line-height: 1;
1029
- }
1030
- .font-bold {
1031
- --tw-font-weight: var(--font-weight-bold);
1032
- font-weight: var(--font-weight-bold);
1033
- }
1034
- .font-medium {
1035
- --tw-font-weight: var(--font-weight-medium);
1036
- font-weight: var(--font-weight-medium);
1037
- }
1038
- .font-semibold {
1039
- --tw-font-weight: var(--font-weight-semibold);
1040
- font-weight: var(--font-weight-semibold);
1041
- }
1042
- .break-words {
1043
- overflow-wrap: break-word;
1044
- }
1045
- .whitespace-pre-line {
1046
- white-space: pre-line;
1047
- }
1048
- .text-black {
1049
- color: var(--color-black);
1050
- }
1051
- .text-blue-400 {
1052
- color: var(--color-blue-400);
1053
- }
1054
- .text-blue-500 {
1055
- color: var(--color-blue-500);
1056
- }
1057
- .text-blue-600 {
1058
- color: var(--color-blue-600);
1059
- }
1060
- .text-blue-700 {
1061
- color: var(--color-blue-700);
1062
- }
1063
- .text-blue-900 {
1064
- color: var(--color-blue-900);
1065
- }
1066
- .text-gray-300 {
1067
- color: var(--color-gray-300);
1068
- }
1069
- .text-gray-400 {
1070
- color: var(--color-gray-400);
1071
- }
1072
- .text-gray-500 {
1073
- color: var(--color-gray-500);
1074
- }
1075
- .text-gray-600 {
1076
- color: var(--color-gray-600);
1077
- }
1078
- .text-gray-700 {
1079
- color: var(--color-gray-700);
1080
- }
1081
- .text-gray-800 {
1082
- color: var(--color-gray-800);
1083
- }
1084
- .text-red-500 {
1085
- color: var(--color-red-500);
1086
- }
1087
- .text-red-600 {
1088
- color: var(--color-red-600);
1089
- }
1090
- .text-white {
1091
- color: var(--color-white);
1092
- }
1093
- .text-yellow-600 {
1094
- color: var(--color-yellow-600);
1095
- }
1096
- .uppercase {
1097
- text-transform: uppercase;
1098
- }
1099
- .opacity-25 {
1100
- opacity: 0.25;
1101
- }
1102
- .opacity-30 {
1103
- opacity: 0.3;
1104
- }
1105
- .opacity-75 {
1106
- opacity: 0.75;
1107
- }
1108
- .shadow-lg {
1109
- --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a),
1110
- 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
1111
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
1112
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1113
- }
1114
- .shadow-md {
1115
- --tw-shadow: 0 4px 6px -1px var(--tw-shadow-color, #0000001a),
1116
- 0 2px 4px -2px var(--tw-shadow-color, #0000001a);
1117
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
1118
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1119
- }
1120
- .shadow-sm {
1121
- --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, #0000001a),
1122
- 0 1px 2px -1px var(--tw-shadow-color, #0000001a);
1123
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
1124
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1125
- }
1126
- .shadow-xl {
1127
- --tw-shadow: 0 20px 25px -5px var(--tw-shadow-color, #0000001a),
1128
- 0 8px 10px -6px var(--tw-shadow-color, #0000001a);
1129
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
1130
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1131
- }
1132
- .transition {
1133
- transition-property: color, background-color, border-color, outline-color,
1134
- text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via,
1135
- --tw-gradient-to, opacity, box-shadow, transform, translate, scale, rotate,
1136
- filter, -webkit-backdrop-filter, backdrop-filter;
1137
- transition-timing-function: var(
1138
- --tw-ease,
1139
- var(--default-transition-timing-function)
1140
- );
1141
- transition-duration: var(--tw-duration, var(--default-transition-duration));
1142
- }
1143
- .transition-all {
1144
- transition-property: all;
1145
- transition-timing-function: var(
1146
- --tw-ease,
1147
- var(--default-transition-timing-function)
1148
- );
1149
- transition-duration: var(--tw-duration, var(--default-transition-duration));
1150
- }
1151
- .transition-colors {
1152
- transition-property: color, background-color, border-color, outline-color,
1153
- text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via,
1154
- --tw-gradient-to;
1155
- transition-timing-function: var(
1156
- --tw-ease,
1157
- var(--default-transition-timing-function)
1158
- );
1159
- transition-duration: var(--tw-duration, var(--default-transition-duration));
1160
- }
1161
- .transition-shadow {
1162
- transition-property: box-shadow;
1163
- transition-timing-function: var(
1164
- --tw-ease,
1165
- var(--default-transition-timing-function)
1166
- );
1167
- transition-duration: var(--tw-duration, var(--default-transition-duration));
1168
- }
1169
- .transition-transform {
1170
- transition-property: transform, translate, scale, rotate;
1171
- transition-timing-function: var(
1172
- --tw-ease,
1173
- var(--default-transition-timing-function)
1174
- );
1175
- transition-duration: var(--tw-duration, var(--default-transition-duration));
1176
- }
1177
- .duration-300 {
1178
- --tw-duration: 0.3s;
1179
- transition-duration: 0.3s;
1180
- }
1181
- .duration-500 {
1182
- --tw-duration: 0.5s;
1183
- transition-duration: 0.5s;
1184
- }
1185
- .ease-in-out {
1186
- --tw-ease: var(--ease-in-out);
1187
- transition-timing-function: var(--ease-in-out);
1188
- }
1189
- @media (hover: hover) {
1190
- .hover\:bg-blue-50:hover {
1191
- background-color: var(--color-blue-50);
1192
- }
1193
- .hover\:bg-blue-200:hover {
1194
- background-color: var(--color-blue-200);
1195
- }
1196
- .hover\:bg-blue-700:hover {
1197
- background-color: var(--color-blue-700);
1198
- }
1199
- .hover\:bg-gray-300:hover {
1200
- background-color: var(--color-gray-300);
1201
- }
1202
- .hover\:text-blue-500:hover {
1203
- color: var(--color-blue-500);
1204
- }
1205
- .hover\:text-blue-800:hover {
1206
- color: var(--color-blue-800);
1207
- }
1208
- .hover\:text-gray-900:hover {
1209
- color: var(--color-gray-900);
1210
- }
1211
- .hover\:text-red-500:hover {
1212
- color: var(--color-red-500);
1213
- }
1214
- .hover\:text-red-700:hover {
1215
- color: var(--color-red-700);
1216
- }
1217
- .hover\:text-yellow-600:hover {
1218
- color: var(--color-yellow-600);
1219
- }
1220
- .hover\:text-yellow-700:hover {
1221
- color: var(--color-yellow-700);
1222
- }
1223
- .hover\:shadow-lg:hover {
1224
- --tw-shadow: 0 10px 15px -3px var(--tw-shadow-color, #0000001a),
1225
- 0 4px 6px -4px var(--tw-shadow-color, #0000001a);
1226
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
1227
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1228
- }
1229
- }
1230
- .focus\:ring-2:focus {
1231
- --tw-ring-shadow: var(--tw-ring-inset) 0 0 0
1232
- calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
1233
- box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow),
1234
- var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);
1235
- }
1236
- .focus\:ring-blue-200:focus {
1237
- --tw-ring-color: var(--color-blue-200);
1238
- }
1239
- .disabled\:cursor-not-allowed:disabled {
1240
- cursor: not-allowed;
1241
- }
1242
- .disabled\:bg-gray-100:disabled {
1243
- background-color: var(--color-gray-100);
1244
- }
1245
- .disabled\:opacity-40:disabled {
1246
- opacity: 0.4;
1247
- }
1248
- .disabled\:opacity-50:disabled {
1249
- opacity: 0.5;
1250
- }
1251
- @media (min-width: 40rem) {
1252
- .sm\:w-auto {
1253
- width: auto;
1254
- }
1255
- .sm\:flex-row {
1256
- flex-direction: row;
1257
- }
1258
- :where(.sm\:space-y-0 > :not(:last-child)) {
1259
- --tw-space-y-reverse: 0;
1260
- margin-block-start: calc(
1261
- calc(var(--spacing) * 0) * var(--tw-space-y-reverse)
1262
- );
1263
- margin-block-end: calc(
1264
- calc(var(--spacing) * 0) * calc(1 - var(--tw-space-y-reverse))
1265
- );
1266
- }
1267
- :where(.sm\:space-x-4 > :not(:last-child)) {
1268
- --tw-space-x-reverse: 0;
1269
- margin-inline-start: calc(
1270
- calc(var(--spacing) * 4) * var(--tw-space-x-reverse)
1271
- );
1272
- margin-inline-end: calc(
1273
- calc(var(--spacing) * 4) * calc(1 - var(--tw-space-x-reverse))
1274
- );
1275
- }
1276
- .sm\:p-4 {
1277
- padding: calc(var(--spacing) * 4);
1278
- }
1279
- .sm\:text-lg {
1280
- font-size: var(--text-lg);
1281
- line-height: var(--tw-leading, var(--text-lg--line-height));
1282
- }
1283
- }
1284
- @media (min-width: 48rem) {
1285
- .md\:flex-row {
1286
- flex-direction: row;
1287
- }
1288
- .md\:p-6 {
1289
- padding: calc(var(--spacing) * 6);
1290
- }
1291
- .md\:text-lg {
1292
- font-size: var(--text-lg);
1293
- line-height: var(--tw-leading, var(--text-lg--line-height));
1294
- }
1295
- .md\:text-xl {
1296
- font-size: var(--text-xl);
1297
- line-height: var(--tw-leading, var(--text-xl--line-height));
1298
- }
1299
- }
1300
- @media (min-width: 64rem) {
1301
- .lg\:relative {
1302
- position: relative;
1303
- }
1304
- .lg\:hidden {
1305
- display: none;
1306
- }
1307
- .lg\:w-1\/3 {
1308
- width: 33.3333%;
1309
- }
1310
- .lg\:translate-x-0 {
1311
- --tw-translate-x: calc(var(--spacing) * 0);
1312
- translate: var(--tw-translate-x) var(--tw-translate-y);
1313
- }
1314
- .lg\:transform-none {
1315
- transform: none;
1316
- }
1317
- .lg\:p-8 {
1318
- padding: calc(var(--spacing) * 8);
1319
- }
1320
- }
1321
- @media (min-width: 80rem) {
1322
- .xl\:text-2xl {
1323
- font-size: var(--text-2xl);
1324
- line-height: var(--tw-leading, var(--text-2xl--line-height));
1325
- }
1326
- }
1327
- }
1328
- :root {
1329
- color-scheme: light dark;
1330
- color: #213547;
1331
- font-synthesis: none;
1332
- text-rendering: optimizeLegibility;
1333
- -webkit-font-smoothing: antialiased;
1334
- -moz-osx-font-smoothing: grayscale;
1335
- --four-geeks-blue: #0097cf;
1336
- --soft-blue: #f3fafd;
1337
- --gray-text: #6883b4;
1338
- --learnpack-blue: #02a9ea;
1339
- --learnpack-light-blue: #c7f3fd;
1340
- font-family: system-ui, Avenir, Helvetica, Arial, sans-serif;
1341
- font-weight: 400;
1342
- line-height: 1.5;
1343
- }
1344
- a {
1345
- color: var(--learnpack-blue);
1346
- -webkit-text-decoration: inherit;
1347
- text-decoration: inherit;
1348
- font-weight: 500;
1349
- }
1350
- a:hover {
1351
- color: var(--learnpack-blue);
1352
- }
1353
- body {
1354
- background-color: #f4f9fe;
1355
- min-height: 100vh;
1356
- margin: 0;
1357
- }
1358
- .bg-learnpack-blue {
1359
- background-color: var(--soft-blue);
1360
- }
1361
- .bg-learnpack {
1362
- background-color: var(--learnpack-blue);
1363
- }
1364
- .bg-gray-blue {
1365
- background-color: #e7f1ff;
1366
- }
1367
- .index-circle {
1368
- width: 30px;
1369
- height: 30px;
1370
- color: var(--four-geeks-blue);
1371
- background-color: var(--soft-blue);
1372
- border-radius: 50%;
1373
- justify-content: center;
1374
- align-items: center;
1375
- font-size: 16px;
1376
- font-weight: 600;
1377
- display: flex;
1378
- }
1379
- .text-gray {
1380
- color: var(--gray-text);
1381
- }
1382
- .scrollbar-hide {
1383
- scrollbar-width: none !important;
1384
- }
1385
- .loader {
1386
- justify-content: center;
1387
- align-items: center;
1388
- gap: 10px;
1389
- animation: 1s linear infinite glowing;
1390
- display: flex;
1391
- }
1392
- @keyframes spin {
1393
- to {
1394
- transform: rotate(360deg);
1395
- }
1396
- }
1397
- .loader-icon {
1398
- justify-content: center;
1399
- align-items: center;
1400
- width: 40px;
1401
- height: 40px;
1402
- display: flex;
1403
- position: relative;
1404
- }
1405
- @keyframes glowing {
1406
- 0% {
1407
- opacity: 0.6;
1408
- }
1409
- to {
1410
- opacity: 1;
1411
- }
1412
- }
1413
- .blue-on-hover:hover svg,
1414
- .blue-on-hover:hover svg path {
1415
- fill: var(--learnpack-blue);
1416
- }
1417
- .border-learnpack-blue {
1418
- border-color: var(--learnpack-blue);
1419
- }
1420
- .red-ball {
1421
- background-color: #eb5757;
1422
- border: 2px solid #fff;
1423
- border-radius: 50%;
1424
- width: 16px;
1425
- height: 16px;
1426
- position: absolute;
1427
- top: -10px;
1428
- left: 10px;
1429
- }
1430
- .fluid-svg > svg {
1431
- width: 100%;
1432
- height: 100%;
1433
- }
1434
- .outline-blue:focus {
1435
- outline: 1px solid #51b3e5;
1436
- }
1437
- .border-C8DBFC {
1438
- border-color: #c8dbfc;
1439
- }
1440
- .markdown-renderer ul {
1441
- padding-left: 0;
1442
- list-style-type: disc;
1443
- list-style-position: inside;
1444
- }
1445
- .markdown-renderer ol {
1446
- padding-left: 0;
1447
- list-style-type: decimal;
1448
- list-style-position: inside;
1449
- }
1450
- .appear {
1451
- transform-origin: top;
1452
- opacity: 0;
1453
- animation: 0.5s ease-in-out forwards appear;
1454
- transform: scaleY(0) translateY(20px);
1455
- }
1456
- @keyframes appear {
1457
- 0% {
1458
- opacity: 0;
1459
- transform: scaleY(0) translateY(20px);
1460
- }
1461
- to {
1462
- opacity: 1;
1463
- transform: scaleY(1) translateY(0);
1464
- }
1465
- }
1466
- .bg-heavy-blue {
1467
- background-color: #9fbdf0;
1468
- }
1469
- .border-heavy-blue {
1470
- border-color: #9fbdf0;
1471
- }
1472
- .border-heavy-blue:focus {
1473
- outline: 1px solid #9fbdf0;
1474
- }
1475
- .cloudy {
1476
- opacity: 0;
1477
- transition: opacity 0.5s ease-in-out;
1478
- animation: 0.5s ease-in-out forwards fadeIn;
1479
- }
1480
- @keyframes fadeIn {
1481
- 0% {
1482
- opacity: 0;
1483
- transform: translateY(20px);
1484
- }
1485
- to {
1486
- opacity: 1;
1487
- transform: translateY(0);
1488
- }
1489
- }
1490
- .yellow-ball {
1491
- background-color: #08f700;
1492
- border-radius: 50%;
1493
- width: 16px;
1494
- height: 16px;
1495
- position: absolute;
1496
- top: -10px;
1497
- left: 10px;
1498
- }
1499
- @property --tw-translate-x {
1500
- syntax: "*";
1501
- inherits: false;
1502
- initial-value: 0;
1503
- }
1504
- @property --tw-translate-y {
1505
- syntax: "*";
1506
- inherits: false;
1507
- initial-value: 0;
1508
- }
1509
- @property --tw-translate-z {
1510
- syntax: "*";
1511
- inherits: false;
1512
- initial-value: 0;
1513
- }
1514
- @property --tw-rotate-x {
1515
- syntax: "*";
1516
- inherits: false;
1517
- initial-value: rotateX(0);
1518
- }
1519
- @property --tw-rotate-y {
1520
- syntax: "*";
1521
- inherits: false;
1522
- initial-value: rotateY(0);
1523
- }
1524
- @property --tw-rotate-z {
1525
- syntax: "*";
1526
- inherits: false;
1527
- initial-value: rotateZ(0);
1528
- }
1529
- @property --tw-skew-x {
1530
- syntax: "*";
1531
- inherits: false;
1532
- initial-value: skewX(0);
1533
- }
1534
- @property --tw-skew-y {
1535
- syntax: "*";
1536
- inherits: false;
1537
- initial-value: skewY(0);
1538
- }
1539
- @property --tw-space-y-reverse {
1540
- syntax: "*";
1541
- inherits: false;
1542
- initial-value: 0;
1543
- }
1544
- @property --tw-space-x-reverse {
1545
- syntax: "*";
1546
- inherits: false;
1547
- initial-value: 0;
1548
- }
1549
- @property --tw-border-style {
1550
- syntax: "*";
1551
- inherits: false;
1552
- initial-value: solid;
1553
- }
1554
- @property --tw-gradient-position {
1555
- syntax: "*";
1556
- inherits: false;
1557
- }
1558
- @property --tw-gradient-from {
1559
- syntax: "<color>";
1560
- inherits: false;
1561
- initial-value: #0000;
1562
- }
1563
- @property --tw-gradient-via {
1564
- syntax: "<color>";
1565
- inherits: false;
1566
- initial-value: #0000;
1567
- }
1568
- @property --tw-gradient-to {
1569
- syntax: "<color>";
1570
- inherits: false;
1571
- initial-value: #0000;
1572
- }
1573
- @property --tw-gradient-stops {
1574
- syntax: "*";
1575
- inherits: false;
1576
- }
1577
- @property --tw-gradient-via-stops {
1578
- syntax: "*";
1579
- inherits: false;
1580
- }
1581
- @property --tw-gradient-from-position {
1582
- syntax: "<length-percentage>";
1583
- inherits: false;
1584
- initial-value: 0%;
1585
- }
1586
- @property --tw-gradient-via-position {
1587
- syntax: "<length-percentage>";
1588
- inherits: false;
1589
- initial-value: 50%;
1590
- }
1591
- @property --tw-gradient-to-position {
1592
- syntax: "<length-percentage>";
1593
- inherits: false;
1594
- initial-value: 100%;
1595
- }
1596
- @property --tw-leading {
1597
- syntax: "*";
1598
- inherits: false;
1599
- }
1600
- @property --tw-font-weight {
1601
- syntax: "*";
1602
- inherits: false;
1603
- }
1604
- @property --tw-shadow {
1605
- syntax: "*";
1606
- inherits: false;
1607
- initial-value: 0 0 #0000;
1608
- }
1609
- @property --tw-shadow-color {
1610
- syntax: "*";
1611
- inherits: false;
1612
- }
1613
- @property --tw-shadow-alpha {
1614
- syntax: "<percentage>";
1615
- inherits: false;
1616
- initial-value: 100%;
1617
- }
1618
- @property --tw-inset-shadow {
1619
- syntax: "*";
1620
- inherits: false;
1621
- initial-value: 0 0 #0000;
1622
- }
1623
- @property --tw-inset-shadow-color {
1624
- syntax: "*";
1625
- inherits: false;
1626
- }
1627
- @property --tw-inset-shadow-alpha {
1628
- syntax: "<percentage>";
1629
- inherits: false;
1630
- initial-value: 100%;
1631
- }
1632
- @property --tw-ring-color {
1633
- syntax: "*";
1634
- inherits: false;
1635
- }
1636
- @property --tw-ring-shadow {
1637
- syntax: "*";
1638
- inherits: false;
1639
- initial-value: 0 0 #0000;
1640
- }
1641
- @property --tw-inset-ring-color {
1642
- syntax: "*";
1643
- inherits: false;
1644
- }
1645
- @property --tw-inset-ring-shadow {
1646
- syntax: "*";
1647
- inherits: false;
1648
- initial-value: 0 0 #0000;
1649
- }
1650
- @property --tw-ring-inset {
1651
- syntax: "*";
1652
- inherits: false;
1653
- }
1654
- @property --tw-ring-offset-width {
1655
- syntax: "<length>";
1656
- inherits: false;
1657
- initial-value: 0;
1658
- }
1659
- @property --tw-ring-offset-color {
1660
- syntax: "*";
1661
- inherits: false;
1662
- initial-value: #fff;
1663
- }
1664
- @property --tw-ring-offset-shadow {
1665
- syntax: "*";
1666
- inherits: false;
1667
- initial-value: 0 0 #0000;
1668
- }
1669
- @property --tw-duration {
1670
- syntax: "*";
1671
- inherits: false;
1672
- }
1673
- @property --tw-ease {
1674
- syntax: "*";
1675
- inherits: false;
1676
- }
1677
- @keyframes ping {
1678
- 75%,
1679
- to {
1680
- opacity: 0;
1681
- transform: scale(2);
1682
- }
1683
- }
1684
- @keyframes pulse {
1685
- 50% {
1686
- opacity: 0.5;
1687
- }
1688
- }
1
+ /*! tailwindcss v4.1.3 | MIT License | https://tailwindcss.com */@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:rotateX(0);--tw-rotate-y:rotateY(0);--tw-rotate-z:rotateZ(0);--tw-skew-x:skewX(0);--tw-skew-y:skewY(0);--tw-space-y-reverse:0;--tw-space-x-reverse:0;--tw-border-style:solid;--tw-gradient-position:initial;--tw-gradient-from:#0000;--tw-gradient-via:#0000;--tw-gradient-to:#0000;--tw-gradient-stops:initial;--tw-gradient-via-stops:initial;--tw-gradient-from-position:0%;--tw-gradient-via-position:50%;--tw-gradient-to-position:100%;--tw-leading:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial}}}@layer theme{:root,:host{--font-sans:ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-red-50:oklch(97.1% .013 17.38);--color-red-100:oklch(93.6% .032 17.717);--color-red-500:oklch(63.7% .237 25.331);--color-red-600:oklch(57.7% .245 27.325);--color-red-700:oklch(50.5% .213 27.518);--color-yellow-600:oklch(68.1% .162 75.834);--color-yellow-700:oklch(55.4% .135 66.442);--color-blue-50:oklch(97% .014 254.604);--color-blue-100:oklch(93.2% .032 255.585);--color-blue-200:oklch(88.2% .059 254.128);--color-blue-400:oklch(70.7% .165 254.624);--color-blue-500:oklch(62.3% .214 259.815);--color-blue-600:oklch(54.6% .245 262.881);--color-blue-700:oklch(48.8% .243 264.376);--color-blue-800:oklch(42.4% .199 265.638);--color-blue-900:oklch(37.9% .146 265.522);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-100:oklch(96.7% .003 264.542);--color-gray-200:oklch(92.8% .006 264.531);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-400:oklch(70.7% .022 261.325);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-600:oklch(44.6% .03 256.802);--color-gray-700:oklch(37.3% .034 259.733);--color-gray-800:oklch(27.8% .033 256.848);--color-gray-900:oklch(21% .034 264.665);--color-black:#000;--color-white:#fff;--spacing:.25rem;--container-xs:20rem;--container-sm:24rem;--container-md:28rem;--container-xl:36rem;--text-xs:.75rem;--text-xs--line-height:calc(1/.75);--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-lg:1.125rem;--text-lg--line-height:calc(1.75/1.125);--text-xl:1.25rem;--text-xl--line-height:calc(1.75/1.25);--text-2xl:1.5rem;--text-2xl--line-height:calc(2/1.5);--text-4xl:2.25rem;--text-4xl--line-height:calc(2.5/2.25);--text-7xl:4.5rem;--text-7xl--line-height:1;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-md:.375rem;--radius-lg:.5rem;--radius-xl:.75rem;--ease-in-out:cubic-bezier(.4,0,.2,1);--animate-spin:spin 1s linear infinite;--animate-ping:ping 1s cubic-bezier(0,0,.2,1)infinite;--animate-pulse:pulse 2s cubic-bezier(.4,0,.6,1)infinite;--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-mono-font-family:var(--font-mono)}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab,red,red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){-webkit-appearance:button;-moz-appearance:button;appearance:button}::file-selector-button{-webkit-appearance:button;-moz-appearance:button;appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.pointer-events-auto{pointer-events:auto}.pointer-events-none{pointer-events:none}.absolute{position:absolute}.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing)*0)}.-top-3{top:calc(var(--spacing)*-3)}.top-0{top:calc(var(--spacing)*0)}.top-2{top:calc(var(--spacing)*2)}.right-2{right:calc(var(--spacing)*2)}.bottom-0{bottom:calc(var(--spacing)*0)}.bottom-2{bottom:calc(var(--spacing)*2)}.bottom-5{bottom:calc(var(--spacing)*5)}.bottom-10{bottom:calc(var(--spacing)*10)}.bottom-\[100\%\]{bottom:100%}.left-0{left:calc(var(--spacing)*0)}.left-1\/2{left:50%}.left-2{left:calc(var(--spacing)*2)}.z-10{z-index:10}.z-30{z-index:30}.z-31{z-index:31}.z-50{z-index:50}.z-1000{z-index:1000}.container{width:100%}@media (min-width:40rem){.container{max-width:40rem}}@media (min-width:48rem){.container{max-width:48rem}}@media (min-width:64rem){.container{max-width:64rem}}@media (min-width:80rem){.container{max-width:80rem}}@media (min-width:96rem){.container{max-width:96rem}}.m-0{margin:calc(var(--spacing)*0)}.mx-2{margin-inline:calc(var(--spacing)*2)}.mx-4{margin-inline:calc(var(--spacing)*4)}.mx-auto{margin-inline:auto}.-mt-5{margin-top:calc(var(--spacing)*-5)}.mt-1{margin-top:calc(var(--spacing)*1)}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-4{margin-top:calc(var(--spacing)*4)}.mt-5{margin-top:calc(var(--spacing)*5)}.mt-6{margin-top:calc(var(--spacing)*6)}.mt-10{margin-top:calc(var(--spacing)*10)}.mt-14{margin-top:calc(var(--spacing)*14)}.mr-1{margin-right:calc(var(--spacing)*1)}.mb-2{margin-bottom:calc(var(--spacing)*2)}.mb-3{margin-bottom:calc(var(--spacing)*3)}.mb-4{margin-bottom:calc(var(--spacing)*4)}.mb-5{margin-bottom:calc(var(--spacing)*5)}.mb-6{margin-bottom:calc(var(--spacing)*6)}.ml-2{margin-left:calc(var(--spacing)*2)}.ml-6{margin-left:calc(var(--spacing)*6)}.ml-auto{margin-left:auto}.flex{display:flex}.hidden{display:none}.inline-flex{display:inline-flex}.table{display:table}.h-2{height:calc(var(--spacing)*2)}.h-4{height:calc(var(--spacing)*4)}.h-5{height:calc(var(--spacing)*5)}.h-6{height:calc(var(--spacing)*6)}.h-10{height:calc(var(--spacing)*10)}.h-12{height:calc(var(--spacing)*12)}.h-15{height:calc(var(--spacing)*15)}.h-20{height:calc(var(--spacing)*20)}.h-24{height:calc(var(--spacing)*24)}.h-60{height:calc(var(--spacing)*60)}.h-\[50vh\]{height:50vh}.h-\[85\%\]{height:85%}.h-\[150px\]{height:150px}.h-full{height:100%}.h-screen{height:100vh}.max-h-\[78vh\]{max-height:78vh}.max-h-\[300px\]{max-height:300px}.min-h-\[69vh\]{min-height:69vh}.min-h-screen{min-height:100vh}.w-2{width:calc(var(--spacing)*2)}.w-4{width:calc(var(--spacing)*4)}.w-4\/5{width:80%}.w-5{width:calc(var(--spacing)*5)}.w-6{width:calc(var(--spacing)*6)}.w-10{width:calc(var(--spacing)*10)}.w-12{width:calc(var(--spacing)*12)}.w-15{width:calc(var(--spacing)*15)}.w-20{width:calc(var(--spacing)*20)}.w-100{width:calc(var(--spacing)*100)}.w-\[100px\]{width:100px}.w-\[280px\]{width:280px}.w-full{width:100%}.max-w-\[700px\]{max-width:700px}.max-w-md{max-width:var(--container-md)}.max-w-sm{max-width:var(--container-sm)}.max-w-xl{max-width:var(--container-xl)}.max-w-xs{max-width:var(--container-xs)}.min-w-\[250px\]{min-width:250px}.flex-1{flex:1}.flex-grow{flex-grow:1}.-translate-x-1\/2{--tw-translate-x: -50% ;translate:var(--tw-translate-x)var(--tw-translate-y)}.-translate-x-full{--tw-translate-x:-100%;translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-x-0{--tw-translate-x:calc(var(--spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x)var(--tw-rotate-y)var(--tw-rotate-z)var(--tw-skew-x)var(--tw-skew-y)}.animate-ping{animation:var(--animate-ping)}.animate-pulse{animation:var(--animate-pulse)}.animate-spin{animation:var(--animate-spin)}.cursor-not-allowed{cursor:not-allowed}.cursor-pointer{cursor:pointer}.resize{resize:both}.list-disc{list-style-type:disc}.flex-col{flex-direction:column}.flex-row{flex-direction:row}.flex-wrap{flex-wrap:wrap}.items-center{align-items:center}.items-start{align-items:flex-start}.justify-between{justify-content:space-between}.justify-center{justify-content:center}.justify-end{justify-content:flex-end}.justify-start{justify-content:flex-start}.gap-1{gap:calc(var(--spacing)*1)}.gap-2{gap:calc(var(--spacing)*2)}.gap-3{gap:calc(var(--spacing)*3)}.gap-4{gap:calc(var(--spacing)*4)}:where(.space-y-2>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*2)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-3>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*3)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*3)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-y-6>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*6)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*6)*calc(1 - var(--tw-space-y-reverse)))}:where(.space-x-2>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*2)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*2)*calc(1 - var(--tw-space-x-reverse)))}.truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.overflow-hidden{overflow:hidden}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.rounded{border-radius:.25rem}.rounded-\[50\%\]{border-radius:50%}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.rounded-xl{border-radius:var(--radius-xl)}.border{border-style:var(--tw-border-style);border-width:1px}.border-2{border-style:var(--tw-border-style);border-width:2px}.border-r{border-right-style:var(--tw-border-style);border-right-width:1px}.border-blue-200{border-color:var(--color-blue-200)}.border-blue-500{border-color:var(--color-blue-500)}.border-blue-600{border-color:var(--color-blue-600)}.border-gray-200{border-color:var(--color-gray-200)}.border-gray-300{border-color:var(--color-gray-300)}.border-transparent{border-color:#0000}.border-t-transparent{border-top-color:#0000}.bg-black\/50{background-color:#00000080}@supports (color:color-mix(in lab,red,red)){.bg-black\/50{background-color:color-mix(in oklab,var(--color-black)50%,transparent)}}.bg-black\/60{background-color:#0009}@supports (color:color-mix(in lab,red,red)){.bg-black\/60{background-color:color-mix(in oklab,var(--color-black)60%,transparent)}}.bg-blue-50{background-color:var(--color-blue-50)}.bg-blue-100{background-color:var(--color-blue-100)}.bg-blue-400{background-color:var(--color-blue-400)}.bg-blue-500{background-color:var(--color-blue-500)}.bg-blue-600{background-color:var(--color-blue-600)}.bg-gray-50{background-color:var(--color-gray-50)}.bg-gray-100{background-color:var(--color-gray-100)}.bg-gray-200{background-color:var(--color-gray-200)}.bg-gray-300{background-color:var(--color-gray-300)}.bg-gray-400{background-color:var(--color-gray-400)}.bg-red-50{background-color:var(--color-red-50)}.bg-red-100{background-color:var(--color-red-100)}.bg-white{background-color:var(--color-white)}.bg-gradient-to-t{--tw-gradient-position:to top in oklab;background-image:linear-gradient(var(--tw-gradient-stops))}.from-white{--tw-gradient-from:var(--color-white);--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.to-transparent{--tw-gradient-to:transparent;--tw-gradient-stops:var(--tw-gradient-via-stops,var(--tw-gradient-position),var(--tw-gradient-from)var(--tw-gradient-from-position),var(--tw-gradient-to)var(--tw-gradient-to-position))}.object-cover{object-fit:cover}.p-1{padding:calc(var(--spacing)*1)}.p-2{padding:calc(var(--spacing)*2)}.p-3{padding:calc(var(--spacing)*3)}.p-4{padding:calc(var(--spacing)*4)}.p-6{padding:calc(var(--spacing)*6)}.p-8{padding:calc(var(--spacing)*8)}.p-10{padding:calc(var(--spacing)*10)}.px-2{padding-inline:calc(var(--spacing)*2)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.px-20{padding-inline:calc(var(--spacing)*20)}.py-1{padding-block:calc(var(--spacing)*1)}.py-1\.5{padding-block:calc(var(--spacing)*1.5)}.py-2{padding-block:calc(var(--spacing)*2)}.pr-2{padding-right:calc(var(--spacing)*2)}.pb-1{padding-bottom:calc(var(--spacing)*1)}.pb-20{padding-bottom:calc(var(--spacing)*20)}.pb-32{padding-bottom:calc(var(--spacing)*32)}.pl-5{padding-left:calc(var(--spacing)*5)}.text-center{text-align:center}.text-left{text-align:left}.font-sans{font-family:var(--font-sans)}.text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}.text-4xl{font-size:var(--text-4xl);line-height:var(--tw-leading,var(--text-4xl--line-height))}.text-7xl{font-size:var(--text-7xl);line-height:var(--tw-leading,var(--text-7xl--line-height))}.text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}.text-xs{font-size:var(--text-xs);line-height:var(--tw-leading,var(--text-xs--line-height))}.leading-none{--tw-leading:1;line-height:1}.font-bold{--tw-font-weight:var(--font-weight-bold);font-weight:var(--font-weight-bold)}.font-medium{--tw-font-weight:var(--font-weight-medium);font-weight:var(--font-weight-medium)}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.break-words{overflow-wrap:break-word}.whitespace-pre-line{white-space:pre-line}.text-black{color:var(--color-black)}.text-blue-400{color:var(--color-blue-400)}.text-blue-500{color:var(--color-blue-500)}.text-blue-600{color:var(--color-blue-600)}.text-blue-700{color:var(--color-blue-700)}.text-blue-900{color:var(--color-blue-900)}.text-gray-300{color:var(--color-gray-300)}.text-gray-400{color:var(--color-gray-400)}.text-gray-500{color:var(--color-gray-500)}.text-gray-600{color:var(--color-gray-600)}.text-gray-700{color:var(--color-gray-700)}.text-gray-800{color:var(--color-gray-800)}.text-red-500{color:var(--color-red-500)}.text-red-600{color:var(--color-red-600)}.text-white{color:var(--color-white)}.text-yellow-600{color:var(--color-yellow-600)}.uppercase{text-transform:uppercase}.opacity-25{opacity:.25}.opacity-30{opacity:.3}.opacity-75{opacity:.75}.shadow-lg{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-md{--tw-shadow:0 4px 6px -1px var(--tw-shadow-color,#0000001a),0 2px 4px -2px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-sm{--tw-shadow:0 1px 3px 0 var(--tw-shadow-color,#0000001a),0 1px 2px -1px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-colors{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-shadow{transition-property:box-shadow;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-transform{transition-property:transform,translate,scale,rotate;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-300{--tw-duration:.3s;transition-duration:.3s}.duration-500{--tw-duration:.5s;transition-duration:.5s}.ease-in-out{--tw-ease:var(--ease-in-out);transition-timing-function:var(--ease-in-out)}@media (hover:hover){.hover\:bg-blue-50:hover{background-color:var(--color-blue-50)}.hover\:bg-blue-200:hover{background-color:var(--color-blue-200)}.hover\:bg-blue-700:hover{background-color:var(--color-blue-700)}.hover\:bg-gray-300:hover{background-color:var(--color-gray-300)}.hover\:text-blue-500:hover{color:var(--color-blue-500)}.hover\:text-blue-800:hover{color:var(--color-blue-800)}.hover\:text-gray-900:hover{color:var(--color-gray-900)}.hover\:text-red-500:hover{color:var(--color-red-500)}.hover\:text-red-700:hover{color:var(--color-red-700)}.hover\:text-yellow-600:hover{color:var(--color-yellow-600)}.hover\:text-yellow-700:hover{color:var(--color-yellow-700)}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px var(--tw-shadow-color,#0000001a),0 4px 6px -4px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}}.focus\:ring-2:focus{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(2px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.focus\:ring-blue-200:focus{--tw-ring-color:var(--color-blue-200)}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:bg-gray-100:disabled{background-color:var(--color-gray-100)}.disabled\:opacity-40:disabled{opacity:.4}.disabled\:opacity-50:disabled{opacity:.5}@media (min-width:40rem){.sm\:w-auto{width:auto}.sm\:flex-row{flex-direction:row}:where(.sm\:space-y-0>:not(:last-child)){--tw-space-y-reverse:0;margin-block-start:calc(calc(var(--spacing)*0)*var(--tw-space-y-reverse));margin-block-end:calc(calc(var(--spacing)*0)*calc(1 - var(--tw-space-y-reverse)))}:where(.sm\:space-x-4>:not(:last-child)){--tw-space-x-reverse:0;margin-inline-start:calc(calc(var(--spacing)*4)*var(--tw-space-x-reverse));margin-inline-end:calc(calc(var(--spacing)*4)*calc(1 - var(--tw-space-x-reverse)))}.sm\:p-4{padding:calc(var(--spacing)*4)}.sm\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}}@media (min-width:48rem){.md\:flex-row{flex-direction:row}.md\:p-6{padding:calc(var(--spacing)*6)}.md\:text-lg{font-size:var(--text-lg);line-height:var(--tw-leading,var(--text-lg--line-height))}.md\:text-xl{font-size:var(--text-xl);line-height:var(--tw-leading,var(--text-xl--line-height))}}@media (min-width:64rem){.lg\:relative{position:relative}.lg\:hidden{display:none}.lg\:w-1\/3{width:33.3333%}.lg\:translate-x-0{--tw-translate-x:calc(var(--spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.lg\:transform-none{transform:none}.lg\:p-8{padding:calc(var(--spacing)*8)}}@media (min-width:80rem){.xl\:text-2xl{font-size:var(--text-2xl);line-height:var(--tw-leading,var(--text-2xl--line-height))}}}:root{color-scheme:light dark;color:#213547;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;--four-geeks-blue:#0097cf;--soft-blue:#f3fafd;--gray-text:#6883b4;--learnpack-blue:#02a9ea;--learnpack-light-blue:#c7f3fd;font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;font-weight:400;line-height:1.5}a{color:var(--learnpack-blue);-webkit-text-decoration:inherit;text-decoration:inherit;font-weight:500}a:hover{color:var(--learnpack-blue)}body{background-color:#f4f9fe;min-height:100vh;margin:0}.bg-learnpack-blue{background-color:var(--soft-blue)}.bg-learnpack{background-color:var(--learnpack-blue)}.bg-gray-blue{background-color:#e7f1ff}.index-circle{width:30px;height:30px;color:var(--four-geeks-blue);background-color:var(--soft-blue);border-radius:50%;justify-content:center;align-items:center;font-size:16px;font-weight:600;display:flex}.text-gray{color:var(--gray-text)}.scrollbar-hide{scrollbar-width:none!important}.loader{justify-content:center;align-items:center;gap:10px;animation:1s linear infinite glowing;display:flex}@keyframes spin{to{transform:rotate(360deg)}}.loader-icon{justify-content:center;align-items:center;width:40px;height:40px;display:flex;position:relative}@keyframes glowing{0%{opacity:.6}to{opacity:1}}.blue-on-hover:hover svg,.blue-on-hover:hover svg path{fill:var(--learnpack-blue)}.border-learnpack-blue{border-color:var(--learnpack-blue)}.red-ball{background-color:#eb5757;border:2px solid #fff;border-radius:50%;width:16px;height:16px;position:absolute;top:-10px;left:10px}.fluid-svg>svg{width:100%;height:100%}.outline-blue:focus{outline:1px solid #51b3e5}.border-C8DBFC{border-color:#c8dbfc}.markdown-renderer ul{padding-left:0;list-style-type:disc;list-style-position:inside}.markdown-renderer ol{padding-left:0;list-style-type:decimal;list-style-position:inside}.appear{transform-origin:top;opacity:0;animation:.5s ease-in-out forwards appear;transform:scaleY(0)translateY(20px)}@keyframes appear{0%{opacity:0;transform:scaleY(0)translateY(20px)}to{opacity:1;transform:scaleY(1)translateY(0)}}.bg-heavy-blue{background-color:#9fbdf0}.border-heavy-blue{border-color:#9fbdf0}.border-heavy-blue:focus{outline:1px solid #9fbdf0}.cloudy{opacity:0;transition:opacity .5s ease-in-out;animation:.5s ease-in-out forwards fadeIn}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.yellow-ball{background-color:#08f700;border-radius:50%;width:16px;height:16px;position:absolute;top:-10px;left:10px}@property --tw-translate-x{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-y{syntax:"*";inherits:false;initial-value:0}@property --tw-translate-z{syntax:"*";inherits:false;initial-value:0}@property --tw-rotate-x{syntax:"*";inherits:false;initial-value:rotateX(0)}@property --tw-rotate-y{syntax:"*";inherits:false;initial-value:rotateY(0)}@property --tw-rotate-z{syntax:"*";inherits:false;initial-value:rotateZ(0)}@property --tw-skew-x{syntax:"*";inherits:false;initial-value:skewX(0)}@property --tw-skew-y{syntax:"*";inherits:false;initial-value:skewY(0)}@property --tw-space-y-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-space-x-reverse{syntax:"*";inherits:false;initial-value:0}@property --tw-border-style{syntax:"*";inherits:false;initial-value:solid}@property --tw-gradient-position{syntax:"*";inherits:false}@property --tw-gradient-from{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-via{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-to{syntax:"<color>";inherits:false;initial-value:#0000}@property --tw-gradient-stops{syntax:"*";inherits:false}@property --tw-gradient-via-stops{syntax:"*";inherits:false}@property --tw-gradient-from-position{syntax:"<length-percentage>";inherits:false;initial-value:0%}@property --tw-gradient-via-position{syntax:"<length-percentage>";inherits:false;initial-value:50%}@property --tw-gradient-to-position{syntax:"<length-percentage>";inherits:false;initial-value:100%}@property --tw-leading{syntax:"*";inherits:false}@property --tw-font-weight{syntax:"*";inherits:false}@property --tw-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-shadow-color{syntax:"*";inherits:false}@property --tw-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-inset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-shadow-color{syntax:"*";inherits:false}@property --tw-inset-shadow-alpha{syntax:"<percentage>";inherits:false;initial-value:100%}@property --tw-ring-color{syntax:"*";inherits:false}@property --tw-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-inset-ring-color{syntax:"*";inherits:false}@property --tw-inset-ring-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-ring-inset{syntax:"*";inherits:false}@property --tw-ring-offset-width{syntax:"<length>";inherits:false;initial-value:0}@property --tw-ring-offset-color{syntax:"*";inherits:false;initial-value:#fff}@property --tw-ring-offset-shadow{syntax:"*";inherits:false;initial-value:0 0 #0000}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@keyframes ping{75%,to{opacity:0;transform:scale(2)}}@keyframes pulse{50%{opacity:.5}}