npm - astro-tractstack - Versions diffs - 2.0.0-rc.47 → 2.0.0-rc.49 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (10) hide show

package/dist/index.js +1 -1
package/package.json +1 -1
package/templates/css/frontend.css +1 -1
package/templates/src/client/sse.js +106 -54
package/templates/src/components/search/SearchModal.tsx +102 -50
package/templates/src/components/search/SearchResults.tsx +48 -41
package/templates/src/lib/storyData.ts +1 -0
package/templates/src/pages/[...slug].astro +40 -1
package/templates/src/pages/storykeep/login.astro +1 -1
package/utils/inject-files.ts +1 -0

package/dist/index.js CHANGED Viewed

@@ -2062,7 +2062,7 @@ async function w(t, e, c) {
     try {
       const p = i(s.dest);
       r(p) || x(p, { recursive: !0 });
-      const o = !s.protected && (s.dest === "tailwind.config.cjs" || s.dest.startsWith("src/components/codehooks/") || s.dest.startsWith("src/components/widgets/") || s.dest.startsWith("src/") || s.dest === ".gitignore");
+      const o = !s.protected && (s.dest === "tailwind.config.cjs" || s.dest.startsWith("src/components/codehooks/") || s.dest.startsWith("src/components/widgets/") || s.dest.startsWith("src/") || s.dest.startsWith("public/client/") || s.dest === ".gitignore");
       if (!r(s.dest) || o)
         if (r(s.src))
           k(s.src, s.dest), e.info(`Updated ${s.dest}`);

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "astro-tractstack",
-  "version": "2.0.0-rc.47",
+  "version": "2.0.0-rc.49",
   "description": "Astro integration for TractStack - redeeming the web from boring experiences",
   "type": "module",
   "main": "dist/index.js",

package/templates/css/frontend.css CHANGED Viewed

	@@ -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))}}

package/templates/src/client/sse.js CHANGED Viewed

