eat-js-sdk 2.0.44 → 2.0.46

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.
@@ -5121,7 +5121,11 @@ const DROPDOWN_POSITION = {
5121
5121
  };
5122
5122
  const DROPDOWN_INTERACTION = {
5123
5123
  KEY_PRESS_TIMEOUT: 1e3,
5124
- PAGE_NAVIGATION_STEP: 10
5124
+ PAGE_NAVIGATION_STEP: 10,
5125
+ PLACEHOLDER: "Select Answer",
5126
+ SAVE_DEBOUNCE_DELAY: 500,
5127
+ RESIZE_DEBOUNCE_DELAY: 150,
5128
+ EMPTY_CHOICE: ""
5125
5129
  };
5126
5130
  const INTERACTION_TYPE_MAP = {
5127
5131
  [INTERACTION_TYPES.MCQ]: "mcq",
@@ -5776,7 +5780,7 @@ function ResultIcon($$anchor, $$props) {
5776
5780
  return pop($$exports);
5777
5781
  }
5778
5782
  create_custom_element(ResultIcon, { isCorrect: {}, iconType: {}, parentProps: {} }, [], [], true);
5779
- var root_3$a = /* @__PURE__ */ from_html(`<span class="sr-only">Alert. &nbsp;</span>`);
5783
+ var root_3$b = /* @__PURE__ */ from_html(`<span class="sr-only">Alert. &nbsp;</span>`);
5780
5784
  var root_1$n = /* @__PURE__ */ from_html(`<div><!> <div><!> <span><!></span></div></div>`);
5781
5785
  function FeedbackAlert($$anchor, $$props) {
5782
5786
  push($$props, true);
@@ -5869,7 +5873,7 @@ function FeedbackAlert($$anchor, $$props) {
5869
5873
  var node_2 = child(div_1);
5870
5874
  {
5871
5875
  var consequent_1 = ($$anchor3) => {
5872
- var span = root_3$a();
5876
+ var span = root_3$b();
5873
5877
  append($$anchor3, span);
5874
5878
  };
5875
5879
  if_block(node_2, ($$render) => {
@@ -6881,9 +6885,9 @@ function useImageModalSize() {
6881
6885
  calculateStimulusImageLayout
6882
6886
  };
6883
6887
  }
6884
- var root_3$9 = /* @__PURE__ */ from_html(`<span class="w-6 h-6 flex items-center justify-center"><!></span>`);
6888
+ var root_3$a = /* @__PURE__ */ from_html(`<span class="w-6 h-6 flex items-center justify-center"><!></span>`);
6885
6889
  var root_4$6 = /* @__PURE__ */ from_html(`<span class="w-6 h-6 flex items-center justify-center"><!></span>`);
6886
- var root_5$7 = /* @__PURE__ */ from_html(`<div><span aria-hidden="true"><!></span></div>`);
6890
+ var root_5$6 = /* @__PURE__ */ from_html(`<div><span aria-hidden="true"><!></span></div>`);
6887
6891
  var root_8$4 = /* @__PURE__ */ from_html(`<span class="w-4 h-4 flex items-center justify-center"><!></span>`);
6888
6892
  var root_9$2 = /* @__PURE__ */ from_html(`<span class="w-4 h-4 flex items-center justify-center"><!></span>`);
6889
6893
  var root_2$e = /* @__PURE__ */ from_html(`<div class="absolute inset-0 m-0"><div class="w-full h-full px-0 md:px-[82px] lg:px-[128px] pt-14 pb-[72px] relative lg:py-24 flex flex-col items-center justify-center"><div aria-live="polite" aria-atomic="true" class="sr-only"> </div> <div class="w-full h-full flex flex-col md:flex-row md:justify-center items-center justify-between"><div class="md:hidden"></div> <!> <!> <div><div class="flex-shrink-0 flex items-center justify-between py-1 px-2 md:px-4 border-border-minimal border rounded-t-md lg:rounded-t-lg md:gap-4 h-8.5 md:h-fit"><!> <!> <!></div> <div class="rounded-b-md"><img class="mx-auto block rounded-b-md lg:rounded-b-lg object-contain max-w-full max-h-[calc(100vh-168px-34px)] md:max-h-[calc(100vh-128px-54px)] lg:max-h-[calc(100vh-192px-54px)] pointer-events-none"/></div></div> <div class="md:hidden flex justify-center items-center gap-1 flex-shrink-0 h-6 mt-4"><!> <!></div></div></div></div>`);
@@ -7109,7 +7113,7 @@ function MCQImageModal($$anchor, $$props) {
7109
7113
  },
7110
7114
  onclick: navigatePrevious,
7111
7115
  children: ($$anchor4, $$slotProps2) => {
7112
- var span = root_3$9();
7116
+ var span = root_3$a();
7113
7117
  var node_2 = child(span);
7114
7118
  SvgLoader(node_2, {
7115
7119
  svgName: "smallChevronLeft",
@@ -7164,7 +7168,7 @@ function MCQImageModal($$anchor, $$props) {
7164
7168
  return get$1(fullAnswerText);
7165
7169
  },
7166
7170
  children: ($$anchor4, $$slotProps2) => {
7167
- var div_6 = root_5$7();
7171
+ var div_6 = root_5$6();
7168
7172
  var span_2 = child(div_6);
7169
7173
  var node_6 = child(span_2);
7170
7174
  {
@@ -7467,7 +7471,7 @@ function InteractionSection($$anchor, $$props) {
7467
7471
  return pop($$exports);
7468
7472
  }
7469
7473
  create_custom_element(InteractionSection, { children: {} }, [], [], true);
7470
- var root_5$6 = /* @__PURE__ */ from_html(`<div></div>`);
7474
+ var root_5$5 = /* @__PURE__ */ from_html(`<div></div>`);
7471
7475
  var root_4$5 = /* @__PURE__ */ from_html(`<div class="px-4 w-full max-w-[1008px] mx-auto flex-shrink-0 text-center font-semibold text-sm md:text-lg leading-[150%] text-white" aria-hidden="true"> </div> <!>`, 1);
7472
7476
  var root_7$4 = /* @__PURE__ */ from_html(`<div></div>`);
7473
7477
  var root_2$d = /* @__PURE__ */ from_html(`<div class="absolute inset-0"><div class="w-full h-full flex items-center justify-center pt-14 pb-[72px] lg:py-24"><div aria-live="polite" aria-atomic="true" class="sr-only"> </div> <div class="flex flex-col items-center overflow-y-auto w-full px-0 md:px-6 lg:px-16"><div class="relative bg-white rounded-md md:rounded-lg shadow-sm overflow-hidden flex-shrink-0"><img class="block object-contain w-full h-auto max-w-full mx-auto"/> <!></div> <!></div></div></div>`);
@@ -7639,7 +7643,7 @@ function PromptStimulusImageModal($$anchor, $$props) {
7639
7643
  var node_3 = sibling(div_5, 2);
7640
7644
  {
7641
7645
  var consequent = ($$anchor5) => {
7642
- var div_6 = root_5$6();
7646
+ var div_6 = root_5$5();
7643
7647
  template_effect(() => set_style(div_6, `height:${get$1(bottomSpacerHeight) ?? ""}px`));
7644
7648
  append($$anchor5, div_6);
7645
7649
  };
@@ -8081,7 +8085,7 @@ const shouldRenderSection = (section) => section.condition !== false;
8081
8085
  const getClassString = (classes = []) => classes.join(" ");
8082
8086
  const getStyleString = (styles = {}) => Object.entries(styles).map(([k, v]) => `${k}:${v}`).join(";");
8083
8087
  var root_4$4 = /* @__PURE__ */ from_html(`<p class="text-lg leading-[22px] text-blue-1000 font-semibold mt-4"> </p>`);
8084
- var root_5$5 = /* @__PURE__ */ from_html(`<div class="mt-6 w-full"><button class="flex items-center font-semibold leading-[1.5] outline-none group w-fit h-11 text-charcoal" aria-controls="long-description-content" aria-labelledby="image-description-label" type="button"><div class="w-6 h-6 flex items-center justify-center mr-2"><!></div> <div id="image-description-label" class="image-description-accordion group-[.active]:border-b-2">Image Description</div></button> <div id="long-description-content"><!></div></div>`);
8088
+ var root_5$4 = /* @__PURE__ */ from_html(`<div class="mt-6 w-full"><button class="flex items-center font-semibold leading-[1.5] outline-none group w-fit h-11 text-charcoal" aria-controls="long-description-content" aria-labelledby="image-description-label" type="button"><div class="w-6 h-6 flex items-center justify-center mr-2"><!></div> <div id="image-description-label" class="image-description-accordion group-[.active]:border-b-2">Image Description</div></button> <div id="long-description-content"><!></div></div>`);
8085
8089
  var root_2$c = /* @__PURE__ */ from_html(`<div class="flex flex-col justify-center items-center text-center"><div class="flex flex-col items-center"><div class="relative inline-block"><img loading="lazy"/> <!></div> <!></div></div> <!>`, 1);
8086
8090
  var root_1$j = /* @__PURE__ */ from_html(`<div class="w-full"><!></div>`);
8087
8091
  function CommonMedia($$anchor, $$props) {
@@ -8213,7 +8217,7 @@ function CommonMedia($$anchor, $$props) {
8213
8217
  var node_4 = sibling(div_1, 2);
8214
8218
  {
8215
8219
  var consequent_1 = ($$anchor4) => {
8216
- var div_4 = root_5$5();
8220
+ var div_4 = root_5$4();
8217
8221
  var button = child(div_4);
8218
8222
  button.__click = toggleLongDescription;
8219
8223
  button.__keydown = handleKeyDown;
@@ -8297,12 +8301,12 @@ create_custom_element(
8297
8301
  [],
8298
8302
  true
8299
8303
  );
8300
- var root_3$8 = /* @__PURE__ */ from_html(`<div><!></div>`);
8304
+ var root_3$9 = /* @__PURE__ */ from_html(`<div><!></div>`);
8301
8305
  var root_4$3 = /* @__PURE__ */ from_html(`<div><!></div>`);
8302
8306
  var root_2$b = /* @__PURE__ */ from_html(`<!> <!>`, 1);
8303
8307
  var root_6$2 = /* @__PURE__ */ from_html(`<div><!></div>`);
8304
8308
  var root_7$3 = /* @__PURE__ */ from_html(`<div><!></div>`);
8305
- var root_5$4 = /* @__PURE__ */ from_html(`<!> <!>`, 1);
8309
+ var root_5$3 = /* @__PURE__ */ from_html(`<!> <!>`, 1);
8306
8310
  var root_1$i = /* @__PURE__ */ from_html(`<div class="stimulus-section flex flex-col w-full"><!></div>`);
8307
8311
  function StimulusSection($$anchor, $$props) {
8308
8312
  push($$props, true);
@@ -8373,7 +8377,7 @@ function StimulusSection($$anchor, $$props) {
8373
8377
  var node_2 = first_child(fragment_1);
8374
8378
  {
8375
8379
  var consequent = ($$anchor4) => {
8376
- var div_1 = root_3$8();
8380
+ var div_1 = root_3$9();
8377
8381
  var node_3 = child(div_1);
8378
8382
  CommonStringToHtml(node_3, {
8379
8383
  get htmlString() {
@@ -8427,7 +8431,7 @@ function StimulusSection($$anchor, $$props) {
8427
8431
  append($$anchor3, fragment_1);
8428
8432
  };
8429
8433
  var alternate = ($$anchor3) => {
8430
- var fragment_2 = root_5$4();
8434
+ var fragment_2 = root_5$3();
8431
8435
  var node_6 = first_child(fragment_2);
8432
8436
  {
8433
8437
  var consequent_3 = ($$anchor4) => {
@@ -8512,10 +8516,10 @@ create_custom_element(
8512
8516
  true
8513
8517
  );
8514
8518
  var root_8$3 = /* @__PURE__ */ from_html(`<div class="divider my-6"></div>`);
8515
- var root_13$1 = /* @__PURE__ */ from_html(`<div class="divider my-6"></div>`);
8516
- var root_15$1 = /* @__PURE__ */ from_html(`<div aria-live="polite"><!></div>`);
8519
+ var root_13 = /* @__PURE__ */ from_html(`<div class="divider my-6"></div>`);
8520
+ var root_15 = /* @__PURE__ */ from_html(`<div aria-live="polite"><!></div>`);
8517
8521
  var root_1$h = /* @__PURE__ */ from_html(`<div><!></div>`);
8518
- var root_16 = /* @__PURE__ */ from_html(`<div><!></div>`);
8522
+ var root_16$1 = /* @__PURE__ */ from_html(`<div><!></div>`);
8519
8523
  var root$e = /* @__PURE__ */ from_html(`<div class="prompt-container"><div><div></div> <!></div></div> <!>`, 1);
8520
8524
  function PromptContainer($$anchor, $$props) {
8521
8525
  push($$props, true);
@@ -8706,7 +8710,7 @@ function PromptContainer($$anchor, $$props) {
8706
8710
  var node_6 = first_child(fragment_10);
8707
8711
  {
8708
8712
  var consequent_5 = ($$anchor8) => {
8709
- var div_5 = root_13$1();
8713
+ var div_5 = root_13();
8710
8714
  append($$anchor8, div_5);
8711
8715
  };
8712
8716
  var alternate = ($$anchor8) => {
@@ -8714,7 +8718,7 @@ function PromptContainer($$anchor, $$props) {
8714
8718
  var node_7 = first_child(fragment_11);
8715
8719
  {
8716
8720
  var consequent_6 = ($$anchor9) => {
8717
- var div_6 = root_15$1();
8721
+ var div_6 = root_15();
8718
8722
  var node_8 = child(div_6);
8719
8723
  snippet(node_8, () => feedback() ?? noop);
8720
8724
  reset(div_6);
@@ -8807,7 +8811,7 @@ function PromptContainer($$anchor, $$props) {
8807
8811
  var node_9 = sibling(div_2, 2);
8808
8812
  {
8809
8813
  var consequent_7 = ($$anchor2) => {
8810
- var div_7 = root_16();
8814
+ var div_7 = root_16$1();
8811
8815
  var node_10 = child(div_7);
8812
8816
  StimulusSection(node_10, {
8813
8817
  get stimulusData() {
@@ -8894,9 +8898,9 @@ create_custom_element(
8894
8898
  );
8895
8899
  var root_1$g = /* @__PURE__ */ from_html(`<p class="text-charcoal text-sm leading-[19.2px] mb-2"> </p>`);
8896
8900
  var root_2$a = /* @__PURE__ */ from_html(`<span class="text-gray-860 text-sm mb-0.5"> </span>`);
8897
- var root_3$7 = /* @__PURE__ */ from_html(`<span class="text-gray-860 text-sm mb-0.5">Missing answer:</span>`);
8901
+ var root_3$8 = /* @__PURE__ */ from_html(`<span class="text-gray-860 text-sm mb-0.5">Missing answer:</span>`);
8898
8902
  var root_4$2 = /* @__PURE__ */ from_html(`<span aria-hidden="true" class="text-green-900 mr-1"><!></span>`);
8899
- var root_5$3 = /* @__PURE__ */ from_html(`<span aria-hidden="true"><!></span>`);
8903
+ var root_5$2 = /* @__PURE__ */ from_html(`<span aria-hidden="true"><!></span>`);
8900
8904
  var root_9$1 = /* @__PURE__ */ from_html(`<span class="w-3 h-2 flex items-center justify-center"><!></span>`);
8901
8905
  var root_8$2 = /* @__PURE__ */ from_html(`<span><!></span>`);
8902
8906
  var root_10$1 = /* @__PURE__ */ from_html(`<div class="w-full overflow-hidden bg-white rounded-b-lg flex items-center justify-center relative"><img class="min-h-[154px] max-h-[184px] w-auto max-w-full object-contain pointer-events-none" loading="lazy"/></div>`);
@@ -9028,7 +9032,7 @@ function MCQOption($$anchor, $$props) {
9028
9032
  var node_2 = sibling(node_1, 2);
9029
9033
  {
9030
9034
  var consequent_2 = ($$anchor2) => {
9031
- var span_6 = root_3$7();
9035
+ var span_6 = root_3$8();
9032
9036
  append($$anchor2, span_6);
9033
9037
  };
9034
9038
  if_block(node_2, ($$render) => {
@@ -9061,7 +9065,7 @@ function MCQOption($$anchor, $$props) {
9061
9065
  var node_6 = sibling(node_4, 2);
9062
9066
  {
9063
9067
  var consequent_5 = ($$anchor2) => {
9064
- var span_9 = root_5$3();
9068
+ var span_9 = root_5$2();
9065
9069
  var node_7 = child(span_9);
9066
9070
  {
9067
9071
  var consequent_4 = ($$anchor3) => {
@@ -9308,7 +9312,7 @@ create_custom_element(
9308
9312
  [],
9309
9313
  true
9310
9314
  );
9311
- var root_3$6 = /* @__PURE__ */ from_html(`<div aria-live="polite" class="mb-6"><!></div>`);
9315
+ var root_3$7 = /* @__PURE__ */ from_html(`<div aria-live="polite" class="mb-6"><!></div>`);
9312
9316
  var root$c = /* @__PURE__ */ from_html(`<!> <!>`, 1);
9313
9317
  function MCQComponent($$anchor, $$props) {
9314
9318
  push($$props, true);
@@ -9446,7 +9450,7 @@ function MCQComponent($$anchor, $$props) {
9446
9450
  var node_1 = first_child(fragment_2);
9447
9451
  {
9448
9452
  var consequent = ($$anchor3) => {
9449
- var div = root_3$6();
9453
+ var div = root_3$7();
9450
9454
  var node_2 = child(div);
9451
9455
  MCQFeedback(node_2, {
9452
9456
  get feedbackState() {
@@ -10297,7 +10301,7 @@ action.update = n.update;
10297
10301
  action.destroy = n.destroy;
10298
10302
  var root_1$c = /* @__PURE__ */ from_html(`<label aria-hidden="true"><span></span> <span> </span></label>`);
10299
10303
  var root_2$6 = /* @__PURE__ */ from_html(`<div role="textbox" aria-readonly="true"><!></div>`);
10300
- var root_3$5 = /* @__PURE__ */ from_html(`<textarea rows="1" readonly=""></textarea>`);
10304
+ var root_3$6 = /* @__PURE__ */ from_html(`<textarea rows="1" readonly=""></textarea>`);
10301
10305
  var root_4 = /* @__PURE__ */ from_html(`<span class="w-6 h-6 absolute right-4 top-[calc(50%+0.375rem)] -translate-y-1/2 flex items-center justify-center"><!></span>`);
10302
10306
  var root$9 = /* @__PURE__ */ from_html(`<div><!> <!> <!></div>`);
10303
10307
  function AnswerDisplay($$anchor, $$props) {
@@ -10478,7 +10482,7 @@ function AnswerDisplay($$anchor, $$props) {
10478
10482
  append($$anchor2, div_1);
10479
10483
  };
10480
10484
  var alternate = ($$anchor2) => {
10481
- var textarea = root_3$5();
10485
+ var textarea = root_3$6();
10482
10486
  remove_textarea_child(textarea);
10483
10487
  action$1(textarea, ($$node) => action?.($$node));
10484
10488
  template_effect(() => {
@@ -10971,7 +10975,7 @@ create_custom_element(
10971
10975
  [],
10972
10976
  true
10973
10977
  );
10974
- var root_3$4 = /* @__PURE__ */ from_html(`<p></p>`);
10978
+ var root_3$5 = /* @__PURE__ */ from_html(`<p></p>`);
10975
10979
  var root_8$1 = /* @__PURE__ */ from_html(`<div class="absolute inset-0 bg-transparent z-50"></div>`);
10976
10980
  var root_2$4 = /* @__PURE__ */ from_html(`<div class="inline-typein-container mt-6 relative"><!> <div class="divider my-6"></div> <!></div>`);
10977
10981
  function TypeInComponent($$anchor, $$props) {
@@ -11175,7 +11179,7 @@ function TypeInComponent($$anchor, $$props) {
11175
11179
  var div = root_2$4();
11176
11180
  var node_1 = child(div);
11177
11181
  each(node_1, 17, () => segments, index, ($$anchor4, segment) => {
11178
- var p = root_3$4();
11182
+ var p = root_3$5();
11179
11183
  each(p, 21, () => get$1(segment).parts, index, ($$anchor5, part, partIndex) => {
11180
11184
  var fragment_2 = comment();
11181
11185
  var node_2 = first_child(fragment_2);
@@ -13842,8 +13846,8 @@ function isInt(value) {
13842
13846
  })(parseFloat(value));
13843
13847
  }
13844
13848
  var root_1$9 = /* @__PURE__ */ from_html(`<span class="text-green-800 preview-icon"><!></span>`);
13845
- var root_3$3 = /* @__PURE__ */ from_html(`<span class="text-red-800 preview-icon"><!></span>`);
13846
- var root_5$2 = /* @__PURE__ */ from_html(`<span class="text-green-800"><!></span>`);
13849
+ var root_3$4 = /* @__PURE__ */ from_html(`<span class="text-red-800 preview-icon"><!></span>`);
13850
+ var root_5$1 = /* @__PURE__ */ from_html(`<span class="text-green-800"><!></span>`);
13847
13851
  var root_7$2 = /* @__PURE__ */ from_html(`<span class="preview-vertical hidden"><!></span>`);
13848
13852
  var root$6 = /* @__PURE__ */ from_html(`<button data-item-button=""><span><!></span> <div><span></span> <span class="absolute"><!> <!></span></div></button>`);
13849
13853
  function CategoriseItem($$anchor, $$props) {
@@ -14136,7 +14140,7 @@ function CategoriseItem($$anchor, $$props) {
14136
14140
  var node_3 = first_child(fragment);
14137
14141
  {
14138
14142
  var consequent_1 = ($$anchor3) => {
14139
- var span_4 = root_3$3();
14143
+ var span_4 = root_3$4();
14140
14144
  var node_4 = child(span_4);
14141
14145
  SvgLoader(node_4, { svgName: "errorSolid", className: "incorrect-icon" });
14142
14146
  reset(span_4);
@@ -14147,7 +14151,7 @@ function CategoriseItem($$anchor, $$props) {
14147
14151
  var node_5 = first_child(fragment_1);
14148
14152
  {
14149
14153
  var consequent_2 = ($$anchor4) => {
14150
- var span_5 = root_5$2();
14154
+ var span_5 = root_5$1();
14151
14155
  var node_6 = child(span_5);
14152
14156
  SvgLoader(node_6, { svgName: "success", className: "missing-correct-icon" });
14153
14157
  reset(span_5);
@@ -14653,7 +14657,7 @@ create_custom_element(
14653
14657
  true
14654
14658
  );
14655
14659
  var root_2$3 = /* @__PURE__ */ from_svg(`<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7"></path></svg>`);
14656
- var root_3$2 = /* @__PURE__ */ from_svg(`<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"></path></svg>`);
14660
+ var root_3$3 = /* @__PURE__ */ from_svg(`<svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 15l7-7 7 7"></path></svg>`);
14657
14661
  var root_1$7 = /* @__PURE__ */ from_html(`<button type="button" class="focus-ring flex items-center rounded-[32px] p-1.5 text-charcoal text-sm border border-gray-800 bg-gray-50 min-w-[85px] ml-3 whitespace-nowrap active:raw-focus-ring active:bg-black-55"><span class="mx-0.5"> </span> <span class="w-4 h-4 text-inherit flex items-center justify-center"><!></span></button>`);
14658
14662
  var root$4 = /* @__PURE__ */ from_html(`<div role="group"><div><!> <!></div> <!></div>`);
14659
14663
  function CategoriseCategory($$anchor, $$props) {
@@ -14688,16 +14692,15 @@ function CategoriseCategory($$anchor, $$props) {
14688
14692
  ${isDraggingOver() && get$1(isNotSourceContainer) ? "raw-focus-ring" : ""}
14689
14693
  ${get$1(isDropTarget) && get$1(isNotSourceContainer) ? "bg-violet-150" : ""}
14690
14694
  ${get$1(isDropTarget) && hasAddItemAnimation() && get$1(isNotSourceContainer) ? "transition bg-white duration-300" : ""}
14691
- ${get$1(isValidDropTarget) ? "hover:bg-violet-100 hover-focus-ring cursor-pointer" : ""}
14695
+ ${get$1(isValidDropTarget) ? "td:hover:bg-violet-100 td:hover-focus-ring cursor-pointer" : ""}
14692
14696
  ${get$1(effectiveIsCollapsed) && isMobile() ? "" : "min-h-[140px]"}`);
14693
14697
  const containerClasses = /* @__PURE__ */ user_derived(() => `content-start !outline-none rounded-lg grow w-full md:p-4
14694
14698
  ${isDraggingOver() && get$1(isNotSourceContainer) ? "bg-violet-100" : ""}
14695
14699
  ${get$1(effectiveIsCollapsed) && isMobile() ? "" : "h-full p-3 min-h-[86px] md:min-h-0"}`);
14696
14700
  const titleClasses = /* @__PURE__ */ user_derived(() => `absolute flex items-center justify-between border-b border-gray-800 w-full rounded-t-lg p-3 md:p-4 md:justify-center
14697
14701
  ${get$1(isDropTarget) && get$1(isNotSourceContainer) ? "bg-transparent" : "bg-white"}
14698
- ${!get$1(effectiveIsCollapsed) && isDraggingOver() && get$1(isNotSourceContainer) ? "!bg-violet-100 md:!bg-white" : ""}
14699
- ${get$1(effectiveIsCollapsed) && isMobile() ? "rounded-b-lg md:rounded-b-none" : ""}
14700
- ${get$1(effectiveIsCollapsed) && isMobile() && get$1(isValidDropTarget) ? "group-hover/itemContainer:bg-violet-100 md:group-hover/itemContainer:bg-white" : ""}`);
14702
+ ${get$1(effectiveIsCollapsed) && isDraggingOver() && get$1(isNotSourceContainer) ? "!bg-violet-100 md:!bg-white" : ""}
14703
+ ${get$1(effectiveIsCollapsed) && isMobile() ? "rounded-b-lg md:rounded-b-none" : ""}`);
14701
14704
  const adjustedTabindex = /* @__PURE__ */ user_derived(() => () => {
14702
14705
  if (get$1(hasSelectedItem)) {
14703
14706
  return -1;
@@ -14921,7 +14924,7 @@ function CategoriseCategory($$anchor, $$props) {
14921
14924
  append($$anchor3, svg);
14922
14925
  };
14923
14926
  var alternate = ($$anchor3) => {
14924
- var svg_1 = root_3$2();
14927
+ var svg_1 = root_3$3();
14925
14928
  append($$anchor3, svg_1);
14926
14929
  };
14927
14930
  if_block(node_2, ($$render) => {
@@ -15057,7 +15060,7 @@ create_custom_element(
15057
15060
  var root_1$6 = /* @__PURE__ */ from_html(`<div role="group" tabindex="-1" class="text-base leading-4 text-gray-800 p-5 border border-gray-400 rounded-lg border-dashed
15058
15061
  absolute top-12 right-4 left-4 bottom-4 flex items-center justify-center !bg-white md:top-20">Word Bin is empty</div>`);
15059
15062
  var root_2$2 = /* @__PURE__ */ from_html(`<button type="button" class="focus-ring p-2 text-blue-1000 rounded-md w-11 h-11 mt-9 td:hover:bg-black-50 active:bg-black-60 disabled:text-gray-40 disabled:hover:bg-white md:hidden" aria-label="Left"><span class="w-6 h-6 text-inherit flex items-center justify-center"><!></span></button>`);
15060
- var root_3$1 = /* @__PURE__ */ from_html(`<button type="button" class="focus-ring p-2 text-blue-1000 rounded-md w-11 h-11 mt-9 td:hover:bg-black-50 active:bg-black-60 disabled:text-gray-40 disabled:hover:bg-white md:hidden" aria-label="Right"><span class="w-6 h-6 text-inherit flex items-center justify-center ml-[3px]"><!></span></button>`);
15063
+ var root_3$2 = /* @__PURE__ */ from_html(`<button type="button" class="focus-ring p-2 text-blue-1000 rounded-md w-11 h-11 mt-9 td:hover:bg-black-50 active:bg-black-60 disabled:text-gray-40 disabled:hover:bg-white md:hidden" aria-label="Right"><span class="w-6 h-6 text-inherit flex items-center justify-center ml-[3px]"><!></span></button>`);
15061
15064
  var root$3 = /* @__PURE__ */ from_html(`<div role="group"><div><span class="text-base leading-5 !text-gray-900 font-semibold md:mb-2 md:item-heading">Word Bin&nbsp;</span> <span class="text-base leading-5 !text-gray-900 md:item-heading"> </span></div> <div class="flex items-center justify-between px-4 min-h-[133px] md:min-h-0 md:block md:px-0 md:justify-normal"><!> <!> <!> <!></div></div>`);
15062
15065
  function CategoriseWordBin($$anchor, $$props) {
15063
15066
  push($$props, true);
@@ -15084,13 +15087,13 @@ function CategoriseWordBin($$anchor, $$props) {
15084
15087
  ${isDraggingOver() && get$1(isNotSourceContainer) ? "raw-focus-ring bg-violet-100" : ""}
15085
15088
  ${get$1(isDropTarget) && get$1(isNotSourceContainer) ? "bg-violet-150" : ""}
15086
15089
  ${get$1(isDropTarget) && hasAddItemAnimation() && get$1(isNotSourceContainer) ? "transition bg-white duration-300" : ""}
15087
- ${get$1(isValidDropTarget) ? "hover:bg-violet-100 hover-focus-ring cursor-pointer" : ""}
15090
+ ${get$1(isValidDropTarget) ? "td:hover:bg-violet-100 td:hover-focus-ring cursor-pointer" : ""}
15088
15091
  ${get$1(hasSelectedItem) && !get$1(isNotSourceContainer) ? "cursor-default" : ""}`);
15089
15092
  const titleClasses = /* @__PURE__ */ user_derived(() => `p-4 pb-3 text-center w-full absolute flex flex-row items-center justify-between md:justify-center md:flex-col md:pb-0
15090
15093
  ${get$1(isDropTarget) && !hasAddItemAnimation() && get$1(isNotSourceContainer) ? "bg-violet-150" : ""}
15091
15094
  ${get$1(isDropTarget) && hasAddItemAnimation() && get$1(isNotSourceContainer) ? "transition duration-300 bg-white" : ""}
15092
15095
  ${isDraggingOver() && get$1(isNotSourceContainer) ? "bg-violet-100" : ""}
15093
- ${get$1(isValidDropTarget) ? "hover:bg-violet-100" : ""}`);
15096
+ ${get$1(isValidDropTarget) ? "td:hover:bg-violet-100" : ""}`);
15094
15097
  const handleEmptyClick = () => {
15095
15098
  if (selectedItemId() && oncontainerclick()) {
15096
15099
  oncontainerclick()(containerId());
@@ -15370,7 +15373,7 @@ function CategoriseWordBin($$anchor, $$props) {
15370
15373
  var node_4 = sibling(node_3, 2);
15371
15374
  {
15372
15375
  var consequent_2 = ($$anchor2) => {
15373
- var button_1 = root_3$1();
15376
+ var button_1 = root_3$2();
15374
15377
  button_1.__click = () => handleNavigate("right");
15375
15378
  button_1.__keydown = (e2) => {
15376
15379
  if (e2.key === "Enter" || e2.key === " ") {
@@ -15741,8 +15744,6 @@ function CategoriseComponent($$anchor, $$props) {
15741
15744
  }
15742
15745
  }
15743
15746
  }
15744
- } else {
15745
- set(dragSourceContainerId, null);
15746
15747
  }
15747
15748
  });
15748
15749
  user_effect(() => {
@@ -15959,7 +15960,6 @@ function CategoriseComponent($$anchor, $$props) {
15959
15960
  set(interactionState, api().reset(get$1(interactionState)), true);
15960
15961
  dispatchStateChange();
15961
15962
  set(currentMobileIndex, 0);
15962
- set(dragSourceContainerId, null);
15963
15963
  set(isModalOpen, false);
15964
15964
  };
15965
15965
  var $$exports = {
@@ -16957,83 +16957,144 @@ function createDropdownState(initialValue) {
16957
16957
  searchString: ""
16958
16958
  };
16959
16959
  }
16960
- const isAllAnswered$1 = (selections) => {
16961
- return selections.every((item) => item.choice !== "" && item.choice !== "Select Answer");
16960
+ const hasRenderedIds = (ids) => {
16961
+ return !!ids && ids.length > 0;
16962
+ };
16963
+ const createSelectionMap = (selections) => {
16964
+ return new Map(selections.map((s) => [s.id, s]));
16965
+ };
16966
+ const isAllAnswered$1 = (selections, renderedIds) => {
16967
+ if (hasRenderedIds(renderedIds)) {
16968
+ const selectionMap = createSelectionMap(selections);
16969
+ return renderedIds.every((id) => {
16970
+ const selection = selectionMap.get(id);
16971
+ return selection && selection.choice !== DROPDOWN_INTERACTION.EMPTY_CHOICE && selection.choice !== DROPDOWN_INTERACTION.PLACEHOLDER;
16972
+ });
16973
+ }
16974
+ return selections.every(
16975
+ (item) => item.choice !== DROPDOWN_INTERACTION.EMPTY_CHOICE && item.choice !== DROPDOWN_INTERACTION.PLACEHOLDER
16976
+ );
16962
16977
  };
16963
- const isAllSkipped = (selections) => {
16964
- return selections.every((item) => item.choice === "");
16978
+ const isAllSkipped = (selections, renderedIds) => {
16979
+ if (hasRenderedIds(renderedIds)) {
16980
+ const selectionMap = createSelectionMap(selections);
16981
+ return renderedIds.every((id) => {
16982
+ const selection = selectionMap.get(id);
16983
+ return !selection || selection.choice === DROPDOWN_INTERACTION.EMPTY_CHOICE;
16984
+ });
16985
+ }
16986
+ return selections.every((item) => item.choice === DROPDOWN_INTERACTION.EMPTY_CHOICE);
16965
16987
  };
16966
- const calculateAnswerResults = (config, selections) => {
16988
+ const calculateAnswerResults = (config, selections, renderedIds) => {
16989
+ const selectionMap = createSelectionMap(selections);
16990
+ if (hasRenderedIds(renderedIds)) {
16991
+ return renderedIds.map((id) => {
16992
+ const selection = selectionMap.get(id);
16993
+ if (!selection) return false;
16994
+ const correctAnswers = config.correctAnswer[id] || [];
16995
+ if (correctAnswers.length === 0) return false;
16996
+ return correctAnswers.includes(selection.choice);
16997
+ });
16998
+ }
16967
16999
  return selections.map((item) => {
16968
17000
  const correctAnswers = config.correctAnswer[item.id] || [];
16969
17001
  if (correctAnswers.length === 0) return false;
16970
17002
  return correctAnswers.includes(item.choice);
16971
17003
  });
16972
17004
  };
16973
- const getCorrectAnswersForDisplay = (config, selections, answerResults) => {
17005
+ const getCorrectAnswersForDisplay = (config, selections, answerResults, renderedIds) => {
17006
+ const selectionMap = createSelectionMap(selections);
17007
+ if (hasRenderedIds(renderedIds)) {
17008
+ return renderedIds.map((id, index2) => {
17009
+ const selection = selectionMap.get(id);
17010
+ const correctAnswersList = config.correctAnswer[id] || [];
17011
+ const firstCorrectAnswer = correctAnswersList[0] || DROPDOWN_INTERACTION.EMPTY_CHOICE;
17012
+ const isDropdownCorrect = answerResults[index2];
17013
+ if (correctAnswersList.length === 0) return DROPDOWN_INTERACTION.EMPTY_CHOICE;
17014
+ return isDropdownCorrect && selection ? selection.choice : firstCorrectAnswer;
17015
+ });
17016
+ }
16974
17017
  return selections.map((item, index2) => {
16975
17018
  const correctAnswersList = config.correctAnswer[item.id] || [];
16976
- const firstCorrectAnswer = correctAnswersList[0] || "";
16977
- const isCorrect = answerResults[index2];
16978
- if (correctAnswersList.length === 0) return "";
16979
- return isCorrect ? item.choice : firstCorrectAnswer;
17019
+ const firstCorrectAnswer = correctAnswersList[0] || DROPDOWN_INTERACTION.EMPTY_CHOICE;
17020
+ const isDropdownCorrect = answerResults[index2];
17021
+ if (correctAnswersList.length === 0) return DROPDOWN_INTERACTION.EMPTY_CHOICE;
17022
+ return isDropdownCorrect ? item.choice : firstCorrectAnswer;
16980
17023
  });
16981
17024
  };
16982
- const getSessionAnswersForDisplay = (selections) => {
17025
+ const getSessionAnswersForDisplay = (selections, renderedIds) => {
17026
+ const selectionMap = createSelectionMap(selections);
17027
+ if (hasRenderedIds(renderedIds)) {
17028
+ return renderedIds.map((id) => {
17029
+ const selection = selectionMap.get(id);
17030
+ const answer = selection?.choice || DROPDOWN_INTERACTION.EMPTY_CHOICE;
17031
+ return answer === DROPDOWN_INTERACTION.PLACEHOLDER || answer === DROPDOWN_INTERACTION.EMPTY_CHOICE ? DROPDOWN_INTERACTION.EMPTY_CHOICE : answer;
17032
+ });
17033
+ }
16983
17034
  return selections.map((item) => {
16984
- const answer = item.choice || "";
16985
- return answer === "Select Answer" || answer === "" ? "" : answer;
17035
+ const answer = item.choice || DROPDOWN_INTERACTION.EMPTY_CHOICE;
17036
+ return answer === DROPDOWN_INTERACTION.PLACEHOLDER || answer === DROPDOWN_INTERACTION.EMPTY_CHOICE ? DROPDOWN_INTERACTION.EMPTY_CHOICE : answer;
16986
17037
  });
16987
17038
  };
16988
- function calculateDropdownFeedback(state2, config, validateFn) {
17039
+ function calculateDropdownFeedback(state2, config, validateFn, renderedDropdownIds) {
16989
17040
  if (config.mode === MODES.PREVIEW) {
16990
17041
  return {
16991
17042
  showFeedback: true,
16992
17043
  isAllCorrect: true,
16993
17044
  isSkipped: false,
16994
17045
  isAllAnswered: true,
16995
- resultFeedback: "",
17046
+ resultFeedback: DROPDOWN_INTERACTION.EMPTY_CHOICE,
16996
17047
  answerResults: [],
16997
17048
  correctAnswers: [],
16998
17049
  sessionAnswer: []
16999
17050
  };
17000
17051
  }
17001
17052
  const selections = state2.data.selected;
17002
- const allAnswered = isAllAnswered$1(selections);
17053
+ const allAnswered = isAllAnswered$1(selections, renderedDropdownIds);
17003
17054
  if (config.mode === MODES.SESSION && !config.isFinished) {
17004
17055
  return {
17005
17056
  showFeedback: false,
17006
17057
  isAllCorrect: false,
17007
17058
  isSkipped: false,
17008
17059
  isAllAnswered: allAnswered,
17009
- resultFeedback: "",
17060
+ resultFeedback: DROPDOWN_INTERACTION.EMPTY_CHOICE,
17010
17061
  answerResults: [],
17011
17062
  correctAnswers: [],
17012
- sessionAnswer: getSessionAnswersForDisplay(selections)
17063
+ sessionAnswer: getSessionAnswersForDisplay(selections, renderedDropdownIds)
17013
17064
  };
17014
17065
  }
17015
- const isSkipped = isAllSkipped(selections);
17066
+ const isSkipped = isAllSkipped(selections, renderedDropdownIds);
17067
+ const answerResults = calculateAnswerResults(config, selections, renderedDropdownIds);
17016
17068
  let validationResult = {
17017
17069
  isValid: false,
17018
- feedback: ""
17070
+ score: 0,
17071
+ maxScore: hasRenderedIds(renderedDropdownIds) ? renderedDropdownIds.length : Object.keys(config.options).length,
17072
+ feedback: DROPDOWN_INTERACTION.EMPTY_CHOICE
17019
17073
  };
17020
17074
  if (allAnswered) {
17075
+ const selectionsToValidate = hasRenderedIds(renderedDropdownIds) ? selections.filter((sel) => renderedDropdownIds.includes(sel.id)) : selections;
17021
17076
  validationResult = validateFn({
17022
- answer: selections,
17077
+ answer: selectionsToValidate,
17023
17078
  timestamp: state2.lastModified
17024
17079
  });
17080
+ if (hasRenderedIds(renderedDropdownIds)) {
17081
+ const renderedCorrectCount = answerResults.filter(Boolean).length;
17082
+ validationResult.score = renderedCorrectCount;
17083
+ validationResult.maxScore = renderedDropdownIds.length;
17084
+ validationResult.isValid = renderedCorrectCount === renderedDropdownIds.length;
17085
+ validationResult.feedback = renderedCorrectCount === renderedDropdownIds.length ? config.feedback.correct : config.feedback.incorrect;
17086
+ }
17025
17087
  } else if (config.mode === MODES.SESSION && config.isFinished && !allAnswered) {
17026
17088
  validationResult = {
17027
17089
  isValid: false,
17028
17090
  score: 0,
17029
- maxScore: Object.keys(config.options).length,
17091
+ maxScore: hasRenderedIds(renderedDropdownIds) ? renderedDropdownIds.length : Object.keys(config.options).length,
17030
17092
  feedback: config.feedback.incorrect
17031
17093
  };
17032
17094
  }
17033
- const isAllCorrect = validationResult.isValid;
17034
- const answerResults = calculateAnswerResults(config, selections);
17035
- const correctAnswers = getCorrectAnswersForDisplay(config, selections, answerResults);
17036
- const sessionAnswer = getSessionAnswersForDisplay(selections);
17095
+ const areAllDropdownsCorrect = validationResult.isValid;
17096
+ const correctAnswers = getCorrectAnswersForDisplay(config, selections, answerResults, renderedDropdownIds);
17097
+ const sessionAnswer = getSessionAnswersForDisplay(selections, renderedDropdownIds);
17037
17098
  let showFeedback = false;
17038
17099
  if (config.mode === MODES.INTERACTIVE) {
17039
17100
  showFeedback = allAnswered;
@@ -17043,10 +17104,10 @@ function calculateDropdownFeedback(state2, config, validateFn) {
17043
17104
  }
17044
17105
  return {
17045
17106
  showFeedback,
17046
- isAllCorrect,
17107
+ isAllCorrect: areAllDropdownsCorrect,
17047
17108
  isSkipped,
17048
17109
  isAllAnswered: allAnswered,
17049
- resultFeedback: validationResult.feedback || "",
17110
+ resultFeedback: validationResult.feedback || DROPDOWN_INTERACTION.EMPTY_CHOICE,
17050
17111
  answerResults,
17051
17112
  correctAnswers,
17052
17113
  sessionAnswer
@@ -17076,20 +17137,21 @@ function useDropdownPosition(config) {
17076
17137
  };
17077
17138
  }
17078
17139
  var root_1$3 = /* @__PURE__ */ from_html(`<div class="absolute inset-0 bg-transparent z-10"></div>`);
17079
- var root_2 = /* @__PURE__ */ from_html(`<span class="text-green-900 mr-2"><span aria-hidden="true"><!></span> <span class="sr-only">Correct</span></span>`);
17080
- var root_5$1 = /* @__PURE__ */ from_html(`<span class="text-green-900 mr-2"><span aria-hidden="true"><!></span> <span class="sr-only">Correct</span></span>`);
17081
- var root_6 = /* @__PURE__ */ from_html(`<span class="text-red-900 mr-2"><span aria-hidden="true"><!></span> <span class="sr-only">Incorrect</span></span>`);
17082
- var root_7 = /* @__PURE__ */ from_html(`<span class="flex items-center justify-center text-blue-1000"><span aria-hidden="true"><!></span> <span class="sr-only">Close dropdown</span></span>`);
17083
- var root_8 = /* @__PURE__ */ from_html(`<span class="flex items-center justify-center text-blue-1000"><span aria-hidden="true"><!></span> <span class="sr-only">Open dropdown</span></span>`);
17084
- var root_11 = /* @__PURE__ */ from_html(`<span class="flex items-center text-green-900" aria-hidden="true"><!></span>`);
17085
- var root_13 = /* @__PURE__ */ from_html(`<span class="flex items-center text-red-900" aria-hidden="true"><!></span>`);
17086
- var root_15 = /* @__PURE__ */ from_html(`<span class="flex items-center text-blue-850" aria-hidden="true"><!></span>`);
17087
- var root_10 = /* @__PURE__ */ from_html(`<li role="option" tabindex="-1"><div class="p-0.5 flex justify-between w-full text-base whitespace-normal"><!> <!></div></li>`);
17088
- var root_9 = /* @__PURE__ */ from_html(`<ul class="dropdown-menu block" role="listbox" tabindex="-1"></ul>`);
17089
- var root$1 = /* @__PURE__ */ from_html(`<span class="dropdown inline-block relative align-middle"><span class="sr-only"> </span> <!> <button type="button" aria-haspopup="listbox"><div class="bg-black bg-opacity-5 h-full flex flex-none justify-center items-center"><div class="font-semibold text-base leading-[19px] text-charcoal px-3 flex items-center"> </div></div> <div class="px-4 flex flex-1 min-w-0 align-middle truncate items-center justify-between w-full"><span><!></span> <div class="flex items-center"><!> <!></div></div></button> <!></span>`);
17140
+ var root_2 = /* @__PURE__ */ from_html(`<div class="bg-black bg-opacity-5 h-full flex flex-none justify-center items-center"><div class="font-semibold text-base leading-[19px] text-charcoal px-3 flex items-center"> </div></div>`);
17141
+ var root_3$1 = /* @__PURE__ */ from_html(`<span class="text-green-900 mr-2"><span aria-hidden="true"><!></span> <span class="sr-only">Correct</span></span>`);
17142
+ var root_6 = /* @__PURE__ */ from_html(`<span class="text-green-900 mr-2"><span aria-hidden="true"><!></span> <span class="sr-only">Correct</span></span>`);
17143
+ var root_7 = /* @__PURE__ */ from_html(`<span class="text-red-900 mr-2"><span aria-hidden="true"><!></span> <span class="sr-only">Incorrect</span></span>`);
17144
+ var root_8 = /* @__PURE__ */ from_html(`<span class="flex items-center justify-center text-blue-1000"><span aria-hidden="true"><!></span> <span class="sr-only">Close dropdown</span></span>`);
17145
+ var root_9 = /* @__PURE__ */ from_html(`<span class="flex items-center justify-center text-blue-1000"><span aria-hidden="true"><!></span> <span class="sr-only">Open dropdown</span></span>`);
17146
+ var root_12 = /* @__PURE__ */ from_html(`<span class="flex items-center text-green-900" aria-hidden="true"><!></span>`);
17147
+ var root_14 = /* @__PURE__ */ from_html(`<span class="flex items-center text-red-900" aria-hidden="true"><!></span>`);
17148
+ var root_16 = /* @__PURE__ */ from_html(`<span class="flex items-center text-blue-850" aria-hidden="true"><!></span>`);
17149
+ var root_11 = /* @__PURE__ */ from_html(`<li role="option" tabindex="-1"><div class="p-0.5 flex justify-between w-full text-base whitespace-normal"><!> <!></div></li>`);
17150
+ var root_10 = /* @__PURE__ */ from_html(`<ul class="dropdown-menu block" role="listbox" tabindex="-1"></ul>`);
17151
+ var root$1 = /* @__PURE__ */ from_html(`<span class="dropdown inline-block relative align-middle"><span class="sr-only"> </span> <!> <button type="button" aria-haspopup="listbox"><!> <div class="px-4 flex flex-1 min-w-0 align-middle truncate items-center justify-between w-full"><span><!></span> <div class="flex items-center"><!> <!></div></div></button> <!></span>`);
17090
17152
  function DropdownContainer($$anchor, $$props) {
17091
17153
  push($$props, true);
17092
- let dropdownId = prop($$props, "dropdownId", 7), dropdownNumber = prop($$props, "dropdownNumber", 7), options = prop($$props, "options", 7), selected = prop($$props, "selected", 7), correctAnswers = prop($$props, "correctAnswers", 23, () => []), isCorrect = prop($$props, "isCorrect", 7, false), isFinished = prop($$props, "isFinished", 7, false), isLocked = prop($$props, "isLocked", 7, false), isDataSaving = prop($$props, "isDataSaving", 7, false), mode = prop($$props, "mode", 7), showFeedback = prop($$props, "showFeedback", 7, false), onselect = prop($$props, "onselect", 7), viewportBuffer = prop($$props, "viewportBuffer", 7, 60);
17154
+ let dropdownId = prop($$props, "dropdownId", 7), dropdownNumber = prop($$props, "dropdownNumber", 7), options = prop($$props, "options", 7), selected = prop($$props, "selected", 7), correctAnswers = prop($$props, "correctAnswers", 23, () => []), isCorrect = prop($$props, "isCorrect", 7, false), isFinished = prop($$props, "isFinished", 7, false), isLocked = prop($$props, "isLocked", 7, false), isDataSaving = prop($$props, "isDataSaving", 7, false), mode = prop($$props, "mode", 7), showFeedback = prop($$props, "showFeedback", 7, false), showNumbering = prop($$props, "showNumbering", 7, true), onselect = prop($$props, "onselect", 7), viewportBuffer = prop($$props, "viewportBuffer", 7, 60);
17093
17155
  const dropdownActions = useDropdownState();
17094
17156
  const dropdownPosition = useDropdownPosition();
17095
17157
  let initializedOptions = /* @__PURE__ */ user_derived(() => {
@@ -17110,7 +17172,7 @@ function DropdownContainer($$anchor, $$props) {
17110
17172
  });
17111
17173
  const canInteract = /* @__PURE__ */ user_derived(() => !isDataSaving() && mode() !== MODES.PREVIEW && !(mode() === MODES.SESSION && isFinished()));
17112
17174
  const canToggleAccordion = /* @__PURE__ */ user_derived(() => !isDataSaving());
17113
- const isMissing = /* @__PURE__ */ user_derived(() => mode() === MODES.SESSION && isFinished() && (selected() === "Select Answer" || selected() === ""));
17175
+ const isMissing = /* @__PURE__ */ user_derived(() => mode() === MODES.SESSION && isFinished() && (selected() === DROPDOWN_INTERACTION.PLACEHOLDER || selected() === ""));
17114
17176
  const getOptionIcon = (option) => {
17115
17177
  const isCorrectAnswer = correctAnswers().includes(option);
17116
17178
  const isSelected = option === get$1(state$1).selected;
@@ -17170,7 +17232,7 @@ function DropdownContainer($$anchor, $$props) {
17170
17232
  set(isKeyboardNavigation, false);
17171
17233
  set(isFirstNavigation, true);
17172
17234
  await tick();
17173
- if (selected() && selected() !== "Select Answer" && selected() !== "") {
17235
+ if (selected() && selected() !== DROPDOWN_INTERACTION.PLACEHOLDER && selected() !== "") {
17174
17236
  const currentIndex = get$1(initializedOptions).indexOf(selected());
17175
17237
  get$1(state$1).activeIndex = currentIndex >= 0 ? currentIndex : null;
17176
17238
  } else {
@@ -17290,7 +17352,7 @@ function DropdownContainer($$anchor, $$props) {
17290
17352
  }
17291
17353
  resizeTimeout = null;
17292
17354
  },
17293
- 150
17355
+ DROPDOWN_INTERACTION.RESIZE_DEBOUNCE_DELAY
17294
17356
  );
17295
17357
  };
17296
17358
  onMount(() => {
@@ -17327,24 +17389,35 @@ function DropdownContainer($$anchor, $$props) {
17327
17389
  return classes.join(" ");
17328
17390
  });
17329
17391
  const ariaLabel = /* @__PURE__ */ user_derived(() => {
17392
+ const cleanSelected = useRemoveRichTextHtmlTags(get$1(state$1).selected);
17330
17393
  if (mode() === MODES.PREVIEW) {
17331
- return `Correct answer, Item number ${dropdownNumber()}`;
17394
+ const parts2 = ["Correct answer"];
17395
+ if (showNumbering()) parts2.push(`Item number ${dropdownNumber()}`);
17396
+ parts2.push(cleanSelected);
17397
+ return parts2.filter(Boolean).join(", ");
17332
17398
  }
17333
17399
  if (mode() === MODES.SESSION && isFinished()) {
17334
17400
  const correctness = isCorrect() ? "Correct" : "Incorrect";
17335
- return `Student's answer (${correctness}), Item number ${dropdownNumber()}, ${get$1(state$1).selected}`;
17401
+ const parts2 = [`Student's answer (${correctness})`];
17402
+ if (showNumbering()) parts2.push(`Item number ${dropdownNumber()}`);
17403
+ parts2.push(cleanSelected);
17404
+ return parts2.filter(Boolean).join(", ");
17336
17405
  }
17337
- return `Item number ${dropdownNumber()}, ${get$1(state$1).selected}`;
17406
+ const parts = [];
17407
+ if (showNumbering()) parts.push(`Item number ${dropdownNumber()}`);
17408
+ parts.push(cleanSelected);
17409
+ return parts.filter(Boolean).join(", ");
17338
17410
  });
17339
17411
  const getOptionAriaLabel = (option, index2) => {
17340
17412
  const optionNum = index2 + 1;
17341
17413
  const isSelected = option === get$1(state$1).selected;
17414
+ const cleanOption = useRemoveRichTextHtmlTags(option);
17342
17415
  if (showFeedback()) {
17343
17416
  const isCorrectAnswer = correctAnswers().includes(option);
17344
17417
  const correctness = isCorrectAnswer ? "correct" : "incorrect";
17345
- return isSelected ? `Selected option ${option} ${correctness}` : `Option ${optionNum} ${option} ${correctness}`;
17418
+ return isSelected ? `Selected option ${cleanOption} ${correctness}` : `Option ${optionNum} ${cleanOption} ${correctness}`;
17346
17419
  }
17347
- return isSelected ? `Selected option ${option}` : `Option ${optionNum} ${option}`;
17420
+ return isSelected ? `Selected option ${cleanOption}` : `Option ${optionNum} ${cleanOption}`;
17348
17421
  };
17349
17422
  const isCurrentOption = (index2) => {
17350
17423
  return get$1(state$1).isOpen && get$1(isKeyboardNavigation) && get$1(state$1).activeIndex === index2;
@@ -17430,6 +17503,13 @@ function DropdownContainer($$anchor, $$props) {
17430
17503
  showFeedback($$value);
17431
17504
  flushSync();
17432
17505
  },
17506
+ get showNumbering() {
17507
+ return showNumbering();
17508
+ },
17509
+ set showNumbering($$value = true) {
17510
+ showNumbering($$value);
17511
+ flushSync();
17512
+ },
17433
17513
  get onselect() {
17434
17514
  return onselect();
17435
17515
  },
@@ -17466,24 +17546,34 @@ function DropdownContainer($$anchor, $$props) {
17466
17546
  get$1(state$1).isOpen ? handleCloseMenu() : handleOpenMenu();
17467
17547
  };
17468
17548
  button.__focusout = handleFocusOut;
17469
- var div_1 = child(button);
17470
- var div_2 = child(div_1);
17471
- var text_1 = child(div_2, true);
17472
- reset(div_2);
17473
- reset(div_1);
17474
- var div_3 = sibling(div_1, 2);
17549
+ var node_1 = child(button);
17550
+ {
17551
+ var consequent_1 = ($$anchor2) => {
17552
+ var div_1 = root_2();
17553
+ var div_2 = child(div_1);
17554
+ var text_1 = child(div_2, true);
17555
+ reset(div_2);
17556
+ reset(div_1);
17557
+ template_effect(() => set_text(text_1, dropdownNumber()));
17558
+ append($$anchor2, div_1);
17559
+ };
17560
+ if_block(node_1, ($$render) => {
17561
+ if (showNumbering()) $$render(consequent_1);
17562
+ });
17563
+ }
17564
+ var div_3 = sibling(node_1, 2);
17475
17565
  var span_2 = child(div_3);
17476
- var node_1 = child(span_2);
17477
- html(node_1, () => get$1(state$1).selected === "" ? "Select Answer" : get$1(state$1).selected);
17566
+ var node_2 = child(span_2);
17567
+ html(node_2, () => get$1(state$1).selected === "" ? DROPDOWN_INTERACTION.PLACEHOLDER : get$1(state$1).selected);
17478
17568
  reset(span_2);
17479
17569
  var div_4 = sibling(span_2, 2);
17480
- var node_2 = child(div_4);
17570
+ var node_3 = child(div_4);
17481
17571
  {
17482
- var consequent_1 = ($$anchor2) => {
17483
- var span_3 = root_2();
17572
+ var consequent_2 = ($$anchor2) => {
17573
+ var span_3 = root_3$1();
17484
17574
  var span_4 = child(span_3);
17485
- var node_3 = child(span_4);
17486
- SvgLoader(node_3, { svgName: "successSolid", className: "correct-icon" });
17575
+ var node_4 = child(span_4);
17576
+ SvgLoader(node_4, { svgName: "successSolid", className: "correct-icon" });
17487
17577
  reset(span_4);
17488
17578
  next$1(2);
17489
17579
  reset(span_3);
@@ -17491,61 +17581,61 @@ function DropdownContainer($$anchor, $$props) {
17491
17581
  };
17492
17582
  var alternate_1 = ($$anchor2) => {
17493
17583
  var fragment = comment();
17494
- var node_4 = first_child(fragment);
17584
+ var node_5 = first_child(fragment);
17495
17585
  {
17496
- var consequent_3 = ($$anchor3) => {
17586
+ var consequent_4 = ($$anchor3) => {
17497
17587
  var fragment_1 = comment();
17498
- var node_5 = first_child(fragment_1);
17588
+ var node_6 = first_child(fragment_1);
17499
17589
  {
17500
- var consequent_2 = ($$anchor4) => {
17501
- var span_5 = root_5$1();
17590
+ var consequent_3 = ($$anchor4) => {
17591
+ var span_5 = root_6();
17502
17592
  var span_6 = child(span_5);
17503
- var node_6 = child(span_6);
17504
- SvgLoader(node_6, { svgName: "successSolid", className: "correct-icon" });
17593
+ var node_7 = child(span_6);
17594
+ SvgLoader(node_7, { svgName: "successSolid", className: "correct-icon" });
17505
17595
  reset(span_6);
17506
17596
  next$1(2);
17507
17597
  reset(span_5);
17508
17598
  append($$anchor4, span_5);
17509
17599
  };
17510
17600
  var alternate = ($$anchor4) => {
17511
- var span_7 = root_6();
17601
+ var span_7 = root_7();
17512
17602
  var span_8 = child(span_7);
17513
- var node_7 = child(span_8);
17514
- SvgLoader(node_7, { svgName: "errorSolid", className: "incorrect-icon" });
17603
+ var node_8 = child(span_8);
17604
+ SvgLoader(node_8, { svgName: "errorSolid", className: "incorrect-icon" });
17515
17605
  reset(span_8);
17516
17606
  next$1(2);
17517
17607
  reset(span_7);
17518
17608
  append($$anchor4, span_7);
17519
17609
  };
17520
- if_block(node_5, ($$render) => {
17521
- if (isCorrect()) $$render(consequent_2);
17610
+ if_block(node_6, ($$render) => {
17611
+ if (isCorrect()) $$render(consequent_3);
17522
17612
  else $$render(alternate, false);
17523
17613
  });
17524
17614
  }
17525
17615
  append($$anchor3, fragment_1);
17526
17616
  };
17527
17617
  if_block(
17528
- node_4,
17618
+ node_5,
17529
17619
  ($$render) => {
17530
- if (showFeedback() && !get$1(isMissing)) $$render(consequent_3);
17620
+ if (showFeedback() && !get$1(isMissing)) $$render(consequent_4);
17531
17621
  },
17532
17622
  true
17533
17623
  );
17534
17624
  }
17535
17625
  append($$anchor2, fragment);
17536
17626
  };
17537
- if_block(node_2, ($$render) => {
17538
- if (mode() === MODES.PREVIEW) $$render(consequent_1);
17627
+ if_block(node_3, ($$render) => {
17628
+ if (mode() === MODES.PREVIEW) $$render(consequent_2);
17539
17629
  else $$render(alternate_1, false);
17540
17630
  });
17541
17631
  }
17542
- var node_8 = sibling(node_2, 2);
17632
+ var node_9 = sibling(node_3, 2);
17543
17633
  {
17544
- var consequent_4 = ($$anchor2) => {
17545
- var span_9 = root_7();
17634
+ var consequent_5 = ($$anchor2) => {
17635
+ var span_9 = root_8();
17546
17636
  var span_10 = child(span_9);
17547
- var node_9 = child(span_10);
17548
- SvgLoader(node_9, {
17637
+ var node_10 = child(span_10);
17638
+ SvgLoader(node_10, {
17549
17639
  svgName: "smallChevronUp",
17550
17640
  className: "collapse-icon",
17551
17641
  width: 12,
@@ -17557,10 +17647,10 @@ function DropdownContainer($$anchor, $$props) {
17557
17647
  append($$anchor2, span_9);
17558
17648
  };
17559
17649
  var alternate_2 = ($$anchor2) => {
17560
- var span_11 = root_8();
17650
+ var span_11 = root_9();
17561
17651
  var span_12 = child(span_11);
17562
- var node_10 = child(span_12);
17563
- SvgLoader(node_10, {
17652
+ var node_11 = child(span_12);
17653
+ SvgLoader(node_11, {
17564
17654
  svgName: "smallChevronDown",
17565
17655
  className: "expand-icon",
17566
17656
  width: 12,
@@ -17571,8 +17661,8 @@ function DropdownContainer($$anchor, $$props) {
17571
17661
  reset(span_11);
17572
17662
  append($$anchor2, span_11);
17573
17663
  };
17574
- if_block(node_8, ($$render) => {
17575
- if (get$1(state$1).isOpen) $$render(consequent_4);
17664
+ if_block(node_9, ($$render) => {
17665
+ if (get$1(state$1).isOpen) $$render(consequent_5);
17576
17666
  else $$render(alternate_2, false);
17577
17667
  });
17578
17668
  }
@@ -17580,16 +17670,16 @@ function DropdownContainer($$anchor, $$props) {
17580
17670
  reset(div_3);
17581
17671
  reset(button);
17582
17672
  bind_this(button, ($$value) => set(buttonRef, $$value), () => get$1(buttonRef));
17583
- var node_11 = sibling(button, 2);
17673
+ var node_12 = sibling(button, 2);
17584
17674
  {
17585
- var consequent_8 = ($$anchor2) => {
17586
- var ul = root_9();
17675
+ var consequent_9 = ($$anchor2) => {
17676
+ var ul = root_10();
17587
17677
  each(ul, 21, () => get$1(initializedOptions), index, ($$anchor3, option, index2) => {
17588
17678
  const iconType = /* @__PURE__ */ user_derived(() => getOptionIcon(get$1(option)));
17589
17679
  const showCurrentOption = /* @__PURE__ */ user_derived(() => isCurrentOption(index2));
17590
17680
  const showHoverOption = /* @__PURE__ */ user_derived(() => shouldShowHover(index2));
17591
17681
  const optionAriaLabel = /* @__PURE__ */ user_derived(() => getOptionAriaLabel(get$1(option), index2));
17592
- var li = root_10();
17682
+ var li = root_11();
17593
17683
  li.__mousedown = (e2) => e2.preventDefault();
17594
17684
  li.__click = async (e2) => {
17595
17685
  e2.preventDefault();
@@ -17597,11 +17687,11 @@ function DropdownContainer($$anchor, $$props) {
17597
17687
  await handleSelect(get$1(option));
17598
17688
  };
17599
17689
  var div_5 = child(li);
17600
- var node_12 = child(div_5);
17690
+ var node_13 = child(div_5);
17601
17691
  {
17602
17692
  let $0 = /* @__PURE__ */ user_derived(() => get$1(showHoverOption) && get$1(canInteract) ? "hover-option" : "");
17603
17693
  let $1 = /* @__PURE__ */ user_derived(() => get$1(showCurrentOption) ? "current-option" : "");
17604
- CommonStringToHtml(node_12, {
17694
+ CommonStringToHtml(node_13, {
17605
17695
  get htmlString() {
17606
17696
  return get$1(option);
17607
17697
  },
@@ -17612,41 +17702,41 @@ function DropdownContainer($$anchor, $$props) {
17612
17702
  }
17613
17703
  });
17614
17704
  }
17615
- var node_13 = sibling(node_12, 2);
17705
+ var node_14 = sibling(node_13, 2);
17616
17706
  {
17617
- var consequent_5 = ($$anchor4) => {
17618
- var span_13 = root_11();
17619
- var node_14 = child(span_13);
17620
- SvgLoader(node_14, { svgName: "successSolid", className: "correct-icon" });
17707
+ var consequent_6 = ($$anchor4) => {
17708
+ var span_13 = root_12();
17709
+ var node_15 = child(span_13);
17710
+ SvgLoader(node_15, { svgName: "successSolid", className: "correct-icon" });
17621
17711
  reset(span_13);
17622
17712
  append($$anchor4, span_13);
17623
17713
  };
17624
17714
  var alternate_4 = ($$anchor4) => {
17625
17715
  var fragment_2 = comment();
17626
- var node_15 = first_child(fragment_2);
17716
+ var node_16 = first_child(fragment_2);
17627
17717
  {
17628
- var consequent_6 = ($$anchor5) => {
17629
- var span_14 = root_13();
17630
- var node_16 = child(span_14);
17631
- SvgLoader(node_16, { svgName: "errorSolid", className: "incorrect-icon" });
17718
+ var consequent_7 = ($$anchor5) => {
17719
+ var span_14 = root_14();
17720
+ var node_17 = child(span_14);
17721
+ SvgLoader(node_17, { svgName: "errorSolid", className: "incorrect-icon" });
17632
17722
  reset(span_14);
17633
17723
  append($$anchor5, span_14);
17634
17724
  };
17635
17725
  var alternate_3 = ($$anchor5) => {
17636
17726
  var fragment_3 = comment();
17637
- var node_17 = first_child(fragment_3);
17727
+ var node_18 = first_child(fragment_3);
17638
17728
  {
17639
- var consequent_7 = ($$anchor6) => {
17640
- var span_15 = root_15();
17641
- var node_18 = child(span_15);
17642
- SvgLoader(node_18, { svgName: "successSolid", className: "correct-icon" });
17729
+ var consequent_8 = ($$anchor6) => {
17730
+ var span_15 = root_16();
17731
+ var node_19 = child(span_15);
17732
+ SvgLoader(node_19, { svgName: "successSolid", className: "correct-icon" });
17643
17733
  reset(span_15);
17644
17734
  append($$anchor6, span_15);
17645
17735
  };
17646
17736
  if_block(
17647
- node_17,
17737
+ node_18,
17648
17738
  ($$render) => {
17649
- if (get$1(iconType) === "selected") $$render(consequent_7);
17739
+ if (get$1(iconType) === "selected") $$render(consequent_8);
17650
17740
  },
17651
17741
  true
17652
17742
  );
@@ -17654,9 +17744,9 @@ function DropdownContainer($$anchor, $$props) {
17654
17744
  append($$anchor5, fragment_3);
17655
17745
  };
17656
17746
  if_block(
17657
- node_15,
17747
+ node_16,
17658
17748
  ($$render) => {
17659
- if (get$1(iconType) === "incorrect") $$render(consequent_6);
17749
+ if (get$1(iconType) === "incorrect") $$render(consequent_7);
17660
17750
  else $$render(alternate_3, false);
17661
17751
  },
17662
17752
  true
@@ -17664,8 +17754,8 @@ function DropdownContainer($$anchor, $$props) {
17664
17754
  }
17665
17755
  append($$anchor4, fragment_2);
17666
17756
  };
17667
- if_block(node_13, ($$render) => {
17668
- if (get$1(iconType) === "correct") $$render(consequent_5);
17757
+ if_block(node_14, ($$render) => {
17758
+ if (get$1(iconType) === "correct") $$render(consequent_6);
17669
17759
  else $$render(alternate_4, false);
17670
17760
  });
17671
17761
  }
@@ -17690,8 +17780,8 @@ function DropdownContainer($$anchor, $$props) {
17690
17780
  });
17691
17781
  append($$anchor2, ul);
17692
17782
  };
17693
- if_block(node_11, ($$render) => {
17694
- if (get$1(state$1).isOpen && get$1(initializedOptions).length > 0) $$render(consequent_8);
17783
+ if_block(node_12, ($$render) => {
17784
+ if (get$1(state$1).isOpen && get$1(initializedOptions).length > 0) $$render(consequent_9);
17695
17785
  });
17696
17786
  }
17697
17787
  reset(span);
@@ -17705,8 +17795,7 @@ function DropdownContainer($$anchor, $$props) {
17705
17795
  set_attribute(button, "aria-labelledby", labelId);
17706
17796
  set_attribute(button, "aria-controls", listId);
17707
17797
  set_attribute(button, "aria-activedescendant", get$1(state$1).activeIndex !== null ? `${listId}-option-${get$1(state$1).activeIndex}` : void 0);
17708
- set_text(text_1, dropdownNumber());
17709
- set_class(span_2, 1, `truncate mr-2 text-base ${get$1(state$1).selected === "Select Answer" || get$1(state$1).selected === "" ? "text-gray-860" : "text-charcoal"}`);
17798
+ set_class(span_2, 1, `truncate mr-2 text-base ${get$1(state$1).selected === DROPDOWN_INTERACTION.PLACEHOLDER || get$1(state$1).selected === "" ? "text-gray-860" : "text-charcoal"}`);
17710
17799
  });
17711
17800
  append($$anchor, span);
17712
17801
  return pop($$exports);
@@ -17726,6 +17815,7 @@ create_custom_element(
17726
17815
  isDataSaving: {},
17727
17816
  mode: {},
17728
17817
  showFeedback: {},
17818
+ showNumbering: {},
17729
17819
  onselect: {},
17730
17820
  viewportBuffer: {}
17731
17821
  },
@@ -17745,14 +17835,31 @@ function DropdownInteractionContent($$anchor, $$props) {
17745
17835
  const pTags = config().text.prompt.match(pTagRegex);
17746
17836
  return pTags && pTags.length > 0 ? pTags : [config().text.prompt];
17747
17837
  });
17838
+ const renderedDropdownIds = /* @__PURE__ */ user_derived(() => {
17839
+ const ids = [];
17840
+ get$1(promptLines).forEach((line) => {
17841
+ const parts = dropdownParser.parseText(line);
17842
+ parts.forEach((part) => {
17843
+ if (part.type === "dropdown" && part.id) {
17844
+ ids.push(part.id);
17845
+ }
17846
+ });
17847
+ });
17848
+ return ids;
17849
+ });
17850
+ const shouldShowNumbering = /* @__PURE__ */ user_derived(() => get$1(renderedDropdownIds).length > 1);
17748
17851
  const previewSelections = /* @__PURE__ */ user_derived(() => config().mode === MODES.PREVIEW ? getDropdownPreviewSelections(config()) : []);
17749
17852
  const shuffledOptionsCache = /* @__PURE__ */ new Map();
17750
17853
  const getShuffledOptions = (dropdownId, options) => {
17751
17854
  if (shuffledOptionsCache.has(dropdownId)) {
17752
17855
  return shuffledOptionsCache.get(dropdownId);
17753
17856
  }
17857
+ if (config().mode === MODES.PREVIEW) {
17858
+ shuffledOptionsCache.set(dropdownId, [...options]);
17859
+ return [...options];
17860
+ }
17754
17861
  const selectedValue = getSelectedValue(dropdownId);
17755
- if (config().mode === MODES.PREVIEW || selectedValue !== "Select Answer" && selectedValue !== "") {
17862
+ if (selectedValue !== DROPDOWN_INTERACTION.PLACEHOLDER && selectedValue !== "") {
17756
17863
  shuffledOptionsCache.set(dropdownId, [...options]);
17757
17864
  return [...options];
17758
17865
  }
@@ -17772,11 +17879,11 @@ function DropdownInteractionContent($$anchor, $$props) {
17772
17879
  const getSelectedValue = (dropdownId) => {
17773
17880
  if (config().mode === MODES.PREVIEW) {
17774
17881
  const previewItem = get$1(previewSelections).find((item) => item.id === dropdownId);
17775
- return previewItem?.choice || config().correctAnswer[dropdownId]?.[0] || "Select Answer";
17882
+ return previewItem?.choice || config().correctAnswer[dropdownId]?.[0] || DROPDOWN_INTERACTION.PLACEHOLDER;
17776
17883
  }
17777
17884
  const selection = state2().data.selected.find((item) => item.id === dropdownId);
17778
17885
  const value = selection?.choice || "";
17779
- return value === "" ? "Select Answer" : value;
17886
+ return value === "" ? DROPDOWN_INTERACTION.PLACEHOLDER : value;
17780
17887
  };
17781
17888
  const getCorrectAnswers = (dropdownId) => {
17782
17889
  return config().correctAnswer[dropdownId] || [];
@@ -17788,7 +17895,7 @@ function DropdownInteractionContent($$anchor, $$props) {
17788
17895
  };
17789
17896
  const isDropdownCorrect = (dropdownId) => {
17790
17897
  const selectedValue = getSelectedValue(dropdownId);
17791
- if (selectedValue === "Select Answer" || selectedValue === "") return false;
17898
+ if (selectedValue === DROPDOWN_INTERACTION.PLACEHOLDER || selectedValue === "") return false;
17792
17899
  const correctAnswers = getCorrectAnswers(dropdownId);
17793
17900
  return correctAnswers.length > 0 && correctAnswers.includes(selectedValue);
17794
17901
  };
@@ -17881,6 +17988,9 @@ function DropdownInteractionContent($$anchor, $$props) {
17881
17988
  get showFeedback() {
17882
17989
  return showFeedback();
17883
17990
  },
17991
+ get showNumbering() {
17992
+ return get$1(shouldShowNumbering);
17993
+ },
17884
17994
  onselect: (value) => handleSelect(get$1(part).id, value)
17885
17995
  });
17886
17996
  }
@@ -18026,11 +18136,26 @@ function DropdownComponent($$anchor, $$props) {
18026
18136
  throw new Error("Failed to initialize Dropdown state");
18027
18137
  }
18028
18138
  let interactionState = /* @__PURE__ */ state(proxy(initialState));
18029
- let feedbackState = /* @__PURE__ */ user_derived(() => calculateDropdownFeedback(get$1(interactionState), config(), api().validate || (() => ({ isValid: false }))));
18139
+ const dropdownParser = useDropdown(config().text.prompt, config().options);
18140
+ const pTagRegex = /<p[^>]*>.*?<\/p>/gi;
18141
+ const renderedDropdownIds = /* @__PURE__ */ user_derived(() => {
18142
+ const pTags = config().text.prompt.match(pTagRegex);
18143
+ const promptLines = pTags && pTags.length > 0 ? pTags : [config().text.prompt];
18144
+ const ids = [];
18145
+ promptLines.forEach((line) => {
18146
+ const parts = dropdownParser.parseText(line);
18147
+ parts.forEach((part) => {
18148
+ if (part.type === "dropdown" && part.id) {
18149
+ ids.push(part.id);
18150
+ }
18151
+ });
18152
+ });
18153
+ return ids;
18154
+ });
18155
+ let feedbackState = /* @__PURE__ */ user_derived(() => calculateDropdownFeedback(get$1(interactionState), config(), api().validate || (() => ({ isValid: false })), get$1(renderedDropdownIds)));
18030
18156
  let isInteractiveMode2 = /* @__PURE__ */ user_derived(() => config().mode === MODES.INTERACTIVE);
18031
18157
  let isSessionNotFinished = /* @__PURE__ */ user_derived(() => config().mode === MODES.SESSION && !config().isFinished);
18032
18158
  let saveTimer = null;
18033
- const SAVE_DELAY = 500;
18034
18159
  const handleSelection = async (event2) => {
18035
18160
  try {
18036
18161
  const { id, value } = event2.detail;
@@ -18042,6 +18167,9 @@ function DropdownComponent($$anchor, $$props) {
18042
18167
  return;
18043
18168
  }
18044
18169
  set(interactionState, result.newState, true);
18170
+ if (get$1(isInteractiveMode2)) {
18171
+ handleInteractiveModeInteraction();
18172
+ }
18045
18173
  api().onStateChange?.(get$1(interactionState));
18046
18174
  onstateChange()?.(new CustomEvent("stateChange", {
18047
18175
  detail: {
@@ -18049,13 +18177,14 @@ function DropdownComponent($$anchor, $$props) {
18049
18177
  serialized: api().serialize?.(get$1(interactionState))
18050
18178
  }
18051
18179
  }));
18052
- if (get$1(isInteractiveMode2)) {
18053
- handleInteractiveModeInteraction();
18054
- }
18055
18180
  if (get$1(isSessionNotFinished)) {
18056
18181
  if (saveTimer) {
18057
18182
  clearTimeout(saveTimer);
18058
18183
  }
18184
+ const hasValidSelection = get$1(interactionState).data.selected.some((item) => item.choice !== "" && item.choice !== DROPDOWN_INTERACTION.PLACEHOLDER);
18185
+ if (!hasValidSelection) {
18186
+ return;
18187
+ }
18059
18188
  saveTimer = setTimeout(
18060
18189
  async () => {
18061
18190
  try {
@@ -18068,18 +18197,25 @@ function DropdownComponent($$anchor, $$props) {
18068
18197
  saveTimer = null;
18069
18198
  }
18070
18199
  },
18071
- SAVE_DELAY
18200
+ DROPDOWN_INTERACTION.SAVE_DEBOUNCE_DELAY
18072
18201
  );
18073
18202
  }
18074
18203
  } catch (error) {
18075
18204
  }
18076
18205
  };
18077
18206
  const handleInteractiveModeInteraction = () => {
18078
- set(interactionState, interactionUtils.updateState(get$1(interactionState), { interactiveHasAnswered: true }), true);
18079
- const allAnswered = get$1(interactionState).data.selected.every((item) => item.choice !== "" && item.choice !== "Select Answer");
18080
- if (allAnswered) {
18081
- set(interactionState, interactionUtils.updateState(get$1(interactionState), { showFeedback: true }), true);
18082
- }
18207
+ const allRenderedAnswered = get$1(renderedDropdownIds).every((id) => {
18208
+ const selection = get$1(interactionState).data.selected.find((item) => item.id === id);
18209
+ return selection && selection.choice !== "" && selection.choice !== DROPDOWN_INTERACTION.PLACEHOLDER;
18210
+ });
18211
+ set(
18212
+ interactionState,
18213
+ interactionUtils.updateState(get$1(interactionState), {
18214
+ interactiveHasAnswered: allRenderedAnswered,
18215
+ showFeedback: allRenderedAnswered
18216
+ }),
18217
+ true
18218
+ );
18083
18219
  };
18084
18220
  onMount(() => {
18085
18221
  return () => {
@@ -18453,7 +18589,7 @@ registerInteraction("dropdown", createDropdownInteraction, DropdownComponent);
18453
18589
  var root_1 = /* @__PURE__ */ from_html(`<link rel="preconnect" href="https://fonts.googleapis.com" class="svelte-1dpid58"/> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin="anonymous" class="svelte-1dpid58"/> <link href="https://fonts.googleapis.com/css2?family=Mulish:ital,wght@0,200..1000;1,200..1000&amp;display=swap" rel="stylesheet" class="svelte-1dpid58"/>`, 1);
18454
18590
  const $$css = {
18455
18591
  hash: "svelte-1dpid58",
18456
- code: ' *, :after, :before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style:} ::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style:} *, :after, :before{border:0 solid #e5e7eb;box-sizing:border-box} :after, :before{--tw-content:""} :host, html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:Mulish,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-tap-highlight-color:transparent} body{line-height:inherit;margin:0} hr{border-top-width:1px;color:inherit;height:0} 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;text-decoration:inherit} b, strong{font-weight:bolder} code, kbd, pre, samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal} small{font-size:80%} sub, sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline} sub{bottom:-.25em} sup{top:-.5em} table{border-collapse:collapse;border-color:inherit;text-indent:0} button, input, optgroup, select, textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0} button, select{text-transform:none} button, input:where([type=button]), input:where([type=reset]), input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none} :-moz-focusring{outline:auto} :-moz-ui-invalid{box-shadow:none} progress{vertical-align:baseline} ::-webkit-inner-spin-button, ::-webkit-outer-spin-button{height:auto} [type=search]{-webkit-appearance:textfield;outline-offset:-2px} ::-webkit-search-decoration{-webkit-appearance:none} ::-webkit-file-upload-button{-webkit-appearance:button;font:inherit} summary{display:list-item} blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre{margin:0} fieldset{margin:0} fieldset, legend{padding:0} menu, ol, ul{list-style:none;margin:0;padding:0} dialog{padding:0} textarea{resize:vertical} input::-moz-placeholder, textarea::-moz-placeholder{color:#9ca3af;opacity:1} input::placeholder, textarea::placeholder{color:#9ca3af;opacity:1} [role=button], button{cursor:pointer} :disabled{cursor:default} audio, canvas, embed, iframe, img, object, svg, video{display:block;vertical-align:middle} img, video{height:auto;max-width:100%} [hidden]:where(:not([hidden=until-found])){display:none} *{font-family:Mulish,sans-serif} input::-moz-selection, textarea::-moz-selection{background-color:hsla(0,0%,85%,.4)} input::selection, textarea::selection{background-color:hsla(0,0%,85%,.4)} .container{width:100%}@media (min-width:732px){ .container{max-width:732px}}@media (min-width:1196px){ .container{max-width:1196px}} .p2{font-size:.875rem;font-weight:600;line-height:1.25rem;line-height:1.5} .blanket-overlay{inset:0;position:absolute} .item-heading{font-size:1.25rem;letter-spacing:-.025em;line-height:1.5rem;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} .focus-ring:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:4px;transition-duration:50ms} .hover-focus-ring:hover, .raw-focus-ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;transition-duration:50ms} .focus-ring-by-dropdown, .hover-focus-ring:hover, .raw-focus-ring{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);outline:2px solid transparent;outline-offset:2px} .focus-ring-by-dropdown{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);border-width:2px;box-shadow:0 0 0 2px #fff,0 0 0 4px #212529,0 0 0 6px #fde047;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))} .divider{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(218,224,224,var(--tw-border-opacity,1))}@keyframes svelte-1dpid58-pulse{50%{opacity:.5}} .animate-skeleton{animation:svelte-1dpid58-pulse 2s cubic-bezier(.4,0,.6,1) infinite;--tw-bg-opacity:1;background-color:rgb(226,232,240,var(--tw-bg-opacity,1))} .btn-mcq-option:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;--tw-ring-offset-color:#212529;outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .btn-mcq-option{font-size:1rem;line-height:1.5rem;line-height:19.2px;margin-bottom:1rem;min-height:52px;width:100%;--tw-text-opacity:1;border-radius:.5rem;border-width:1px;box-sizing:border-box;color:rgb(33,37,41,var(--tw-text-opacity,1));--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248,248,248,var(--tw-bg-opacity,1))} .btn-mcq-option:active{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(238,240,255,var(--tw-bg-opacity,1))}} .btn-mcq-text{align-items:center;display:flex;padding:.375rem .75rem;width:100%}@supports (overflow-wrap:anywhere){ .btn-mcq-text{overflow-wrap:anywhere}}@supports not (overflow-wrap:anywhere){ .btn-mcq-text{word-break:break-word}} .btn-mcq-option>span>span>span>.choice{align-items:center;border-radius:1rem;border-width:1px;display:flex;font-size:1rem;font-weight:700;height:2rem;justify-content:center;letter-spacing:.05em;line-height:1rem;width:2rem;--tw-border-opacity:1;border-color:rgb(156,163,175,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1));padding:.5rem;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .btn-mcq-option.selected{border-width:2px;--tw-border-opacity:1;background-color:rgb(40,44,135,var(--tw-bg-opacity,1));border-color:rgb(40,44,135,var(--tw-border-opacity,1))} .btn-mcq-option.selected, .btn-mcq-option.selected:active{--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(255,255,255,var(--tw-text-opacity,1))} .btn-mcq-option.selected:active{background-color:rgb(84,101,251,var(--tw-bg-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option.selected:hover{--tw-bg-opacity:1;background-color:rgb(84,101,251,var(--tw-bg-opacity,1))}} .btn-mcq-option.finished{cursor:default} .btn-mcq-option.finished:active, .btn-mcq-option.finished:hover{border-width:1px;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248,248,248,var(--tw-bg-opacity,1))} .btn-mcq-option.selected>span>span>.choice{--tw-bg-opacity:1;background-color:rgb(238,240,255,var(--tw-bg-opacity,1))} .btn-mcq-option>span>span>span>.custom-checkbox{align-items:center;border-radius:.25rem;border-width:1px;display:flex;height:1.75rem;justify-content:center;pointer-events:none;width:1.75rem;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option:hover>span>span>span>.custom-checkbox{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))} .btn-mcq-option:active>span>span>span>.custom-checkbox.preview-only, .btn-mcq-option:hover>span>span>span>.custom-checkbox.preview-only{border-width:1px;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1))}} .btn-mcq-option:active>span>span>span>.custom-checkbox{border-width:2px;--tw-border-opacity:1;border-color:rgb(40,44,135,var(--tw-border-opacity,1))} .btn-mcq-option.selected>span>span>span>.custom-checkbox{border-width:0;pointer-events:none;--tw-bg-opacity:1;background-color:rgb(84,101,251,var(--tw-bg-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option.selected:hover>span>span>span>.custom-checkbox{border-width:0;--tw-bg-opacity:1;background-color:rgb(76,91,226,var(--tw-bg-opacity,1))}} .btn-mcq-option.selected:active>span>span>span>.custom-checkbox{border-width:0;--tw-bg-opacity:1;background-color:rgb(40,44,135,var(--tw-bg-opacity,1))} .btn-mcq-option.finished:active>span>span>span>.custom-checkbox, .btn-mcq-option.finished:hover>span>span>span>.custom-checkbox{border-width:1px;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))} .btn-mcq-option.missing.\\!correct, .btn-mcq-option.missing.correct{border-width:1px;--tw-border-opacity:1;border-color:rgb(21,128,61,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248,248,248,var(--tw-bg-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option.\\!correct.interactive:active, .btn-mcq-option.\\!correct.interactive:hover, .btn-mcq-option.correct.interactive:active, .btn-mcq-option.correct.interactive:hover, .btn-mcq-option.incorrect.interactive:active, .btn-mcq-option.incorrect.interactive:hover, .btn-mcq-option.missing.interactive:active, .btn-mcq-option.missing.interactive:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(238,240,255,var(--tw-bg-opacity,1))}} .btn-mcq-option.selected.\\!correct, .btn-mcq-option.selected.correct{background-color:rgb(240,253,244,var(--tw-bg-opacity,1));border-color:rgb(21,128,61,var(--tw-border-opacity,1));border-width:1px} .btn-mcq-option.selected.\\!correct, .btn-mcq-option.selected.correct, .btn-mcq-option.selected.incorrect{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .btn-mcq-option.selected.incorrect{background-color:rgb(253,242,248,var(--tw-bg-opacity,1));border-color:rgb(190,24,93,var(--tw-border-opacity,1));border-width:1px} .btn-mcq-option.selected.\\!correct>span>span>span>.choice, .btn-mcq-option.selected.correct>span>span>span>.choice, .btn-mcq-option.selected.incorrect>span>span>span>.choice{border-width:1px;--tw-border-opacity:1;border-color:rgb(113,115,119,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))} .btn-pressed{border-width:2px;--tw-border-opacity:1;border-color:rgb(51,69,223,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1));--tw-shadow:inset 0 0 0 100vmax rgba(0,0,0,.05);--tw-shadow-colored:inset 0 0 0 100vmax var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .btn-base:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;--tw-ring-offset-color:#212529;outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .btn-base{align-items:center;display:inline-flex;justify-content:center}@media (hover:hover) and (pointer:fine){ .btn-base:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1))}} .btn-base:active{border-width:2px;--tw-border-opacity:1;border-color:rgb(51,69,223,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1));--tw-shadow:inset 0 0 0 100vmax rgba(0,0,0,.05);--tw-shadow-colored:inset 0 0 0 100vmax var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .btn-touch-container{align-items:center;display:flex;height:2.75rem;justify-content:center;width:2.75rem} .btn-touch-container:focus{outline:2px solid transparent;outline-offset:2px} .btn-icon-sm{align-items:center;background-color:hsla(0,0%,100%,.8);border-radius:.25rem;display:flex;height:1.5rem;justify-content:center;width:1.5rem}@media (hover:hover) and (pointer:fine){ .btn-touch-container:hover>.btn-icon-sm{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1))}} .btn-touch-container:active>.btn-icon-sm{border-width:2px;--tw-border-opacity:1;border-color:rgb(51,69,223,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1));--tw-shadow:inset 0 0 0 100vmax rgba(0,0,0,.05);--tw-shadow-colored:inset 0 0 0 100vmax var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .btn-touch-container:focus-visible>.btn-icon-sm{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;--tw-ring-offset-color:#212529;outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .typein-textbox:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:4px;transition-duration:50ms} .typein-textbox{border-radius:.5rem;border-width:1px;width:100%;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1));font-size:1rem;line-height:1.5rem;padding:.75rem 1rem;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .typein-textbox::-moz-placeholder{--tw-placeholder-opacity:1;color:rgb(55,65,81,var(--tw-placeholder-opacity,1))} .typein-textbox::placeholder{--tw-placeholder-opacity:1;color:rgb(55,65,81,var(--tw-placeholder-opacity,1))} .typein-textbox:focus{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))}@media (hover:hover) and (pointer:fine){ .typein-textbox:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))}} .typein-textbox:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)!important;--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color)!important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent)!important}@media (hover:hover) and (pointer:fine){ .typein-textbox:hover{transition-duration:50ms}} .typein-textbox:focus{outline-color:#212529;outline-width:2px}@media (hover:hover) and (pointer:fine){ .typein-textbox:hover{outline-color:#212529;outline-width:2px}} .typein-textbox:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1))} .inline-typein-container>p{font-size:1.25rem;font-weight:600;line-height:3rem;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} #dnd-action-dragged-el{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;cursor:grabbing!important;transition-duration:50ms;--tw-border-opacity:1!important;border-color:rgb(93,99,107,var(--tw-border-opacity,1))!important;--tw-bg-opacity:1!important;background-color:rgb(205,208,254,var(--tw-bg-opacity,1))!important} #dnd-action-dragged-el .btn-vertical-icon{cursor:grabbing!important;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} #dnd-action-dragged-el .preview-icon{display:none!important} #dnd-action-dragged-el .preview-vertical{display:block!important} .image-description, .text-stimulus{padding-bottom:1rem;padding-top:1rem} .text-stimulus p{font-size:1.25rem;line-height:1.75rem;padding-bottom:.5rem;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} .image-description p{font-size:.875rem;line-height:1.25rem;padding-bottom:.5rem;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .text-stimulus ol, .text-stimulus ul{font-size:1rem;line-height:1.5rem;list-style-position:inside;padding-bottom:.5rem;padding-left:.5rem} .text-stimulus ol ::marker, .text-stimulus ul ::marker{color:#282c87} .text-stimulus ol::marker, .text-stimulus ul::marker{color:#282c87} .image-description ol, .image-description ul{font-size:.875rem;line-height:1.25rem;list-style-position:inside;padding-bottom:.5rem;padding-left:.5rem} .image-description ol ::marker, .image-description ul ::marker{color:#212529} .image-description ol::marker, .image-description ul::marker{color:#212529} .image-description ul, .text-stimulus ul{list-style-type:disc} .image-description ol, .text-stimulus ol{list-style-type:decimal} .image-description ul li>p, .text-stimulus ul li>p{margin-left:-.5rem} .text-stimulus ol>li>p, .text-stimulus ul>li>p{display:inline;font-size:1rem;line-height:1.5rem;padding-bottom:0;padding-top:0} .image-description ol>li>p, .image-description ul>li>p{display:inline;font-size:.875rem;line-height:1.25rem;padding-bottom:0;padding-top:0} .image-description div.table-container:focus, .text-stimulus div.table-container:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:4px;transition-duration:50ms} .image-description div.table-container, .text-stimulus div.table-container{border-radius:.5rem;overflow:auto;padding-left:.125rem;padding-right:.125rem} .image-description table, .text-stimulus table{margin-bottom:1rem;margin-top:.5rem;width:100%;--tw-border-spacing-x:0.75rem;--tw-border-spacing-y:0.75rem;border-radius:.5rem;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y);overflow-x:auto;--tw-shadow:0 0 0 1px #9ca3af;--tw-shadow-colored:0 0 0 1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .image-description table tr, .text-stimulus table tr{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(156,163,175,var(--tw-border-opacity,1))} .image-description table tr:last-child, .text-stimulus table tr:last-child{border-color:transparent} .image-description table td, .image-description table th, .text-stimulus table td, .text-stimulus table th{border-left-width:1px;min-width:140px;--tw-border-opacity:1;border-color:rgb(156,163,175,var(--tw-border-opacity,1))} .image-description table td:first-child, .image-description table th:first-child, .text-stimulus table td:first-child, .text-stimulus table th:first-child{border-style:none} .text-stimulus table td>p, .text-stimulus table th>p{font-size:1rem;line-height:1.5rem;padding:.75rem;text-align:left;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .image-description table td>p, .image-description table th>p{font-size:.875rem;line-height:1.25rem;padding:.75rem;text-align:left;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .text-stimulus table th>p{font-weight:400} .image-description table th p, .prompt p, .text-stimulus table th p{font-weight:600} .prompt p b, .prompt p b i, .prompt p b i u, .prompt p b u, .prompt p b u i, .prompt p i b, .prompt p i b u, .prompt p i u b, .prompt p u b, .prompt p u b i, .prompt p u i b, .text-stimulus table th p b, .text-stimulus table th p b i, .text-stimulus table th p b i u, .text-stimulus table th p b u, .text-stimulus table th p b u i, .text-stimulus table th p i b, .text-stimulus table th p i b u, .text-stimulus table th p i u b, .text-stimulus table th p u b, .text-stimulus table th p u b i, .text-stimulus table th p u i b{font-weight:900} .dropdown-text:not(:last-child), .dropdown:not(:last-child){margin-right:1rem} .dropdown-container{align-items:center;border-radius:.5rem;border-width:1px;display:flex;height:2.75rem;overflow:hidden;white-space:nowrap;width:15rem;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1))} .dropdown-container:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent)} .dropdown-container:active, .dropdown-container:focus{border-width:2px;box-shadow:0 0 0 2px #fff,0 0 0 4px #212529,0 0 0 6px #fde047;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))}@media (hover:hover) and (pointer:fine){ .dropdown-container:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));outline-color:#212529;outline-width:2px}} .dropdown-menu{border-radius:.5rem;border-width:1px;margin-top:.5rem;max-height:400px;overflow-y:auto;position:absolute;z-index:10;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))}@supports (overflow-wrap:anywhere){ .dropdown-menu{overflow-wrap:anywhere}}@supports not (overflow-wrap:anywhere){ .dropdown-menu{word-break:break-word}} .dropdown-menu{max-width:min(500px,100vw - 2rem);min-width:240px;width:-moz-max-content;width:max-content} .dropdown-item{cursor:pointer;font-size:1rem;line-height:1.5rem;outline:2px solid transparent;outline-offset:2px;padding:.5rem 1rem} .dropdown-itemtext{border-bottom-width:1px;border-color:transparent} .dropdown-itemtext.hover-option{--tw-border-opacity:1;border-color:rgb(0,0,0,var(--tw-border-opacity,1));--tw-text-opacity:1;color:rgb(46,47,212,var(--tw-text-opacity,1))} .dropdown-itemtext.current-option{--tw-bg-opacity:1;background-color:rgb(251,217,27,var(--tw-bg-opacity,1));--tw-text-opacity:1;border-bottom-width:1px;color:rgb(0,0,0,var(--tw-text-opacity,1));outline:2px solid transparent;outline-offset:2px;--tw-border-opacity:1;border-color:rgb(0,0,0,var(--tw-border-opacity,1))} .dropdown-itemtext:active{border-bottom-width:2px} .image-description-accordion{border-bottom-width:1px;border-color:transparent;font-weight:600;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .group:focus .image-description-accordion{--tw-bg-opacity:1;background-color:rgb(251,217,27,var(--tw-bg-opacity,1));--tw-text-opacity:1;border-bottom-width:1px;color:rgb(0,0,0,var(--tw-text-opacity,1));outline:2px solid transparent;outline-offset:2px} .group:focus .image-description-accordion, .group:hover .image-description-accordion{--tw-border-opacity:1;border-color:rgb(0,0,0,var(--tw-border-opacity,1))} .group:active .image-description-accordion{border-bottom-width:2px} .sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap} .pointer-events-none{pointer-events:none} .pointer-events-auto{pointer-events:auto} .visible{visibility:visible} .invisible{visibility:hidden} .collapse{visibility:collapse} .static{position:static} .fixed{position:fixed} .absolute{position:absolute} .relative{position:relative} .inset-0{inset:0} .inset-y-0{bottom:0;top:0} .-top-2\\.5{top:-.625rem} .bottom-0{bottom:0} .bottom-1\\.5{bottom:.375rem} .bottom-4{bottom:1rem} .bottom-5{bottom:1.25rem} .bottom-\\[7px\\]{bottom:7px} .bottom-full{bottom:100%} .left-0{left:0} .left-1\\/2{left:50%} .left-4{left:1rem} .left-6{left:1.5rem} .left-\\[-9999px\\]{left:-9999px} .left-full{left:100%} .right-0{right:0} .right-1{right:.25rem} .right-1\\.5{right:.375rem} .right-4{right:1rem} .right-6{right:1.5rem} .right-full{right:100%} .top-0{top:0} .top-1{top:.25rem} .top-1\\.5{top:.375rem} .top-1\\/2{top:50%} .top-12{top:3rem} .top-3\\.5{top:.875rem} .top-\\[13px\\]{top:13px} .top-\\[calc\\(50\\%\\+0\\.375rem\\)\\]{top:calc(50% + .375rem)} .top-full{top:100%} .z-0{z-index:0} .z-10{z-index:10} .z-50{z-index:50} .m-0{margin:0} .m-auto{margin:auto} .mx-0\\.5{margin-left:.125rem;margin-right:.125rem} .mx-auto{margin-left:auto;margin-right:auto} .my-1\\.5{margin-bottom:.375rem;margin-top:.375rem} .my-2{margin-bottom:.5rem;margin-top:.5rem} .my-6{margin-bottom:1.5rem;margin-top:1.5rem} .-mb-1{margin-bottom:-.25rem} .-ml-1{margin-left:-.25rem} .-mr-1{margin-right:-.25rem} .-mr-2\\.5{margin-right:-.625rem} .-mt-0\\.5{margin-top:-.125rem} .-mt-1{margin-top:-.25rem} .mb-0\\.5{margin-bottom:.125rem} .mb-10{margin-bottom:2.5rem} .mb-12{margin-bottom:3rem} .mb-2{margin-bottom:.5rem} .mb-3{margin-bottom:.75rem} .mb-4{margin-bottom:1rem} .mb-5{margin-bottom:1.25rem} .mb-6{margin-bottom:1.5rem} .mb-\\[9\\.5px\\]{margin-bottom:9.5px} .ml-1{margin-left:.25rem} .ml-2{margin-left:.5rem} .ml-2\\.5{margin-left:.625rem} .ml-3{margin-left:.75rem} .ml-8\\.5{margin-left:2.125rem} .ml-\\[3px\\]{margin-left:3px} .ml-\\[9\\.5px\\]{margin-left:9.5px} .mr-1{margin-right:.25rem} .mr-2{margin-right:.5rem} .mr-4{margin-right:1rem} .mr-\\[9\\.5px\\]{margin-right:9.5px} .mt-0\\.5{margin-top:.125rem} .mt-1{margin-top:.25rem} .mt-2{margin-top:.5rem} .mt-4{margin-top:1rem} .mt-6{margin-top:1.5rem} .mt-7\\.5{margin-top:1.875} .mt-9{margin-top:2.25rem} .mt-\\[9\\.5px\\]{margin-top:9.5px} .line-clamp-1{-webkit-line-clamp:1} .line-clamp-1, .line-clamp-3{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical} .line-clamp-3{-webkit-line-clamp:3} .block{display:block} .inline-block{display:inline-block} .inline{display:inline} .flex{display:flex} .table{display:table} .grid{display:grid} .contents{display:contents} .hidden{display:none} .h-10\\.5{height:2.625rem} .h-11{height:2.75rem} .h-2{height:.5rem} .h-4{height:1rem} .h-52{height:13rem} .h-6{height:1.5rem} .h-8\\.5{height:2.125rem} .h-\\[13\\.33px\\]{height:13.33px} .h-\\[8\\.77px\\]{height:8.77px} .h-auto{height:auto} .h-fit{height:-moz-fit-content;height:fit-content} .h-full{height:100%} .h-screen{height:100vh} .max-h-\\[184px\\]{max-height:184px} .max-h-\\[470px\\]{max-height:470px} .max-h-\\[660px\\]{max-height:660px} .max-h-\\[calc\\(100vh-168px\\)\\]{max-height:calc(100vh - 168px)} .max-h-\\[calc\\(100vh-168px-34px\\)\\]{max-height:calc(100vh - 202px)} .max-h-none{max-height:none} .min-h-\\[133px\\]{min-height:133px} .min-h-\\[140px\\]{min-height:140px} .min-h-\\[154px\\]{min-height:154px} .min-h-\\[210px\\]{min-height:210px} .min-h-\\[44px\\]{min-height:44px} .min-h-\\[54px\\]{min-height:54px} .min-h-\\[86px\\]{min-height:86px} .w-11{width:2.75rem} .w-2{width:.5rem} .w-2\\/4{width:50%} .w-3{width:.75rem} .w-4{width:1rem} .w-6{width:1.5rem} .w-60{width:15rem} .w-8\\.5{width:2.125rem} .w-\\[13\\.33px\\]{width:13.33px} .w-\\[8\\.77px\\]{width:8.77px} .w-auto{width:auto} .w-fit{width:-moz-fit-content;width:fit-content} .w-full{width:100%} .w-screen{width:100vw} .min-w-0{min-width:0} .min-w-\\[288px\\]{min-width:288px} .min-w-\\[44px\\]{min-width:44px} .min-w-\\[85px\\]{min-width:85px} .max-w-\\[1008px\\]{max-width:1008px} .max-w-\\[300px\\]{max-width:300px} .max-w-\\[304px\\]{max-width:304px} .max-w-\\[400px\\]{max-width:400px} .max-w-full{max-width:100%} .max-w-none{max-width:none} .flex-1{flex:1 1 0%} .flex-none{flex:none} .flex-shrink-0{flex-shrink:0} .grow{flex-grow:1} .basis-0{flex-basis:0px} .-translate-x-1\\/2{--tw-translate-x:-50%} .-translate-x-1\\/2, .-translate-y-1\\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .-translate-y-1\\/2{--tw-translate-y:-50%} .rotate-45{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .\\!cursor-default{cursor:default!important} .\\!cursor-pointer{cursor:pointer!important} .cursor-default{cursor:default} .cursor-pointer{cursor:pointer} .select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none} .resize-none{resize:none} .resize{resize:both} .grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))} .flex-row{flex-direction:row} .flex-col{flex-direction:column} .flex-col-reverse{flex-direction:column-reverse} .flex-wrap{flex-wrap:wrap} .content-start{align-content:flex-start} .items-center{align-items:center} .justify-start{justify-content:flex-start} .justify-center{justify-content:center} .justify-between{justify-content:space-between} .gap-1{gap:.25rem} .gap-2{gap:.5rem} .space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(.5rem*var(--tw-space-y-reverse));margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)))} .space-y-reverse>:not([hidden])~:not([hidden]){--tw-space-y-reverse:1} .overflow-hidden{overflow:hidden} .overflow-y-auto{overflow-y:auto} .overflow-y-visible{overflow-y:visible} .truncate{overflow:hidden;white-space:nowrap} .text-ellipsis, .truncate{text-overflow:ellipsis} .whitespace-normal{white-space:normal} .whitespace-nowrap{white-space:nowrap} .break-words{overflow-wrap:break-word} .break-all{word-break:break-all} .rounded{border-radius:.25rem} .rounded-\\[32px\\]{border-radius:32px} .rounded-lg{border-radius:.5rem} .rounded-md{border-radius:.375rem} .rounded-b-lg{border-bottom-left-radius:.5rem;border-bottom-right-radius:.5rem} .rounded-b-md{border-bottom-left-radius:.375rem;border-bottom-right-radius:.375rem} .rounded-l-lg{border-bottom-left-radius:.5rem;border-top-left-radius:.5rem} .rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem} .rounded-t-md{border-top-left-radius:.375rem;border-top-right-radius:.375rem} .border{border-width:1px} .border-2{border-width:2px} .border-b{border-bottom-width:1px} .border-l-4{border-left-width:4px} .border-l-6{border-left-width:6px} .border-dashed{border-style:dashed} .\\!border-blue-1000{--tw-border-opacity:1!important;border-color:rgb(40,44,135,var(--tw-border-opacity,1))!important} .border-blue-1000{--tw-border-opacity:1;border-color:rgb(40,44,135,var(--tw-border-opacity,1))} .border-blue-950{--tw-border-opacity:1;border-color:rgb(29,78,216,var(--tw-border-opacity,1))} .border-border-minimal{--tw-border-opacity:1;border-color:rgb(229,231,235,var(--tw-border-opacity,1))} .border-charcoal{--tw-border-opacity:1;border-color:rgb(33,37,41,var(--tw-border-opacity,1))} .border-gray-400{--tw-border-opacity:1;border-color:rgb(196,201,204,var(--tw-border-opacity,1))} .border-gray-800{--tw-border-opacity:1;border-color:rgb(93,99,107,var(--tw-border-opacity,1))} .border-gray-850{--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1))} .border-green-800{--tw-border-opacity:1;border-color:rgb(0,102,5,var(--tw-border-opacity,1))} .border-green-900{--tw-border-opacity:1;border-color:rgb(21,128,61,var(--tw-border-opacity,1))} .border-red-600{--tw-border-opacity:1;border-color:rgb(220,38,38,var(--tw-border-opacity,1))} .border-red-800{--tw-border-opacity:1;border-color:rgb(217,12,85,var(--tw-border-opacity,1))} .border-red-900{--tw-border-opacity:1;border-color:rgb(190,24,93,var(--tw-border-opacity,1))} .border-soft-blue{--tw-border-opacity:1;border-color:rgb(84,101,251,var(--tw-border-opacity,1))} .border-white{--tw-border-opacity:1;border-color:rgb(255,255,255,var(--tw-border-opacity,1))} .\\!bg-violet-100{--tw-bg-opacity:1!important;background-color:rgb(235,235,255,var(--tw-bg-opacity,1))!important} .\\!bg-white{--tw-bg-opacity:1!important;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))!important} .bg-black{--tw-bg-opacity:1;background-color:rgb(0,0,0,var(--tw-bg-opacity,1))} .bg-blue-1000{--tw-bg-opacity:1;background-color:rgb(40,44,135,var(--tw-bg-opacity,1))} .bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239,246,255,var(--tw-bg-opacity,1))} .bg-charcoal\\/30{background-color:rgba(33,37,41,.3)} .bg-charcoal\\/80{background-color:rgba(33,37,41,.8)} .bg-gray-100{--tw-bg-opacity:1;background-color:rgb(247,250,250,var(--tw-bg-opacity,1))} .bg-gray-50{--tw-bg-opacity:1;background-color:rgb(244,244,244,var(--tw-bg-opacity,1))} .bg-gray-900{--tw-bg-opacity:1;background-color:rgb(57,62,69,var(--tw-bg-opacity,1))} .bg-green-300{--tw-bg-opacity:1;background-color:rgb(241,254,241,var(--tw-bg-opacity,1))} .bg-red-200{--tw-bg-opacity:1;background-color:rgb(254,202,202,var(--tw-bg-opacity,1))} .bg-red-300{--tw-bg-opacity:1;background-color:rgb(253,243,247,var(--tw-bg-opacity,1))} .bg-red-50{--tw-bg-opacity:1;background-color:rgb(253,242,248,var(--tw-bg-opacity,1))} .bg-soft-blue{--tw-bg-opacity:1;background-color:rgb(84,101,251,var(--tw-bg-opacity,1))} .bg-transparent{background-color:transparent} .bg-violet-100{--tw-bg-opacity:1;background-color:rgb(235,235,255,var(--tw-bg-opacity,1))} .bg-violet-150{--tw-bg-opacity:1;background-color:rgb(205,208,254,var(--tw-bg-opacity,1))} .bg-white{--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))} .bg-white\\/80{background-color:hsla(0,0%,100%,.8)} .bg-yellow-1000{--tw-bg-opacity:1;background-color:rgb(251,217,27,var(--tw-bg-opacity,1))} .bg-opacity-5{--tw-bg-opacity:0.05} .object-contain{-o-object-fit:contain;object-fit:contain} .p-0\\.5{padding:.125rem} .p-1{padding:.25rem} .p-1\\.5{padding:.375rem} .p-2{padding:.5rem} .p-3{padding:.75rem} .p-4{padding:1rem} .p-5{padding:1.25rem} .p-6{padding:1.5rem} .px-0{padding-left:0;padding-right:0} .px-2{padding-left:.5rem;padding-right:.5rem} .px-3{padding-left:.75rem;padding-right:.75rem} .px-4{padding-left:1rem;padding-right:1rem} .py-1{padding-bottom:.25rem;padding-top:.25rem} .py-1\\.5{padding-bottom:.375rem;padding-top:.375rem} .py-2{padding-bottom:.5rem;padding-top:.5rem} .py-\\[9px\\]{padding-bottom:9px;padding-top:9px} .\\!pr-11{padding-right:2.75rem!important} .pb-0{padding-bottom:0} .pb-10{padding-bottom:2.5rem} .pb-2{padding-bottom:.5rem} .pb-3{padding-bottom:.75rem} .pb-\\[72px\\]{padding-bottom:72px} .pl-13\\.2{padding-left:3.125rem} .pl-24{padding-left:6rem} .pl-3{padding-left:.75rem} .pl-4{padding-left:1rem} .pr-3{padding-right:.75rem} .pr-4{padding-right:1rem} .pt-0{padding-top:0} .pt-0\\.5{padding-top:.125rem} .pt-14{padding-top:3.5rem} .pt-4{padding-top:1rem} .pt-6{padding-top:1.5rem} .pt-\\[15px\\]{padding-top:15px} .pt-\\[55px\\]{padding-top:55px} .text-left{text-align:left} .text-center{text-align:center} .align-middle{vertical-align:middle} .text-base{font-size:1rem;line-height:1.5rem} .text-lg{font-size:1.125rem;line-height:1.75rem} .text-sm{font-size:.875rem;line-height:1.25rem} .text-xl{font-size:1.25rem;line-height:1.75rem} .font-bold{font-weight:700} .font-normal{font-weight:400} .font-semibold{font-weight:600} .leading-12{line-height:3rem} .leading-4{line-height:1rem} .leading-5{line-height:1.25rem} .leading-6{line-height:1.5rem} .leading-\\[1\\.5\\]{line-height:1.5} .leading-\\[150\\%\\]{line-height:150%} .leading-\\[19\\.2px\\]{line-height:19.2px} .leading-\\[19px\\]{line-height:19px} .leading-\\[22px\\]{line-height:22px} .\\!text-gray-900{--tw-text-opacity:1!important;color:rgb(57,62,69,var(--tw-text-opacity,1))!important} .text-blue-1000{--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} .text-blue-850{--tw-text-opacity:1;color:rgb(46,47,212,var(--tw-text-opacity,1))} .text-charcoal{--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .text-gray-500{--tw-text-opacity:1;color:rgb(107,114,128,var(--tw-text-opacity,1))} .text-gray-800{--tw-text-opacity:1;color:rgb(93,99,107,var(--tw-text-opacity,1))} .text-gray-860{--tw-text-opacity:1;color:rgb(55,65,81,var(--tw-text-opacity,1))} .text-green-800{--tw-text-opacity:1;color:rgb(0,102,5,var(--tw-text-opacity,1))} .text-green-900{--tw-text-opacity:1;color:rgb(21,128,61,var(--tw-text-opacity,1))} .text-inherit{color:inherit} .text-primary-emphasis{--tw-text-opacity:1;color:rgb(8,38,99,var(--tw-text-opacity,1))} .text-red-800{--tw-text-opacity:1;color:rgb(217,12,85,var(--tw-text-opacity,1))} .text-red-900{--tw-text-opacity:1;color:rgb(190,24,93,var(--tw-text-opacity,1))} .text-white{--tw-text-opacity:1;color:rgb(255,255,255,var(--tw-text-opacity,1))} .underline{text-decoration-line:underline} .opacity-0{opacity:0} .opacity-5{opacity:.05} .opacity-50{opacity:.5} .shadow-\\[0_-12px_14px_-16px_\\#00000033\\]{--tw-shadow:0 -12px 14px -16px #00000033;--tw-shadow-colored:0 -12px 14px -16px var(--tw-shadow-color)} .shadow-\\[0_-12px_14px_-16px_\\#00000033\\], .shadow-md{box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .shadow-md{--tw-shadow:0px 2px 8px rgba(0,0,0,.2);--tw-shadow-colored:0px 2px 8px var(--tw-shadow-color)} .\\!outline-none{outline:2px solid transparent!important;outline-offset:2px!important} .outline-none{outline:2px solid transparent;outline-offset:2px} .blur{--tw-blur:blur(8px)} .blur, .filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)} .backdrop-blur-md{--tw-backdrop-blur:blur(12px);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)} .transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)} .duration-300{transition-duration:.3s} :host, html{-webkit-tap-highlight-color:inherit!important} .active\\:raw-focus-ring-by:active{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;--tw-ring-offset-color:#212529} .active\\:raw-focus-ring-by:active, .active\\:raw-focus-ring:active{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .active\\:raw-focus-ring:active{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px}@media (min-width:732px){ .md\\:item-heading{font-size:1.25rem;letter-spacing:-.025em;line-height:1.5rem;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))}}@media (hover:hover) and (pointer:fine){ .td\\:hover-focus-ring:hover{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;transition-duration:50ms}} .last\\:mr-0:last-child{margin-right:0} .focus-within\\:left-0:focus-within{left:0} .focus-within\\:right-0:focus-within{right:0} .focus-within\\:top-0:focus-within{top:0} .focus-within\\:z-30:focus-within{z-index:30} .hover\\:bg-black-50:hover{background-color:rgba(0,0,0,.051)} .hover\\:bg-blue-100:hover{--tw-bg-opacity:1;background-color:rgb(222,222,255,var(--tw-bg-opacity,1))} .hover\\:bg-violet-100:hover{--tw-bg-opacity:1;background-color:rgb(235,235,255,var(--tw-bg-opacity,1))} .hover\\:bg-yellow-1000:hover{--tw-bg-opacity:1;background-color:rgb(251,217,27,var(--tw-bg-opacity,1))} .hover\\:text-charcoal:hover{--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .hover\\:underline:hover{text-decoration-line:underline} .hover\\:decoration-2:hover{text-decoration-thickness:2px} .hover\\:underline-offset-\\[25\\%\\]:hover{text-underline-offset:25%} .focus-visible\\:border-charcoal:focus-visible{--tw-border-opacity:1;border-color:rgb(33,37,41,var(--tw-border-opacity,1))} .focus-visible\\:bg-yellow-900:focus-visible{--tw-bg-opacity:1;background-color:rgb(253,224,71,var(--tw-bg-opacity,1))} .focus-visible\\:text-charcoal:focus-visible{--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .focus-visible\\:underline:focus-visible{text-decoration-line:underline} .focus-visible\\:decoration-2:focus-visible{text-decoration-thickness:2px} .focus-visible\\:underline-offset-\\[25\\%\\]:focus-visible{text-underline-offset:25%} .focus-visible\\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px} .focus-visible\\:ring-4:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent)} .focus-visible\\:ring-soft-blue:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1))} .focus-visible\\:ring-offset-4:focus-visible{--tw-ring-offset-width:4px} .focus-visible\\:duration-50:focus-visible{transition-duration:50ms} .active\\:bg-black-55:active, .active\\:bg-black-60:active{background-color:rgba(0,0,0,.102)} .active\\:bg-yellow-1100:active{--tw-bg-opacity:1;background-color:rgb(238,206,26,var(--tw-bg-opacity,1))} .active\\:text-charcoal:active{--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .disabled\\:text-gray-40:disabled{--tw-text-opacity:1;color:rgb(142,147,153,var(--tw-text-opacity,1))} .disabled\\:hover\\:bg-white:hover:disabled{--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))} .group\\/itemContainer:hover .group-hover\\/itemContainer\\:bg-violet-100{--tw-bg-opacity:1;background-color:rgb(235,235,255,var(--tw-bg-opacity,1))} .group:hover .group-hover\\:underline{text-decoration-line:underline} .group.active .group-\\[\\.active\\]\\:border-b-2{border-bottom-width:2px}@media (min-width:732px){ .md\\:inset-0{inset:0} .md\\:top-20{top:5rem} .md\\:mb-2{margin-bottom:.5rem} .md\\:mb-4{margin-bottom:1rem} .md\\:mb-8{margin-bottom:2rem} .md\\:ml-0{margin-left:0} .md\\:mt-0{margin-top:0} .md\\:mt-14{margin-top:3.5rem} .md\\:block{display:block} .md\\:inline-block{display:inline-block} .md\\:flex{display:flex} .md\\:grid{display:grid} .md\\:hidden{display:none} .md\\:h-11{height:2.75rem} .md\\:h-5{height:1.25rem} .md\\:h-\\[13\\.5px\\]{height:13.5px} .md\\:h-fit{height:-moz-fit-content;height:fit-content} .md\\:max-h-\\[calc\\(100vh-128px\\)\\]{max-height:calc(100vh - 128px)} .md\\:max-h-\\[calc\\(100vh-128px-54px\\)\\]{max-height:calc(100vh - 182px)} .md\\:min-h-0{min-height:0} .md\\:min-h-\\[140px\\]{min-height:140px} .md\\:min-h-\\[164px\\]{min-height:164px} .md\\:w-1\\/2{width:50%} .md\\:w-11{width:2.75rem} .md\\:w-5{width:1.25rem} .md\\:w-\\[13\\.5px\\]{width:13.5px} .md\\:w-fit{width:-moz-fit-content;width:fit-content} .md\\:max-w-\\[calc\\(100vw-164px\\)\\]{max-width:calc(100vw - 164px)} .md\\:flex-none{flex:none} .md\\:grow-0{flex-grow:0} .md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))} .md\\:flex-row{flex-direction:row} .md\\:flex-col{flex-direction:column} .md\\:items-start{align-items:flex-start} .md\\:items-center{align-items:center} .md\\:justify-normal{justify-content:normal} .md\\:justify-center{justify-content:center} .md\\:justify-between{justify-content:space-between} .md\\:gap-4{gap:1rem} .md\\:gap-6{gap:1.5rem} .md\\:gap-x-4{-moz-column-gap:1rem;column-gap:1rem} .md\\:space-y-0>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(0px*var(--tw-space-y-reverse));margin-top:calc(0px*(1 - var(--tw-space-y-reverse)))} .md\\:rounded-lg{border-radius:.5rem} .md\\:rounded-md{border-radius:.375rem} .md\\:rounded-b-none{border-bottom-left-radius:0;border-bottom-right-radius:0} .md\\:border{border-width:1px} .md\\:border-gray-400{--tw-border-opacity:1;border-color:rgb(196,201,204,var(--tw-border-opacity,1))} .md\\:\\!bg-white{--tw-bg-opacity:1!important;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))!important} .md\\:p-4{padding:1rem} .md\\:px-0{padding-left:0;padding-right:0} .md\\:px-4{padding-left:1rem;padding-right:1rem} .md\\:px-6{padding-left:1.5rem;padding-right:1.5rem} .md\\:px-\\[82px\\]{padding-left:82px;padding-right:82px} .md\\:pb-0{padding-bottom:0} .md\\:pl-13\\.2{padding-left:3.125rem} .md\\:pl-4{padding-left:1rem} .md\\:pr-4{padding-right:1rem} .md\\:pt-20\\.5{padding-top:5.125rem} .md\\:text-center{text-align:center} .md\\:text-lg{font-size:1.125rem;line-height:1.75rem} .md\\:shadow-\\[0_0_\\#0000\\]{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .md\\:\\[grid-template-columns\\:repeat\\(2\\,minmax\\(auto\\,304px\\)\\)\\]{grid-template-columns:repeat(2,minmax(auto,304px))} .group\\/itemContainer:hover .md\\:group-hover\\/itemContainer\\:bg-white{--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))}}@media (min-width:1196px){ .lg\\:left-16{left:4rem} .lg\\:right-16{right:4rem} .lg\\:flex{display:flex} .lg\\:hidden{display:none} .lg\\:max-h-\\[calc\\(100vh-192px\\)\\]{max-height:calc(100vh - 192px)} .lg\\:max-h-\\[calc\\(100vh-192px-54px\\)\\]{max-height:calc(100vh - 246px)} .lg\\:min-h-\\[224px\\]{min-height:224px} .lg\\:w-full{width:100%} .lg\\:max-w-\\[50\\%\\]{max-width:50%} .lg\\:max-w-\\[calc\\(100vw-248px\\)\\]{max-width:calc(100vw - 248px)} .lg\\:grow{flex-grow:1} .lg\\:basis-1\\/2{flex-basis:50%} .lg\\:justify-start{justify-content:flex-start} .lg\\:rounded-b-lg{border-bottom-left-radius:.5rem;border-bottom-right-radius:.5rem} .lg\\:rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem} .lg\\:px-16{padding-left:4rem;padding-right:4rem} .lg\\:px-\\[128px\\]{padding-left:128px;padding-right:128px} .lg\\:py-24{padding-bottom:6rem;padding-top:6rem} .lg\\:pt-6{padding-top:1.5rem}}@media (hover:hover) and (pointer:fine){ .td\\:border-2{border-width:2px} .td\\:border-blue-900{--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))} .td\\:hover\\:cursor-grab:hover{cursor:grab} .td\\:hover\\:bg-black-50:hover{background-color:rgba(0,0,0,.051)} .td\\:hover\\:bg-violet-100:hover{--tw-bg-opacity:1;background-color:rgb(235,235,255,var(--tw-bg-opacity,1))} .td\\:hover\\:text-soft-blue:hover{--tw-text-opacity:1;color:rgb(84,101,251,var(--tw-text-opacity,1))} .group:hover .td\\:group-hover\\:bg-black{--tw-bg-opacity:1;background-color:rgb(0,0,0,var(--tw-bg-opacity,1))} .group:hover .td\\:group-hover\\:opacity-5{opacity:.05}}@media (pointer:coarse){ .coarse\\:active\\:bg-yellow-900:active{--tw-bg-opacity:1;background-color:rgb(253,224,71,var(--tw-bg-opacity,1))}}'
18592
+ code: ' *, :after, :before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style:} ::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style:} *, :after, :before{border:0 solid #e5e7eb;box-sizing:border-box} :after, :before{--tw-content:""} :host, html{line-height:1.5;-webkit-text-size-adjust:100%;font-family:Mulish,sans-serif;font-feature-settings:normal;font-variation-settings:normal;-moz-tab-size:4;-o-tab-size:4;tab-size:4;-webkit-tap-highlight-color:transparent} body{line-height:inherit;margin:0} hr{border-top-width:1px;color:inherit;height:0} 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;text-decoration:inherit} b, strong{font-weight:bolder} code, kbd, pre, samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-size:1em;font-variation-settings:normal} small{font-size:80%} sub, sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline} sub{bottom:-.25em} sup{top:-.5em} table{border-collapse:collapse;border-color:inherit;text-indent:0} button, input, optgroup, select, textarea{color:inherit;font-family:inherit;font-feature-settings:inherit;font-size:100%;font-variation-settings:inherit;font-weight:inherit;letter-spacing:inherit;line-height:inherit;margin:0;padding:0} button, select{text-transform:none} button, input:where([type=button]), input:where([type=reset]), input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none} :-moz-focusring{outline:auto} :-moz-ui-invalid{box-shadow:none} progress{vertical-align:baseline} ::-webkit-inner-spin-button, ::-webkit-outer-spin-button{height:auto} [type=search]{-webkit-appearance:textfield;outline-offset:-2px} ::-webkit-search-decoration{-webkit-appearance:none} ::-webkit-file-upload-button{-webkit-appearance:button;font:inherit} summary{display:list-item} blockquote, dd, dl, figure, h1, h2, h3, h4, h5, h6, hr, p, pre{margin:0} fieldset{margin:0} fieldset, legend{padding:0} menu, ol, ul{list-style:none;margin:0;padding:0} dialog{padding:0} textarea{resize:vertical} input::-moz-placeholder, textarea::-moz-placeholder{color:#9ca3af;opacity:1} input::placeholder, textarea::placeholder{color:#9ca3af;opacity:1} [role=button], button{cursor:pointer} :disabled{cursor:default} audio, canvas, embed, iframe, img, object, svg, video{display:block;vertical-align:middle} img, video{height:auto;max-width:100%} [hidden]:where(:not([hidden=until-found])){display:none} *{font-family:Mulish,sans-serif} input::-moz-selection, textarea::-moz-selection{background-color:hsla(0,0%,85%,.4)} input::selection, textarea::selection{background-color:hsla(0,0%,85%,.4)} .container{width:100%}@media (min-width:732px){ .container{max-width:732px}}@media (min-width:1196px){ .container{max-width:1196px}} .p2{font-size:.875rem;font-weight:600;line-height:1.25rem;line-height:1.5} .blanket-overlay{inset:0;position:absolute} .item-heading{font-size:1.25rem;letter-spacing:-.025em;line-height:1.5rem;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} .focus-ring:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:4px} .focus-ring:focus, .raw-focus-ring{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .raw-focus-ring{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px} .focus-ring-by-dropdown{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);border-color:rgb(59,64,240,var(--tw-border-opacity,1));border-width:2px;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);box-shadow:0 0 0 2px #fff,0 0 0 4px #212529,0 0 0 6px #fde047} .divider, .focus-ring-by-dropdown{--tw-border-opacity:1} .divider{border-bottom-width:1px;border-color:rgb(218,224,224,var(--tw-border-opacity,1))}@keyframes svelte-1dpid58-pulse{50%{opacity:.5}} .animate-skeleton{animation:svelte-1dpid58-pulse 2s cubic-bezier(.4,0,.6,1) infinite;--tw-bg-opacity:1;background-color:rgb(226,232,240,var(--tw-bg-opacity,1))} .btn-mcq-option:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;--tw-ring-offset-color:#212529;outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .btn-mcq-option{font-size:1rem;line-height:1.5rem;line-height:19.2px;margin-bottom:1rem;min-height:52px;width:100%;--tw-text-opacity:1;border-radius:.5rem;border-width:1px;box-sizing:border-box;color:rgb(33,37,41,var(--tw-text-opacity,1));--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248,248,248,var(--tw-bg-opacity,1))} .btn-mcq-option:active{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(238,240,255,var(--tw-bg-opacity,1))}} .btn-mcq-text{align-items:center;display:flex;padding:.375rem .75rem;width:100%}@supports (overflow-wrap:anywhere){ .btn-mcq-text{overflow-wrap:anywhere}}@supports not (overflow-wrap:anywhere){ .btn-mcq-text{word-break:break-word}} .btn-mcq-option>span>span>span>.choice{align-items:center;border-radius:1rem;border-width:1px;display:flex;font-size:1rem;font-weight:700;height:2rem;justify-content:center;letter-spacing:.05em;line-height:1rem;width:2rem;--tw-border-opacity:1;border-color:rgb(156,163,175,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1));padding:.5rem;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .btn-mcq-option.selected{border-width:2px;--tw-border-opacity:1;background-color:rgb(40,44,135,var(--tw-bg-opacity,1));border-color:rgb(40,44,135,var(--tw-border-opacity,1))} .btn-mcq-option.selected, .btn-mcq-option.selected:active{--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(255,255,255,var(--tw-text-opacity,1))} .btn-mcq-option.selected:active{background-color:rgb(84,101,251,var(--tw-bg-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option.selected:hover{--tw-bg-opacity:1;background-color:rgb(84,101,251,var(--tw-bg-opacity,1))}} .btn-mcq-option.finished{cursor:default} .btn-mcq-option.finished:active, .btn-mcq-option.finished:hover{border-width:1px;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248,248,248,var(--tw-bg-opacity,1))} .btn-mcq-option.selected>span>span>.choice{--tw-bg-opacity:1;background-color:rgb(238,240,255,var(--tw-bg-opacity,1))} .btn-mcq-option>span>span>span>.custom-checkbox{align-items:center;border-radius:.25rem;border-width:1px;display:flex;height:1.75rem;justify-content:center;pointer-events:none;width:1.75rem;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option:hover>span>span>span>.custom-checkbox{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))} .btn-mcq-option:active>span>span>span>.custom-checkbox.preview-only, .btn-mcq-option:hover>span>span>span>.custom-checkbox.preview-only{border-width:1px;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1))}} .btn-mcq-option:active>span>span>span>.custom-checkbox{border-width:2px;--tw-border-opacity:1;border-color:rgb(40,44,135,var(--tw-border-opacity,1))} .btn-mcq-option.selected>span>span>span>.custom-checkbox{border-width:0;pointer-events:none;--tw-bg-opacity:1;background-color:rgb(84,101,251,var(--tw-bg-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option.selected:hover>span>span>span>.custom-checkbox{border-width:0;--tw-bg-opacity:1;background-color:rgb(76,91,226,var(--tw-bg-opacity,1))}} .btn-mcq-option.selected:active>span>span>span>.custom-checkbox{border-width:0;--tw-bg-opacity:1;background-color:rgb(40,44,135,var(--tw-bg-opacity,1))} .btn-mcq-option.finished:active>span>span>span>.custom-checkbox, .btn-mcq-option.finished:hover>span>span>span>.custom-checkbox{border-width:1px;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))} .btn-mcq-option.missing.\\!correct, .btn-mcq-option.missing.correct{border-width:1px;--tw-border-opacity:1;border-color:rgb(21,128,61,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(248,248,248,var(--tw-bg-opacity,1))}@media (hover:hover) and (pointer:fine){ .btn-mcq-option.\\!correct.interactive:active, .btn-mcq-option.\\!correct.interactive:hover, .btn-mcq-option.correct.interactive:active, .btn-mcq-option.correct.interactive:hover, .btn-mcq-option.incorrect.interactive:active, .btn-mcq-option.incorrect.interactive:hover, .btn-mcq-option.missing.interactive:active, .btn-mcq-option.missing.interactive:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(238,240,255,var(--tw-bg-opacity,1))}} .btn-mcq-option.selected.\\!correct, .btn-mcq-option.selected.correct{background-color:rgb(240,253,244,var(--tw-bg-opacity,1));border-color:rgb(21,128,61,var(--tw-border-opacity,1));border-width:1px} .btn-mcq-option.selected.\\!correct, .btn-mcq-option.selected.correct, .btn-mcq-option.selected.incorrect{--tw-border-opacity:1;--tw-bg-opacity:1;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .btn-mcq-option.selected.incorrect{background-color:rgb(253,242,248,var(--tw-bg-opacity,1));border-color:rgb(190,24,93,var(--tw-border-opacity,1));border-width:1px} .btn-mcq-option.selected.\\!correct>span>span>span>.choice, .btn-mcq-option.selected.correct>span>span>span>.choice, .btn-mcq-option.selected.incorrect>span>span>span>.choice{border-width:1px;--tw-border-opacity:1;border-color:rgb(113,115,119,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))} .btn-pressed{border-width:2px;--tw-border-opacity:1;border-color:rgb(51,69,223,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1));--tw-shadow:inset 0 0 0 100vmax rgba(0,0,0,.05);--tw-shadow-colored:inset 0 0 0 100vmax var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .btn-base:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;--tw-ring-offset-color:#212529;outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .btn-base{align-items:center;display:inline-flex;justify-content:center}@media (hover:hover) and (pointer:fine){ .btn-base:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1))}} .btn-base:active{border-width:2px;--tw-border-opacity:1;border-color:rgb(51,69,223,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1));--tw-shadow:inset 0 0 0 100vmax rgba(0,0,0,.05);--tw-shadow-colored:inset 0 0 0 100vmax var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .btn-touch-container{align-items:center;display:flex;height:2.75rem;justify-content:center;width:2.75rem} .btn-touch-container:focus{outline:2px solid transparent;outline-offset:2px} .btn-icon-sm{align-items:center;background-color:hsla(0,0%,100%,.8);border-radius:.25rem;display:flex;height:1.5rem;justify-content:center;width:1.5rem}@media (hover:hover) and (pointer:fine){ .btn-touch-container:hover>.btn-icon-sm{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1))}} .btn-touch-container:active>.btn-icon-sm{border-width:2px;--tw-border-opacity:1;border-color:rgb(51,69,223,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(249,250,251,var(--tw-bg-opacity,1));--tw-shadow:inset 0 0 0 100vmax rgba(0,0,0,.05);--tw-shadow-colored:inset 0 0 0 100vmax var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .btn-touch-container:focus-visible>.btn-icon-sm{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;--tw-ring-offset-color:#212529;outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .typein-textbox:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:4px;transition-duration:50ms} .typein-textbox{border-radius:.5rem;border-width:1px;width:100%;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1));font-size:1rem;line-height:1.5rem;padding:.75rem 1rem;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .typein-textbox::-moz-placeholder{--tw-placeholder-opacity:1;color:rgb(55,65,81,var(--tw-placeholder-opacity,1))} .typein-textbox::placeholder{--tw-placeholder-opacity:1;color:rgb(55,65,81,var(--tw-placeholder-opacity,1))} .typein-textbox:focus{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))}@media (hover:hover) and (pointer:fine){ .typein-textbox:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))}} .typein-textbox:focus{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)!important;--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color)!important;box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent)!important}@media (hover:hover) and (pointer:fine){ .typein-textbox:hover{transition-duration:50ms}} .typein-textbox:focus{outline-color:#212529;outline-width:2px}@media (hover:hover) and (pointer:fine){ .typein-textbox:hover{outline-color:#212529;outline-width:2px}} .typein-textbox:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1))} .inline-typein-container>p{font-size:1.25rem;font-weight:600;line-height:3rem;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} #dnd-action-dragged-el{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;cursor:grabbing!important;transition-duration:50ms;--tw-border-opacity:1!important;border-color:rgb(93,99,107,var(--tw-border-opacity,1))!important;--tw-bg-opacity:1!important;background-color:rgb(205,208,254,var(--tw-bg-opacity,1))!important} #dnd-action-dragged-el .btn-vertical-icon{cursor:grabbing!important;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} #dnd-action-dragged-el .preview-icon{display:none!important} #dnd-action-dragged-el .preview-vertical{display:block!important} .image-description, .text-stimulus{padding-bottom:1rem;padding-top:1rem} .text-stimulus p{font-size:1.25rem;line-height:1.75rem;padding-bottom:.5rem;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} .image-description p{font-size:.875rem;line-height:1.25rem;padding-bottom:.5rem;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .text-stimulus ol, .text-stimulus ul{font-size:1rem;line-height:1.5rem;list-style-position:inside;padding-bottom:.5rem;padding-left:.5rem} .text-stimulus ol ::marker, .text-stimulus ul ::marker{color:#282c87} .text-stimulus ol::marker, .text-stimulus ul::marker{color:#282c87} .image-description ol, .image-description ul{font-size:.875rem;line-height:1.25rem;list-style-position:inside;padding-bottom:.5rem;padding-left:.5rem} .image-description ol ::marker, .image-description ul ::marker{color:#212529} .image-description ol::marker, .image-description ul::marker{color:#212529} .image-description ul, .text-stimulus ul{list-style-type:disc} .image-description ol, .text-stimulus ol{list-style-type:decimal} .image-description ul li>p, .text-stimulus ul li>p{margin-left:-.5rem} .text-stimulus ol>li>p, .text-stimulus ul>li>p{display:inline;font-size:1rem;line-height:1.5rem;padding-bottom:0;padding-top:0} .image-description ol>li>p, .image-description ul>li>p{display:inline;font-size:.875rem;line-height:1.25rem;padding-bottom:0;padding-top:0} .image-description div.table-container:focus, .text-stimulus div.table-container:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:4px;transition-duration:50ms} .image-description div.table-container, .text-stimulus div.table-container{border-radius:.5rem;overflow:auto;padding-left:.125rem;padding-right:.125rem} .image-description table, .text-stimulus table{margin-bottom:1rem;margin-top:.5rem;width:100%;--tw-border-spacing-x:0.75rem;--tw-border-spacing-y:0.75rem;border-radius:.5rem;border-spacing:var(--tw-border-spacing-x) var(--tw-border-spacing-y);overflow-x:auto;--tw-shadow:0 0 0 1px #9ca3af;--tw-shadow-colored:0 0 0 1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .image-description table tr, .text-stimulus table tr{border-bottom-width:1px;--tw-border-opacity:1;border-color:rgb(156,163,175,var(--tw-border-opacity,1))} .image-description table tr:last-child, .text-stimulus table tr:last-child{border-color:transparent} .image-description table td, .image-description table th, .text-stimulus table td, .text-stimulus table th{border-left-width:1px;min-width:140px;--tw-border-opacity:1;border-color:rgb(156,163,175,var(--tw-border-opacity,1))} .image-description table td:first-child, .image-description table th:first-child, .text-stimulus table td:first-child, .text-stimulus table th:first-child{border-style:none} .text-stimulus table td>p, .text-stimulus table th>p{font-size:1rem;line-height:1.5rem;padding:.75rem;text-align:left;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .image-description table td>p, .image-description table th>p{font-size:.875rem;line-height:1.25rem;padding:.75rem;text-align:left;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .text-stimulus table th>p{font-weight:400} .image-description table th p, .prompt p, .text-stimulus table th p{font-weight:600} .prompt p b, .prompt p b i, .prompt p b i u, .prompt p b u, .prompt p b u i, .prompt p i b, .prompt p i b u, .prompt p i u b, .prompt p u b, .prompt p u b i, .prompt p u i b, .text-stimulus table th p b, .text-stimulus table th p b i, .text-stimulus table th p b i u, .text-stimulus table th p b u, .text-stimulus table th p b u i, .text-stimulus table th p i b, .text-stimulus table th p i b u, .text-stimulus table th p i u b, .text-stimulus table th p u b, .text-stimulus table th p u b i, .text-stimulus table th p u i b{font-weight:900} .dropdown-text:not(:last-child), .dropdown:not(:last-child){margin-right:1rem} .dropdown-container{align-items:center;border-radius:.5rem;border-width:1px;display:flex;height:2.75rem;overflow:hidden;white-space:nowrap;width:15rem;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1))} .dropdown-container:focus{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent)} .dropdown-container:active, .dropdown-container:focus{border-width:2px;box-shadow:0 0 0 2px #fff,0 0 0 4px #212529,0 0 0 6px #fde047;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))}@media (hover:hover) and (pointer:fine){ .dropdown-container:hover{border-width:2px;--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1));outline-color:#212529;outline-width:2px}} .dropdown-menu{border-radius:.5rem;border-width:1px;margin-top:.5rem;max-height:400px;overflow-y:auto;position:absolute;z-index:10;--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1));--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))}@supports (overflow-wrap:anywhere){ .dropdown-menu{overflow-wrap:anywhere}}@supports not (overflow-wrap:anywhere){ .dropdown-menu{word-break:break-word}} .dropdown-menu{max-width:min(500px,100vw - 2rem);min-width:240px;width:-moz-max-content;width:max-content} .dropdown-item{cursor:pointer;font-size:1rem;line-height:1.5rem;outline:2px solid transparent;outline-offset:2px;padding:.5rem 1rem} .dropdown-itemtext{border-bottom-width:1px;border-color:transparent} .dropdown-itemtext.hover-option{--tw-border-opacity:1;border-color:rgb(0,0,0,var(--tw-border-opacity,1));--tw-text-opacity:1;color:rgb(46,47,212,var(--tw-text-opacity,1))} .dropdown-itemtext.current-option{--tw-bg-opacity:1;background-color:rgb(251,217,27,var(--tw-bg-opacity,1));--tw-text-opacity:1;border-bottom-width:1px;color:rgb(0,0,0,var(--tw-text-opacity,1));outline:2px solid transparent;outline-offset:2px;--tw-border-opacity:1;border-color:rgb(0,0,0,var(--tw-border-opacity,1))} .dropdown-itemtext:active{border-bottom-width:2px} .image-description-accordion{border-bottom-width:1px;border-color:transparent;font-weight:600;--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .group:focus .image-description-accordion{--tw-bg-opacity:1;background-color:rgb(251,217,27,var(--tw-bg-opacity,1));--tw-text-opacity:1;border-bottom-width:1px;color:rgb(0,0,0,var(--tw-text-opacity,1));outline:2px solid transparent;outline-offset:2px} .group:focus .image-description-accordion, .group:hover .image-description-accordion{--tw-border-opacity:1;border-color:rgb(0,0,0,var(--tw-border-opacity,1))} .group:active .image-description-accordion{border-bottom-width:2px} .sr-only{height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;clip:rect(0,0,0,0);border-width:0;white-space:nowrap} .pointer-events-none{pointer-events:none} .pointer-events-auto{pointer-events:auto} .visible{visibility:visible} .invisible{visibility:hidden} .collapse{visibility:collapse} .static{position:static} .fixed{position:fixed} .absolute{position:absolute} .relative{position:relative} .inset-0{inset:0} .inset-y-0{bottom:0;top:0} .-top-2\\.5{top:-.625rem} .bottom-0{bottom:0} .bottom-1\\.5{bottom:.375rem} .bottom-4{bottom:1rem} .bottom-5{bottom:1.25rem} .bottom-\\[7px\\]{bottom:7px} .bottom-full{bottom:100%} .left-0{left:0} .left-1\\/2{left:50%} .left-4{left:1rem} .left-6{left:1.5rem} .left-\\[-9999px\\]{left:-9999px} .left-full{left:100%} .right-0{right:0} .right-1{right:.25rem} .right-1\\.5{right:.375rem} .right-4{right:1rem} .right-6{right:1.5rem} .right-full{right:100%} .top-0{top:0} .top-1{top:.25rem} .top-1\\.5{top:.375rem} .top-1\\/2{top:50%} .top-12{top:3rem} .top-3\\.5{top:.875rem} .top-\\[13px\\]{top:13px} .top-\\[calc\\(50\\%\\+0\\.375rem\\)\\]{top:calc(50% + .375rem)} .top-full{top:100%} .z-0{z-index:0} .z-10{z-index:10} .z-50{z-index:50} .m-0{margin:0} .m-auto{margin:auto} .mx-0\\.5{margin-left:.125rem;margin-right:.125rem} .mx-auto{margin-left:auto;margin-right:auto} .my-1\\.5{margin-bottom:.375rem;margin-top:.375rem} .my-2{margin-bottom:.5rem;margin-top:.5rem} .my-6{margin-bottom:1.5rem;margin-top:1.5rem} .-mb-1{margin-bottom:-.25rem} .-ml-1{margin-left:-.25rem} .-mr-1{margin-right:-.25rem} .-mr-2\\.5{margin-right:-.625rem} .-mt-0\\.5{margin-top:-.125rem} .-mt-1{margin-top:-.25rem} .mb-0\\.5{margin-bottom:.125rem} .mb-10{margin-bottom:2.5rem} .mb-12{margin-bottom:3rem} .mb-2{margin-bottom:.5rem} .mb-3{margin-bottom:.75rem} .mb-4{margin-bottom:1rem} .mb-5{margin-bottom:1.25rem} .mb-6{margin-bottom:1.5rem} .mb-\\[9\\.5px\\]{margin-bottom:9.5px} .ml-1{margin-left:.25rem} .ml-2{margin-left:.5rem} .ml-2\\.5{margin-left:.625rem} .ml-3{margin-left:.75rem} .ml-8\\.5{margin-left:2.125rem} .ml-\\[3px\\]{margin-left:3px} .ml-\\[9\\.5px\\]{margin-left:9.5px} .mr-1{margin-right:.25rem} .mr-2{margin-right:.5rem} .mr-4{margin-right:1rem} .mr-\\[9\\.5px\\]{margin-right:9.5px} .mt-0\\.5{margin-top:.125rem} .mt-1{margin-top:.25rem} .mt-2{margin-top:.5rem} .mt-4{margin-top:1rem} .mt-6{margin-top:1.5rem} .mt-7\\.5{margin-top:1.875} .mt-9{margin-top:2.25rem} .mt-\\[9\\.5px\\]{margin-top:9.5px} .line-clamp-1{-webkit-line-clamp:1} .line-clamp-1, .line-clamp-3{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical} .line-clamp-3{-webkit-line-clamp:3} .block{display:block} .inline-block{display:inline-block} .inline{display:inline} .flex{display:flex} .table{display:table} .grid{display:grid} .contents{display:contents} .hidden{display:none} .h-10\\.5{height:2.625rem} .h-11{height:2.75rem} .h-2{height:.5rem} .h-4{height:1rem} .h-52{height:13rem} .h-6{height:1.5rem} .h-8\\.5{height:2.125rem} .h-\\[13\\.33px\\]{height:13.33px} .h-\\[8\\.77px\\]{height:8.77px} .h-auto{height:auto} .h-fit{height:-moz-fit-content;height:fit-content} .h-full{height:100%} .h-screen{height:100vh} .max-h-\\[184px\\]{max-height:184px} .max-h-\\[470px\\]{max-height:470px} .max-h-\\[660px\\]{max-height:660px} .max-h-\\[calc\\(100vh-168px\\)\\]{max-height:calc(100vh - 168px)} .max-h-\\[calc\\(100vh-168px-34px\\)\\]{max-height:calc(100vh - 202px)} .max-h-none{max-height:none} .min-h-\\[133px\\]{min-height:133px} .min-h-\\[140px\\]{min-height:140px} .min-h-\\[154px\\]{min-height:154px} .min-h-\\[210px\\]{min-height:210px} .min-h-\\[44px\\]{min-height:44px} .min-h-\\[54px\\]{min-height:54px} .min-h-\\[86px\\]{min-height:86px} .w-11{width:2.75rem} .w-2{width:.5rem} .w-2\\/4{width:50%} .w-3{width:.75rem} .w-4{width:1rem} .w-6{width:1.5rem} .w-60{width:15rem} .w-8\\.5{width:2.125rem} .w-\\[13\\.33px\\]{width:13.33px} .w-\\[8\\.77px\\]{width:8.77px} .w-auto{width:auto} .w-fit{width:-moz-fit-content;width:fit-content} .w-full{width:100%} .w-screen{width:100vw} .min-w-0{min-width:0} .min-w-\\[288px\\]{min-width:288px} .min-w-\\[44px\\]{min-width:44px} .min-w-\\[85px\\]{min-width:85px} .max-w-\\[1008px\\]{max-width:1008px} .max-w-\\[300px\\]{max-width:300px} .max-w-\\[304px\\]{max-width:304px} .max-w-\\[400px\\]{max-width:400px} .max-w-full{max-width:100%} .max-w-none{max-width:none} .flex-1{flex:1 1 0%} .flex-none{flex:none} .flex-shrink-0{flex-shrink:0} .grow{flex-grow:1} .basis-0{flex-basis:0px} .-translate-x-1\\/2{--tw-translate-x:-50%} .-translate-x-1\\/2, .-translate-y-1\\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .-translate-y-1\\/2{--tw-translate-y:-50%} .rotate-45{--tw-rotate:45deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))} .\\!cursor-default{cursor:default!important} .\\!cursor-pointer{cursor:pointer!important} .cursor-default{cursor:default} .cursor-pointer{cursor:pointer} .select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none} .resize-none{resize:none} .resize{resize:both} .grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))} .flex-row{flex-direction:row} .flex-col{flex-direction:column} .flex-col-reverse{flex-direction:column-reverse} .flex-wrap{flex-wrap:wrap} .content-start{align-content:flex-start} .items-center{align-items:center} .justify-start{justify-content:flex-start} .justify-center{justify-content:center} .justify-between{justify-content:space-between} .gap-1{gap:.25rem} .gap-2{gap:.5rem} .space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(.5rem*var(--tw-space-y-reverse));margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)))} .space-y-reverse>:not([hidden])~:not([hidden]){--tw-space-y-reverse:1} .overflow-hidden{overflow:hidden} .overflow-y-auto{overflow-y:auto} .overflow-y-visible{overflow-y:visible} .truncate{overflow:hidden;white-space:nowrap} .text-ellipsis, .truncate{text-overflow:ellipsis} .whitespace-normal{white-space:normal} .whitespace-nowrap{white-space:nowrap} .break-words{overflow-wrap:break-word} .break-all{word-break:break-all} .rounded{border-radius:.25rem} .rounded-\\[32px\\]{border-radius:32px} .rounded-lg{border-radius:.5rem} .rounded-md{border-radius:.375rem} .rounded-b-lg{border-bottom-left-radius:.5rem;border-bottom-right-radius:.5rem} .rounded-b-md{border-bottom-left-radius:.375rem;border-bottom-right-radius:.375rem} .rounded-l-lg{border-bottom-left-radius:.5rem;border-top-left-radius:.5rem} .rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem} .rounded-t-md{border-top-left-radius:.375rem;border-top-right-radius:.375rem} .border{border-width:1px} .border-2{border-width:2px} .border-b{border-bottom-width:1px} .border-l-4{border-left-width:4px} .border-l-6{border-left-width:6px} .border-dashed{border-style:dashed} .\\!border-blue-1000{--tw-border-opacity:1!important;border-color:rgb(40,44,135,var(--tw-border-opacity,1))!important} .border-blue-1000{--tw-border-opacity:1;border-color:rgb(40,44,135,var(--tw-border-opacity,1))} .border-blue-950{--tw-border-opacity:1;border-color:rgb(29,78,216,var(--tw-border-opacity,1))} .border-border-minimal{--tw-border-opacity:1;border-color:rgb(229,231,235,var(--tw-border-opacity,1))} .border-charcoal{--tw-border-opacity:1;border-color:rgb(33,37,41,var(--tw-border-opacity,1))} .border-gray-400{--tw-border-opacity:1;border-color:rgb(196,201,204,var(--tw-border-opacity,1))} .border-gray-800{--tw-border-opacity:1;border-color:rgb(93,99,107,var(--tw-border-opacity,1))} .border-gray-850{--tw-border-opacity:1;border-color:rgb(75,85,99,var(--tw-border-opacity,1))} .border-green-800{--tw-border-opacity:1;border-color:rgb(0,102,5,var(--tw-border-opacity,1))} .border-green-900{--tw-border-opacity:1;border-color:rgb(21,128,61,var(--tw-border-opacity,1))} .border-red-600{--tw-border-opacity:1;border-color:rgb(220,38,38,var(--tw-border-opacity,1))} .border-red-800{--tw-border-opacity:1;border-color:rgb(217,12,85,var(--tw-border-opacity,1))} .border-red-900{--tw-border-opacity:1;border-color:rgb(190,24,93,var(--tw-border-opacity,1))} .border-soft-blue{--tw-border-opacity:1;border-color:rgb(84,101,251,var(--tw-border-opacity,1))} .border-white{--tw-border-opacity:1;border-color:rgb(255,255,255,var(--tw-border-opacity,1))} .\\!bg-violet-100{--tw-bg-opacity:1!important;background-color:rgb(235,235,255,var(--tw-bg-opacity,1))!important} .\\!bg-white{--tw-bg-opacity:1!important;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))!important} .bg-black{--tw-bg-opacity:1;background-color:rgb(0,0,0,var(--tw-bg-opacity,1))} .bg-blue-1000{--tw-bg-opacity:1;background-color:rgb(40,44,135,var(--tw-bg-opacity,1))} .bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239,246,255,var(--tw-bg-opacity,1))} .bg-charcoal\\/30{background-color:rgba(33,37,41,.3)} .bg-charcoal\\/80{background-color:rgba(33,37,41,.8)} .bg-gray-100{--tw-bg-opacity:1;background-color:rgb(247,250,250,var(--tw-bg-opacity,1))} .bg-gray-50{--tw-bg-opacity:1;background-color:rgb(244,244,244,var(--tw-bg-opacity,1))} .bg-gray-900{--tw-bg-opacity:1;background-color:rgb(57,62,69,var(--tw-bg-opacity,1))} .bg-green-300{--tw-bg-opacity:1;background-color:rgb(241,254,241,var(--tw-bg-opacity,1))} .bg-red-200{--tw-bg-opacity:1;background-color:rgb(254,202,202,var(--tw-bg-opacity,1))} .bg-red-300{--tw-bg-opacity:1;background-color:rgb(253,243,247,var(--tw-bg-opacity,1))} .bg-red-50{--tw-bg-opacity:1;background-color:rgb(253,242,248,var(--tw-bg-opacity,1))} .bg-soft-blue{--tw-bg-opacity:1;background-color:rgb(84,101,251,var(--tw-bg-opacity,1))} .bg-transparent{background-color:transparent} .bg-violet-100{--tw-bg-opacity:1;background-color:rgb(235,235,255,var(--tw-bg-opacity,1))} .bg-violet-150{--tw-bg-opacity:1;background-color:rgb(205,208,254,var(--tw-bg-opacity,1))} .bg-white{--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))} .bg-white\\/80{background-color:hsla(0,0%,100%,.8)} .bg-yellow-1000{--tw-bg-opacity:1;background-color:rgb(251,217,27,var(--tw-bg-opacity,1))} .bg-opacity-5{--tw-bg-opacity:0.05} .object-contain{-o-object-fit:contain;object-fit:contain} .p-0\\.5{padding:.125rem} .p-1{padding:.25rem} .p-1\\.5{padding:.375rem} .p-2{padding:.5rem} .p-3{padding:.75rem} .p-4{padding:1rem} .p-5{padding:1.25rem} .p-6{padding:1.5rem} .px-0{padding-left:0;padding-right:0} .px-2{padding-left:.5rem;padding-right:.5rem} .px-3{padding-left:.75rem;padding-right:.75rem} .px-4{padding-left:1rem;padding-right:1rem} .py-1{padding-bottom:.25rem;padding-top:.25rem} .py-1\\.5{padding-bottom:.375rem;padding-top:.375rem} .py-2{padding-bottom:.5rem;padding-top:.5rem} .py-\\[9px\\]{padding-bottom:9px;padding-top:9px} .\\!pr-11{padding-right:2.75rem!important} .pb-0{padding-bottom:0} .pb-10{padding-bottom:2.5rem} .pb-2{padding-bottom:.5rem} .pb-3{padding-bottom:.75rem} .pb-\\[72px\\]{padding-bottom:72px} .pl-13\\.2{padding-left:3.125rem} .pl-24{padding-left:6rem} .pl-3{padding-left:.75rem} .pl-4{padding-left:1rem} .pr-3{padding-right:.75rem} .pr-4{padding-right:1rem} .pt-0{padding-top:0} .pt-0\\.5{padding-top:.125rem} .pt-14{padding-top:3.5rem} .pt-4{padding-top:1rem} .pt-6{padding-top:1.5rem} .pt-\\[15px\\]{padding-top:15px} .pt-\\[55px\\]{padding-top:55px} .text-left{text-align:left} .text-center{text-align:center} .align-middle{vertical-align:middle} .text-base{font-size:1rem;line-height:1.5rem} .text-lg{font-size:1.125rem;line-height:1.75rem} .text-sm{font-size:.875rem;line-height:1.25rem} .text-xl{font-size:1.25rem;line-height:1.75rem} .font-bold{font-weight:700} .font-normal{font-weight:400} .font-semibold{font-weight:600} .leading-12{line-height:3rem} .leading-4{line-height:1rem} .leading-5{line-height:1.25rem} .leading-6{line-height:1.5rem} .leading-\\[1\\.5\\]{line-height:1.5} .leading-\\[150\\%\\]{line-height:150%} .leading-\\[19\\.2px\\]{line-height:19.2px} .leading-\\[19px\\]{line-height:19px} .leading-\\[22px\\]{line-height:22px} .\\!text-gray-900{--tw-text-opacity:1!important;color:rgb(57,62,69,var(--tw-text-opacity,1))!important} .text-blue-1000{--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))} .text-blue-850{--tw-text-opacity:1;color:rgb(46,47,212,var(--tw-text-opacity,1))} .text-charcoal{--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .text-gray-500{--tw-text-opacity:1;color:rgb(107,114,128,var(--tw-text-opacity,1))} .text-gray-800{--tw-text-opacity:1;color:rgb(93,99,107,var(--tw-text-opacity,1))} .text-gray-860{--tw-text-opacity:1;color:rgb(55,65,81,var(--tw-text-opacity,1))} .text-green-800{--tw-text-opacity:1;color:rgb(0,102,5,var(--tw-text-opacity,1))} .text-green-900{--tw-text-opacity:1;color:rgb(21,128,61,var(--tw-text-opacity,1))} .text-inherit{color:inherit} .text-primary-emphasis{--tw-text-opacity:1;color:rgb(8,38,99,var(--tw-text-opacity,1))} .text-red-800{--tw-text-opacity:1;color:rgb(217,12,85,var(--tw-text-opacity,1))} .text-red-900{--tw-text-opacity:1;color:rgb(190,24,93,var(--tw-text-opacity,1))} .text-white{--tw-text-opacity:1;color:rgb(255,255,255,var(--tw-text-opacity,1))} .underline{text-decoration-line:underline} .opacity-0{opacity:0} .opacity-5{opacity:.05} .opacity-50{opacity:.5} .shadow-\\[0_-12px_14px_-16px_\\#00000033\\]{--tw-shadow:0 -12px 14px -16px #00000033;--tw-shadow-colored:0 -12px 14px -16px var(--tw-shadow-color)} .shadow-\\[0_-12px_14px_-16px_\\#00000033\\], .shadow-md{box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .shadow-md{--tw-shadow:0px 2px 8px rgba(0,0,0,.2);--tw-shadow-colored:0px 2px 8px var(--tw-shadow-color)} .\\!outline-none{outline:2px solid transparent!important;outline-offset:2px!important} .outline-none{outline:2px solid transparent;outline-offset:2px} .blur{--tw-blur:blur(8px)} .blur, .filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)} .backdrop-blur-md{--tw-backdrop-blur:blur(12px);backdrop-filter:var(--tw-backdrop-blur) var(--tw-backdrop-brightness) var(--tw-backdrop-contrast) var(--tw-backdrop-grayscale) var(--tw-backdrop-hue-rotate) var(--tw-backdrop-invert) var(--tw-backdrop-opacity) var(--tw-backdrop-saturate) var(--tw-backdrop-sepia)} .transition{transition-duration:.15s;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1)} .duration-300{transition-duration:.3s} :host, html{-webkit-tap-highlight-color:inherit!important} .active\\:raw-focus-ring-by:active{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(253 224 71/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;--tw-ring-offset-color:#212529} .active\\:raw-focus-ring-by:active, .active\\:raw-focus-ring:active{box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);outline:2px solid transparent;outline-offset:2px;transition-duration:50ms} .active\\:raw-focus-ring:active{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px}@media (min-width:732px){ .md\\:item-heading{font-size:1.25rem;letter-spacing:-.025em;line-height:1.5rem;--tw-text-opacity:1;color:rgb(40,44,135,var(--tw-text-opacity,1))}}@media (hover:hover) and (pointer:fine){ .td\\:hover-focus-ring:hover{outline:2px solid transparent;outline-offset:2px;--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent);--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1));--tw-ring-offset-width:2px;transition-duration:50ms}} .last\\:mr-0:last-child{margin-right:0} .focus-within\\:left-0:focus-within{left:0} .focus-within\\:right-0:focus-within{right:0} .focus-within\\:top-0:focus-within{top:0} .focus-within\\:z-30:focus-within{z-index:30} .hover\\:bg-black-50:hover{background-color:rgba(0,0,0,.051)} .hover\\:bg-blue-100:hover{--tw-bg-opacity:1;background-color:rgb(222,222,255,var(--tw-bg-opacity,1))} .hover\\:bg-yellow-1000:hover{--tw-bg-opacity:1;background-color:rgb(251,217,27,var(--tw-bg-opacity,1))} .hover\\:text-charcoal:hover{--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .hover\\:underline:hover{text-decoration-line:underline} .hover\\:decoration-2:hover{text-decoration-thickness:2px} .hover\\:underline-offset-\\[25\\%\\]:hover{text-underline-offset:25%} .focus-visible\\:border-charcoal:focus-visible{--tw-border-opacity:1;border-color:rgb(33,37,41,var(--tw-border-opacity,1))} .focus-visible\\:bg-yellow-900:focus-visible{--tw-bg-opacity:1;background-color:rgb(253,224,71,var(--tw-bg-opacity,1))} .focus-visible\\:text-charcoal:focus-visible{--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .focus-visible\\:underline:focus-visible{text-decoration-line:underline} .focus-visible\\:decoration-2:focus-visible{text-decoration-thickness:2px} .focus-visible\\:underline-offset-\\[25\\%\\]:focus-visible{text-underline-offset:25%} .focus-visible\\:outline-none:focus-visible{outline:2px solid transparent;outline-offset:2px} .focus-visible\\:ring-4:focus-visible{--tw-ring-offset-shadow:var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);--tw-ring-shadow:var(--tw-ring-inset) 0 0 0 calc(4px + var(--tw-ring-offset-width)) var(--tw-ring-color);box-shadow:var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow,0 0 transparent)} .focus-visible\\:ring-soft-blue:focus-visible{--tw-ring-opacity:1;--tw-ring-color:rgb(84 101 251/var(--tw-ring-opacity,1))} .focus-visible\\:ring-offset-4:focus-visible{--tw-ring-offset-width:4px} .focus-visible\\:duration-50:focus-visible{transition-duration:50ms} .active\\:bg-black-55:active, .active\\:bg-black-60:active{background-color:rgba(0,0,0,.102)} .active\\:bg-yellow-1100:active{--tw-bg-opacity:1;background-color:rgb(238,206,26,var(--tw-bg-opacity,1))} .active\\:text-charcoal:active{--tw-text-opacity:1;color:rgb(33,37,41,var(--tw-text-opacity,1))} .disabled\\:text-gray-40:disabled{--tw-text-opacity:1;color:rgb(142,147,153,var(--tw-text-opacity,1))} .disabled\\:hover\\:bg-white:hover:disabled{--tw-bg-opacity:1;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))} .group:hover .group-hover\\:underline{text-decoration-line:underline} .group.active .group-\\[\\.active\\]\\:border-b-2{border-bottom-width:2px}@media (min-width:732px){ .md\\:inset-0{inset:0} .md\\:top-20{top:5rem} .md\\:mb-2{margin-bottom:.5rem} .md\\:mb-4{margin-bottom:1rem} .md\\:mb-8{margin-bottom:2rem} .md\\:ml-0{margin-left:0} .md\\:mt-0{margin-top:0} .md\\:mt-14{margin-top:3.5rem} .md\\:block{display:block} .md\\:inline-block{display:inline-block} .md\\:flex{display:flex} .md\\:grid{display:grid} .md\\:hidden{display:none} .md\\:h-11{height:2.75rem} .md\\:h-5{height:1.25rem} .md\\:h-\\[13\\.5px\\]{height:13.5px} .md\\:h-fit{height:-moz-fit-content;height:fit-content} .md\\:max-h-\\[calc\\(100vh-128px\\)\\]{max-height:calc(100vh - 128px)} .md\\:max-h-\\[calc\\(100vh-128px-54px\\)\\]{max-height:calc(100vh - 182px)} .md\\:min-h-0{min-height:0} .md\\:min-h-\\[140px\\]{min-height:140px} .md\\:min-h-\\[164px\\]{min-height:164px} .md\\:w-1\\/2{width:50%} .md\\:w-11{width:2.75rem} .md\\:w-5{width:1.25rem} .md\\:w-\\[13\\.5px\\]{width:13.5px} .md\\:w-fit{width:-moz-fit-content;width:fit-content} .md\\:max-w-\\[calc\\(100vw-164px\\)\\]{max-width:calc(100vw - 164px)} .md\\:flex-none{flex:none} .md\\:grow-0{flex-grow:0} .md\\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))} .md\\:flex-row{flex-direction:row} .md\\:flex-col{flex-direction:column} .md\\:items-start{align-items:flex-start} .md\\:items-center{align-items:center} .md\\:justify-normal{justify-content:normal} .md\\:justify-center{justify-content:center} .md\\:justify-between{justify-content:space-between} .md\\:gap-4{gap:1rem} .md\\:gap-6{gap:1.5rem} .md\\:gap-x-4{-moz-column-gap:1rem;column-gap:1rem} .md\\:space-y-0>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-bottom:calc(0px*var(--tw-space-y-reverse));margin-top:calc(0px*(1 - var(--tw-space-y-reverse)))} .md\\:rounded-lg{border-radius:.5rem} .md\\:rounded-md{border-radius:.375rem} .md\\:rounded-b-none{border-bottom-left-radius:0;border-bottom-right-radius:0} .md\\:border{border-width:1px} .md\\:border-gray-400{--tw-border-opacity:1;border-color:rgb(196,201,204,var(--tw-border-opacity,1))} .md\\:\\!bg-white{--tw-bg-opacity:1!important;background-color:rgb(255,255,255,var(--tw-bg-opacity,1))!important} .md\\:p-4{padding:1rem} .md\\:px-0{padding-left:0;padding-right:0} .md\\:px-4{padding-left:1rem;padding-right:1rem} .md\\:px-6{padding-left:1.5rem;padding-right:1.5rem} .md\\:px-\\[82px\\]{padding-left:82px;padding-right:82px} .md\\:pb-0{padding-bottom:0} .md\\:pl-13\\.2{padding-left:3.125rem} .md\\:pl-4{padding-left:1rem} .md\\:pr-4{padding-right:1rem} .md\\:pt-20\\.5{padding-top:5.125rem} .md\\:text-center{text-align:center} .md\\:text-lg{font-size:1.125rem;line-height:1.75rem} .md\\:shadow-\\[0_0_\\#0000\\]{--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow,0 0 transparent),var(--tw-ring-shadow,0 0 transparent),var(--tw-shadow)} .md\\:\\[grid-template-columns\\:repeat\\(2\\,minmax\\(auto\\,304px\\)\\)\\]{grid-template-columns:repeat(2,minmax(auto,304px))}}@media (min-width:1196px){ .lg\\:left-16{left:4rem} .lg\\:right-16{right:4rem} .lg\\:flex{display:flex} .lg\\:hidden{display:none} .lg\\:max-h-\\[calc\\(100vh-192px\\)\\]{max-height:calc(100vh - 192px)} .lg\\:max-h-\\[calc\\(100vh-192px-54px\\)\\]{max-height:calc(100vh - 246px)} .lg\\:min-h-\\[224px\\]{min-height:224px} .lg\\:w-full{width:100%} .lg\\:max-w-\\[50\\%\\]{max-width:50%} .lg\\:max-w-\\[calc\\(100vw-248px\\)\\]{max-width:calc(100vw - 248px)} .lg\\:grow{flex-grow:1} .lg\\:basis-1\\/2{flex-basis:50%} .lg\\:justify-start{justify-content:flex-start} .lg\\:rounded-b-lg{border-bottom-left-radius:.5rem;border-bottom-right-radius:.5rem} .lg\\:rounded-t-lg{border-top-left-radius:.5rem;border-top-right-radius:.5rem} .lg\\:px-16{padding-left:4rem;padding-right:4rem} .lg\\:px-\\[128px\\]{padding-left:128px;padding-right:128px} .lg\\:py-24{padding-bottom:6rem;padding-top:6rem} .lg\\:pt-6{padding-top:1.5rem}}@media (hover:hover) and (pointer:fine){ .td\\:border-2{border-width:2px} .td\\:border-blue-900{--tw-border-opacity:1;border-color:rgb(59,64,240,var(--tw-border-opacity,1))} .td\\:hover\\:cursor-grab:hover{cursor:grab} .td\\:hover\\:bg-black-50:hover{background-color:rgba(0,0,0,.051)} .td\\:hover\\:bg-violet-100:hover{--tw-bg-opacity:1;background-color:rgb(235,235,255,var(--tw-bg-opacity,1))} .td\\:hover\\:text-soft-blue:hover{--tw-text-opacity:1;color:rgb(84,101,251,var(--tw-text-opacity,1))} .group:hover .td\\:group-hover\\:bg-black{--tw-bg-opacity:1;background-color:rgb(0,0,0,var(--tw-bg-opacity,1))} .group:hover .td\\:group-hover\\:opacity-5{opacity:.05}}@media (pointer:coarse){ .coarse\\:active\\:bg-yellow-900:active{--tw-bg-opacity:1;background-color:rgb(253,224,71,var(--tw-bg-opacity,1))}}'
18457
18593
  };
18458
18594
  function InteractionBuilder($$anchor, $$props) {
18459
18595
  push($$props, true);