astro-tractstack 2.0.0-rc.47 → 2.0.0-rc.48

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.
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "astro-tractstack",
3
- "version": "2.0.0-rc.47",
3
+ "version": "2.0.0-rc.48",
4
4
  "description": "Astro integration for TractStack - redeeming the web from boring experiences",
5
5
  "type": "module",
6
6
  "main": "dist/index.js",
@@ -1 +1 @@
1
- /* ! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com */*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){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,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[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,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*, ::before, ::after{--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:rgb(59 130 246 / 0.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: }::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:rgb(59 130 246 / 0.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: } .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0} .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} .sticky{position:sticky} .inset-0{inset:0px} .inset-x-0{left:0px;right:0px} .inset-y-0{top:0px;bottom:0px} .bottom-0{bottom:0px} .bottom-1{bottom:0.25rem} .bottom-24{bottom:6rem} .bottom-4{bottom:1rem} .bottom-full{bottom:100%} .left-0{left:0px} .left-1\/2{left:50%} .left-2{left:0.5rem} .left-3{left:0.75rem} .right-0{right:0px} .right-1{right:0.25rem} .right-2{right:0.5rem} .right-4{right:1rem} .right-8{right:2rem} .top-0{top:0px} .top-1\/2{top:50%} .top-2{top:0.5rem} .top-4{top:1rem} .top-8{top:2rem} .top-full{top:100%} .isolate{isolation:isolate} .isolation-auto{isolation:auto} .z-10{z-index:110} .z-101{z-index:1001} .z-102{z-index:1002} .z-50{z-index:510} .col-span-1{grid-column:span 1 / span 1} .col-span-3{grid-column:span 3 / span 3} .mx-1{margin-left:0.25rem;margin-right:0.25rem} .mx-2{margin-left:0.5rem;margin-right:0.5rem} .mx-4{margin-left:1rem;margin-right:1rem} .mx-5{margin-left:1.25rem;margin-right:1.25rem} .mx-auto{margin-left:auto;margin-right:auto} .my-1{margin-top:0.25rem;margin-bottom:0.25rem} .my-16{margin-top:4rem;margin-bottom:4rem} .my-2{margin-top:0.5rem;margin-bottom:0.5rem} .my-3{margin-top:0.75rem;margin-bottom:0.75rem} .my-4{margin-top:1rem;margin-bottom:1rem} .my-8{margin-top:2rem;margin-bottom:2rem} .mb-1{margin-bottom:0.25rem} .mb-12{margin-bottom:3rem} .mb-2{margin-bottom:0.5rem} .mb-3{margin-bottom:0.75rem} .mb-4{margin-bottom:1rem} .mb-6{margin-bottom:1.5rem} .mb-8{margin-bottom:2rem} .ml-1{margin-left:0.25rem} .ml-2{margin-left:0.5rem} .ml-3{margin-left:0.75rem} .ml-4{margin-left:1rem} .ml-6{margin-left:1.5rem} .ml-auto{margin-left:auto} .mr-1{margin-right:0.25rem} .mr-2{margin-right:0.5rem} .mr-3{margin-right:0.75rem} .mr-4{margin-right:1rem} .mt-1{margin-top:0.25rem} .mt-2{margin-top:0.5rem} .mt-3{margin-top:0.75rem} .mt-4{margin-top:1rem} .mt-5{margin-top:1.25rem} .mt-6{margin-top:1.5rem} .mt-8{margin-top:2rem} .line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1} .line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2} .block{display:block} .inline-block{display:inline-block} .inline{display:inline} .flex{display:flex} .inline-flex{display:inline-flex} .table{display:table} .grid{display:grid} .inline-grid{display:inline-grid} .contents{display:contents} .list-item{display:list-item} .hidden{display:none} .aspect-video{aspect-ratio:16 / 9} .h-1{height:0.25rem} .h-10{height:2.5rem} .h-12{height:3rem} .h-14{height:3.5rem} .h-16{height:4rem} .h-2{height:0.5rem} .h-3{height:0.75rem} .h-32{height:8rem} .h-4{height:1rem} .h-48{height:12rem} .h-5{height:1.25rem} .h-6{height:1.5rem} .h-64{height:16rem} .h-8{height:2rem} .h-9{height:2.25rem} .h-96{height:24rem} .h-auto{height:auto} .h-fit{height:fit-content} .h-full{height:100%} .max-h-32{max-height:8rem} .max-h-40{max-height:10rem} .max-h-56{max-height:14rem} .max-h-60{max-height:15rem} .max-h-64{max-height:16rem} .max-h-96{max-height:24rem} .max-h-screen{max-height:100vh} .min-h-16{min-height:4rem} .min-h-9{min-height:2.25rem} .min-h-full{min-height:100%} .min-h-screen{min-height:100vh} .w-1\/2{width:50%} .w-1\/3{width:33.333333%} .w-10{width:2.5rem} .w-11{width:2.75rem} .w-12{width:3rem} .w-16{width:4rem} .w-2{width:0.5rem} .w-2\/3{width:66.666667%} .w-20{width:5rem} .w-24{width:6rem} .w-3{width:0.75rem} .w-4{width:1rem} .w-40{width:10rem} .w-5{width:1.25rem} .w-6{width:1.5rem} .w-64{width:16rem} .w-8{width:2rem} .w-9{width:2.25rem} .w-96{width:24rem} .w-auto{width:auto} .w-fit{width:fit-content} .w-full{width:100%} .w-screen{width:100vw} .min-w-0{min-width:0px} .min-w-24{min-width:6rem} .min-w-48{min-width:12rem} .min-w-64{min-width:16rem} .min-w-full{min-width:100%} .max-w-2xl{max-width:42rem} .max-w-3xl{max-width:48rem} .max-w-48{max-width:12rem} .max-w-4xl{max-width:56rem} .max-w-7xl{max-width:80rem} .max-w-full{max-width:100%} .max-w-lg{max-width:32rem} .max-w-md{max-width:28rem} .max-w-none{max-width:none} .max-w-xl{max-width:36rem} .flex-1{flex:1 1 0%} .flex-auto{flex:1 1 auto} .flex-shrink-0{flex-shrink:0} .shrink-0{flex-shrink:0} .flex-grow{flex-grow:1} .translate-x-0{--tw-translate-x:0px;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-x-1{--tw-translate-x:0.25rem;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-x-5{--tw-translate-x:1.25rem;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-x-6{--tw-translate-x:1.5rem;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-0{--tw-translate-y:0px;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-full{--tw-translate-y:100%;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))} .rotate-180{--tw-rotate:180deg;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))} .scale-125{--tw-scale-x:1.25;--tw-scale-y:1.25;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))} .scale-x-0{--tw-scale-x:0;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))} .transform{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))} @keyframes fadeIn{0%{opacity:.25}100%{opacity:1}} .animate-fadeIn{animation:fadeIn 1s ease-in} @keyframes pulse{50%{opacity:.5}} .animate-pulse{animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite} @keyframes spin{to{transform:rotate(360deg)}} .animate-spin{animation:spin 1s linear infinite} .cursor-default{cursor:default} .cursor-help{cursor:help} .cursor-move{cursor:move} .cursor-not-allowed{cursor:not-allowed} .cursor-pointer{cursor:pointer} .select-none{user-select:none} .resize-y{resize:vertical} .resize{resize:both} .list-inside{list-style-position:inside} .list-disc{list-style-type:disc} .grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))} .grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))} .grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))} .flex-row{flex-direction:row} .flex-row-reverse{flex-direction:row-reverse} .flex-col{flex-direction:column} .flex-wrap{flex-wrap:wrap} .flex-nowrap{flex-wrap:nowrap} .items-start{align-items:flex-start} .items-end{align-items:flex-end} .items-center{align-items:center} .justify-start{justify-content:flex-start} .justify-end{justify-content:flex-end} .justify-center{justify-content:center} .justify-between{justify-content:space-between} .justify-around{justify-content:space-around} .gap-1{gap:0.25rem} .gap-2{gap:0.5rem} .gap-3{gap:0.75rem} .gap-4{gap:1rem} .gap-6{gap:1.5rem} .gap-x-2{column-gap:0.5rem} .gap-x-4{column-gap:1rem} .gap-x-6{column-gap:1.5rem} .gap-x-8{column-gap:2rem} .gap-y-1{row-gap:0.25rem} .gap-y-2{row-gap:0.5rem} .gap-y-3{row-gap:0.75rem} .space-x-1 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.25rem * var(--tw-space-x-reverse));margin-left:calc(0.25rem * calc(1 - var(--tw-space-x-reverse)))} .space-x-2 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.5rem * var(--tw-space-x-reverse));margin-left:calc(0.5rem * calc(1 - var(--tw-space-x-reverse)))} .space-x-3 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.75rem * var(--tw-space-x-reverse));margin-left:calc(0.75rem * calc(1 - var(--tw-space-x-reverse)))} .space-x-4 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))} .space-y-1 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.25rem * var(--tw-space-y-reverse))} .space-y-2 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))} .space-y-3 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.75rem * var(--tw-space-y-reverse))} .space-y-4 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))} .space-y-6 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))} .space-y-8 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2rem * var(--tw-space-y-reverse))} .divide-y > :not([hidden]) ~ :not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse))} .divide-gray-100 > :not([hidden]) ~ :not([hidden]){--tw-divide-opacity:1;border-color:rgb(243 244 246 / var(--tw-divide-opacity))} .divide-gray-200 > :not([hidden]) ~ :not([hidden]){--tw-divide-opacity:1;border-color:rgb(229 231 235 / var(--tw-divide-opacity))} .divide-gray-300 > :not([hidden]) ~ :not([hidden]){--tw-divide-opacity:1;border-color:rgb(209 213 219 / var(--tw-divide-opacity))} .justify-self-start{justify-self:start} .overflow-auto{overflow:auto} .overflow-hidden{overflow:hidden} .overflow-x-auto{overflow-x:auto} .overflow-y-auto{overflow-y:auto} .truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .text-ellipsis{text-overflow:ellipsis} .text-clip{text-overflow:clip} .whitespace-normal{white-space:normal} .whitespace-nowrap{white-space:nowrap} .text-pretty{text-wrap:pretty} .break-all{word-break:break-all} .rounded{border-radius:0.25rem} .rounded-3xl{border-radius:1.5rem} .rounded-full{border-radius:9999px} .rounded-lg{border-radius:0.5rem} .rounded-md{border-radius:0.375rem} .rounded-sm{border-radius:0.125rem} .rounded-xl{border-radius:0.75rem} .rounded-b-md{border-bottom-right-radius:0.375rem;border-bottom-left-radius:0.375rem} .rounded-l-md{border-top-left-radius:0.375rem;border-bottom-left-radius:0.375rem} .rounded-r-md{border-top-right-radius:0.375rem;border-bottom-right-radius:0.375rem} .rounded-t-md{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem} .border{border-width:1px} .border-0{border-width:0px} .border-2{border-width:2px} .border-4{border-width:4px} .border-b{border-bottom-width:1px} .border-b-2{border-bottom-width:2px} .border-l-2{border-left-width:2px} .border-t{border-top-width:1px} .border-t-2{border-top-width:2px} .border-solid{border-style:solid} .border-dashed{border-style:dashed} .border-dotted{border-style:dotted} .border-none{border-style:none} .border-amber-200{--tw-border-opacity:1;border-color:rgb(253 230 138 / var(--tw-border-opacity))} .border-amber-300{--tw-border-opacity:1;border-color:rgb(252 211 77 / var(--tw-border-opacity))} .border-black\/10{border-color:rgb(0 0 0 / 0.1)} .border-blue-200{--tw-border-opacity:1;border-color:rgb(191 219 254 / var(--tw-border-opacity))} .border-blue-500{--tw-border-opacity:1;border-color:rgb(59 130 246 / var(--tw-border-opacity))} .border-blue-600{--tw-border-opacity:1;border-color:rgb(37 99 235 / var(--tw-border-opacity))} .border-cyan-200{--tw-border-opacity:1;border-color:rgb(165 243 252 / var(--tw-border-opacity))} .border-cyan-400{--tw-border-opacity:1;border-color:rgb(34 211 238 / var(--tw-border-opacity))} .border-cyan-500{--tw-border-opacity:1;border-color:rgb(6 182 212 / var(--tw-border-opacity))} .border-cyan-600{--tw-border-opacity:1;border-color:rgb(8 145 178 / var(--tw-border-opacity))} .border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity))} .border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity))} .border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity))} .border-gray-500{--tw-border-opacity:1;border-color:rgb(107 114 128 / var(--tw-border-opacity))} .border-green-200{--tw-border-opacity:1;border-color:rgb(187 247 208 / var(--tw-border-opacity))} .border-green-300{--tw-border-opacity:1;border-color:rgb(134 239 172 / var(--tw-border-opacity))} .border-myblue{--tw-border-opacity:1;border-color:rgb(41 63 88 / var(--tw-border-opacity))} .border-myblue\/20{border-color:rgb(41 63 88 / 0.2)} .border-mydarkgrey{--tw-border-opacity:1;border-color:rgb(57 61 52 / var(--tw-border-opacity))} .border-mydarkgrey\/20{border-color:rgb(57 61 52 / 0.2)} .border-mydarkgrey\/30{border-color:rgb(57 61 52 / 0.3)} .border-mylightgrey{--tw-border-opacity:1;border-color:rgb(167 177 183 / var(--tw-border-opacity))} .border-orange-200{--tw-border-opacity:1;border-color:rgb(254 215 170 / var(--tw-border-opacity))} .border-red-200{--tw-border-opacity:1;border-color:rgb(254 202 202 / var(--tw-border-opacity))} .border-red-300{--tw-border-opacity:1;border-color:rgb(252 165 165 / var(--tw-border-opacity))} .border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68 / var(--tw-border-opacity))} .border-slate-100{--tw-border-opacity:1;border-color:rgb(241 245 249 / var(--tw-border-opacity))} .border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240 / var(--tw-border-opacity))} .border-transparent{border-color:transparent} .border-white{--tw-border-opacity:1;border-color:rgb(255 255 255 / var(--tw-border-opacity))} .border-yellow-200{--tw-border-opacity:1;border-color:rgb(254 240 138 / var(--tw-border-opacity))} .border-r-transparent{border-right-color:transparent} .border-t-cyan-600{--tw-border-opacity:1;border-top-color:rgb(8 145 178 / var(--tw-border-opacity))} .border-t-gray-600{--tw-border-opacity:1;border-top-color:rgb(75 85 99 / var(--tw-border-opacity))} .border-t-gray-900{--tw-border-opacity:1;border-top-color:rgb(17 24 39 / var(--tw-border-opacity))} .border-t-red-600{--tw-border-opacity:1;border-top-color:rgb(220 38 38 / var(--tw-border-opacity))} .border-t-transparent{border-top-color:transparent} .bg-amber-100{--tw-bg-opacity:1;background-color:rgb(254 243 199 / var(--tw-bg-opacity))} .bg-amber-400{--tw-bg-opacity:1;background-color:rgb(251 191 36 / var(--tw-bg-opacity))} .bg-amber-50{--tw-bg-opacity:1;background-color:rgb(255 251 235 / var(--tw-bg-opacity))} .bg-amber-600{--tw-bg-opacity:1;background-color:rgb(217 119 6 / var(--tw-bg-opacity))} .bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity))} .bg-black\/10{background-color:rgb(0 0 0 / 0.1)} .bg-black\/70{background-color:rgb(0 0 0 / 0.7)} .bg-blue-100{--tw-bg-opacity:1;background-color:rgb(219 234 254 / var(--tw-bg-opacity))} .bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255 / var(--tw-bg-opacity))} .bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246 / var(--tw-bg-opacity))} .bg-brand-1{background-color:var(--brand-1)} .bg-cyan-100{--tw-bg-opacity:1;background-color:rgb(207 250 254 / var(--tw-bg-opacity))} .bg-cyan-50{--tw-bg-opacity:1;background-color:rgb(236 254 255 / var(--tw-bg-opacity))} .bg-cyan-600{--tw-bg-opacity:1;background-color:rgb(8 145 178 / var(--tw-bg-opacity))} .bg-cyan-600\/10{background-color:rgb(8 145 178 / 0.1)} .bg-cyan-700{--tw-bg-opacity:1;background-color:rgb(14 116 144 / var(--tw-bg-opacity))} .bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))} .bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))} .bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219 / var(--tw-bg-opacity))} .bg-gray-400{--tw-bg-opacity:1;background-color:rgb(156 163 175 / var(--tw-bg-opacity))} .bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity))} .bg-gray-600{--tw-bg-opacity:1;background-color:rgb(75 85 99 / var(--tw-bg-opacity))} .bg-gray-900{--tw-bg-opacity:1;background-color:rgb(17 24 39 / var(--tw-bg-opacity))} .bg-green-100{--tw-bg-opacity:1;background-color:rgb(220 252 231 / var(--tw-bg-opacity))} .bg-green-50{--tw-bg-opacity:1;background-color:rgb(240 253 244 / var(--tw-bg-opacity))} .bg-green-500{--tw-bg-opacity:1;background-color:rgb(34 197 94 / var(--tw-bg-opacity))} .bg-lime-400{--tw-bg-opacity:1;background-color:rgb(163 230 53 / var(--tw-bg-opacity))} .bg-myblue{--tw-bg-opacity:1;background-color:rgb(41 63 88 / var(--tw-bg-opacity))} .bg-myblue\/20{background-color:rgb(41 63 88 / 0.2)} .bg-mydarkgrey{--tw-bg-opacity:1;background-color:rgb(57 61 52 / var(--tw-bg-opacity))} .bg-mylightgrey{--tw-bg-opacity:1;background-color:rgb(167 177 183 / var(--tw-bg-opacity))} .bg-myoffwhite{--tw-bg-opacity:1;background-color:rgb(227 227 227 / var(--tw-bg-opacity))} .bg-myorange{--tw-bg-opacity:1;background-color:rgb(245 131 51 / var(--tw-bg-opacity))} .bg-mywhite{--tw-bg-opacity:1;background-color:rgb(252 252 252 / var(--tw-bg-opacity))} .bg-orange-100{--tw-bg-opacity:1;background-color:rgb(255 237 213 / var(--tw-bg-opacity))} .bg-orange-50{--tw-bg-opacity:1;background-color:rgb(255 247 237 / var(--tw-bg-opacity))} .bg-orange-500{--tw-bg-opacity:1;background-color:rgb(249 115 22 / var(--tw-bg-opacity))} .bg-orange-600{--tw-bg-opacity:1;background-color:rgb(234 88 12 / var(--tw-bg-opacity))} .bg-red-100{--tw-bg-opacity:1;background-color:rgb(254 226 226 / var(--tw-bg-opacity))} .bg-red-400{--tw-bg-opacity:1;background-color:rgb(248 113 113 / var(--tw-bg-opacity))} .bg-red-50{--tw-bg-opacity:1;background-color:rgb(254 242 242 / var(--tw-bg-opacity))} .bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68 / var(--tw-bg-opacity))} .bg-red-600{--tw-bg-opacity:1;background-color:rgb(220 38 38 / var(--tw-bg-opacity))} .bg-red-700{--tw-bg-opacity:1;background-color:rgb(185 28 28 / var(--tw-bg-opacity))} .bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240 / var(--tw-bg-opacity))} .bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))} .bg-teal-400{--tw-bg-opacity:1;background-color:rgb(45 212 191 / var(--tw-bg-opacity))} .bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))} .bg-yellow-100{--tw-bg-opacity:1;background-color:rgb(254 249 195 / var(--tw-bg-opacity))} .bg-yellow-50{--tw-bg-opacity:1;background-color:rgb(254 252 232 / var(--tw-bg-opacity))} .bg-opacity-0{--tw-bg-opacity:0} .bg-opacity-20{--tw-bg-opacity:0.2} .bg-opacity-50{--tw-bg-opacity:0.5} .bg-opacity-75{--tw-bg-opacity:0.75} .bg-opacity-80{--tw-bg-opacity:0.8} .bg-opacity-90{--tw-bg-opacity:0.9} .bg-gradient-to-b{background-image:linear-gradient(to bottom, var(--tw-gradient-stops))} .from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)} .to-white{--tw-gradient-to:#fff var(--tw-gradient-to-position)} .object-contain{object-fit:contain} .object-cover{object-fit:cover} .p-0{padding:0px} .p-1{padding:0.25rem} .p-2{padding:0.5rem} .p-3{padding:0.75rem} .p-4{padding:1rem} .p-6{padding:1.5rem} .p-8{padding:2rem} .px-1{padding-left:0.25rem;padding-right:0.25rem} .px-12{padding-left:3rem;padding-right:3rem} .px-2{padding-left:0.5rem;padding-right:0.5rem} .px-3{padding-left:0.75rem;padding-right:0.75rem} .px-4{padding-left:1rem;padding-right:1rem} .px-5{padding-left:1.25rem;padding-right:1.25rem} .px-6{padding-left:1.5rem;padding-right:1.5rem} .px-8{padding-left:2rem;padding-right:2rem} .px-9{padding-left:2.25rem;padding-right:2.25rem} .py-1{padding-top:0.25rem;padding-bottom:0.25rem} .py-10{padding-top:2.5rem;padding-bottom:2.5rem} .py-12{padding-top:3rem;padding-bottom:3rem} .py-2{padding-top:0.5rem;padding-bottom:0.5rem} .py-24{padding-top:6rem;padding-bottom:6rem} .py-3{padding-top:0.75rem;padding-bottom:0.75rem} .py-4{padding-top:1rem;padding-bottom:1rem} .py-5{padding-top:1.25rem;padding-bottom:1.25rem} .py-6{padding-top:1.5rem;padding-bottom:1.5rem} .py-8{padding-top:2rem;padding-bottom:2rem} .pb-2{padding-bottom:0.5rem} .pb-3{padding-bottom:0.75rem} .pb-4{padding-bottom:1rem} .pb-6{padding-bottom:1.5rem} .pl-10{padding-left:2.5rem} .pl-12{padding-left:3rem} .pl-2{padding-left:0.5rem} .pl-3{padding-left:0.75rem} .pl-5{padding-left:1.25rem} .pl-6{padding-left:1.5rem} .pr-0{padding-right:0px} .pr-10{padding-right:2.5rem} .pr-12{padding-right:3rem} .pr-16{padding-right:4rem} .pr-2{padding-right:0.5rem} .pr-3{padding-right:0.75rem} .pr-4{padding-right:1rem} .pr-8{padding-right:2rem} .pr-9{padding-right:2.25rem} .pt-12{padding-top:3rem} .pt-2{padding-top:0.5rem} .pt-4{padding-top:1rem} .pt-6{padding-top:1.5rem} .pt-8{padding-top:2rem} .text-left{text-align:left} .text-center{text-align:center} .text-right{text-align:right} .font-action{font-family:var(--font-action), Inter, Georgia, Times New Roman, Times, serif} .font-main{font-family:var(--font-main), Inter, Arial, Helvetica Neue, Helvetica, sans-serif} .font-mono{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace} .font-sans{font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"} .text-2xl{font-size:1.5rem} .text-3xl{font-size:1.875rem} .text-base{font-size:1rem} .text-lg{font-size:1.125rem} .text-sm{font-size:0.875rem} .text-xl{font-size:1.25rem} .text-xs{font-size:0.75rem} .font-bold{font-weight:700} .font-medium{font-weight:500} .font-normal{font-weight:400} .font-semibold{font-weight:600} .uppercase{text-transform:uppercase} .lowercase{text-transform:lowercase} .capitalize{text-transform:capitalize} .normal-case{text-transform:none} .italic{font-style:italic} .not-italic{font-style:normal} .leading-5{line-height:1.25rem} .leading-6{line-height:1.5rem} .leading-9{line-height:2.25rem} .leading-none{line-height:1} .leading-relaxed{line-height:1.625} .tracking-tight{letter-spacing:-0.025em} .tracking-wide{letter-spacing:0.025em} .tracking-wider{letter-spacing:0.05em} .text-amber-400{--tw-text-opacity:1;color:rgb(251 191 36 / var(--tw-text-opacity))} .text-amber-500{--tw-text-opacity:1;color:rgb(245 158 11 / var(--tw-text-opacity))} .text-amber-600{--tw-text-opacity:1;color:rgb(217 119 6 / var(--tw-text-opacity))} .text-amber-700{--tw-text-opacity:1;color:rgb(180 83 9 / var(--tw-text-opacity))} .text-amber-800{--tw-text-opacity:1;color:rgb(146 64 14 / var(--tw-text-opacity))} .text-black{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))} .text-black\/20{color:rgb(0 0 0 / 0.2)} .text-blue-300{--tw-text-opacity:1;color:rgb(147 197 253 / var(--tw-text-opacity))} .text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246 / var(--tw-text-opacity))} .text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity))} .text-blue-700{--tw-text-opacity:1;color:rgb(29 78 216 / var(--tw-text-opacity))} .text-blue-800{--tw-text-opacity:1;color:rgb(30 64 175 / var(--tw-text-opacity))} .text-cyan-500{--tw-text-opacity:1;color:rgb(6 182 212 / var(--tw-text-opacity))} .text-cyan-600{--tw-text-opacity:1;color:rgb(8 145 178 / var(--tw-text-opacity))} .text-cyan-700{--tw-text-opacity:1;color:rgb(14 116 144 / var(--tw-text-opacity))} .text-cyan-800{--tw-text-opacity:1;color:rgb(21 94 117 / var(--tw-text-opacity))} .text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219 / var(--tw-text-opacity))} .text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity))} .text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity))} .text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity))} .text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81 / var(--tw-text-opacity))} .text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55 / var(--tw-text-opacity))} .text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity))} .text-green-400{--tw-text-opacity:1;color:rgb(74 222 128 / var(--tw-text-opacity))} .text-green-500{--tw-text-opacity:1;color:rgb(34 197 94 / var(--tw-text-opacity))} .text-green-600{--tw-text-opacity:1;color:rgb(22 163 74 / var(--tw-text-opacity))} .text-green-700{--tw-text-opacity:1;color:rgb(21 128 61 / var(--tw-text-opacity))} .text-green-800{--tw-text-opacity:1;color:rgb(22 101 52 / var(--tw-text-opacity))} .text-myblack{--tw-text-opacity:1;color:rgb(16 18 13 / var(--tw-text-opacity))} .text-myblue{--tw-text-opacity:1;color:rgb(41 63 88 / var(--tw-text-opacity))} .text-myblue\/80{color:rgb(41 63 88 / 0.8)} .text-mydarkgrey{--tw-text-opacity:1;color:rgb(57 61 52 / var(--tw-text-opacity))} .text-mylightgrey{--tw-text-opacity:1;color:rgb(167 177 183 / var(--tw-text-opacity))} .text-myorange{--tw-text-opacity:1;color:rgb(245 131 51 / var(--tw-text-opacity))} .text-orange-400{--tw-text-opacity:1;color:rgb(251 146 60 / var(--tw-text-opacity))} .text-orange-500{--tw-text-opacity:1;color:rgb(249 115 22 / var(--tw-text-opacity))} .text-orange-600{--tw-text-opacity:1;color:rgb(234 88 12 / var(--tw-text-opacity))} .text-orange-700{--tw-text-opacity:1;color:rgb(194 65 12 / var(--tw-text-opacity))} .text-orange-800{--tw-text-opacity:1;color:rgb(154 52 18 / var(--tw-text-opacity))} .text-red-400{--tw-text-opacity:1;color:rgb(248 113 113 / var(--tw-text-opacity))} .text-red-500{--tw-text-opacity:1;color:rgb(239 68 68 / var(--tw-text-opacity))} .text-red-600{--tw-text-opacity:1;color:rgb(220 38 38 / var(--tw-text-opacity))} .text-red-700{--tw-text-opacity:1;color:rgb(185 28 28 / var(--tw-text-opacity))} .text-red-800{--tw-text-opacity:1;color:rgb(153 27 27 / var(--tw-text-opacity))} .text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .text-yellow-700{--tw-text-opacity:1;color:rgb(161 98 7 / var(--tw-text-opacity))} .text-yellow-800{--tw-text-opacity:1;color:rgb(133 77 14 / var(--tw-text-opacity))} .underline{text-decoration-line:underline} .overline{text-decoration-line:overline} .line-through{text-decoration-line:line-through} .no-underline{text-decoration-line:none} .underline-offset-4{text-underline-offset:4px} .placeholder-gray-400::placeholder{--tw-placeholder-opacity:1;color:rgb(156 163 175 / var(--tw-placeholder-opacity))} .placeholder-gray-500::placeholder{--tw-placeholder-opacity:1;color:rgb(107 114 128 / var(--tw-placeholder-opacity))} .opacity-0{opacity:0} .opacity-100{opacity:1} .opacity-25{opacity:0.25} .opacity-50{opacity:0.5} .opacity-60{opacity:0.6} .opacity-75{opacity:0.75} .mix-blend-difference{mix-blend-mode:difference} .shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-inner{--tw-shadow:inset 0 2px 4px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:inset 0 2px 4px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-md{--tw-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-sm{--tw-shadow:0 1px 2px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-xl{--tw-shadow:0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .outline{outline-style:solid} .outline-dashed{outline-style:dashed} .outline-dotted{outline-style:dotted} .outline-2{outline-width:2px} .outline-4{outline-width:4px} .outline-offset-2{outline-offset:2px} .outline-cyan-500{outline-color:#06b6d4} .outline-cyan-600{outline-color:#0891b2} .outline-red-700{outline-color:#b91c1c} .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(3px + 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 #0000)} .ring-0{--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(0px + 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 #0000)} .ring-1{--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(1px + 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 #0000)} .ring-2{--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 #0000)} .ring-inset{--tw-ring-inset:inset} .ring-black{--tw-ring-opacity:1;--tw-ring-color:rgb(0 0 0 / var(--tw-ring-opacity))} .ring-black\/5{--tw-ring-color:rgb(0 0 0 / 0.05)} .ring-cyan-600{--tw-ring-opacity:1;--tw-ring-color:rgb(8 145 178 / var(--tw-ring-opacity))} .ring-gray-300{--tw-ring-opacity:1;--tw-ring-color:rgb(209 213 219 / var(--tw-ring-opacity))} .ring-mydarkgrey\/5{--tw-ring-color:rgb(57 61 52 / 0.05)} .ring-mygreen{--tw-ring-opacity:1;--tw-ring-color:rgb(200 223 140 / var(--tw-ring-opacity))} .ring-mylightgrey{--tw-ring-opacity:1;--tw-ring-color:rgb(167 177 183 / var(--tw-ring-opacity))} .ring-orange-500{--tw-ring-opacity:1;--tw-ring-color:rgb(249 115 22 / var(--tw-ring-opacity))} .ring-red-300{--tw-ring-opacity:1;--tw-ring-color:rgb(252 165 165 / var(--tw-ring-opacity))} .ring-opacity-5{--tw-ring-opacity:0.05} .blur{--tw-blur:blur(8px);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)} .drop-shadow{--tw-drop-shadow:drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));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)} .grayscale{--tw-grayscale:grayscale(100%);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)} .invert{--tw-invert:invert(100%);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)} .sepia{--tw-sepia:sepia(100%);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)} .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{--tw-backdrop-blur:blur(8px);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)} .backdrop-blur-sm{--tw-backdrop-blur:blur(4px);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)} .backdrop-grayscale{--tw-backdrop-grayscale:grayscale(100%);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)} .backdrop-invert{--tw-backdrop-invert:invert(100%);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)} .backdrop-sepia{--tw-backdrop-sepia:sepia(100%);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-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .duration-150{transition-duration:150ms} .duration-200{transition-duration:200ms} .duration-300{transition-duration:300ms} .ease-in{transition-timing-function:cubic-bezier(0.4, 0, 1, 1)} .ease-in-out{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)} .ease-out{transition-timing-function:cubic-bezier(0, 0, 0.2, 1)} .placeholder\:text-gray-400::placeholder{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity))} .placeholder\:text-mydarkgrey::placeholder{--tw-text-opacity:1;color:rgb(57 61 52 / var(--tw-text-opacity))} .placeholder\:text-mylightgrey::placeholder{--tw-text-opacity:1;color:rgb(167 177 183 / var(--tw-text-opacity))} .before\:pointer-events-none::before{content:var(--tw-content);pointer-events:none} .before\:absolute::before{content:var(--tw-content);position:absolute} .before\:inset-0::before{content:var(--tw-content);inset:0px} .before\:opacity-50::before{content:var(--tw-content);opacity:0.5} .before\:outline-dashed::before{content:var(--tw-content);outline-style:dashed} .before\:outline-4::before{content:var(--tw-content);outline-width:4px} .before\:outline-red-700::before{content:var(--tw-content);outline-color:#b91c1c} .last\:border-b-0:last-child{border-bottom-width:0px} .focus-within\:border-myblue:focus-within{--tw-border-opacity:1;border-color:rgb(41 63 88 / var(--tw-border-opacity))} .focus-within\:ring-1:focus-within{--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(1px + 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 #0000)} .focus-within\:ring-myblue:focus-within{--tw-ring-opacity:1;--tw-ring-color:rgb(41 63 88 / var(--tw-ring-opacity))} .hover\:rotate-1:hover{--tw-rotate:1deg;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))} .hover\:rotate-3:hover{--tw-rotate:3deg;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))} .hover\:rotate-6:hover{--tw-rotate:6deg;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))} .hover\:rounded:hover{border-radius:0.25rem} .hover\:border-black:hover{--tw-border-opacity:1;border-color:rgb(0 0 0 / var(--tw-border-opacity))} .hover\:border-cyan-100:hover{--tw-border-opacity:1;border-color:rgb(207 250 254 / var(--tw-border-opacity))} .hover\:border-cyan-400:hover{--tw-border-opacity:1;border-color:rgb(34 211 238 / var(--tw-border-opacity))} .hover\:border-cyan-500:hover{--tw-border-opacity:1;border-color:rgb(6 182 212 / var(--tw-border-opacity))} .hover\:border-cyan-600:hover{--tw-border-opacity:1;border-color:rgb(8 145 178 / var(--tw-border-opacity))} .hover\:border-cyan-700:hover{--tw-border-opacity:1;border-color:rgb(14 116 144 / var(--tw-border-opacity))} .hover\:border-gray-300:hover{--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity))} .hover\:bg-amber-50:hover{--tw-bg-opacity:1;background-color:rgb(255 251 235 / var(--tw-bg-opacity))} .hover\:bg-amber-700:hover{--tw-bg-opacity:1;background-color:rgb(180 83 9 / var(--tw-bg-opacity))} .hover\:bg-black:hover{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity))} .hover\:bg-blue-50:hover{--tw-bg-opacity:1;background-color:rgb(239 246 255 / var(--tw-bg-opacity))} .hover\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235 / var(--tw-bg-opacity))} .hover\:bg-brand-3:hover{background-color:var(--brand-3)} .hover\:bg-cyan-100:hover{--tw-bg-opacity:1;background-color:rgb(207 250 254 / var(--tw-bg-opacity))} .hover\:bg-cyan-200:hover{--tw-bg-opacity:1;background-color:rgb(165 243 252 / var(--tw-bg-opacity))} .hover\:bg-cyan-50:hover{--tw-bg-opacity:1;background-color:rgb(236 254 255 / var(--tw-bg-opacity))} .hover\:bg-cyan-50\/20:hover{background-color:rgb(236 254 255 / 0.2)} .hover\:bg-cyan-500:hover{--tw-bg-opacity:1;background-color:rgb(6 182 212 / var(--tw-bg-opacity))} .hover\:bg-cyan-600:hover{--tw-bg-opacity:1;background-color:rgb(8 145 178 / var(--tw-bg-opacity))} .hover\:bg-cyan-600\/20:hover{background-color:rgb(8 145 178 / 0.2)} .hover\:bg-cyan-700:hover{--tw-bg-opacity:1;background-color:rgb(14 116 144 / var(--tw-bg-opacity))} .hover\:bg-cyan-800:hover{--tw-bg-opacity:1;background-color:rgb(21 94 117 / var(--tw-bg-opacity))} .hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))} .hover\:bg-gray-200:hover{--tw-bg-opacity:1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))} .hover\:bg-gray-300:hover{--tw-bg-opacity:1;background-color:rgb(209 213 219 / var(--tw-bg-opacity))} .hover\:bg-gray-400:hover{--tw-bg-opacity:1;background-color:rgb(156 163 175 / var(--tw-bg-opacity))} .hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity))} .hover\:bg-gray-700:hover{--tw-bg-opacity:1;background-color:rgb(55 65 81 / var(--tw-bg-opacity))} .hover\:bg-green-200:hover{--tw-bg-opacity:1;background-color:rgb(187 247 208 / var(--tw-bg-opacity))} .hover\:bg-myblack:hover{--tw-bg-opacity:1;background-color:rgb(16 18 13 / var(--tw-bg-opacity))} .hover\:bg-myblue\/10:hover{background-color:rgb(41 63 88 / 0.1)} .hover\:bg-mydarkgrey\/10:hover{background-color:rgb(57 61 52 / 0.1)} .hover\:bg-mygreen\/20:hover{background-color:rgb(200 223 140 / 0.2)} .hover\:bg-mylightgrey:hover{--tw-bg-opacity:1;background-color:rgb(167 177 183 / var(--tw-bg-opacity))} .hover\:bg-myorange:hover{--tw-bg-opacity:1;background-color:rgb(245 131 51 / var(--tw-bg-opacity))} .hover\:bg-orange-100:hover{--tw-bg-opacity:1;background-color:rgb(255 237 213 / var(--tw-bg-opacity))} .hover\:bg-orange-200:hover{--tw-bg-opacity:1;background-color:rgb(254 215 170 / var(--tw-bg-opacity))} .hover\:bg-orange-500:hover{--tw-bg-opacity:1;background-color:rgb(249 115 22 / var(--tw-bg-opacity))} .hover\:bg-orange-600:hover{--tw-bg-opacity:1;background-color:rgb(234 88 12 / var(--tw-bg-opacity))} .hover\:bg-red-200:hover{--tw-bg-opacity:1;background-color:rgb(254 202 202 / var(--tw-bg-opacity))} .hover\:bg-red-50:hover{--tw-bg-opacity:1;background-color:rgb(254 242 242 / var(--tw-bg-opacity))} .hover\:bg-red-700:hover{--tw-bg-opacity:1;background-color:rgb(185 28 28 / var(--tw-bg-opacity))} .hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))} .hover\:bg-white\/50:hover{background-color:rgb(255 255 255 / 0.5)} .hover\:bg-opacity-100:hover{--tw-bg-opacity:1} .hover\:bg-opacity-20:hover{--tw-bg-opacity:0.2} .hover\:font-bold:hover{font-weight:700} .hover\:text-black:hover{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))} .hover\:text-blue-600:hover{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity))} .hover\:text-cyan-600:hover{--tw-text-opacity:1;color:rgb(8 145 178 / var(--tw-text-opacity))} .hover\:text-cyan-700:hover{--tw-text-opacity:1;color:rgb(14 116 144 / var(--tw-text-opacity))} .hover\:text-cyan-800:hover{--tw-text-opacity:1;color:rgb(21 94 117 / var(--tw-text-opacity))} .hover\:text-cyan-900:hover{--tw-text-opacity:1;color:rgb(22 78 99 / var(--tw-text-opacity))} .hover\:text-gray-500:hover{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity))} .hover\:text-gray-600:hover{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity))} .hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81 / var(--tw-text-opacity))} .hover\:text-gray-800:hover{--tw-text-opacity:1;color:rgb(31 41 55 / var(--tw-text-opacity))} .hover\:text-gray-900:hover{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity))} .hover\:text-green-500:hover{--tw-text-opacity:1;color:rgb(34 197 94 / var(--tw-text-opacity))} .hover\:text-myblack:hover{--tw-text-opacity:1;color:rgb(16 18 13 / var(--tw-text-opacity))} .hover\:text-myblue:hover{--tw-text-opacity:1;color:rgb(41 63 88 / var(--tw-text-opacity))} .hover\:text-myorange:hover{--tw-text-opacity:1;color:rgb(245 131 51 / var(--tw-text-opacity))} .hover\:text-orange-600:hover{--tw-text-opacity:1;color:rgb(234 88 12 / var(--tw-text-opacity))} .hover\:text-red-600:hover{--tw-text-opacity:1;color:rgb(220 38 38 / var(--tw-text-opacity))} .hover\:text-red-700:hover{--tw-text-opacity:1;color:rgb(185 28 28 / var(--tw-text-opacity))} .hover\:text-red-800:hover{--tw-text-opacity:1;color:rgb(153 27 27 / var(--tw-text-opacity))} .hover\:text-red-900:hover{--tw-text-opacity:1;color:rgb(127 29 29 / var(--tw-text-opacity))} .hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .hover\:underline:hover{text-decoration-line:underline} .hover\:decoration-dashed:hover{text-decoration-style:dashed} .hover\:decoration-4:hover{text-decoration-thickness:4px} .hover\:underline-offset-4:hover{text-underline-offset:4px} .hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .hover\:outline:hover{outline-style:solid} .hover\:ring-2:hover{--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 #0000)} .hover\:ring-cyan-600:hover{--tw-ring-opacity:1;--tw-ring-color:rgb(8 145 178 / var(--tw-ring-opacity))} .hover\:before\:bg-red-600\/50:hover::before{content:var(--tw-content);background-color:rgb(220 38 38 / 0.5)} .hover\:before\:opacity-100:hover::before{content:var(--tw-content);opacity:1} .focus\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(59 130 246 / var(--tw-border-opacity))} .focus\:border-cyan-500:focus{--tw-border-opacity:1;border-color:rgb(6 182 212 / var(--tw-border-opacity))} .focus\:border-cyan-600:focus{--tw-border-opacity:1;border-color:rgb(8 145 178 / var(--tw-border-opacity))} .focus\:border-cyan-700:focus{--tw-border-opacity:1;border-color:rgb(14 116 144 / var(--tw-border-opacity))} .focus\:border-indigo-500:focus{--tw-border-opacity:1;border-color:rgb(99 102 241 / var(--tw-border-opacity))} .focus\:border-myblue:focus{--tw-border-opacity:1;border-color:rgb(41 63 88 / var(--tw-border-opacity))} .focus\:border-red-500:focus{--tw-border-opacity:1;border-color:rgb(239 68 68 / var(--tw-border-opacity))} .focus\:bg-brand-7:focus{background-color:var(--brand-7)} .focus\:bg-cyan-700:focus{--tw-bg-opacity:1;background-color:rgb(14 116 144 / var(--tw-bg-opacity))} .focus\:text-black:focus{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))} .focus\:text-gray-600:focus{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity))} .focus\:text-red-600:focus{--tw-text-opacity:1;color:rgb(220 38 38 / var(--tw-text-opacity))} .focus\:text-white:focus{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .focus\:underline:focus{text-decoration-line:underline} .focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px} .focus\:outline-offset-0:focus{outline-offset:0px} .focus\:ring-0: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(0px + 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 #0000)} .focus\:ring-1: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(1px + 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 #0000)} .focus\:ring-2: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(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 #0000)} .focus\:ring-inset:focus{--tw-ring-inset:inset} .focus\:ring-amber-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(245 158 11 / var(--tw-ring-opacity))} .focus\:ring-blue-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(59 130 246 / var(--tw-ring-opacity))} .focus\:ring-brand-1:focus{--tw-ring-color:var(--brand-1)} .focus\:ring-cyan-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(6 182 212 / var(--tw-ring-opacity))} .focus\:ring-cyan-600:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(8 145 178 / var(--tw-ring-opacity))} .focus\:ring-cyan-700:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(14 116 144 / var(--tw-ring-opacity))} .focus\:ring-indigo-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(99 102 241 / var(--tw-ring-opacity))} .focus\:ring-myblue:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(41 63 88 / var(--tw-ring-opacity))} .focus\:ring-myorange:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(245 131 51 / var(--tw-ring-opacity))} .focus\:ring-red-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(239 68 68 / var(--tw-ring-opacity))} .focus\:ring-offset-2:focus{--tw-ring-offset-width:2px} .focus\:before\:bg-red-600\/50:focus::before{content:var(--tw-content);background-color:rgb(220 38 38 / 0.5)} .focus\:before\:opacity-100:focus::before{content:var(--tw-content);opacity:1} .focus-visible\:outline:focus-visible{outline-style:solid} .focus-visible\:outline-2:focus-visible{outline-width:2px} .focus-visible\:outline-offset-2:focus-visible{outline-offset:2px} .focus-visible\:outline-cyan-600:focus-visible{outline-color:#0891b2} .focus-visible\:outline-myorange:focus-visible{outline-color:#f58333} .disabled\:cursor-not-allowed:disabled{cursor:not-allowed} .disabled\:text-gray-400:disabled{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity))} .disabled\:opacity-50:disabled{opacity:0.5} .disabled\:hover\:bg-transparent:hover:disabled{background-color:transparent} .group:focus-within .group-focus-within\:bg-red-700{--tw-bg-opacity:1;background-color:rgb(185 28 28 / var(--tw-bg-opacity))} .group:focus-within .group-focus-within\:text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .group:focus-within .group-focus-within\:opacity-100{opacity:1} .group:hover .group-hover\:visible{visibility:visible} .group:hover .group-hover\:bg-cyan-200{--tw-bg-opacity:1;background-color:rgb(165 243 252 / var(--tw-bg-opacity))} .group:hover .group-hover\:bg-red-700{--tw-bg-opacity:1;background-color:rgb(185 28 28 / var(--tw-bg-opacity))} .group:hover .group-hover\:bg-slate-200\/20{background-color:rgb(226 232 240 / 0.2)} .group:hover .group-hover\:bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))} .group:hover .group-hover\:text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity))} .group:hover .group-hover\:text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .group:hover .group-hover\:opacity-100{opacity:1} @media (prefers-reduced-motion: no-preference){@keyframes bounce{0%, 100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,0.2,1)}}.motion-safe\:animate-bounce{animation:bounce 1s infinite}@keyframes pulse{50%{opacity:.5}}.motion-safe\:animate-pulse{animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}@keyframes wiggle{0%, 100%{transform:translateX(3%)}50%{transform:translateX(0)}}.motion-safe\:animate-wig{animation:wiggle 1s ease-in-out infinite}.motion-safe\:scroll-smooth{scroll-behavior:smooth}} @media (min-width: 0px){.xs\:flex{display:flex}.xs\:hidden{display:none}.xs\:flex-row{flex-direction:row}.xs\:items-start{align-items:flex-start}.xs\:justify-between{justify-content:space-between}.xs\:text-sm{font-size:0.875rem}.xs\:leading-6{line-height:1.5rem}} @media (min-width: 801px){.md\:static{position:static}.md\:fixed{position:fixed}.md\:sticky{position:sticky}.md\:bottom-0{bottom:0px}.md\:bottom-auto{bottom:auto}.md\:left-0{left:0px}.md\:top-24{top:6rem}.md\:col-span-1{grid-column:span 1 / span 1}.md\:col-span-2{grid-column:span 2 / span 2}.md\:col-span-3{grid-column:span 3 / span 3}.md\:mx-10{margin-left:2.5rem;margin-right:2.5rem}.md\:mb-10{margin-bottom:2.5rem}.md\:ml-16{margin-left:4rem}.md\:mt-0{margin-top:0px}.md\:block{display:block}.md\:flex{display:flex}.md\:table-cell{display:table-cell}.md\:hidden{display:none}.md\:h-8{height:2rem}.md\:h-screen{height:100vh}.md\:w-1\/2{width:50%}.md\:w-16{width:4rem}.md\:w-2\/5{width:40%}.md\:w-3\/5{width:60%}.md\:max-w-72{max-width:18rem}.md\:flex-1{flex:1 1 0%}.md\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4, minmax(0, 1fr))}.md\:flex-row{flex-direction:row}.md\:flex-col{flex-direction:column}.md\:items-center{align-items:center}.md\:justify-between{justify-content:space-between}.md\:gap-10{gap:2.5rem}.md\:gap-2{gap:0.5rem}.md\:gap-4{gap:1rem}.md\:gap-8{gap:2rem}.md\:space-x-0 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0px * var(--tw-space-x-reverse));margin-left:calc(0px * calc(1 - var(--tw-space-x-reverse)))}.md\:space-x-6 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1.5rem * var(--tw-space-x-reverse));margin-left:calc(1.5rem * calc(1 - var(--tw-space-x-reverse)))}.md\:space-y-0 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px * var(--tw-space-y-reverse))}.md\:space-y-2 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}.md\:rounded-lg{border-radius:0.5rem}.md\:border-l-2{border-left-width:2px}.md\:border-t-0{border-top-width:0px}.md\:p-8{padding:2rem}.md\:px-14{padding-left:3.5rem;padding-right:3.5rem}.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:py-2{padding-top:0.5rem;padding-bottom:0.5rem}.md\:pt-0{padding-top:0px}.md\:text-3xl{font-size:1.875rem}} @media (min-width: 1367px){.xl\:block{display:block}.xl\:table-cell{display:table-cell}.xl\:hidden{display:none}.xl\:max-w-screen-xl{max-width:1367px}.xl\:gap-12{gap:3rem}.xl\:px-32{padding-left:8rem;padding-right:8rem}.xl\:px-6{padding-left:1.5rem;padding-right:1.5rem}} @media (prefers-color-scheme: dark){.dark\:border-cyan-600{--tw-border-opacity:1;border-color:rgb(8 145 178 / var(--tw-border-opacity))}.dark\:bg-cyan-800{--tw-bg-opacity:1;background-color:rgb(21 94 117 / var(--tw-bg-opacity))}.dark\:bg-cyan-900{--tw-bg-opacity:1;background-color:rgb(22 78 99 / var(--tw-bg-opacity))}.dark\:text-cyan-300{--tw-text-opacity:1;color:rgb(103 232 249 / var(--tw-text-opacity))}.dark\:hover\:bg-cyan-800:hover{--tw-bg-opacity:1;background-color:rgb(21 94 117 / var(--tw-bg-opacity))}.group:hover .dark\:group-hover\:bg-cyan-700{--tw-bg-opacity:1;background-color:rgb(14 116 144 / var(--tw-bg-opacity))}}
1
+ /* ! tailwindcss v3.4.1 | MIT License | https://tailwindcss.com */*,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:#e5e7eb}:before,:after{--tw-content: ""}html,:host{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;tab-size:4;font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-feature-settings:normal;font-variation-settings:normal;-webkit-tap-highlight-color:transparent}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){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,samp,pre{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;font-feature-settings:normal;font-variation-settings:normal;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-feature-settings:inherit;font-variation-settings:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[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,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*, ::before, ::after{--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:rgb(59 130 246 / 0.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: }::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:rgb(59 130 246 / 0.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: } .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0} .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} .sticky{position:sticky} .inset-0{inset:0px} .inset-y-0{top:0px;bottom:0px} .-right-1{right:-0.25rem} .-top-1{top:-0.25rem} .bottom-0{bottom:0px} .bottom-1{bottom:0.25rem} .bottom-16{bottom:4rem} .bottom-4{bottom:1rem} .bottom-full{bottom:100%} .left-0{left:0px} .left-1\/2{left:50%} .left-2{left:0.5rem} .left-3{left:0.75rem} .right-0{right:0px} .right-1{right:0.25rem} .right-2{right:0.5rem} .right-4{right:1rem} .right-8{right:2rem} .top-0{top:0px} .top-1\/2{top:50%} .top-2{top:0.5rem} .top-4{top:1rem} .top-6{top:1.5rem} .top-8{top:2rem} .top-full{top:100%} .isolate{isolation:isolate} .isolation-auto{isolation:auto} .z-10{z-index:110} .z-101{z-index:1001} .z-102{z-index:1002} .z-50{z-index:510} .col-span-1{grid-column:span 1 / span 1} .col-span-3{grid-column:span 3 / span 3} .mx-1{margin-left:0.25rem;margin-right:0.25rem} .mx-2{margin-left:0.5rem;margin-right:0.5rem} .mx-4{margin-left:1rem;margin-right:1rem} .mx-5{margin-left:1.25rem;margin-right:1.25rem} .mx-auto{margin-left:auto;margin-right:auto} .my-1{margin-top:0.25rem;margin-bottom:0.25rem} .my-16{margin-top:4rem;margin-bottom:4rem} .my-2{margin-top:0.5rem;margin-bottom:0.5rem} .my-3{margin-top:0.75rem;margin-bottom:0.75rem} .my-4{margin-top:1rem;margin-bottom:1rem} .my-8{margin-top:2rem;margin-bottom:2rem} .-mb-px{margin-bottom:-1px} .-ml-1{margin-left:-0.25rem} .mb-1{margin-bottom:0.25rem} .mb-12{margin-bottom:3rem} .mb-2{margin-bottom:0.5rem} .mb-3{margin-bottom:0.75rem} .mb-4{margin-bottom:1rem} .mb-6{margin-bottom:1.5rem} .mb-8{margin-bottom:2rem} .ml-1{margin-left:0.25rem} .ml-2{margin-left:0.5rem} .ml-3{margin-left:0.75rem} .ml-4{margin-left:1rem} .ml-6{margin-left:1.5rem} .ml-auto{margin-left:auto} .mr-1{margin-right:0.25rem} .mr-2{margin-right:0.5rem} .mr-3{margin-right:0.75rem} .mr-4{margin-right:1rem} .mr-6{margin-right:1.5rem} .mt-1{margin-top:0.25rem} .mt-2{margin-top:0.5rem} .mt-3{margin-top:0.75rem} .mt-4{margin-top:1rem} .mt-5{margin-top:1.25rem} .mt-6{margin-top:1.5rem} .mt-8{margin-top:2rem} .line-clamp-1{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1} .line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2} .block{display:block} .inline-block{display:inline-block} .inline{display:inline} .flex{display:flex} .inline-flex{display:inline-flex} .table{display:table} .grid{display:grid} .inline-grid{display:inline-grid} .contents{display:contents} .list-item{display:list-item} .hidden{display:none} .aspect-video{aspect-ratio:16 / 9} .h-1{height:0.25rem} .h-10{height:2.5rem} .h-12{height:3rem} .h-14{height:3.5rem} .h-16{height:4rem} .h-2{height:0.5rem} .h-3{height:0.75rem} .h-32{height:8rem} .h-4{height:1rem} .h-48{height:12rem} .h-5{height:1.25rem} .h-6{height:1.5rem} .h-64{height:16rem} .h-8{height:2rem} .h-9{height:2.25rem} .h-96{height:24rem} .h-auto{height:auto} .h-fit{height:fit-content} .h-full{height:100%} .max-h-32{max-height:8rem} .max-h-40{max-height:10rem} .max-h-56{max-height:14rem} .max-h-60{max-height:15rem} .max-h-64{max-height:16rem} .max-h-96{max-height:24rem} .max-h-full{max-height:100%} .min-h-0{min-height:0px} .min-h-16{min-height:4rem} .min-h-9{min-height:2.25rem} .min-h-full{min-height:100%} .min-h-screen{min-height:100vh} .w-1\/2{width:50%} .w-1\/3{width:33.333333%} .w-10{width:2.5rem} .w-11{width:2.75rem} .w-12{width:3rem} .w-16{width:4rem} .w-2{width:0.5rem} .w-2\/3{width:66.666667%} .w-20{width:5rem} .w-24{width:6rem} .w-3{width:0.75rem} .w-4{width:1rem} .w-40{width:10rem} .w-5{width:1.25rem} .w-6{width:1.5rem} .w-64{width:16rem} .w-8{width:2rem} .w-9{width:2.25rem} .w-96{width:24rem} .w-auto{width:auto} .w-fit{width:fit-content} .w-full{width:100%} .w-screen{width:100vw} .min-w-0{min-width:0px} .min-w-24{min-width:6rem} .min-w-48{min-width:12rem} .min-w-64{min-width:16rem} .min-w-full{min-width:100%} .max-w-2xl{max-width:42rem} .max-w-3xl{max-width:48rem} .max-w-48{max-width:12rem} .max-w-4xl{max-width:56rem} .max-w-5xl{max-width:64rem} .max-w-7xl{max-width:80rem} .max-w-full{max-width:100%} .max-w-lg{max-width:32rem} .max-w-md{max-width:28rem} .max-w-none{max-width:none} .max-w-sm{max-width:24rem} .max-w-xl{max-width:36rem} .flex-1{flex:1 1 0%} .flex-auto{flex:1 1 auto} .flex-shrink-0{flex-shrink:0} .shrink-0{flex-shrink:0} .flex-grow{flex-grow:1} .-translate-x-1\/2{--tw-translate-x:-50%;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%;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-x-0{--tw-translate-x:0px;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-x-1{--tw-translate-x:0.25rem;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-x-5{--tw-translate-x:1.25rem;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-x-6{--tw-translate-x:1.5rem;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-0{--tw-translate-y:0px;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-full{--tw-translate-y:100%;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))} .-rotate-2{--tw-rotate:-2deg;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))} .rotate-180{--tw-rotate:180deg;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))} .scale-125{--tw-scale-x:1.25;--tw-scale-y:1.25;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))} .scale-x-0{--tw-scale-x:0;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))} .transform{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))} @keyframes fadeIn{0%{opacity:.25}100%{opacity:1}} .animate-fadeIn{animation:fadeIn 1s ease-in} @keyframes pulse{50%{opacity:.5}} .animate-pulse{animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite} @keyframes spin{to{transform:rotate(360deg)}} .animate-spin{animation:spin 1s linear infinite} .cursor-default{cursor:default} .cursor-help{cursor:help} .cursor-move{cursor:move} .cursor-not-allowed{cursor:not-allowed} .cursor-pointer{cursor:pointer} .select-none{user-select:none} .resize-y{resize:vertical} .resize{resize:both} .list-inside{list-style-position:inside} .list-disc{list-style-type:disc} .grid-cols-1{grid-template-columns:repeat(1, minmax(0, 1fr))} .grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))} .grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))} .flex-row{flex-direction:row} .flex-row-reverse{flex-direction:row-reverse} .flex-col{flex-direction:column} .flex-wrap{flex-wrap:wrap} .flex-nowrap{flex-wrap:nowrap} .items-start{align-items:flex-start} .items-end{align-items:flex-end} .items-center{align-items:center} .justify-start{justify-content:flex-start} .justify-end{justify-content:flex-end} .justify-center{justify-content:center} .justify-between{justify-content:space-between} .justify-around{justify-content:space-around} .gap-1{gap:0.25rem} .gap-2{gap:0.5rem} .gap-3{gap:0.75rem} .gap-4{gap:1rem} .gap-6{gap:1.5rem} .gap-x-2{column-gap:0.5rem} .gap-x-4{column-gap:1rem} .gap-x-6{column-gap:1.5rem} .gap-x-8{column-gap:2rem} .gap-y-1{row-gap:0.25rem} .gap-y-2{row-gap:0.5rem} .gap-y-3{row-gap:0.75rem} .-space-x-px > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(-1px * var(--tw-space-x-reverse));margin-left:calc(-1px * calc(1 - var(--tw-space-x-reverse)))} .space-x-1 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.25rem * var(--tw-space-x-reverse));margin-left:calc(0.25rem * calc(1 - var(--tw-space-x-reverse)))} .space-x-2 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.5rem * var(--tw-space-x-reverse));margin-left:calc(0.5rem * calc(1 - var(--tw-space-x-reverse)))} .space-x-3 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0.75rem * var(--tw-space-x-reverse));margin-left:calc(0.75rem * calc(1 - var(--tw-space-x-reverse)))} .space-x-4 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1rem * var(--tw-space-x-reverse));margin-left:calc(1rem * calc(1 - var(--tw-space-x-reverse)))} .space-y-1 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.25rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.25rem * var(--tw-space-y-reverse))} .space-y-2 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))} .space-y-3 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.75rem * var(--tw-space-y-reverse))} .space-y-4 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem * var(--tw-space-y-reverse))} .space-y-6 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))} .space-y-8 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(2rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(2rem * var(--tw-space-y-reverse))} .divide-y > :not([hidden]) ~ :not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px * calc(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px * var(--tw-divide-y-reverse))} .divide-gray-100 > :not([hidden]) ~ :not([hidden]){--tw-divide-opacity:1;border-color:rgb(243 244 246 / var(--tw-divide-opacity))} .divide-gray-200 > :not([hidden]) ~ :not([hidden]){--tw-divide-opacity:1;border-color:rgb(229 231 235 / var(--tw-divide-opacity))} .divide-gray-300 > :not([hidden]) ~ :not([hidden]){--tw-divide-opacity:1;border-color:rgb(209 213 219 / var(--tw-divide-opacity))} .justify-self-start{justify-self:start} .overflow-auto{overflow:auto} .overflow-hidden{overflow:hidden} .overflow-visible{overflow:visible} .overflow-x-auto{overflow-x:auto} .overflow-y-auto{overflow-y:auto} .truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap} .text-ellipsis{text-overflow:ellipsis} .text-clip{text-overflow:clip} .whitespace-normal{white-space:normal} .whitespace-nowrap{white-space:nowrap} .text-balance{text-wrap:balance} .text-pretty{text-wrap:pretty} .break-all{word-break:break-all} .rounded{border-radius:0.25rem} .rounded-2xl{border-radius:1rem} .rounded-3xl{border-radius:1.5rem} .rounded-full{border-radius:9999px} .rounded-lg{border-radius:0.5rem} .rounded-md{border-radius:0.375rem} .rounded-sm{border-radius:0.125rem} .rounded-xl{border-radius:0.75rem} .rounded-b-md{border-bottom-right-radius:0.375rem;border-bottom-left-radius:0.375rem} .rounded-l-md{border-top-left-radius:0.375rem;border-bottom-left-radius:0.375rem} .rounded-r-md{border-top-right-radius:0.375rem;border-bottom-right-radius:0.375rem} .rounded-t-md{border-top-left-radius:0.375rem;border-top-right-radius:0.375rem} .border{border-width:1px} .border-0{border-width:0px} .border-2{border-width:2px} .border-4{border-width:4px} .border-b{border-bottom-width:1px} .border-b-2{border-bottom-width:2px} .border-l-2{border-left-width:2px} .border-t{border-top-width:1px} .border-t-2{border-top-width:2px} .border-solid{border-style:solid} .border-dashed{border-style:dashed} .border-dotted{border-style:dotted} .border-none{border-style:none} .border-amber-200{--tw-border-opacity:1;border-color:rgb(253 230 138 / var(--tw-border-opacity))} .border-amber-300{--tw-border-opacity:1;border-color:rgb(252 211 77 / var(--tw-border-opacity))} .border-black\/10{border-color:rgb(0 0 0 / 0.1)} .border-blue-200{--tw-border-opacity:1;border-color:rgb(191 219 254 / var(--tw-border-opacity))} .border-blue-500{--tw-border-opacity:1;border-color:rgb(59 130 246 / var(--tw-border-opacity))} .border-blue-600{--tw-border-opacity:1;border-color:rgb(37 99 235 / var(--tw-border-opacity))} .border-cyan-200{--tw-border-opacity:1;border-color:rgb(165 243 252 / var(--tw-border-opacity))} .border-cyan-400{--tw-border-opacity:1;border-color:rgb(34 211 238 / var(--tw-border-opacity))} .border-cyan-500{--tw-border-opacity:1;border-color:rgb(6 182 212 / var(--tw-border-opacity))} .border-cyan-600{--tw-border-opacity:1;border-color:rgb(8 145 178 / var(--tw-border-opacity))} .border-gray-100{--tw-border-opacity:1;border-color:rgb(243 244 246 / var(--tw-border-opacity))} .border-gray-200{--tw-border-opacity:1;border-color:rgb(229 231 235 / var(--tw-border-opacity))} .border-gray-300{--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity))} .border-gray-500{--tw-border-opacity:1;border-color:rgb(107 114 128 / var(--tw-border-opacity))} .border-green-200{--tw-border-opacity:1;border-color:rgb(187 247 208 / var(--tw-border-opacity))} .border-green-300{--tw-border-opacity:1;border-color:rgb(134 239 172 / var(--tw-border-opacity))} .border-myblue{--tw-border-opacity:1;border-color:rgb(41 63 88 / var(--tw-border-opacity))} .border-myblue\/20{border-color:rgb(41 63 88 / 0.2)} .border-mydarkgrey{--tw-border-opacity:1;border-color:rgb(57 61 52 / var(--tw-border-opacity))} .border-mydarkgrey\/20{border-color:rgb(57 61 52 / 0.2)} .border-mydarkgrey\/30{border-color:rgb(57 61 52 / 0.3)} .border-mylightgrey{--tw-border-opacity:1;border-color:rgb(167 177 183 / var(--tw-border-opacity))} .border-orange-200{--tw-border-opacity:1;border-color:rgb(254 215 170 / var(--tw-border-opacity))} .border-purple-200{--tw-border-opacity:1;border-color:rgb(233 213 255 / var(--tw-border-opacity))} .border-red-200{--tw-border-opacity:1;border-color:rgb(254 202 202 / var(--tw-border-opacity))} .border-red-300{--tw-border-opacity:1;border-color:rgb(252 165 165 / var(--tw-border-opacity))} .border-red-500{--tw-border-opacity:1;border-color:rgb(239 68 68 / var(--tw-border-opacity))} .border-slate-100{--tw-border-opacity:1;border-color:rgb(241 245 249 / var(--tw-border-opacity))} .border-slate-200{--tw-border-opacity:1;border-color:rgb(226 232 240 / var(--tw-border-opacity))} .border-transparent{border-color:transparent} .border-white{--tw-border-opacity:1;border-color:rgb(255 255 255 / var(--tw-border-opacity))} .border-yellow-200{--tw-border-opacity:1;border-color:rgb(254 240 138 / var(--tw-border-opacity))} .border-r-transparent{border-right-color:transparent} .border-t-cyan-600{--tw-border-opacity:1;border-top-color:rgb(8 145 178 / var(--tw-border-opacity))} .border-t-gray-600{--tw-border-opacity:1;border-top-color:rgb(75 85 99 / var(--tw-border-opacity))} .border-t-gray-900{--tw-border-opacity:1;border-top-color:rgb(17 24 39 / var(--tw-border-opacity))} .border-t-red-600{--tw-border-opacity:1;border-top-color:rgb(220 38 38 / var(--tw-border-opacity))} .border-t-transparent{border-top-color:transparent} .bg-amber-100{--tw-bg-opacity:1;background-color:rgb(254 243 199 / var(--tw-bg-opacity))} .bg-amber-400{--tw-bg-opacity:1;background-color:rgb(251 191 36 / var(--tw-bg-opacity))} .bg-amber-50{--tw-bg-opacity:1;background-color:rgb(255 251 235 / var(--tw-bg-opacity))} .bg-amber-600{--tw-bg-opacity:1;background-color:rgb(217 119 6 / var(--tw-bg-opacity))} .bg-black{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity))} .bg-black\/10{background-color:rgb(0 0 0 / 0.1)} .bg-black\/70{background-color:rgb(0 0 0 / 0.7)} .bg-blue-100{--tw-bg-opacity:1;background-color:rgb(219 234 254 / var(--tw-bg-opacity))} .bg-blue-50{--tw-bg-opacity:1;background-color:rgb(239 246 255 / var(--tw-bg-opacity))} .bg-blue-500{--tw-bg-opacity:1;background-color:rgb(59 130 246 / var(--tw-bg-opacity))} .bg-brand-1{background-color:var(--brand-1)} .bg-cyan-100{--tw-bg-opacity:1;background-color:rgb(207 250 254 / var(--tw-bg-opacity))} .bg-cyan-50{--tw-bg-opacity:1;background-color:rgb(236 254 255 / var(--tw-bg-opacity))} .bg-cyan-600{--tw-bg-opacity:1;background-color:rgb(8 145 178 / var(--tw-bg-opacity))} .bg-cyan-600\/10{background-color:rgb(8 145 178 / 0.1)} .bg-cyan-700{--tw-bg-opacity:1;background-color:rgb(14 116 144 / var(--tw-bg-opacity))} .bg-gray-100{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))} .bg-gray-200{--tw-bg-opacity:1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))} .bg-gray-300{--tw-bg-opacity:1;background-color:rgb(209 213 219 / var(--tw-bg-opacity))} .bg-gray-400{--tw-bg-opacity:1;background-color:rgb(156 163 175 / var(--tw-bg-opacity))} .bg-gray-50{--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity))} .bg-gray-600{--tw-bg-opacity:1;background-color:rgb(75 85 99 / var(--tw-bg-opacity))} .bg-gray-900{--tw-bg-opacity:1;background-color:rgb(17 24 39 / var(--tw-bg-opacity))} .bg-green-100{--tw-bg-opacity:1;background-color:rgb(220 252 231 / var(--tw-bg-opacity))} .bg-green-50{--tw-bg-opacity:1;background-color:rgb(240 253 244 / var(--tw-bg-opacity))} .bg-green-500{--tw-bg-opacity:1;background-color:rgb(34 197 94 / var(--tw-bg-opacity))} .bg-lime-400{--tw-bg-opacity:1;background-color:rgb(163 230 53 / var(--tw-bg-opacity))} .bg-myblue{--tw-bg-opacity:1;background-color:rgb(41 63 88 / var(--tw-bg-opacity))} .bg-myblue\/20{background-color:rgb(41 63 88 / 0.2)} .bg-mydarkgrey{--tw-bg-opacity:1;background-color:rgb(57 61 52 / var(--tw-bg-opacity))} .bg-mylightgrey{--tw-bg-opacity:1;background-color:rgb(167 177 183 / var(--tw-bg-opacity))} .bg-myoffwhite{--tw-bg-opacity:1;background-color:rgb(227 227 227 / var(--tw-bg-opacity))} .bg-myorange{--tw-bg-opacity:1;background-color:rgb(245 131 51 / var(--tw-bg-opacity))} .bg-mywhite{--tw-bg-opacity:1;background-color:rgb(252 252 252 / var(--tw-bg-opacity))} .bg-orange-100{--tw-bg-opacity:1;background-color:rgb(255 237 213 / var(--tw-bg-opacity))} .bg-orange-50{--tw-bg-opacity:1;background-color:rgb(255 247 237 / var(--tw-bg-opacity))} .bg-orange-500{--tw-bg-opacity:1;background-color:rgb(249 115 22 / var(--tw-bg-opacity))} .bg-orange-600{--tw-bg-opacity:1;background-color:rgb(234 88 12 / var(--tw-bg-opacity))} .bg-purple-100{--tw-bg-opacity:1;background-color:rgb(243 232 255 / var(--tw-bg-opacity))} .bg-red-100{--tw-bg-opacity:1;background-color:rgb(254 226 226 / var(--tw-bg-opacity))} .bg-red-400{--tw-bg-opacity:1;background-color:rgb(248 113 113 / var(--tw-bg-opacity))} .bg-red-50{--tw-bg-opacity:1;background-color:rgb(254 242 242 / var(--tw-bg-opacity))} .bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68 / var(--tw-bg-opacity))} .bg-red-600{--tw-bg-opacity:1;background-color:rgb(220 38 38 / var(--tw-bg-opacity))} .bg-red-700{--tw-bg-opacity:1;background-color:rgb(185 28 28 / var(--tw-bg-opacity))} .bg-slate-200{--tw-bg-opacity:1;background-color:rgb(226 232 240 / var(--tw-bg-opacity))} .bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))} .bg-teal-400{--tw-bg-opacity:1;background-color:rgb(45 212 191 / var(--tw-bg-opacity))} .bg-transparent{background-color:transparent} .bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))} .bg-yellow-100{--tw-bg-opacity:1;background-color:rgb(254 249 195 / var(--tw-bg-opacity))} .bg-yellow-50{--tw-bg-opacity:1;background-color:rgb(254 252 232 / var(--tw-bg-opacity))} .bg-opacity-0{--tw-bg-opacity:0} .bg-opacity-20{--tw-bg-opacity:0.2} .bg-opacity-50{--tw-bg-opacity:0.5} .bg-opacity-75{--tw-bg-opacity:0.75} .bg-opacity-80{--tw-bg-opacity:0.8} .bg-opacity-85{--tw-bg-opacity:0.85} .bg-opacity-90{--tw-bg-opacity:0.9} .bg-gradient-to-b{background-image:linear-gradient(to bottom, var(--tw-gradient-stops))} .from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:rgb(0 0 0 / 0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from), var(--tw-gradient-to)} .to-white{--tw-gradient-to:#fff var(--tw-gradient-to-position)} .object-contain{object-fit:contain} .object-cover{object-fit:cover} .p-0{padding:0px} .p-1{padding:0.25rem} .p-2{padding:0.5rem} .p-3{padding:0.75rem} .p-4{padding:1rem} .p-6{padding:1.5rem} .p-8{padding:2rem} .px-1{padding-left:0.25rem;padding-right:0.25rem} .px-2{padding-left:0.5rem;padding-right:0.5rem} .px-3{padding-left:0.75rem;padding-right:0.75rem} .px-4{padding-left:1rem;padding-right:1rem} .px-5{padding-left:1.25rem;padding-right:1.25rem} .px-6{padding-left:1.5rem;padding-right:1.5rem} .px-8{padding-left:2rem;padding-right:2rem} .px-9{padding-left:2.25rem;padding-right:2.25rem} .py-1{padding-top:0.25rem;padding-bottom:0.25rem} .py-1\.5{padding-top:0.375rem;padding-bottom:0.375rem} .py-10{padding-top:2.5rem;padding-bottom:2.5rem} .py-12{padding-top:3rem;padding-bottom:3rem} .py-2{padding-top:0.5rem;padding-bottom:0.5rem} .py-24{padding-top:6rem;padding-bottom:6rem} .py-3{padding-top:0.75rem;padding-bottom:0.75rem} .py-3\.5{padding-top:0.875rem;padding-bottom:0.875rem} .py-4{padding-top:1rem;padding-bottom:1rem} .py-5{padding-top:1.25rem;padding-bottom:1.25rem} .py-6{padding-top:1.5rem;padding-bottom:1.5rem} .py-8{padding-top:2rem;padding-bottom:2rem} .pb-2{padding-bottom:0.5rem} .pb-2\.5{padding-bottom:0.625rem} .pb-3{padding-bottom:0.75rem} .pb-4{padding-bottom:1rem} .pb-6{padding-bottom:1.5rem} .pl-10{padding-left:2.5rem} .pl-12{padding-left:3rem} .pl-2{padding-left:0.5rem} .pl-3{padding-left:0.75rem} .pl-5{padding-left:1.25rem} .pl-6{padding-left:1.5rem} .pr-0{padding-right:0px} .pr-10{padding-right:2.5rem} .pr-12{padding-right:3rem} .pr-16{padding-right:4rem} .pr-2{padding-right:0.5rem} .pr-3{padding-right:0.75rem} .pr-4{padding-right:1rem} .pr-8{padding-right:2rem} .pr-9{padding-right:2.25rem} .pt-0{padding-top:0px} .pt-12{padding-top:3rem} .pt-16{padding-top:4rem} .pt-2{padding-top:0.5rem} .pt-4{padding-top:1rem} .pt-6{padding-top:1.5rem} .pt-8{padding-top:2rem} .text-left{text-align:left} .text-center{text-align:center} .text-right{text-align:right} .font-action{font-family:var(--font-action), Inter, Georgia, Times New Roman, Times, serif} .font-main{font-family:var(--font-main), Inter, Arial, Helvetica Neue, Helvetica, sans-serif} .font-mono{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace} .font-sans{font-family:ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"} .text-2xl{font-size:1.5rem} .text-3xl{font-size:1.875rem} .text-5xl{font-size:3rem} .text-base{font-size:1rem} .text-lg{font-size:1.125rem} .text-sm{font-size:0.875rem} .text-xl{font-size:1.25rem} .text-xs{font-size:0.75rem} .font-bold{font-weight:700} .font-medium{font-weight:500} .font-normal{font-weight:400} .font-semibold{font-weight:600} .uppercase{text-transform:uppercase} .lowercase{text-transform:lowercase} .capitalize{text-transform:capitalize} .normal-case{text-transform:none} .italic{font-style:italic} .not-italic{font-style:normal} .leading-5{line-height:1.25rem} .leading-6{line-height:1.5rem} .leading-9{line-height:2.25rem} .leading-loose{line-height:2} .leading-none{line-height:1} .leading-relaxed{line-height:1.625} .tracking-tight{letter-spacing:-0.025em} .tracking-wide{letter-spacing:0.025em} .tracking-wider{letter-spacing:0.05em} .text-amber-400{--tw-text-opacity:1;color:rgb(251 191 36 / var(--tw-text-opacity))} .text-amber-500{--tw-text-opacity:1;color:rgb(245 158 11 / var(--tw-text-opacity))} .text-amber-600{--tw-text-opacity:1;color:rgb(217 119 6 / var(--tw-text-opacity))} .text-amber-700{--tw-text-opacity:1;color:rgb(180 83 9 / var(--tw-text-opacity))} .text-amber-800{--tw-text-opacity:1;color:rgb(146 64 14 / var(--tw-text-opacity))} .text-black{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))} .text-black\/20{color:rgb(0 0 0 / 0.2)} .text-blue-300{--tw-text-opacity:1;color:rgb(147 197 253 / var(--tw-text-opacity))} .text-blue-500{--tw-text-opacity:1;color:rgb(59 130 246 / var(--tw-text-opacity))} .text-blue-600{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity))} .text-blue-700{--tw-text-opacity:1;color:rgb(29 78 216 / var(--tw-text-opacity))} .text-blue-800{--tw-text-opacity:1;color:rgb(30 64 175 / var(--tw-text-opacity))} .text-brand-2{color:var(--brand-2)} .text-brand-5{color:var(--brand-5)} .text-brand-7{color:var(--brand-7)} .text-brand-8{color:var(--brand-8)} .text-cyan-500{--tw-text-opacity:1;color:rgb(6 182 212 / var(--tw-text-opacity))} .text-cyan-600{--tw-text-opacity:1;color:rgb(8 145 178 / var(--tw-text-opacity))} .text-cyan-700{--tw-text-opacity:1;color:rgb(14 116 144 / var(--tw-text-opacity))} .text-cyan-800{--tw-text-opacity:1;color:rgb(21 94 117 / var(--tw-text-opacity))} .text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219 / var(--tw-text-opacity))} .text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity))} .text-gray-500{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity))} .text-gray-600{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity))} .text-gray-700{--tw-text-opacity:1;color:rgb(55 65 81 / var(--tw-text-opacity))} .text-gray-800{--tw-text-opacity:1;color:rgb(31 41 55 / var(--tw-text-opacity))} .text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity))} .text-green-400{--tw-text-opacity:1;color:rgb(74 222 128 / var(--tw-text-opacity))} .text-green-500{--tw-text-opacity:1;color:rgb(34 197 94 / var(--tw-text-opacity))} .text-green-600{--tw-text-opacity:1;color:rgb(22 163 74 / var(--tw-text-opacity))} .text-green-700{--tw-text-opacity:1;color:rgb(21 128 61 / var(--tw-text-opacity))} .text-green-800{--tw-text-opacity:1;color:rgb(22 101 52 / var(--tw-text-opacity))} .text-myblack{--tw-text-opacity:1;color:rgb(16 18 13 / var(--tw-text-opacity))} .text-myblue{--tw-text-opacity:1;color:rgb(41 63 88 / var(--tw-text-opacity))} .text-myblue\/80{color:rgb(41 63 88 / 0.8)} .text-mydarkgrey{--tw-text-opacity:1;color:rgb(57 61 52 / var(--tw-text-opacity))} .text-mylightgrey{--tw-text-opacity:1;color:rgb(167 177 183 / var(--tw-text-opacity))} .text-myorange{--tw-text-opacity:1;color:rgb(245 131 51 / var(--tw-text-opacity))} .text-orange-400{--tw-text-opacity:1;color:rgb(251 146 60 / var(--tw-text-opacity))} .text-orange-500{--tw-text-opacity:1;color:rgb(249 115 22 / var(--tw-text-opacity))} .text-orange-600{--tw-text-opacity:1;color:rgb(234 88 12 / var(--tw-text-opacity))} .text-orange-700{--tw-text-opacity:1;color:rgb(194 65 12 / var(--tw-text-opacity))} .text-orange-800{--tw-text-opacity:1;color:rgb(154 52 18 / var(--tw-text-opacity))} .text-purple-800{--tw-text-opacity:1;color:rgb(107 33 168 / var(--tw-text-opacity))} .text-red-400{--tw-text-opacity:1;color:rgb(248 113 113 / var(--tw-text-opacity))} .text-red-500{--tw-text-opacity:1;color:rgb(239 68 68 / var(--tw-text-opacity))} .text-red-600{--tw-text-opacity:1;color:rgb(220 38 38 / var(--tw-text-opacity))} .text-red-700{--tw-text-opacity:1;color:rgb(185 28 28 / var(--tw-text-opacity))} .text-red-800{--tw-text-opacity:1;color:rgb(153 27 27 / var(--tw-text-opacity))} .text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .text-yellow-700{--tw-text-opacity:1;color:rgb(161 98 7 / var(--tw-text-opacity))} .text-yellow-800{--tw-text-opacity:1;color:rgb(133 77 14 / var(--tw-text-opacity))} .underline{text-decoration-line:underline} .overline{text-decoration-line:overline} .line-through{text-decoration-line:line-through} .no-underline{text-decoration-line:none} .underline-offset-2{text-underline-offset:2px} .underline-offset-4{text-underline-offset:4px} .placeholder-gray-400::placeholder{--tw-placeholder-opacity:1;color:rgb(156 163 175 / var(--tw-placeholder-opacity))} .placeholder-gray-500::placeholder{--tw-placeholder-opacity:1;color:rgb(107 114 128 / var(--tw-placeholder-opacity))} .opacity-0{opacity:0} .opacity-100{opacity:1} .opacity-25{opacity:0.25} .opacity-50{opacity:0.5} .opacity-60{opacity:0.6} .opacity-75{opacity:0.75} .mix-blend-difference{mix-blend-mode:difference} .shadow{--tw-shadow:0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-2xl{--tw-shadow:0 25px 50px -12px rgb(0 0 0 / 0.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-inner{--tw-shadow:inset 0 2px 4px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:inset 0 2px 4px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-lg{--tw-shadow:0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-md{--tw-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-sm{--tw-shadow:0 1px 2px 0 rgb(0 0 0 / 0.05);--tw-shadow-colored:0 1px 2px 0 var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .shadow-xl{--tw-shadow:0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .outline-none{outline:2px solid transparent;outline-offset:2px} .outline{outline-style:solid} .outline-dashed{outline-style:dashed} .outline-dotted{outline-style:dotted} .outline-2{outline-width:2px} .outline-4{outline-width:4px} .outline-offset-2{outline-offset:2px} .outline-cyan-500{outline-color:#06b6d4} .outline-cyan-600{outline-color:#0891b2} .outline-red-700{outline-color:#b91c1c} .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(3px + 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 #0000)} .ring-0{--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(0px + 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 #0000)} .ring-1{--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(1px + 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 #0000)} .ring-2{--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 #0000)} .ring-inset{--tw-ring-inset:inset} .ring-black{--tw-ring-opacity:1;--tw-ring-color:rgb(0 0 0 / var(--tw-ring-opacity))} .ring-black\/5{--tw-ring-color:rgb(0 0 0 / 0.05)} .ring-cyan-600{--tw-ring-opacity:1;--tw-ring-color:rgb(8 145 178 / var(--tw-ring-opacity))} .ring-gray-300{--tw-ring-opacity:1;--tw-ring-color:rgb(209 213 219 / var(--tw-ring-opacity))} .ring-mydarkgrey\/5{--tw-ring-color:rgb(57 61 52 / 0.05)} .ring-mygreen{--tw-ring-opacity:1;--tw-ring-color:rgb(200 223 140 / var(--tw-ring-opacity))} .ring-mylightgrey{--tw-ring-opacity:1;--tw-ring-color:rgb(167 177 183 / var(--tw-ring-opacity))} .ring-orange-500{--tw-ring-opacity:1;--tw-ring-color:rgb(249 115 22 / var(--tw-ring-opacity))} .ring-red-300{--tw-ring-opacity:1;--tw-ring-color:rgb(252 165 165 / var(--tw-ring-opacity))} .ring-opacity-5{--tw-ring-opacity:0.05} .blur{--tw-blur:blur(8px);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)} .drop-shadow{--tw-drop-shadow:drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));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)} .grayscale{--tw-grayscale:grayscale(100%);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)} .invert{--tw-invert:invert(100%);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)} .sepia{--tw-sepia:sepia(100%);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)} .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{--tw-backdrop-blur:blur(8px);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)} .backdrop-blur-sm{--tw-backdrop-blur:blur(4px);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)} .backdrop-grayscale{--tw-backdrop-grayscale:grayscale(100%);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)} .backdrop-invert{--tw-backdrop-invert:invert(100%);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)} .backdrop-sepia{--tw-backdrop-sepia:sepia(100%);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)} .backdrop-filter{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-property:color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .transition-all{transition-property:all;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .transition-colors{transition-property:color, background-color, border-color, text-decoration-color, fill, stroke;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1);transition-duration:150ms} .duration-150{transition-duration:150ms} .duration-200{transition-duration:200ms} .duration-300{transition-duration:300ms} .ease-in{transition-timing-function:cubic-bezier(0.4, 0, 1, 1)} .ease-in-out{transition-timing-function:cubic-bezier(0.4, 0, 0.2, 1)} .ease-out{transition-timing-function:cubic-bezier(0, 0, 0.2, 1)} .placeholder\:text-gray-400::placeholder{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity))} .placeholder\:text-mydarkgrey::placeholder{--tw-text-opacity:1;color:rgb(57 61 52 / var(--tw-text-opacity))} .placeholder\:text-mylightgrey::placeholder{--tw-text-opacity:1;color:rgb(167 177 183 / var(--tw-text-opacity))} .before\:pointer-events-none::before{content:var(--tw-content);pointer-events:none} .before\:absolute::before{content:var(--tw-content);position:absolute} .before\:inset-0::before{content:var(--tw-content);inset:0px} .before\:opacity-50::before{content:var(--tw-content);opacity:0.5} .before\:outline-dashed::before{content:var(--tw-content);outline-style:dashed} .before\:outline-4::before{content:var(--tw-content);outline-width:4px} .before\:outline-red-700::before{content:var(--tw-content);outline-color:#b91c1c} .last\:border-b-0:last-child{border-bottom-width:0px} .focus-within\:border-myblue:focus-within{--tw-border-opacity:1;border-color:rgb(41 63 88 / var(--tw-border-opacity))} .focus-within\:ring-1:focus-within{--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(1px + 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 #0000)} .focus-within\:ring-myblue:focus-within{--tw-ring-opacity:1;--tw-ring-color:rgb(41 63 88 / var(--tw-ring-opacity))} .hover\:rotate-1:hover{--tw-rotate:1deg;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))} .hover\:rotate-3:hover{--tw-rotate:3deg;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))} .hover\:rotate-6:hover{--tw-rotate:6deg;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))} .hover\:rounded:hover{border-radius:0.25rem} .hover\:border-black:hover{--tw-border-opacity:1;border-color:rgb(0 0 0 / var(--tw-border-opacity))} .hover\:border-cyan-100:hover{--tw-border-opacity:1;border-color:rgb(207 250 254 / var(--tw-border-opacity))} .hover\:border-cyan-400:hover{--tw-border-opacity:1;border-color:rgb(34 211 238 / var(--tw-border-opacity))} .hover\:border-cyan-500:hover{--tw-border-opacity:1;border-color:rgb(6 182 212 / var(--tw-border-opacity))} .hover\:border-cyan-600:hover{--tw-border-opacity:1;border-color:rgb(8 145 178 / var(--tw-border-opacity))} .hover\:border-cyan-700:hover{--tw-border-opacity:1;border-color:rgb(14 116 144 / var(--tw-border-opacity))} .hover\:border-gray-300:hover{--tw-border-opacity:1;border-color:rgb(209 213 219 / var(--tw-border-opacity))} .hover\:bg-amber-50:hover{--tw-bg-opacity:1;background-color:rgb(255 251 235 / var(--tw-bg-opacity))} .hover\:bg-amber-700:hover{--tw-bg-opacity:1;background-color:rgb(180 83 9 / var(--tw-bg-opacity))} .hover\:bg-black:hover{--tw-bg-opacity:1;background-color:rgb(0 0 0 / var(--tw-bg-opacity))} .hover\:bg-blue-200:hover{--tw-bg-opacity:1;background-color:rgb(191 219 254 / var(--tw-bg-opacity))} .hover\:bg-blue-50:hover{--tw-bg-opacity:1;background-color:rgb(239 246 255 / var(--tw-bg-opacity))} .hover\:bg-blue-600:hover{--tw-bg-opacity:1;background-color:rgb(37 99 235 / var(--tw-bg-opacity))} .hover\:bg-brand-3:hover{background-color:var(--brand-3)} .hover\:bg-cyan-100:hover{--tw-bg-opacity:1;background-color:rgb(207 250 254 / var(--tw-bg-opacity))} .hover\:bg-cyan-200:hover{--tw-bg-opacity:1;background-color:rgb(165 243 252 / var(--tw-bg-opacity))} .hover\:bg-cyan-50:hover{--tw-bg-opacity:1;background-color:rgb(236 254 255 / var(--tw-bg-opacity))} .hover\:bg-cyan-50\/20:hover{background-color:rgb(236 254 255 / 0.2)} .hover\:bg-cyan-500:hover{--tw-bg-opacity:1;background-color:rgb(6 182 212 / var(--tw-bg-opacity))} .hover\:bg-cyan-600:hover{--tw-bg-opacity:1;background-color:rgb(8 145 178 / var(--tw-bg-opacity))} .hover\:bg-cyan-600\/20:hover{background-color:rgb(8 145 178 / 0.2)} .hover\:bg-cyan-700:hover{--tw-bg-opacity:1;background-color:rgb(14 116 144 / var(--tw-bg-opacity))} .hover\:bg-cyan-800:hover{--tw-bg-opacity:1;background-color:rgb(21 94 117 / var(--tw-bg-opacity))} .hover\:bg-gray-100:hover{--tw-bg-opacity:1;background-color:rgb(243 244 246 / var(--tw-bg-opacity))} .hover\:bg-gray-200:hover{--tw-bg-opacity:1;background-color:rgb(229 231 235 / var(--tw-bg-opacity))} .hover\:bg-gray-300:hover{--tw-bg-opacity:1;background-color:rgb(209 213 219 / var(--tw-bg-opacity))} .hover\:bg-gray-400:hover{--tw-bg-opacity:1;background-color:rgb(156 163 175 / var(--tw-bg-opacity))} .hover\:bg-gray-50:hover{--tw-bg-opacity:1;background-color:rgb(249 250 251 / var(--tw-bg-opacity))} .hover\:bg-gray-700:hover{--tw-bg-opacity:1;background-color:rgb(55 65 81 / var(--tw-bg-opacity))} .hover\:bg-green-200:hover{--tw-bg-opacity:1;background-color:rgb(187 247 208 / var(--tw-bg-opacity))} .hover\:bg-myblack:hover{--tw-bg-opacity:1;background-color:rgb(16 18 13 / var(--tw-bg-opacity))} .hover\:bg-myblue\/10:hover{background-color:rgb(41 63 88 / 0.1)} .hover\:bg-mydarkgrey\/10:hover{background-color:rgb(57 61 52 / 0.1)} .hover\:bg-mygreen\/20:hover{background-color:rgb(200 223 140 / 0.2)} .hover\:bg-mylightgrey:hover{--tw-bg-opacity:1;background-color:rgb(167 177 183 / var(--tw-bg-opacity))} .hover\:bg-myorange:hover{--tw-bg-opacity:1;background-color:rgb(245 131 51 / var(--tw-bg-opacity))} .hover\:bg-orange-100:hover{--tw-bg-opacity:1;background-color:rgb(255 237 213 / var(--tw-bg-opacity))} .hover\:bg-orange-200:hover{--tw-bg-opacity:1;background-color:rgb(254 215 170 / var(--tw-bg-opacity))} .hover\:bg-orange-500:hover{--tw-bg-opacity:1;background-color:rgb(249 115 22 / var(--tw-bg-opacity))} .hover\:bg-orange-600:hover{--tw-bg-opacity:1;background-color:rgb(234 88 12 / var(--tw-bg-opacity))} .hover\:bg-red-200:hover{--tw-bg-opacity:1;background-color:rgb(254 202 202 / var(--tw-bg-opacity))} .hover\:bg-red-50:hover{--tw-bg-opacity:1;background-color:rgb(254 242 242 / var(--tw-bg-opacity))} .hover\:bg-red-700:hover{--tw-bg-opacity:1;background-color:rgb(185 28 28 / var(--tw-bg-opacity))} .hover\:bg-slate-100:hover{--tw-bg-opacity:1;background-color:rgb(241 245 249 / var(--tw-bg-opacity))} .hover\:bg-white\/50:hover{background-color:rgb(255 255 255 / 0.5)} .hover\:bg-opacity-100:hover{--tw-bg-opacity:1} .hover\:bg-opacity-20:hover{--tw-bg-opacity:0.2} .hover\:font-bold:hover{font-weight:700} .hover\:text-black:hover{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))} .hover\:text-blue-600:hover{--tw-text-opacity:1;color:rgb(37 99 235 / var(--tw-text-opacity))} .hover\:text-blue-800:hover{--tw-text-opacity:1;color:rgb(30 64 175 / var(--tw-text-opacity))} .hover\:text-brand-1:hover{color:var(--brand-1)} .hover\:text-cyan-600:hover{--tw-text-opacity:1;color:rgb(8 145 178 / var(--tw-text-opacity))} .hover\:text-cyan-700:hover{--tw-text-opacity:1;color:rgb(14 116 144 / var(--tw-text-opacity))} .hover\:text-cyan-800:hover{--tw-text-opacity:1;color:rgb(21 94 117 / var(--tw-text-opacity))} .hover\:text-cyan-900:hover{--tw-text-opacity:1;color:rgb(22 78 99 / var(--tw-text-opacity))} .hover\:text-gray-500:hover{--tw-text-opacity:1;color:rgb(107 114 128 / var(--tw-text-opacity))} .hover\:text-gray-600:hover{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity))} .hover\:text-gray-700:hover{--tw-text-opacity:1;color:rgb(55 65 81 / var(--tw-text-opacity))} .hover\:text-gray-800:hover{--tw-text-opacity:1;color:rgb(31 41 55 / var(--tw-text-opacity))} .hover\:text-gray-900:hover{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity))} .hover\:text-green-500:hover{--tw-text-opacity:1;color:rgb(34 197 94 / var(--tw-text-opacity))} .hover\:text-myblack:hover{--tw-text-opacity:1;color:rgb(16 18 13 / var(--tw-text-opacity))} .hover\:text-myblue:hover{--tw-text-opacity:1;color:rgb(41 63 88 / var(--tw-text-opacity))} .hover\:text-myorange:hover{--tw-text-opacity:1;color:rgb(245 131 51 / var(--tw-text-opacity))} .hover\:text-orange-600:hover{--tw-text-opacity:1;color:rgb(234 88 12 / var(--tw-text-opacity))} .hover\:text-red-600:hover{--tw-text-opacity:1;color:rgb(220 38 38 / var(--tw-text-opacity))} .hover\:text-red-700:hover{--tw-text-opacity:1;color:rgb(185 28 28 / var(--tw-text-opacity))} .hover\:text-red-800:hover{--tw-text-opacity:1;color:rgb(153 27 27 / var(--tw-text-opacity))} .hover\:text-red-900:hover{--tw-text-opacity:1;color:rgb(127 29 29 / var(--tw-text-opacity))} .hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .hover\:underline:hover{text-decoration-line:underline} .hover\:decoration-dashed:hover{text-decoration-style:dashed} .hover\:decoration-4:hover{text-decoration-thickness:4px} .hover\:underline-offset-4:hover{text-underline-offset:4px} .hover\:shadow-md:hover{--tw-shadow:0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);--tw-shadow-colored:0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow)} .hover\:outline:hover{outline-style:solid} .hover\:ring-2:hover{--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 #0000)} .hover\:ring-cyan-600:hover{--tw-ring-opacity:1;--tw-ring-color:rgb(8 145 178 / var(--tw-ring-opacity))} .hover\:before\:bg-red-600\/50:hover::before{content:var(--tw-content);background-color:rgb(220 38 38 / 0.5)} .hover\:before\:opacity-100:hover::before{content:var(--tw-content);opacity:1} .focus\:border-blue-500:focus{--tw-border-opacity:1;border-color:rgb(59 130 246 / var(--tw-border-opacity))} .focus\:border-cyan-500:focus{--tw-border-opacity:1;border-color:rgb(6 182 212 / var(--tw-border-opacity))} .focus\:border-cyan-600:focus{--tw-border-opacity:1;border-color:rgb(8 145 178 / var(--tw-border-opacity))} .focus\:border-cyan-700:focus{--tw-border-opacity:1;border-color:rgb(14 116 144 / var(--tw-border-opacity))} .focus\:border-indigo-500:focus{--tw-border-opacity:1;border-color:rgb(99 102 241 / var(--tw-border-opacity))} .focus\:border-myblue:focus{--tw-border-opacity:1;border-color:rgb(41 63 88 / var(--tw-border-opacity))} .focus\:border-red-500:focus{--tw-border-opacity:1;border-color:rgb(239 68 68 / var(--tw-border-opacity))} .focus\:bg-brand-7:focus{background-color:var(--brand-7)} .focus\:bg-cyan-700:focus{--tw-bg-opacity:1;background-color:rgb(14 116 144 / var(--tw-bg-opacity))} .focus\:text-black:focus{--tw-text-opacity:1;color:rgb(0 0 0 / var(--tw-text-opacity))} .focus\:text-gray-600:focus{--tw-text-opacity:1;color:rgb(75 85 99 / var(--tw-text-opacity))} .focus\:text-red-600:focus{--tw-text-opacity:1;color:rgb(220 38 38 / var(--tw-text-opacity))} .focus\:text-white:focus{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .focus\:underline:focus{text-decoration-line:underline} .focus\:outline-none:focus{outline:2px solid transparent;outline-offset:2px} .focus\:outline-offset-0:focus{outline-offset:0px} .focus\:ring-0: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(0px + 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 #0000)} .focus\:ring-1: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(1px + 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 #0000)} .focus\:ring-2: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(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 #0000)} .focus\:ring-inset:focus{--tw-ring-inset:inset} .focus\:ring-amber-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(245 158 11 / var(--tw-ring-opacity))} .focus\:ring-blue-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(59 130 246 / var(--tw-ring-opacity))} .focus\:ring-brand-1:focus{--tw-ring-color:var(--brand-1)} .focus\:ring-cyan-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(6 182 212 / var(--tw-ring-opacity))} .focus\:ring-cyan-600:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(8 145 178 / var(--tw-ring-opacity))} .focus\:ring-cyan-700:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(14 116 144 / var(--tw-ring-opacity))} .focus\:ring-indigo-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(99 102 241 / var(--tw-ring-opacity))} .focus\:ring-myblue:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(41 63 88 / var(--tw-ring-opacity))} .focus\:ring-myorange:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(245 131 51 / var(--tw-ring-opacity))} .focus\:ring-red-500:focus{--tw-ring-opacity:1;--tw-ring-color:rgb(239 68 68 / var(--tw-ring-opacity))} .focus\:ring-offset-2:focus{--tw-ring-offset-width:2px} .focus\:before\:bg-red-600\/50:focus::before{content:var(--tw-content);background-color:rgb(220 38 38 / 0.5)} .focus\:before\:opacity-100:focus::before{content:var(--tw-content);opacity:1} .focus-visible\:outline:focus-visible{outline-style:solid} .focus-visible\:outline-2:focus-visible{outline-width:2px} .focus-visible\:outline-offset-2:focus-visible{outline-offset:2px} .focus-visible\:outline-cyan-600:focus-visible{outline-color:#0891b2} .focus-visible\:outline-myorange:focus-visible{outline-color:#f58333} .disabled\:cursor-not-allowed:disabled{cursor:not-allowed} .disabled\:text-gray-400:disabled{--tw-text-opacity:1;color:rgb(156 163 175 / var(--tw-text-opacity))} .disabled\:opacity-50:disabled{opacity:0.5} .disabled\:hover\:bg-transparent:hover:disabled{background-color:transparent} .group:focus-within .group-focus-within\:bg-red-700{--tw-bg-opacity:1;background-color:rgb(185 28 28 / var(--tw-bg-opacity))} .group:focus-within .group-focus-within\:text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .group:focus-within .group-focus-within\:opacity-100{opacity:1} .group:hover .group-hover\:visible{visibility:visible} .group:hover .group-hover\:bg-cyan-200{--tw-bg-opacity:1;background-color:rgb(165 243 252 / var(--tw-bg-opacity))} .group:hover .group-hover\:bg-red-700{--tw-bg-opacity:1;background-color:rgb(185 28 28 / var(--tw-bg-opacity))} .group:hover .group-hover\:bg-slate-200\/20{background-color:rgb(226 232 240 / 0.2)} .group:hover .group-hover\:bg-slate-50{--tw-bg-opacity:1;background-color:rgb(248 250 252 / var(--tw-bg-opacity))} .group:hover .group-hover\:text-gray-900{--tw-text-opacity:1;color:rgb(17 24 39 / var(--tw-text-opacity))} .group:hover .group-hover\:text-myblue{--tw-text-opacity:1;color:rgb(41 63 88 / var(--tw-text-opacity))} .group:hover .group-hover\:text-white{--tw-text-opacity:1;color:rgb(255 255 255 / var(--tw-text-opacity))} .group:hover .group-hover\:opacity-100{opacity:1} @media (prefers-reduced-motion: no-preference){@keyframes bounce{0%, 100%{transform:translateY(-25%);animation-timing-function:cubic-bezier(0.8,0,1,1)}50%{transform:none;animation-timing-function:cubic-bezier(0,0,0.2,1)}}.motion-safe\:animate-bounce{animation:bounce 1s infinite}@keyframes pulse{50%{opacity:.5}}.motion-safe\:animate-pulse{animation:pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite}@keyframes wiggle{0%, 100%{transform:translateX(3%)}50%{transform:translateX(0)}}.motion-safe\:animate-wig{animation:wiggle 1s ease-in-out infinite}.motion-safe\:scroll-smooth{scroll-behavior:smooth}} @media (min-width: 0px){.xs\:flex{display:flex}.xs\:hidden{display:none}.xs\:flex-row{flex-direction:row}.xs\:items-start{align-items:flex-start}.xs\:justify-between{justify-content:space-between}.xs\:text-sm{font-size:0.875rem}.xs\:leading-6{line-height:1.5rem}} @media (min-width: 801px){.md\:static{position:static}.md\:fixed{position:fixed}.md\:sticky{position:sticky}.md\:bottom-2{bottom:0.5rem}.md\:bottom-auto{bottom:auto}.md\:left-0{left:0px}.md\:top-24{top:6rem}.md\:col-span-1{grid-column:span 1 / span 1}.md\:col-span-2{grid-column:span 2 / span 2}.md\:mx-10{margin-left:2.5rem;margin-right:2.5rem}.md\:mb-10{margin-bottom:2.5rem}.md\:mt-0{margin-top:0px}.md\:mt-2{margin-top:0.5rem}.md\:block{display:block}.md\:flex{display:flex}.md\:table-cell{display:table-cell}.md\:hidden{display:none}.md\:h-8{height:2rem}.md\:h-screen{height:100vh}.md\:w-1\/2{width:50%}.md\:w-16{width:4rem}.md\:w-2\/5{width:40%}.md\:w-3\/5{width:60%}.md\:max-w-72{max-width:18rem}.md\:flex-1{flex:1 1 0%}.md\:grid-cols-2{grid-template-columns:repeat(2, minmax(0, 1fr))}.md\:grid-cols-3{grid-template-columns:repeat(3, minmax(0, 1fr))}.md\:grid-cols-4{grid-template-columns:repeat(4, 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-between{justify-content:space-between}.md\:gap-10{gap:2.5rem}.md\:gap-2{gap:0.5rem}.md\:gap-4{gap:1rem}.md\:gap-8{gap:2rem}.md\:space-x-0 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(0px * var(--tw-space-x-reverse));margin-left:calc(0px * calc(1 - var(--tw-space-x-reverse)))}.md\:space-x-6 > :not([hidden]) ~ :not([hidden]){--tw-space-x-reverse:0;margin-right:calc(1.5rem * var(--tw-space-x-reverse));margin-left:calc(1.5rem * calc(1 - var(--tw-space-x-reverse)))}.md\:space-y-0 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0px * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0px * var(--tw-space-y-reverse))}.md\:space-y-2 > :not([hidden]) ~ :not([hidden]){--tw-space-y-reverse:0;margin-top:calc(0.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(0.5rem * var(--tw-space-y-reverse))}.md\:rounded-lg{border-radius:0.5rem}.md\:border-l-2{border-left-width:2px}.md\:border-t-0{border-top-width:0px}.md\:p-4{padding:1rem}.md\:p-8{padding:2rem}.md\:px-12{padding-left:3rem;padding-right:3rem}.md\:px-14{padding-left:3.5rem;padding-right:3.5rem}.md\:px-4{padding-left:1rem;padding-right:1rem}.md\:px-6{padding-left:1.5rem;padding-right:1.5rem}.md\:px-8{padding-left:2rem;padding-right:2rem}.md\:py-2{padding-top:0.5rem;padding-bottom:0.5rem}.md\:py-2\.5{padding-top:0.625rem;padding-bottom:0.625rem}.md\:py-3{padding-top:0.75rem;padding-bottom:0.75rem}.md\:py-4{padding-top:1rem;padding-bottom:1rem}.md\:pb-3{padding-bottom:0.75rem}.md\:pb-3\.5{padding-bottom:0.875rem}.md\:pt-0{padding-top:0px}.md\:pt-9{padding-top:2.25rem}.md\:text-3xl{font-size:1.875rem}.md\:text-xl{font-size:1.25rem}.md\:leading-relaxed{line-height:1.625}.md\:text-yellow-300{--tw-text-opacity:1;color:rgb(253 224 71 / var(--tw-text-opacity))}} @media (min-width: 1367px){.xl\:block{display:block}.xl\:table-cell{display:table-cell}.xl\:hidden{display:none}.xl\:max-w-screen-xl{max-width:1367px}.xl\:gap-12{gap:3rem}.xl\:px-32{padding-left:8rem;padding-right:8rem}.xl\:px-6{padding-left:1.5rem;padding-right:1.5rem}.xl\:py-6{padding-top:1.5rem;padding-bottom:1.5rem}.xl\:pt-12{padding-top:3rem}.xl\:text-red-700{--tw-text-opacity:1;color:rgb(185 28 28 / var(--tw-text-opacity))}} @media (prefers-color-scheme: dark){.dark\:border-cyan-600{--tw-border-opacity:1;border-color:rgb(8 145 178 / var(--tw-border-opacity))}.dark\:bg-cyan-800{--tw-bg-opacity:1;background-color:rgb(21 94 117 / var(--tw-bg-opacity))}.dark\:bg-cyan-900{--tw-bg-opacity:1;background-color:rgb(22 78 99 / var(--tw-bg-opacity))}.dark\:text-cyan-300{--tw-text-opacity:1;color:rgb(103 232 249 / var(--tw-text-opacity))}.dark\:hover\:bg-cyan-800:hover{--tw-bg-opacity:1;background-color:rgb(21 94 117 / var(--tw-bg-opacity))}.group:hover .dark\:group-hover\:bg-cyan-700{--tw-bg-opacity:1;background-color:rgb(14 116 144 / var(--tw-bg-opacity))}}
@@ -21,13 +21,26 @@ interface SearchModalProps {
21
21
  contentMap: FullContentMapItem[];
22
22
  }
23
23
 
24
+ // --- CHANGE START ---
25
+ // 1. Define a new type for the selected suggestions to include their type
26
+ interface SelectedSuggestion {
27
+ term: string;
28
+ type: string;
29
+ }
30
+ // --- CHANGE END ---
31
+
24
32
  export default function SearchModal({
25
33
  isOpen,
26
34
  onClose,
27
35
  contentMap,
28
36
  }: SearchModalProps) {
29
37
  const [query, setQuery] = useState('');
30
- const [selectedTerms, setSelectedTerms] = useState<string[]>([]);
38
+ // --- CHANGE START ---
39
+ // 2. Update state to use the new type instead of just string[]
40
+ const [selectedSuggestions, setSelectedSuggestions] = useState<
41
+ SelectedSuggestion[]
42
+ >([]);
43
+ // --- CHANGE END ---
31
44
  const inputRef = useRef<HTMLInputElement>(null);
32
45
  const {
33
46
  suggestions,
@@ -51,13 +64,15 @@ export default function SearchModal({
51
64
  useEffect(() => {
52
65
  if (!isOpen) {
53
66
  setQuery('');
54
- setSelectedTerms([]);
67
+ // --- CHANGE START ---
68
+ // 3. Update cleanup logic to use the new state
69
+ setSelectedSuggestions([]);
70
+ // --- CHANGE END ---
55
71
  clearAll();
56
72
  }
57
73
  }, [isOpen, clearAll]);
58
74
 
59
75
  useEffect(() => {
60
- // Only trigger discovery if query has 3+ characters
61
76
  if (query.trim().length >= 3) {
62
77
  discoverTerms(query);
63
78
  }
@@ -69,7 +84,10 @@ export default function SearchModal({
69
84
 
70
85
  const handleClose = () => {
71
86
  setQuery('');
72
- setSelectedTerms([]);
87
+ // --- CHANGE START ---
88
+ // 4. Update cleanup logic to use the new state
89
+ setSelectedSuggestions([]);
90
+ // --- CHANGE END ---
73
91
  clearAll();
74
92
  onClose();
75
93
  };
@@ -78,25 +96,20 @@ export default function SearchModal({
78
96
  if (e.key === 'Escape') {
79
97
  handleClose();
80
98
  } else if (e.key === 'Enter' && query.trim()) {
81
- // Only proceed if we have suggestions or query is 3+ chars
82
99
  if (query.trim().length < 3) return;
83
100
 
84
- // If there's only one suggestion, select it
85
101
  if (suggestions.length === 1) {
86
102
  handleSuggestionSelect(suggestions[0]);
87
103
  } else if (suggestions.length > 0) {
88
- // Check for exact match first
89
104
  const exactMatch = suggestions.find(
90
105
  (s) => s.term.toLowerCase() === query.trim().toLowerCase()
91
106
  );
92
107
  if (exactMatch) {
93
108
  handleSuggestionSelect(exactMatch);
94
109
  } else {
95
- // No exact match, select first suggestion
96
110
  handleSuggestionSelect(suggestions[0]);
97
111
  }
98
112
  } else {
99
- // No suggestions, do exact match search
100
113
  handleExactMatch(query.trim());
101
114
  }
102
115
  }
@@ -107,34 +120,42 @@ export default function SearchModal({
107
120
  };
108
121
 
109
122
  const handleSuggestionSelect = (suggestion: DiscoverySuggestion) => {
110
- // Add to selected terms if not already present
111
- if (!selectedTerms.includes(suggestion.term)) {
112
- setSelectedTerms((prev) => [...prev, suggestion.term]);
123
+ // --- CHANGE START ---
124
+ // 5. Update how suggestions are added to the state
125
+ // Check for duplicates before adding
126
+ if (!selectedSuggestions.some((s) => s.term === suggestion.term)) {
127
+ setSelectedSuggestions((prev) => [
128
+ ...prev,
129
+ { term: suggestion.term, type: suggestion.type },
130
+ ]);
113
131
  }
132
+ // --- CHANGE END ---
114
133
 
115
- // Clear input and perform search
116
134
  setQuery('');
117
135
  selectSuggestion(suggestion);
118
136
  };
119
137
 
120
138
  const handleExactMatch = (term: string) => {
121
- // Add to selected terms if not already present
122
- if (!selectedTerms.includes(term)) {
123
- setSelectedTerms((prev) => [...prev, term]);
139
+ // --- CHANGE START ---
140
+ // 6. Update exact match handling to add a default type
141
+ // From the legend, "Exact Match" uses the 'COLLECTION' style
142
+ if (!selectedSuggestions.some((s) => s.term === term)) {
143
+ setSelectedSuggestions((prev) => [...prev, { term, type: 'COLLECTION' }]);
124
144
  }
145
+ // --- CHANGE END ---
125
146
 
126
- // Clear input and perform search
127
147
  setQuery('');
128
148
  selectExactMatch(term);
129
149
  };
130
150
 
131
151
  const removeTerm = (indexToRemove: number) => {
132
- setSelectedTerms((prev) =>
152
+ // --- CHANGE START ---
153
+ // 7. Update remove logic to use the new state
154
+ setSelectedSuggestions((prev) =>
133
155
  prev.filter((_, index) => index !== indexToRemove)
134
156
  );
135
- // Clear search results when removing terms
157
+ // --- CHANGE END ---
136
158
  clearAll();
137
- // Focus back on input
138
159
  if (inputRef.current) {
139
160
  inputRef.current.focus();
140
161
  }
@@ -144,8 +165,8 @@ export default function SearchModal({
144
165
  switch (type) {
145
166
  case 'TOPIC':
146
167
  return 'bg-purple-100 text-purple-800 border-purple-200';
147
- case 'TITLE':
148
- return 'bg-blue-100 text-blue-800 border-blue-200';
168
+ case 'COLLECTION':
169
+ return 'bg-orange-100 text-orange-800 border-orange-200';
149
170
  case 'CONTENT':
150
171
  return 'bg-green-100 text-green-800 border-green-200';
151
172
  default:
@@ -153,13 +174,34 @@ export default function SearchModal({
153
174
  }
154
175
  };
155
176
 
156
- // Autocomplete logic - only show when we have suggestions and query is 3+ chars
177
+ // --- CHANGE START ---
178
+ // 8. (Optional but recommended) Create a helper for the 'X' button color
179
+ const getCloseButtonColor = (type: string) => {
180
+ switch (type) {
181
+ case 'TOPIC':
182
+ return 'text-purple-600 hover:text-purple-800';
183
+ case 'COLLECTION':
184
+ return 'text-orange-600 hover:text-orange-800';
185
+ case 'CONTENT':
186
+ return 'text-green-600 hover:text-green-800';
187
+ default:
188
+ return 'text-gray-600 hover:text-gray-800';
189
+ }
190
+ };
191
+ // --- CHANGE END ---
192
+
157
193
  const bestCompletion =
158
194
  suggestions.length > 0 && query.length >= 3 ? suggestions[0].term : '';
159
195
  const showCompletion =
160
196
  bestCompletion.toLowerCase().startsWith(query.toLowerCase()) &&
161
197
  query.length >= 3;
162
-
198
+ let preservedCompletion = '';
199
+ if (showCompletion) {
200
+ const completionText = bestCompletion.slice(query.length);
201
+ preservedCompletion = completionText.startsWith(' ')
202
+ ? '\u00A0' + completionText.slice(1)
203
+ : completionText;
204
+ }
163
205
  const showSuggestions =
164
206
  suggestions.length > 0 && !searchResults && query.length >= 3;
165
207
  const showResults = searchResults !== null;
@@ -181,37 +223,44 @@ export default function SearchModal({
181
223
  className="bg-mywhite mx-auto w-full overflow-hidden rounded-lg shadow-2xl"
182
224
  style={{ height: '80vh' }}
183
225
  >
184
- {/* Fixed Header */}
185
226
  <div className="relative w-full border-b border-gray-200 p-4">
186
- {/* Selected Terms Pills */}
187
- {selectedTerms.length > 0 && (
227
+ {/* --- CHANGE START --- */}
228
+ {/* 9. Update the rendering of selected term pills */}
229
+ {selectedSuggestions.length > 0 && (
188
230
  <div className="mb-3 flex flex-wrap gap-2">
189
- {selectedTerms.map((term, index) => (
231
+ {selectedSuggestions.map((suggestion, index) => (
190
232
  <div
191
233
  key={index}
192
- className="flex items-center gap-1 rounded-full border border-blue-200 bg-blue-100 px-3 py-1 text-sm font-bold text-blue-800"
234
+ // Use getTypeColor to dynamically set the class
235
+ className={`inline-flex items-center gap-1.5 rounded-lg border px-3 py-1.5 text-sm font-bold ${getTypeColor(
236
+ suggestion.type
237
+ )}`}
193
238
  >
194
- <span>{term}</span>
239
+ <span>{suggestion.term}</span>
195
240
  <button
196
241
  onClick={() => removeTerm(index)}
197
- className="ml-1 rounded-full p-0.5 text-blue-600 hover:bg-blue-200 hover:text-blue-800"
198
- aria-label={`Remove ${term}`}
242
+ // Use the new helper for the button color
243
+ className={`flex items-center justify-center rounded-full ${getCloseButtonColor(
244
+ suggestion.type
245
+ )}`}
246
+ aria-label={`Remove ${suggestion.term}`}
199
247
  >
200
- <XMarkIcon className="h-3 w-3" />
248
+ <XMarkIcon className="h-4 w-4" />
201
249
  </button>
202
250
  </div>
203
251
  ))}
204
252
  </div>
205
253
  )}
254
+ {/* --- CHANGE END --- */}
206
255
 
207
256
  {!showResults && (
208
257
  <div className="relative w-full px-6 py-2">
209
258
  {showCompletion && (
210
259
  <div className="pointer-events-none absolute left-0 top-0 flex h-full w-full items-center px-6 py-2 text-xl text-gray-400">
211
- <span style={{ visibility: 'hidden' }}>{query}</span>
212
- {bestCompletion
213
- .slice(query.length)
214
- .replace(/ /g, '\u00A0')}
260
+ <span style={{ visibility: 'hidden', whiteSpace: 'pre' }}>
261
+ {query}
262
+ </span>
263
+ {preservedCompletion}
215
264
  </div>
216
265
  )}
217
266
  <input
@@ -226,6 +275,7 @@ export default function SearchModal({
226
275
  />
227
276
  </div>
228
277
  )}
278
+
229
279
  <button
230
280
  onClick={handleClose}
231
281
  className="text-mydarkgrey hover:text-myblue absolute right-4 top-6 rounded-lg p-2 transition-colors hover:bg-gray-100"
@@ -235,13 +285,14 @@ export default function SearchModal({
235
285
  </button>
236
286
  </div>
237
287
 
238
- {/* Scrollable Content Area */}
239
288
  <div
240
289
  className="w-full overflow-y-auto"
241
290
  style={{ height: 'calc(80vh - 80px)' }}
242
291
  >
243
- {/* Initial State */}
244
- {!query.trim() && selectedTerms.length === 0 && (
292
+ {/* --- CHANGE START --- */}
293
+ {/* 10. Final cleanup logic update */}
294
+ {!query.trim() && selectedSuggestions.length === 0 && (
295
+ // --- CHANGE END ---
245
296
  <div className="w-full p-8 text-center text-gray-500">
246
297
  <MagnifyingGlassIcon className="mx-auto mb-4 h-16 w-16 text-gray-300" />
247
298
  <p className="text-lg">Search across all content</p>
@@ -251,7 +302,6 @@ export default function SearchModal({
251
302
  </div>
252
303
  )}
253
304
 
254
- {/* Show message for less than 3 characters */}
255
305
  {query.trim() && query.trim().length < 3 && (
256
306
  <div className="w-full p-8 text-center text-gray-500">
257
307
  <p className="text-lg">Keep typing...</p>
@@ -261,7 +311,6 @@ export default function SearchModal({
261
311
  </div>
262
312
  )}
263
313
 
264
- {/* Discovery Loading */}
265
314
  {query.trim().length >= 3 && isDiscovering && (
266
315
  <div className="w-full p-8 text-center">
267
316
  <div className="border-myblue inline-block h-8 w-8 animate-spin rounded-full border-b-2"></div>
@@ -269,7 +318,6 @@ export default function SearchModal({
269
318
  </div>
270
319
  )}
271
320
 
272
- {/* Discovery Error */}
273
321
  {query.trim().length >= 3 && discoverError && (
274
322
  <div className="w-full p-8 text-center text-red-600">
275
323
  <p>Discovery failed: {discoverError}</p>
@@ -282,7 +330,6 @@ export default function SearchModal({
282
330
  </div>
283
331
  )}
284
332
 
285
- {/* Suggestion Pills */}
286
333
  {showSuggestions && (
287
334
  <div className="w-full p-6">
288
335
  <p className="text-mydarkgrey mb-4 text-sm font-bold">
@@ -293,7 +340,9 @@ export default function SearchModal({
293
340
  <button
294
341
  key={index}
295
342
  onClick={() => handleSuggestionClick(suggestion)}
296
- className={`inline-flex items-center rounded-full border px-3 py-1.5 text-sm font-bold transition-all hover:shadow-md ${getTypeColor(suggestion.type)}`}
343
+ className={`inline-flex items-center rounded-lg border px-3 py-1.5 text-sm font-bold transition-all hover:shadow-md ${getTypeColor(
344
+ suggestion.type
345
+ )}`}
297
346
  >
298
347
  <span>{suggestion.term}</span>
299
348
  </button>
@@ -302,10 +351,35 @@ export default function SearchModal({
302
351
  <p className="text-mydarkgrey mt-4 text-xs">
303
352
  Click a suggestion or press Enter to search
304
353
  </p>
354
+ <div className="mt-6 border-t border-gray-200 pt-4">
355
+ <div className="flex flex-wrap items-center gap-x-4 gap-y-2 text-xs text-gray-600">
356
+ <span className="font-bold">Legend:</span>
357
+ <span
358
+ className={`inline-flex items-center rounded-lg border px-3 py-1.5 text-sm font-bold ${getTypeColor(
359
+ 'COLLECTION'
360
+ )}`}
361
+ >
362
+ Exact Match
363
+ </span>
364
+ <span
365
+ className={`inline-flex items-center rounded-lg border px-3 py-1.5 text-sm font-bold ${getTypeColor(
366
+ 'TOPIC'
367
+ )}`}
368
+ >
369
+ Topic
370
+ </span>
371
+ <span
372
+ className={`inline-flex items-center rounded-lg border px-3 py-1.5 text-sm font-bold ${getTypeColor(
373
+ 'CONTENT'
374
+ )}`}
375
+ >
376
+ Text Match
377
+ </span>
378
+ </div>
379
+ </div>
305
380
  </div>
306
381
  )}
307
382
 
308
- {/* Retrieve Loading */}
309
383
  {isRetrieving && (
310
384
  <div className="w-full p-8 text-center">
311
385
  <div className="border-myblue inline-block h-8 w-8 animate-spin rounded-full border-b-2"></div>
@@ -313,14 +387,12 @@ export default function SearchModal({
313
387
  </div>
314
388
  )}
315
389
 
316
- {/* Retrieve Error */}
317
390
  {retrieveError && (
318
391
  <div className="w-full p-8 text-center text-red-600">
319
392
  <p>Search failed: {retrieveError}</p>
320
393
  </div>
321
394
  )}
322
395
 
323
- {/* No Results */}
324
396
  {!isRetrieving &&
325
397
  !retrieveError &&
326
398
  showResults &&
@@ -333,7 +405,6 @@ export default function SearchModal({
333
405
  </div>
334
406
  )}
335
407
 
336
- {/* Search Results */}
337
408
  {!isRetrieving &&
338
409
  !retrieveError &&
339
410
  showResults &&
@@ -341,6 +412,7 @@ export default function SearchModal({
341
412
  <SearchResults
342
413
  results={searchResults}
343
414
  contentMap={contentMap}
415
+ getTypeColor={getTypeColor}
344
416
  />
345
417
  )}
346
418
  </div>
@@ -14,6 +14,7 @@ const VERBOSE = false;
14
14
  interface SearchResultsProps {
15
15
  results: CategorizedResults;
16
16
  contentMap: FullContentMapItem[];
17
+ getTypeColor: (type: string) => string;
17
18
  }
18
19
 
19
20
  interface ResultItem {
@@ -35,6 +36,7 @@ const ITEMS_PER_PAGE = 10;
35
36
  export default function SearchResults({
36
37
  results,
37
38
  contentMap,
39
+ getTypeColor,
38
40
  }: SearchResultsProps) {
39
41
  const [currentPage, setCurrentPage] = useState(1);
40
42
 
@@ -189,28 +191,31 @@ export default function SearchResults({
189
191
  };
190
192
 
191
193
  const getResultBadge = (type: string, categorySlug?: string) => {
194
+ let styleType = type;
195
+ let label = '';
192
196
  switch (type) {
193
197
  case 'StoryFragment':
194
- return (
195
- <span className="inline-flex items-center rounded-full bg-blue-100 px-2 py-1 text-xs font-medium text-blue-800">
196
- Page
197
- </span>
198
- );
198
+ label = 'Page';
199
+ break;
199
200
  case 'ContextPane':
200
- return (
201
- <span className="inline-flex items-center rounded-full bg-green-100 px-2 py-1 text-xs font-medium text-green-800">
202
- Context
203
- </span>
204
- );
201
+ label = 'Context';
202
+ break;
205
203
  case 'Resource':
206
- return (
207
- <span className="inline-flex items-center rounded-full bg-orange-100 px-2 py-1 text-xs font-medium text-orange-800">
208
- {categorySlug || 'Resource'}
209
- </span>
210
- );
204
+ styleType = 'COLLECTION';
205
+ label = categorySlug || 'Resource';
206
+ break;
211
207
  default:
212
208
  return null;
213
209
  }
210
+
211
+ // Get the color classes but extract just the text and background colors for the inline style
212
+ const colorClasses = getTypeColor(styleType);
213
+
214
+ return (
215
+ <span className={`rounded px-2 py-1 text-xs ${colorClasses}`}>
216
+ {label}
217
+ </span>
218
+ );
214
219
  };
215
220
 
216
221
  if (totalResults === 0) {
@@ -238,7 +243,7 @@ export default function SearchResults({
238
243
  >
239
244
  <a href={item.url} className="group block">
240
245
  <div className="flex flex-col md:flex-row md:items-start md:gap-4">
241
- {/* Mobile: Full width image with overlay badge */}
246
+ {/* Mobile: Full width image without overlay badge */}
242
247
  <div
243
248
  className="bg-mydarkgrey relative w-full overflow-hidden rounded-lg md:hidden"
244
249
  style={{ aspectRatio: '1200/630' }}
@@ -248,12 +253,9 @@ export default function SearchResults({
248
253
  alt={item.title}
249
254
  className="h-full w-full object-contain"
250
255
  />
251
- <div className="absolute left-2 top-2">
252
- {getResultBadge(item.type, item.categorySlug)}
253
- </div>
254
256
  </div>
255
257
 
256
- {/* Desktop: Side image with overlay badge */}
258
+ {/* Desktop: Side image without overlay badge */}
257
259
  <div
258
260
  className="bg-mydarkgrey relative hidden flex-shrink-0 overflow-hidden rounded-lg md:block"
259
261
  style={{ width: '240px', height: '135px' }}
@@ -263,9 +265,6 @@ export default function SearchResults({
263
265
  alt={item.title}
264
266
  className="h-full w-full object-contain"
265
267
  />
266
- <div className="absolute left-2 top-2">
267
- {getResultBadge(item.type, item.categorySlug)}
268
- </div>
269
268
  </div>
270
269
 
271
270
  <div className="mt-3 min-w-0 flex-1 md:mt-0">
@@ -279,23 +278,31 @@ export default function SearchResults({
279
278
  {item.description}
280
279
  </p>
281
280
  )}
282
- {item.topics && item.topics.length > 0 && (
283
- <div className="mb-2 flex flex-wrap gap-1">
284
- {item.topics.slice(0, 3).map((topic, idx) => (
285
- <span
286
- key={idx}
287
- className="bg-myoffwhite text-mydarkgrey rounded px-2 py-1 text-xs"
288
- >
289
- {topic}
290
- </span>
291
- ))}
292
- {item.topics.length > 3 && (
293
- <span className="text-mydarkgrey text-xs">
294
- +{item.topics.length - 3} more
295
- </span>
296
- )}
297
- </div>
298
- )}
281
+
282
+ {/* Category badge and topics in same row */}
283
+ <div className="mb-2 flex flex-wrap gap-1">
284
+ {/* Always show the category badge first */}
285
+ {getResultBadge(item.type, item.categorySlug)}
286
+
287
+ {/* Then show topics if they exist */}
288
+ {item.topics && item.topics.length > 0 && (
289
+ <>
290
+ {item.topics.slice(0, 3).map((topic, idx) => (
291
+ <span
292
+ key={idx}
293
+ className="bg-myoffwhite text-mydarkgrey rounded px-2 py-1 text-xs"
294
+ >
295
+ {topic}
296
+ </span>
297
+ ))}
298
+ {item.topics.length > 3 && (
299
+ <span className="text-mydarkgrey text-xs">
300
+ +{item.topics.length - 3} more
301
+ </span>
302
+ )}
303
+ </>
304
+ )}
305
+ </div>
299
306
  </div>
300
307
  </div>
301
308
  </div>
@@ -350,7 +357,7 @@ export default function SearchResults({
350
357
 
351
358
  <Pagination.NextTrigger className="text-mydarkgrey hover:text-myblue ml-2 flex items-center gap-1 rounded px-3 py-2 text-sm font-medium transition-colors disabled:opacity-50">
352
359
  Next
353
- <ChevronRightIcon className="h-4 w-6" />
360
+ <ChevronRightIcon className="h-4 w-4" />
354
361
  </Pagination.NextTrigger>
355
362
  </Pagination.Root>
356
363
  </div>