@@ -25,7 +25,7 @@ function log(...args) {
 }
 function logCritical(...args) {
-  if (VERBOSE) console.error('🚨 SSE CRITICAL:', ...args);
+  if (VERBOSE) console.warn('🚨 SSE CRITICAL:', ...args);
 }
 function logStoryfragmentChange(action, oldId, newId, source) {
@@ -151,57 +151,6 @@ async function performSSEHandshake(sessionId) {
     localStorage.setItem('tractstack_consent', result.consent);
     log('💾 Set consent:', result.consent);
-    if (
-      result.restored &&
-      result.affectedPanes &&
-      result.affectedPanes.length > 0
-    ) {
-      log('🔄 State restoration needed. Affected panes:', result.affectedPanes);
-      if (window.htmx && isHtmxReady) {
-        log('✅ HTMX ready, triggering immediate pane refreshes');
-        result.affectedPanes.forEach((paneId) => {
-          const element = document.querySelector(`[data-pane-id="${paneId}"]`);
-          if (element) {
-            log(`🔄 Restoring pane: ${paneId}`);
-            window.htmx.trigger(element, 'refresh');
-          } else {
-            log(`⚠️  Restoration pane element not found: ${paneId}`);
-          }
-        });
-      } else {
-        log(
-          '⚠️  HTMX not ready during restoration, setting up delayed refresh'
-        );
-        document.addEventListener(
-          'astro:page-load',
-          () => {
-            if (window.htmx && result.affectedPanes) {
-              log(
-                '🔄 HTMX now ready after page load, triggering delayed pane refreshes'
-              );
-              result.affectedPanes.forEach((paneId) => {
-                const element = document.querySelector(
-                  `[data-pane-id="${paneId}"]`
-                );
-                if (element) {
-                  log(`🔄 Delayed restoration for pane: ${paneId}`);
-                  window.htmx.trigger(element, 'refresh');
-                } else {
-                  log(
-                    `⚠️  Delayed restoration pane element not found: ${paneId}`
-                  );
-                }
-              });
-            }
-          },
-          { once: true }
-        );
-      }
-    } else {
-      log('ℹ️  No state restoration needed');
-    }
     if (window.TRACTSTACK_CONFIG) {
       window.TRACTSTACK_CONFIG.session = { isReady: true };
       log('✅ Marked session as ready in config');
@@ -297,6 +246,7 @@ function initializeSSE(sessionId) {
         for (const update of data.updates) {
           logCritical(`🔍 CHECKING UPDATE:`, {
             updateStoryfragment: update.storyfragmentId,
+            payload: update,
             currentStoryfragment: currentStoryfragmentId,
             configStoryfragment: window.TRACTSTACK_CONFIG?.storyfragmentId,
             willProcess: update.storyfragmentId === currentStoryfragmentId,
@@ -380,6 +330,7 @@ function processStoryfragmentUpdate(update) {
     storyfragmentId: update.storyfragmentId,
     affectedPanes: update.affectedPanes,
     gotoPaneId: update.gotoPaneId,
+    codeHookVisibility: update.CodeHookVisibility,
     currentContext: currentStoryfragmentId,
   });
@@ -395,10 +346,111 @@ function processStoryfragmentUpdate(update) {
     return;
   }
+  // Split pane IDs: code hooks vs regular panes
+  const codeHookPaneIds = [];
+  const regularPaneIds = [];
+  uniquePaneIds.forEach((paneId) => {
+    if (
+      update.CodeHookVisibility &&
+      update.CodeHookVisibility.hasOwnProperty(paneId)
+    ) {
+      codeHookPaneIds.push(paneId);
+    } else {
+      regularPaneIds.push(paneId);
+    }
+  });
+  log('🎭 Code hook pane IDs:', codeHookPaneIds);
+  log('📄 Regular pane IDs:', regularPaneIds);
+  // Process code hook visibility changes (CSS toggling)
+  if (codeHookPaneIds.length > 0) {
+    log('🎭 Processing code hook visibility changes');
+    codeHookPaneIds.forEach((paneId) => {
+      const element = document.querySelector(`#pane-${paneId}`);
+      if (element) {
+        const visibilityValue = update.CodeHookVisibility[paneId];
+        log(
+          `🎭 Code hook ${paneId} visibility value:`,
+          visibilityValue,
+          typeof visibilityValue
+        );
+        // Handle pane visibility
+        if (visibilityValue === false) {
+          element.style.display = 'none';
+          log(`🎭 Code hook pane ${paneId} HIDDEN`);
+        } else if (visibilityValue === true || Array.isArray(visibilityValue)) {
+          element.style.display = 'block';
+          log(`🎭 Code hook pane ${paneId} VISIBLE`);
+        }
+        // Handle unset button visibility
+        const unsetDiv = document.querySelector(`#pane-${paneId}-unset`);
+        if (unsetDiv) {
+          if (Array.isArray(visibilityValue)) {
+            // Show unset button - pane is visible and has beliefs to unset
+            const hxValsObject = {
+              unsetBeliefIds: visibilityValue.join(','),
+              paneId: paneId,
+            };
+            const hxValsJson = JSON.stringify(hxValsObject);
+            unsetDiv.innerHTML = `
+          <button
+            type="button"
+            class="text-mydarkgrey absolute right-2 top-2 z-10 rounded-full bg-white p-1.5 hover:bg-black hover:text-white"
+            title="Go Back"
+            hx-post="/api/v1/state"
+            hx-trigger="click"
+            hx-swap="none"
+            hx-vals='${hxValsJson}'
+            hx-preserve="true"
+          >
+            <svg
+              class="h-6 w-6"
+              fill="none"
+              viewBox="0 0 24 24"
+              stroke-width="1.5"
+              stroke="currentColor"
+            >
+              <path
+                stroke-linecap="round"
+                stroke-linejoin="round"
+                d="M9 15L3 9m0 0l6-6M3 9h12a6 6 0 010 12h-3"
+              />
+            </svg>
+          </button>
+        `;
+            // Tell HTMX to process the new button so hx-post works
+            if (window.htmx) {
+              window.htmx.process(unsetDiv);
+            }
+            log(
+              `🔄 Added unset button for pane ${paneId} with beliefs: ${visibilityValue.join(',')}`
+            );
+          } else {
+            // Clear unset button - pane is hidden or visible without unset needs
+            unsetDiv.innerHTML = '';
+            log(`🚫 Cleared unset button for pane ${paneId}`);
+          }
+        } else {
+          log(`⚠️ Unset div not found: pane-${paneId}-unset`);
+        }
+      } else {
+        log(`⚠️ Code hook element not found: pane-${paneId}`);
+      }
+    });
+  }
+  // Process regular panes (HTMX refresh)
   let refreshedCount = 0;
   let errorCount = 0;
-  uniquePaneIds.forEach((paneId) => {
+  regularPaneIds.forEach((paneId) => {
     const element = document.querySelector(`[data-pane-id="${paneId}"]`);
     if (element && window.htmx) {
@@ -431,7 +483,7 @@ function processStoryfragmentUpdate(update) {
   if (update.gotoPaneId) {
     const targetElement = document.getElementById(`pane-${update.gotoPaneId}`);
     if (targetElement) {
-      log(`📍 Scrolling to target pane: ${update.gotoPaneId}`);
+      log(`🔍 Scrolling to target pane: ${update.gotoPaneId}`);
       try {
         targetElement.scrollIntoView({ behavior: 'smooth' });
         log('✅ Scroll completed successfully');

package/templates/src/components/search/SearchModal.tsx CHANGED Viewed

@@ -21,13 +21,22 @@ interface SearchModalProps {
   contentMap: FullContentMapItem[];
 }
+// 1. Define a new type for the selected suggestions to include their type
+interface SelectedSuggestion {
+  term: string;
+  type: string;
+}
 export default function SearchModal({
   isOpen,
   onClose,
   contentMap,
 }: SearchModalProps) {
   const [query, setQuery] = useState('');
-  const [selectedTerms, setSelectedTerms] = useState<string[]>([]);
+  // 2. Update state to use the new type instead of just string[]
+  const [selectedSuggestions, setSelectedSuggestions] = useState<
+    SelectedSuggestion[]
+  >([]);
   const inputRef = useRef<HTMLInputElement>(null);
   const {
     suggestions,
@@ -51,13 +60,13 @@ export default function SearchModal({
   useEffect(() => {
     if (!isOpen) {
       setQuery('');
-      setSelectedTerms([]);
+      // 3. Update cleanup logic to use the new state
+      setSelectedSuggestions([]);
       clearAll();
     }
   }, [isOpen, clearAll]);
   useEffect(() => {
-    // Only trigger discovery if query has 3+ characters
     if (query.trim().length >= 3) {
       discoverTerms(query);
     }
@@ -69,7 +78,8 @@ export default function SearchModal({
   const handleClose = () => {
     setQuery('');
-    setSelectedTerms([]);
+    // 4. Update cleanup logic to use the new state
+    setSelectedSuggestions([]);
     clearAll();
     onClose();
   };
@@ -78,25 +88,20 @@ export default function SearchModal({
     if (e.key === 'Escape') {
       handleClose();
     } else if (e.key === 'Enter' && query.trim()) {
-      // Only proceed if we have suggestions or query is 3+ chars
       if (query.trim().length < 3) return;
-      // If there's only one suggestion, select it
       if (suggestions.length === 1) {
         handleSuggestionSelect(suggestions[0]);
       } else if (suggestions.length > 0) {
-        // Check for exact match first
         const exactMatch = suggestions.find(
           (s) => s.term.toLowerCase() === query.trim().toLowerCase()
         );
         if (exactMatch) {
           handleSuggestionSelect(exactMatch);
         } else {
-          // No exact match, select first suggestion
           handleSuggestionSelect(suggestions[0]);
         }
       } else {
-        // No suggestions, do exact match search
         handleExactMatch(query.trim());
       }
     }
@@ -107,34 +112,36 @@ export default function SearchModal({
   };
   const handleSuggestionSelect = (suggestion: DiscoverySuggestion) => {
-    // Add to selected terms if not already present
-    if (!selectedTerms.includes(suggestion.term)) {
-      setSelectedTerms((prev) => [...prev, suggestion.term]);
+    // 5. Update how suggestions are added to the state
+    // Check for duplicates before adding
+    if (!selectedSuggestions.some((s) => s.term === suggestion.term)) {
+      setSelectedSuggestions((prev) => [
+        ...prev,
+        { term: suggestion.term, type: suggestion.type },
+      ]);
     }
-    // Clear input and perform search
     setQuery('');
     selectSuggestion(suggestion);
   };
   const handleExactMatch = (term: string) => {
-    // Add to selected terms if not already present
-    if (!selectedTerms.includes(term)) {
-      setSelectedTerms((prev) => [...prev, term]);
+    // 6. Update exact match handling to add a default type
+    // From the legend, "Exact Match" uses the 'EXACT' style
+    if (!selectedSuggestions.some((s) => s.term === term)) {
+      setSelectedSuggestions((prev) => [...prev, { term, type: 'EXACT' }]);
     }
-    // Clear input and perform search
     setQuery('');
     selectExactMatch(term);
   };
   const removeTerm = (indexToRemove: number) => {
-    setSelectedTerms((prev) =>
+    // 7. Update remove logic to use the new state
+    setSelectedSuggestions((prev) =>
       prev.filter((_, index) => index !== indexToRemove)
     );
-    // Clear search results when removing terms
     clearAll();
-    // Focus back on input
     if (inputRef.current) {
       inputRef.current.focus();
     }
@@ -144,22 +151,41 @@ export default function SearchModal({
     switch (type) {
       case 'TOPIC':
         return 'bg-purple-100 text-purple-800 border-purple-200';
-      case 'TITLE':
-        return 'bg-blue-100 text-blue-800 border-blue-200';
-      case 'CONTENT':
+      case 'EXACT':
+        return 'bg-orange-100 text-orange-800 border-orange-200';
+      case 'TEXT':
         return 'bg-green-100 text-green-800 border-green-200';
       default:
         return 'bg-gray-100 text-gray-800 border-gray-200';
     }
   };
-  // Autocomplete logic - only show when we have suggestions and query is 3+ chars
+  // 8. (Optional but recommended) Create a helper for the 'X' button color
+  const getCloseButtonColor = (type: string) => {
+    switch (type) {
+      case 'TOPIC':
+        return 'text-purple-600 hover:text-purple-800';
+      case 'EXACT':
+        return 'text-orange-600 hover:text-orange-800';
+      case 'TEXT':
+        return 'text-green-600 hover:text-green-800';
+      default:
+        return 'text-gray-600 hover:text-gray-800';
+    }
+  };
   const bestCompletion =
     suggestions.length > 0 && query.length >= 3 ? suggestions[0].term : '';
   const showCompletion =
     bestCompletion.toLowerCase().startsWith(query.toLowerCase()) &&
     query.length >= 3;
+  let preservedCompletion = '';
+  if (showCompletion) {
+    const completionText = bestCompletion.slice(query.length);
+    preservedCompletion = completionText.startsWith(' ')
+      ? '\u00A0' + completionText.slice(1)
+      : completionText;
+  }
   const showSuggestions =
     suggestions.length > 0 && !searchResults && query.length >= 3;
   const showResults = searchResults !== null;
@@ -181,23 +207,28 @@ export default function SearchModal({
             className="bg-mywhite mx-auto w-full overflow-hidden rounded-lg shadow-2xl"
             style={{ height: '80vh' }}
           >
-            {/* Fixed Header */}
             <div className="relative w-full border-b border-gray-200 p-4">
-              {/* Selected Terms Pills */}
-              {selectedTerms.length > 0 && (
+              {/* 9. Update the rendering of selected term pills */}
+              {selectedSuggestions.length > 0 && (
                 <div className="mb-3 flex flex-wrap gap-2">
-                  {selectedTerms.map((term, index) => (
+                  {selectedSuggestions.map((suggestion, index) => (
                     <div
                       key={index}
-                      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"
+                      // Use getTypeColor to dynamically set the class
+                      className={`inline-flex items-center gap-1.5 rounded-lg border px-3 py-1.5 text-sm font-bold ${getTypeColor(
+                        suggestion.type
+                      )}`}
                     >
-                      <span>{term}</span>
+                      <span>{suggestion.term}</span>
                       <button
                         onClick={() => removeTerm(index)}
-                        className="ml-1 rounded-full p-0.5 text-blue-600 hover:bg-blue-200 hover:text-blue-800"
-                        aria-label={`Remove ${term}`}
+                        // Use the new helper for the button color
+                        className={`flex items-center justify-center rounded-full ${getCloseButtonColor(
+                          suggestion.type
+                        )}`}
+                        aria-label={`Remove ${suggestion.term}`}
                       >
-                        <XMarkIcon className="h-3 w-3" />
+                        <XMarkIcon className="h-4 w-4" />
                       </button>
                     </div>
                   ))}
@@ -208,10 +239,10 @@ export default function SearchModal({
                 <div className="relative w-full px-6 py-2">
                   {showCompletion && (
                     <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">
-                      <span style={{ visibility: 'hidden' }}>{query}</span>
-                      {bestCompletion
-                        .slice(query.length)
-                        .replace(/ /g, '\u00A0')}
+                      <span style={{ visibility: 'hidden', whiteSpace: 'pre' }}>
+                        {query}
+                      </span>
+                      {preservedCompletion}
                     </div>
                   )}
                   <input
@@ -226,6 +257,7 @@ export default function SearchModal({
                   />
                 </div>
               )}
               <button
                 onClick={handleClose}
                 className="text-mydarkgrey hover:text-myblue absolute right-4 top-6 rounded-lg p-2 transition-colors hover:bg-gray-100"
@@ -235,13 +267,12 @@ export default function SearchModal({
               </button>
             </div>
-            {/* Scrollable Content Area */}
             <div
               className="w-full overflow-y-auto"
               style={{ height: 'calc(80vh - 80px)' }}
             >
-              {/* Initial State */}
-              {!query.trim() && selectedTerms.length === 0 && (
+              {/* 10. Final cleanup logic update */}
+              {!query.trim() && selectedSuggestions.length === 0 && (
                 <div className="w-full p-8 text-center text-gray-500">
                   <MagnifyingGlassIcon className="mx-auto mb-4 h-16 w-16 text-gray-300" />
                   <p className="text-lg">Search across all content</p>
@@ -251,7 +282,6 @@ export default function SearchModal({
                 </div>
               )}
-              {/* Show message for less than 3 characters */}
               {query.trim() && query.trim().length < 3 && (
                 <div className="w-full p-8 text-center text-gray-500">
                   <p className="text-lg">Keep typing...</p>
@@ -261,7 +291,6 @@ export default function SearchModal({
                 </div>
               )}
-              {/* Discovery Loading */}
               {query.trim().length >= 3 && isDiscovering && (
                 <div className="w-full p-8 text-center">
                   <div className="border-myblue inline-block h-8 w-8 animate-spin rounded-full border-b-2"></div>
@@ -269,7 +298,6 @@ export default function SearchModal({
                 </div>
               )}
-              {/* Discovery Error */}
               {query.trim().length >= 3 && discoverError && (
                 <div className="w-full p-8 text-center text-red-600">
                   <p>Discovery failed: {discoverError}</p>
@@ -282,7 +310,6 @@ export default function SearchModal({
                 </div>
               )}
-              {/* Suggestion Pills */}
               {showSuggestions && (
                 <div className="w-full p-6">
                   <p className="text-mydarkgrey mb-4 text-sm font-bold">
@@ -293,7 +320,9 @@ export default function SearchModal({
                       <button
                         key={index}
                         onClick={() => handleSuggestionClick(suggestion)}
-                        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)}`}
+                        className={`inline-flex items-center rounded-lg border px-3 py-1.5 text-sm font-bold transition-all hover:shadow-md ${getTypeColor(
+                          suggestion.type
+                        )}`}
                       >
                         <span>{suggestion.term}</span>
                       </button>
@@ -302,10 +331,35 @@ export default function SearchModal({
                   <p className="text-mydarkgrey mt-4 text-xs">
                     Click a suggestion or press Enter to search
                   </p>
+                  <div className="mt-6 border-t border-gray-200 pt-4">
+                    <div className="flex flex-wrap items-center gap-x-4 gap-y-2 text-xs text-gray-600">
+                      <span className="font-bold">Legend:</span>
+                      <span
+                        className={`inline-flex items-center rounded-lg border px-3 py-1.5 text-sm font-bold ${getTypeColor(
+                          'EXACT'
+                        )}`}
+                      >
+                        Exact Match
+                      </span>
+                      <span
+                        className={`inline-flex items-center rounded-lg border px-3 py-1.5 text-sm font-bold ${getTypeColor(
+                          'TOPIC'
+                        )}`}
+                      >
+                        Topic
+                      </span>
+                      <span
+                        className={`inline-flex items-center rounded-lg border px-3 py-1.5 text-sm font-bold ${getTypeColor(
+                          'TEXT'
+                        )}`}
+                      >
+                        Text Match
+                      </span>
+                    </div>
+                  </div>
                 </div>
               )}
-              {/* Retrieve Loading */}
               {isRetrieving && (
                 <div className="w-full p-8 text-center">
                   <div className="border-myblue inline-block h-8 w-8 animate-spin rounded-full border-b-2"></div>
@@ -313,14 +367,12 @@ export default function SearchModal({
                 </div>
               )}
-              {/* Retrieve Error */}
               {retrieveError && (
                 <div className="w-full p-8 text-center text-red-600">
                   <p>Search failed: {retrieveError}</p>
                 </div>
               )}
-              {/* No Results */}
               {!isRetrieving &&
                 !retrieveError &&
                 showResults &&
@@ -333,7 +385,6 @@ export default function SearchModal({
                   </div>
                 )}
-              {/* Search Results */}
               {!isRetrieving &&
                 !retrieveError &&
                 showResults &&
@@ -341,6 +392,7 @@ export default function SearchModal({
                   <SearchResults
                     results={searchResults}
                     contentMap={contentMap}
+                    getTypeColor={getTypeColor}
                   />
                 )}
             </div>

package/templates/src/components/search/SearchResults.tsx CHANGED Viewed

@@ -14,6 +14,7 @@ const VERBOSE = false;
 interface SearchResultsProps {
   results: CategorizedResults;
   contentMap: FullContentMapItem[];
+  getTypeColor: (type: string) => string;
 }
 interface ResultItem {
@@ -35,6 +36,7 @@ const ITEMS_PER_PAGE = 10;
 export default function SearchResults({
   results,
   contentMap,
+  getTypeColor,
 }: SearchResultsProps) {
   const [currentPage, setCurrentPage] = useState(1);
@@ -189,28 +191,31 @@ export default function SearchResults({
   };
   const getResultBadge = (type: string, categorySlug?: string) => {
+    let styleType = type;
+    let label = '';
     switch (type) {
       case 'StoryFragment':
-        return (
-          <span className="inline-flex items-center rounded-full bg-blue-100 px-2 py-1 text-xs font-medium text-blue-800">
-            Page
-          </span>
-        );
+        label = 'Page';
+        break;
       case 'ContextPane':
-        return (
-          <span className="inline-flex items-center rounded-full bg-green-100 px-2 py-1 text-xs font-medium text-green-800">
-            Context
-          </span>
-        );
+        label = 'Context';
+        break;
       case 'Resource':
-        return (
-          <span className="inline-flex items-center rounded-full bg-orange-100 px-2 py-1 text-xs font-medium text-orange-800">
-            {categorySlug || 'Resource'}
-          </span>
-        );
+        styleType = 'COLLECTION';
+        label = categorySlug || 'Resource';
+        break;
       default:
         return null;
     }
+    // Get the color classes but extract just the text and background colors for the inline style
+    const colorClasses = getTypeColor(styleType);
+    return (
+      <span className={`rounded px-2 py-1 text-xs ${colorClasses}`}>
+        {label}
+      </span>
+    );
   };
   if (totalResults === 0) {
@@ -238,7 +243,7 @@ export default function SearchResults({
           >
             <a href={item.url} className="group block">
               <div className="flex flex-col md:flex-row md:items-start md:gap-4">
-                {/* Mobile: Full width image with overlay badge */}
+                {/* Mobile: Full width image without overlay badge */}
                 <div
                   className="bg-mydarkgrey relative w-full overflow-hidden rounded-lg md:hidden"
                   style={{ aspectRatio: '1200/630' }}
@@ -248,12 +253,9 @@ export default function SearchResults({
                     alt={item.title}
                     className="h-full w-full object-contain"
                   />
-                  <div className="absolute left-2 top-2">
-                    {getResultBadge(item.type, item.categorySlug)}
-                  </div>
                 </div>
-                {/* Desktop: Side image with overlay badge */}
+                {/* Desktop: Side image without overlay badge */}
                 <div
                   className="bg-mydarkgrey relative hidden flex-shrink-0 overflow-hidden rounded-lg md:block"
                   style={{ width: '240px', height: '135px' }}
@@ -263,9 +265,6 @@ export default function SearchResults({
                     alt={item.title}
                     className="h-full w-full object-contain"
                   />
-                  <div className="absolute left-2 top-2">
-                    {getResultBadge(item.type, item.categorySlug)}
-                  </div>
                 </div>
                 <div className="mt-3 min-w-0 flex-1 md:mt-0">
@@ -279,23 +278,31 @@ export default function SearchResults({
                           {item.description}
                         </p>
                       )}
-                      {item.topics && item.topics.length > 0 && (
-                        <div className="mb-2 flex flex-wrap gap-1">
-                          {item.topics.slice(0, 3).map((topic, idx) => (
-                            <span
-                              key={idx}
-                              className="bg-myoffwhite text-mydarkgrey rounded px-2 py-1 text-xs"
-                            >
-                              {topic}
-                            </span>
-                          ))}
-                          {item.topics.length > 3 && (
-                            <span className="text-mydarkgrey text-xs">
-                              +{item.topics.length - 3} more
-                            </span>
-                          )}
-                        </div>
-                      )}
+                      {/* Category badge and topics in same row */}
+                      <div className="mb-2 flex flex-wrap gap-1">
+                        {/* Always show the category badge first */}
+                        {getResultBadge(item.type, item.categorySlug)}
+                        {/* Then show topics if they exist */}
+                        {item.topics && item.topics.length > 0 && (
+                          <>
+                            {item.topics.slice(0, 3).map((topic, idx) => (
+                              <span
+                                key={idx}
+                                className="bg-myoffwhite text-mydarkgrey rounded px-2 py-1 text-xs"
+                              >
+                                {topic}
+                              </span>
+                            ))}
+                            {item.topics.length > 3 && (
+                              <span className="text-mydarkgrey text-xs">
+                                +{item.topics.length - 3} more
+                              </span>
+                            )}
+                          </>
+                        )}
+                      </div>
                     </div>
                   </div>
                 </div>
@@ -350,7 +357,7 @@ export default function SearchResults({
             <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">
               Next
-              <ChevronRightIcon className="h-4 w-6" />
+              <ChevronRightIcon className="h-4 w-4" />
             </Pagination.NextTrigger>
           </Pagination.Root>
         </div>

package/templates/src/lib/storyData.ts CHANGED Viewed

@@ -7,6 +7,7 @@ export interface StoryData {
   slug: string;
   paneIds: string[];
   codeHookTargets: Record<string, string>;
+  codeHookVisibility: Record<string, boolean | string[]>;
   resourcesPayload: Record<string, ResourceNode[]>;
   impressions: ImpressionNode[];
   fragments: Record<string, string>;

package/templates/src/pages/[...slug].astro CHANGED Viewed

@@ -131,12 +131,19 @@ const ogImage =
             id={`pane-${paneId}`}
             data-pane-id={paneId}
             class="pane-fragment-container"
+            style={
+              !codeHookTargets[paneId]
+                ? undefined
+                : !storyData.codeHookVisibility?.[paneId]
+                  ? 'display:none;'
+                  : 'display:block;'
+            }
             hx-get={`/api/v1/fragments/panes/${paneId}`}
             hx-trigger="refresh"
             hx-swap="innerHTML"
           >
             {codeHookTargets[paneId] ? (
-              <div class="overflow-hidden">
+              <div class="relative overflow-hidden">
                 <CodeHook
                   target={codeHookTargets[paneId]}
                   options={(() => {
@@ -149,6 +156,38 @@ const ogImage =
                   fullContentMap={fullContentMap}
                   resourcesPayload={resourcesPayload}
                 />
+                <div id={`pane-${paneId}-unset`}>
+                  {Array.isArray(storyData.codeHookVisibility?.[paneId]) && (
+                    <button
+                      type="button"
+                      class="text-mydarkgrey absolute right-2 top-2 z-10 rounded-full bg-white p-1.5 hover:bg-black hover:text-white"
+                      title="Go Back"
+                      hx-post="/api/v1/state"
+                      hx-trigger="click"
+                      hx-swap="none"
+                      hx-vals={JSON.stringify({
+                        unsetBeliefIds:
+                          storyData.codeHookVisibility[paneId].join(','),
+                        paneId: paneId,
+                      })}
+                      hx-preserve="true"
+                    >
+                      <svg
+                        class="h-6 w-6"
+                        fill="none"
+                        viewBox="0 0 24 24"
+                        stroke-width="1.5"
+                        stroke="currentColor"
+                      >
+                        <path
+                          stroke-linecap="round"
+                          stroke-linejoin="round"
+                          d="M9 15L3 9m0 0l6-6M3 9h12a6 6 0 010 12h-3"
+                        />
+                      </svg>
+                    </button>
+                  )}
+                </div>
               </div>
             ) : (
               <Fragment set:html={fragmentsData[paneId] || ''} />

package/templates/src/pages/storykeep/login.astro CHANGED Viewed

@@ -75,7 +75,7 @@ const mainStylesUrl = isDev
         </h2>
       </div>
-      <div class="mx-auto">
+      <div class="mx-auto max-w-sm">
         <div class="rounded-lg bg-white px-6 py-12 shadow-inner">
           <!-- Error message -->
           <div

package/utils/inject-files.ts CHANGED Viewed

@@ -2119,6 +2119,7 @@ export async function injectTemplateFiles(
           file.dest.startsWith('src/components/codehooks/') ||
           file.dest.startsWith('src/components/widgets/') ||
           file.dest.startsWith('src/') ||
+          file.dest.startsWith('public/client/') ||
           file.dest === '.gitignore');
       if (!existsSync(file.dest) || shouldOverwrite) {