*,:after,:before{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }::backdrop{--tw-border-spacing-x:0;--tw-border-spacing-y:0;--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness:proximity;--tw-gradient-from-position: ;--tw-gradient-via-position: ;--tw-gradient-to-position: ;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-color:rgba(59,130,246,.5);--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: ;--tw-contain-size: ;--tw-contain-layout: ;--tw-contain-paint: ;--tw-contain-style: }/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com*/*,:after,:before{box-sizing:border-box;border:0 solid #e5e7eb}:after,:before{--tw-content:""}:host,html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:Inter,system-ui,sans-serif;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]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,pre,samp{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-feature-settings:normal;font-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;letter-spacing:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,input:where([type=button]),input:where([type=reset]),input:where([type=submit]){-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre{margin:0}fieldset{margin:0}fieldset,legend{padding:0}menu,ol,ul{list-style:none;margin:0;padding:0}dialog{padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}[role=button],button{cursor:pointer}:disabled{cursor:default}audio,canvas,embed,iframe,img,object,svg,video{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]:where(:not([hidden=until-found])){display:none}.\!container{width:100%!important}.container{width:100%}@media (min-width:640px){.\!container{max-width:640px!important}.container{max-width:640px}}@media (min-width:768px){.\!container{max-width:768px!important}.container{max-width:768px}}@media (min-width:1024px){.\!container{max-width:1024px!important}.container{max-width:1024px}}@media (min-width:1280px){.\!container{max-width:1280px!important}.container{max-width:1280px}}@media (min-width:1536px){.\!container{max-width:1536px!important}.container{max-width:1536px}}.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}.not-sr-only{position:static;width:auto;height:auto;padding:0;margin:0;overflow:visible;clip:auto;white-space:normal}.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:0}.-right-2{right:-.5rem}.-right-8{right:-2rem}.-top-2{top:-.5rem}.-top-8{top:-2rem}.bottom-0{bottom:0}.bottom-3{bottom:.75rem}.bottom-4{bottom:1rem}.bottom-6{bottom:1.5rem}.left-0{left:0}.left-1\/2{left:50%}.left-2{left:.5rem}.left-3{left:.75rem}.left-4{left:1rem}.left-6{left:1.5rem}.right-0{right:0}.right-1{right:.25rem}.right-2{right:.5rem}.right-3{right:.75rem}.right-4{right:1rem}.right-6{right:1.5rem}.top-0{top:0}.top-1{top:.25rem}.top-1\/2{top:50%}.top-2{top:.5rem}.top-3{top:.75rem}.top-4{top:1rem}.top-5{top:1.25rem}.isolate{isolation:isolate}.isolation-auto{isolation:auto}.z-10{z-index:10}.z-30{z-index:30}.z-40{z-index:40}.z-50{z-index:50}.z-\[45\]{z-index:45}.z-\[55\]{z-index:55}.z-\[60\]{z-index:60}.order-1{order:1}.order-2{order:2}.col-span-full{grid-column:1/-1}.float-start{float:inline-start}.float-end{float:inline-end}.float-right{float:right}.float-left{float:left}.float-none{float:none}.clear-start{clear:inline-start}.clear-end{clear:inline-end}.clear-left{clear:left}.clear-right{clear:right}.clear-both{clear:both}.clear-none{clear:none}.-m-1{margin:-.25rem}.-mx-4{margin-left:-1rem;margin-right:-1rem}.mx-auto{margin-left:auto;margin-right:auto}.my-auto{margin-top:auto;margin-bottom:auto}.mb-0{margin-bottom:0}.mb-0\.5{margin-bottom:.125rem}.mb-1{margin-bottom:.25rem}.mb-1\.5{margin-bottom:.375rem}.mb-10{margin-bottom:2.5rem}.mb-2{margin-bottom:.5rem}.mb-2\.5{margin-bottom:.625rem}.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}.mb-5{margin-bottom:1.25rem}.mb-6{margin-bottom:1.5rem}.mb-8{margin-bottom:2rem}.ml-auto{margin-left:auto}.mt-0\.5{margin-top:.125rem}.mt-1{margin-top:.25rem}.mt-1\.5{margin-top:.375rem}.mt-10{margin-top:2.5rem}.mt-2{margin-top:.5rem}.mt-2\.5{margin-top:.625rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.mt-auto{margin-top:auto}.box-border{box-sizing:border-box}.box-content{box-sizing:content-box}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2}.line-clamp-none{overflow:visible;display:block;-webkit-box-orient:horizontal;-webkit-line-clamp:none}.block{display:block}.inline-block{display:inline-block}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.table{display:table}.inline-table{display:inline-table}.table-caption{display:table-caption}.table-cell{display:table-cell}.table-column{display:table-column}.table-column-group{display:table-column-group}.table-footer-group{display:table-footer-group}.table-header-group{display:table-header-group}.table-row-group{display:table-row-group}.table-row{display:table-row}.flow-root{display:flow-root}.\!grid{display:grid!important}.grid{display:grid}.inline-grid{display:inline-grid}.contents{display:contents}.list-item{display:list-item}.hidden{display:none}.aspect-\[3\/4\]{aspect-ratio:3/4}.aspect-square{aspect-ratio:1/1}.h-1{height:.25rem}.h-1\.5{height:.375rem}.h-10{height:2.5rem}.h-11{height:2.75rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-16{height:4rem}.h-2{height:.5rem}.h-2\.5{height:.625rem}.h-20{height:5rem}.h-24{height:6rem}.h-3{height:.75rem}.h-3\.5{height:.875rem}.h-4{height:1rem}.h-5{height:1.25rem}.h-6{height:1.5rem}.h-7{height:1.75rem}.h-8{height:2rem}.h-9{height:2.25rem}.h-\[2px\]{height:2px}.h-\[72px\]{height:72px}.h-full{height:100%}.max-h-60{max-height:15rem}.max-h-72{max-height:18rem}.max-h-\[90vh\]{max-height:90vh}.w-1{width:.25rem}.w-1\.5{width:.375rem}.w-10{width:2.5rem}.w-11{width:2.75rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-16{width:4rem}.w-2{width:.5rem}.w-2\.5{width:.625rem}.w-20{width:5rem}.w-24{width:6rem}.w-3{width:.75rem}.w-3\.5{width:.875rem}.w-4{width:1rem}.w-5{width:1.25rem}.w-6{width:1.5rem}.w-7{width:1.75rem}.w-8{width:2rem}.w-9{width:2.25rem}.w-\[72px\]{width:72px}.w-full{width:100%}.min-w-0{min-width:0}.min-w-\[44px\]{min-width:44px}.max-w-2xl{max-width:42rem}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-7xl{max-width:80rem}.max-w-\[320px\]{max-width:320px}.max-w-\[340px\]{max-width:340px}.max-w-\[90vw\]{max-width:90vw}.max-w-lg{max-width:32rem}.max-w-md{max-width:28rem}.max-w-sm{max-width:24rem}.max-w-xs{max-width:20rem}.flex-1{flex:1 1 0%}.flex-shrink{flex-shrink:1}.flex-shrink-0{flex-shrink:0}.shrink{flex-shrink:1}.shrink-0{flex-shrink:0}.flex-grow,.grow{flex-grow:1}.table-auto{table-layout:auto}.table-fixed{table-layout:fixed}.caption-top{caption-side:top}.caption-bottom{caption-side:bottom}.border-collapse{border-collapse:collapse}.border-separate{border-collapse:separate}.-translate-x-1\/2{--tw-translate-x:-50%}.-translate-x-1\/2,.-translate-y-1\/2{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-translate-y-1\/2{--tw-translate-y:-50%}.translate-x-0{--tw-translate-x:0px}.translate-x-0,.translate-x-full{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-full{--tw-translate-x:100%}.translate-y-full{--tw-translate-y:100%}.transform,.transform-cpu,.translate-y-full{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-gpu{transform:translate3d(var(--tw-translate-x),var(--tw-translate-y),0) 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-none{transform:none}@keyframes ping{75%,to{transform:scale(2);opacity:0}}.animate-ping{animation:ping 1s cubic-bezier(0,0,.2,1) infinite}@keyframes pulse{50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes spin{to{transform:rotate(1turn)}}.animate-spin{animation:spin 1s linear infinite}.cursor-pointer{cursor:pointer}.touch-auto{touch-action:auto}.touch-none{touch-action:none}.touch-pan-x{--tw-pan-x:pan-x}.touch-pan-left,.touch-pan-x{touch-action:var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom)}.touch-pan-left{--tw-pan-x:pan-left}.touch-pan-right{--tw-pan-x:pan-right}.touch-pan-right,.touch-pan-y{touch-action:var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom)}.touch-pan-y{--tw-pan-y:pan-y}.touch-pan-up{--tw-pan-y:pan-up}.touch-pan-down,.touch-pan-up{touch-action:var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom)}.touch-pan-down{--tw-pan-y:pan-down}.touch-pinch-zoom{--tw-pinch-zoom:pinch-zoom;touch-action:var(--tw-pan-x) var(--tw-pan-y) var(--tw-pinch-zoom)}.touch-manipulation{touch-action:manipulation}.select-none{-webkit-user-select:none;-moz-user-select:none;user-select:none}.select-text{-webkit-user-select:text;-moz-user-select:text;user-select:text}.select-all{-webkit-user-select:all;-moz-user-select:all;user-select:all}.select-auto{-webkit-user-select:auto;-moz-user-select:auto;user-select:auto}.resize-none{resize:none}.resize-y{resize:vertical}.resize-x{resize:horizontal}.resize{resize:both}.snap-none{scroll-snap-type:none}.snap-x{scroll-snap-type:x var(--tw-scroll-snap-strictness)}.snap-y{scroll-snap-type:y var(--tw-scroll-snap-strictness)}.snap-both{scroll-snap-type:both var(--tw-scroll-snap-strictness)}.snap-mandatory{--tw-scroll-snap-strictness:mandatory}.snap-proximity{--tw-scroll-snap-strictness:proximity}.snap-start{scroll-snap-align:start}.snap-end{scroll-snap-align:end}.snap-center{scroll-snap-align:center}.snap-align-none{scroll-snap-align:none}.snap-normal{scroll-snap-stop:normal}.snap-always{scroll-snap-stop:always}.list-inside{list-style-position:inside}.list-outside{list-style-position:outside}.list-disc{list-style-type:disc}.appearance-none{-webkit-appearance:none;-moz-appearance:none;appearance:none}.appearance-auto{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto}.break-before-auto{-moz-column-break-before:auto;break-before:auto}.break-before-avoid{-moz-column-break-before:avoid;break-before:avoid}.break-before-all{-moz-column-break-before:all;break-before:all}.break-before-avoid-page{-moz-column-break-before:avoid;break-before:avoid-page}.break-before-page{-moz-column-break-before:page;break-before:page}.break-before-left{-moz-column-break-before:left;break-before:left}.break-before-right{-moz-column-break-before:right;break-before:right}.break-before-column{-moz-column-break-before:column;break-before:column}.break-inside-auto{-moz-column-break-inside:auto;break-inside:auto}.break-inside-avoid{-moz-column-break-inside:avoid;break-inside:avoid}.break-inside-avoid-page{break-inside:avoid-page}.break-inside-avoid-column{-moz-column-break-inside:avoid;break-inside:avoid-column}.break-after-auto{-moz-column-break-after:auto;break-after:auto}.break-after-avoid{-moz-column-break-after:avoid;break-after:avoid}.break-after-all{-moz-column-break-after:all;break-after:all}.break-after-avoid-page{-moz-column-break-after:avoid;break-after:avoid-page}.break-after-page{-moz-column-break-after:page;break-after:page}.break-after-left{-moz-column-break-after:left;break-after:left}.break-after-right{-moz-column-break-after:right;break-after:right}.break-after-column{-moz-column-break-after:column;break-after:column}.grid-flow-row{grid-auto-flow:row}.grid-flow-col{grid-auto-flow:column}.grid-flow-dense{grid-auto-flow:dense}.grid-flow-row-dense{grid-auto-flow:row dense}.grid-flow-col-dense{grid-auto-flow:column dense}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.flex-row{flex-direction:row}.flex-row-reverse{flex-direction:row-reverse}.flex-col{flex-direction:column}.flex-col-reverse{flex-direction:column-reverse}.flex-wrap{flex-wrap:wrap}.flex-wrap-reverse{flex-wrap:wrap-reverse}.flex-nowrap{flex-wrap:nowrap}.place-content-center{place-content:center}.place-content-start{place-content:start}.place-content-end{place-content:end}.place-content-between{place-content:space-between}.place-content-around{place-content:space-around}.place-content-evenly{place-content:space-evenly}.place-content-baseline{place-content:baseline}.place-content-stretch{place-content:stretch}.place-items-start{place-items:start}.place-items-end{place-items:end}.place-items-center{place-items:center}.place-items-baseline{place-items:baseline}.place-items-stretch{place-items:stretch}.content-normal{align-content:normal}.content-center{align-content:center}.content-start{align-content:flex-start}.content-end{align-content:flex-end}.content-between{align-content:space-between}.content-around{align-content:space-around}.content-evenly{align-content:space-evenly}.content-baseline{align-content:baseline}.content-stretch{align-content:stretch}.items-start{align-items:flex-start}.items-end{align-items:flex-end}.items-center{align-items:center}.items-baseline{align-items:baseline}.items-stretch{align-items:stretch}.justify-normal{justify-content:normal}.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}.justify-evenly{justify-content:space-evenly}.justify-stretch{justify-content:stretch}.justify-items-start{justify-items:start}.justify-items-end{justify-items:end}.justify-items-center{justify-items:center}.justify-items-stretch{justify-items:stretch}.gap-0\.5{gap:.125rem}.gap-1{gap:.25rem}.gap-1\.5{gap:.375rem}.gap-2{gap:.5rem}.gap-2\.5{gap:.625rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-6{gap:1.5rem}.gap-8{gap:2rem}.space-y-0\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.125rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.125rem*var(--tw-space-y-reverse))}.space-y-1>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.25rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.25rem*var(--tw-space-y-reverse))}.space-y-1\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.375rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.375rem*var(--tw-space-y-reverse))}.space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.space-y-2\.5>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.625rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.625rem*var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.75rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem*var(--tw-space-y-reverse))}.space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.space-y-reverse>:not([hidden])~:not([hidden]){--tw-space-y-reverse:1}.space-x-reverse>:not([hidden])~:not([hidden]){--tw-space-x-reverse:1}.divide-x>:not([hidden])~:not([hidden]){--tw-divide-x-reverse:0;border-right-width:calc(1px*var(--tw-divide-x-reverse));border-left-width:calc(1px*(1 - var(--tw-divide-x-reverse)))}.divide-y>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:0;border-top-width:calc(1px*(1 - var(--tw-divide-y-reverse)));border-bottom-width:calc(1px*var(--tw-divide-y-reverse))}.divide-y-reverse>:not([hidden])~:not([hidden]){--tw-divide-y-reverse:1}.divide-x-reverse>:not([hidden])~:not([hidden]){--tw-divide-x-reverse:1}.divide-solid>:not([hidden])~:not([hidden]){border-style:solid}.divide-dashed>:not([hidden])~:not([hidden]){border-style:dashed}.divide-dotted>:not([hidden])~:not([hidden]){border-style:dotted}.divide-double>:not([hidden])~:not([hidden]){border-style:double}.divide-none>:not([hidden])~:not([hidden]){border-style:none}.place-self-auto{place-self:auto}.place-self-start{place-self:start}.place-self-end{place-self:end}.place-self-center{place-self:center}.place-self-stretch{place-self:stretch}.self-auto{align-self:auto}.self-start{align-self:flex-start}.self-end{align-self:flex-end}.self-center{align-self:center}.self-stretch{align-self:stretch}.self-baseline{align-self:baseline}.justify-self-auto{justify-self:auto}.justify-self-start{justify-self:start}.justify-self-end{justify-self:end}.justify-self-center{justify-self:center}.justify-self-stretch{justify-self:stretch}.overflow-auto{overflow:auto}.overflow-hidden{overflow:hidden}.overflow-clip{overflow:clip}.overflow-visible{overflow:visible}.overflow-scroll{overflow:scroll}.overflow-x-auto{overflow-x:auto}.overflow-y-auto{overflow-y:auto}.overflow-x-hidden{overflow-x:hidden}.overflow-y-hidden{overflow-y:hidden}.overflow-x-clip{overflow-x:clip}.overflow-y-clip{overflow-y:clip}.overflow-x-visible{overflow-x:visible}.overflow-y-visible{overflow-y:visible}.overflow-x-scroll{overflow-x:scroll}.overflow-y-scroll{overflow-y:scroll}.overscroll-auto{overscroll-behavior:auto}.overscroll-contain{overscroll-behavior:contain}.overscroll-none{overscroll-behavior:none}.overscroll-y-auto{overscroll-behavior-y:auto}.overscroll-y-contain{overscroll-behavior-y:contain}.overscroll-y-none{overscroll-behavior-y:none}.overscroll-x-auto{overscroll-behavior-x:auto}.overscroll-x-contain{overscroll-behavior-x:contain}.overscroll-x-none{overscroll-behavior-x:none}.scroll-auto{scroll-behavior:auto}.scroll-smooth{scroll-behavior:smooth}.truncate{overflow:hidden;white-space:nowrap}.overflow-ellipsis,.text-ellipsis,.truncate{text-overflow:ellipsis}.text-clip{text-overflow:clip}.hyphens-none{-webkit-hyphens:none;hyphens:none}.hyphens-manual{-webkit-hyphens:manual;hyphens:manual}.hyphens-auto{-webkit-hyphens:auto;hyphens:auto}.whitespace-normal{white-space:normal}.whitespace-nowrap{white-space:nowrap}.whitespace-pre{white-space:pre}.whitespace-pre-line{white-space:pre-line}.whitespace-pre-wrap{white-space:pre-wrap}.whitespace-break-spaces{white-space:break-spaces}.text-wrap{text-wrap:wrap}.text-nowrap{text-wrap:nowrap}.text-balance{text-wrap:balance}.text-pretty{text-wrap:pretty}.break-normal{overflow-wrap:normal;word-break:normal}.break-words{overflow-wrap:break-word}.break-all{word-break:break-all}.break-keep{word-break:keep-all}.rounded{border-radius:.25rem}.rounded-2xl{border-radius:1rem}.rounded-3xl{border-radius:1.5rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-xl{border-radius:.75rem}.rounded-b{border-bottom-right-radius:.25rem;border-bottom-left-radius:.25rem}.rounded-e{border-start-end-radius:.25rem;border-end-end-radius:.25rem}.rounded-l{border-top-left-radius:.25rem;border-bottom-left-radius:.25rem}.rounded-r{border-top-right-radius:.25rem;border-bottom-right-radius:.25rem}.rounded-r-2xl{border-top-right-radius:1rem;border-bottom-right-radius:1rem}.rounded-s{border-start-start-radius:.25rem;border-end-start-radius:.25rem}.rounded-t{border-top-left-radius:.25rem;border-top-right-radius:.25rem}.rounded-bl{border-bottom-left-radius:.25rem}.rounded-br{border-bottom-right-radius:.25rem}.rounded-ee{border-end-end-radius:.25rem}.rounded-es{border-end-start-radius:.25rem}.rounded-se{border-start-end-radius:.25rem}.rounded-ss{border-start-start-radius:.25rem}.rounded-tl{border-top-left-radius:.25rem}.rounded-tr{border-top-right-radius:.25rem}.border{border-width:1px}.border-2{border-width:2px}.border-x{border-left-width:1px;border-right-width:1px}.border-y{border-top-width:1px}.border-b,.border-y{border-bottom-width:1px}.border-e{border-inline-end-width:1px}.border-l{border-left-width:1px}.border-l-4{border-left-width:4px}.border-r{border-right-width:1px}.border-s{border-inline-start-width:1px}.border-t{border-top-width:1px}.border-solid{border-style:solid}.border-dashed{border-style:dashed}.border-dotted{border-style:dotted}.border-double{border-style:double}.border-hidden{border-style:hidden}.border-none{border-style:none}.border-green-500\/20{border-color:rgba(34,197,94,.2)}.border-green-500\/25{border-color:rgba(34,197,94,.25)}.border-green-500\/30{border-color:rgba(34,197,94,.3)}.border-red-500\/20{border-color:rgba(239,68,68,.2)}.border-red-500\/25{border-color:rgba(239,68,68,.25)}.border-red-500\/30{border-color:rgba(239,68,68,.3)}.border-white\/10{border-color:hsla(0,0%,100%,.1)}.border-xoro-border{border-color:var(--xoro-border)}.border-xoro-gold{border-color:var(--xoro-gold)}.bg-black\/30{background-color:rgba(0,0,0,.3)}.bg-black\/40{background-color:rgba(0,0,0,.4)}.bg-black\/50{background-color:rgba(0,0,0,.5)}.bg-black\/60{background-color:rgba(0,0,0,.6)}.bg-black\/70{background-color:rgba(0,0,0,.7)}.bg-black\/80{background-color:rgba(0,0,0,.8)}.bg-black\/95{background-color:rgba(0,0,0,.95)}.bg-gray-700\/50{background-color:rgba(55,65,81,.5)}.bg-gray-800{--tw-bg-opacity:1;background-color:rgb(31 41 55/var(--tw-bg-opacity,1))}.bg-green-400{--tw-bg-opacity:1;background-color:rgb(74 222 128/var(--tw-bg-opacity,1))}.bg-green-500{--tw-bg-opacity:1;background-color:rgb(34 197 94/var(--tw-bg-opacity,1))}.bg-green-500\/10{background-color:rgba(34,197,94,.1)}.bg-green-500\/15{background-color:rgba(34,197,94,.15)}.bg-green-600{--tw-bg-opacity:1;background-color:rgb(22 163 74/var(--tw-bg-opacity,1))}.bg-orange-400{--tw-bg-opacity:1;background-color:rgb(251 146 60/var(--tw-bg-opacity,1))}.bg-orange-500{--tw-bg-opacity:1;background-color:rgb(249 115 22/var(--tw-bg-opacity,1))}.bg-red-400{--tw-bg-opacity:1;background-color:rgb(248 113 113/var(--tw-bg-opacity,1))}.bg-red-500{--tw-bg-opacity:1;background-color:rgb(239 68 68/var(--tw-bg-opacity,1))}.bg-red-500\/10{background-color:rgba(239,68,68,.1)}.bg-red-500\/15{background-color:rgba(239,68,68,.15)}.bg-red-500\/20{background-color:rgba(239,68,68,.2)}.bg-transparent{background-color:transparent}.bg-white{--tw-bg-opacity:1;background-color:rgb(255 255 255/var(--tw-bg-opacity,1))}.bg-white\/10{background-color:hsla(0,0%,100%,.1)}.bg-white\/5{background-color:hsla(0,0%,100%,.05)}.bg-white\/50{background-color:hsla(0,0%,100%,.5)}.bg-xoro-black{background-color:var(--xoro-bg)}.bg-xoro-border{background-color:var(--xoro-border)}.bg-xoro-card{background-color:var(--xoro-card)}.bg-xoro-charcoal{background-color:var(--xoro-charcoal)}.bg-xoro-gold{background-color:var(--xoro-gold)}.bg-xoro-silver{--tw-bg-opacity:1;background-color:rgb(192 192 192/var(--tw-bg-opacity,1))}.bg-yellow-400{--tw-bg-opacity:1;background-color:rgb(250 204 21/var(--tw-bg-opacity,1))}.bg-yellow-500{--tw-bg-opacity:1;background-color:rgb(234 179 8/var(--tw-bg-opacity,1))}.bg-gradient-to-b{background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}.bg-gradient-to-br{background-image:linear-gradient(to bottom right,var(--tw-gradient-stops))}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--tw-gradient-stops))}.bg-gradient-to-t{background-image:linear-gradient(to top,var(--tw-gradient-stops))}.from-black{--tw-gradient-from:#000 var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-black\/60{--tw-gradient-from:rgba(0,0,0,.6) var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-black\/80{--tw-gradient-from:rgba(0,0,0,.8) var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-red-500\/10{--tw-gradient-from:rgba(239,68,68,.1) var(--tw-gradient-from-position);--tw-gradient-to:rgba(239,68,68,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-transparent{--tw-gradient-from:transparent var(--tw-gradient-from-position);--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.from-xoro-gold{--tw-gradient-from:var(--xoro-gold) var(--tw-gradient-from-position);--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}.via-black\/20{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(0,0,0,.2) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-black\/80{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),rgba(0,0,0,.8) var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),transparent var(--tw-gradient-via-position),var(--tw-gradient-to)}.via-xoro-charcoal{--tw-gradient-to:hsla(0,0%,100%,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--xoro-charcoal) var(--tw-gradient-via-position),var(--tw-gradient-to)}.to-black\/40{--tw-gradient-to:rgba(0,0,0,.4) var(--tw-gradient-to-position)}.to-orange-500\/10{--tw-gradient-to:rgba(249,115,22,.1) var(--tw-gradient-to-position)}.to-transparent{--tw-gradient-to:transparent var(--tw-gradient-to-position)}.to-xoro-charcoal{--tw-gradient-to:var(--xoro-charcoal) var(--tw-gradient-to-position)}.to-yellow-400{--tw-gradient-to:#facc15 var(--tw-gradient-to-position)}.decoration-slice{-webkit-box-decoration-break:slice;box-decoration-break:slice}.decoration-clone{-webkit-box-decoration-break:clone;box-decoration-break:clone}.box-decoration-slice{-webkit-box-decoration-break:slice;box-decoration-break:slice}.box-decoration-clone{-webkit-box-decoration-break:clone;box-decoration-break:clone}.bg-fixed{background-attachment:fixed}.bg-local{background-attachment:local}.bg-scroll{background-attachment:scroll}.bg-clip-border{background-clip:border-box}.bg-clip-padding{background-clip:padding-box}.bg-clip-content{background-clip:content-box}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.bg-repeat{background-repeat:repeat}.bg-no-repeat{background-repeat:no-repeat}.bg-repeat-x{background-repeat:repeat-x}.bg-repeat-y{background-repeat:repeat-y}.bg-repeat-round{background-repeat:round}.bg-repeat-space{background-repeat:space}.bg-origin-border{background-origin:border-box}.bg-origin-padding{background-origin:padding-box}.bg-origin-content{background-origin:content-box}.fill-xoro-gold{fill:var(--xoro-gold)}.object-contain{-o-object-fit:contain;object-fit:contain}.object-cover{-o-object-fit:cover;object-fit:cover}.object-fill{-o-object-fit:fill;object-fit:fill}.object-none{-o-object-fit:none;object-fit:none}.object-scale-down{-o-object-fit:scale-down;object-fit:scale-down}.p-1{padding:.25rem}.p-2{padding:.5rem}.p-2\.5{padding:.625rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-5{padding:1.25rem}.px-1{padding-left:.25rem;padding-right:.25rem}.px-1\.5{padding-left:.375rem;padding-right:.375rem}.px-10{padding-left:2.5rem;padding-right:2.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-2\.5{padding-left:.625rem;padding-right:.625rem}.px-3{padding-left:.75rem;padding-right:.75rem}.px-3\.5{padding-left:.875rem;padding-right:.875rem}.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}.py-0\.5{padding-top:.125rem;padding-bottom:.125rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.py-10{padding-top:2.5rem;padding-bottom:2.5rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-16{padding-top:4rem;padding-bottom:4rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-2\.5{padding-top:.625rem;padding-bottom:.625rem}.py-20{padding-top:5rem;padding-bottom:5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.py-3\.5{padding-top:.875rem;padding-bottom:.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-12{padding-bottom:3rem}.pb-2{padding-bottom:.5rem}.pb-3{padding-bottom:.75rem}.pb-4{padding-bottom:1rem}.pb-5{padding-bottom:1.25rem}.pl-12{padding-left:3rem}.pr-1{padding-right:.25rem}.pr-4{padding-right:1rem}.pt-0{padding-top:0}.pt-1{padding-top:.25rem}.pt-2{padding-top:.5rem}.pt-20{padding-top:5rem}.pt-3{padding-top:.75rem}.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}.text-justify{text-align:justify}.text-start{text-align:start}.text-end{text-align:end}.align-baseline{vertical-align:baseline}.align-top{vertical-align:top}.align-middle{vertical-align:middle}.align-bottom{vertical-align:bottom}.align-text-top{vertical-align:text-top}.align-text-bottom{vertical-align:text-bottom}.align-sub{vertical-align:sub}.align-super{vertical-align:super}.text-2xl{font-size:1.5rem;line-height:2rem}.text-3xl{font-size:1.875rem;line-height:2.25rem}.text-4xl{font-size:2.25rem;line-height:2.5rem}.text-\[10px\]{font-size:10px}.text-\[11px\]{font-size:11px}.text-\[13px\]{font-size:13px}.text-\[8px\]{font-size:8px}.text-\[9px\]{font-size:9px}.text-base{font-size:1rem;line-height:1.5rem}.text-lg{font-size:1.125rem;line-height:1.75rem}.text-sm{font-size:.875rem;line-height:1.25rem}.text-xl{font-size:1.25rem;line-height:1.75rem}.text-xs{font-size:.75rem;line-height:1rem}.font-black{font-weight:900}.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}.normal-nums{font-variant-numeric:normal}.ordinal{--tw-ordinal:ordinal}.ordinal,.slashed-zero{font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.slashed-zero{--tw-slashed-zero:slashed-zero}.lining-nums{--tw-numeric-figure:lining-nums}.lining-nums,.oldstyle-nums{font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.oldstyle-nums{--tw-numeric-figure:oldstyle-nums}.proportional-nums{--tw-numeric-spacing:proportional-nums}.proportional-nums,.tabular-nums{font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.tabular-nums{--tw-numeric-spacing:tabular-nums}.diagonal-fractions{--tw-numeric-fraction:diagonal-fractions}.diagonal-fractions,.stacked-fractions{font-variant-numeric:var(--tw-ordinal) var(--tw-slashed-zero) var(--tw-numeric-figure) var(--tw-numeric-spacing) var(--tw-numeric-fraction)}.stacked-fractions{--tw-numeric-fraction:stacked-fractions}.leading-\[1\.05\]{line-height:1.05}.leading-none{line-height:1}.leading-relaxed{line-height:1.625}.leading-tight{line-height:1.25}.tracking-\[0\.1em\]{letter-spacing:.1em}.tracking-tight{letter-spacing:-.025em}.tracking-wide{letter-spacing:.025em}.tracking-wider{letter-spacing:.05em}.tracking-widest{letter-spacing:.1em}.text-black{--tw-text-opacity:1;color:rgb(0 0 0/var(--tw-text-opacity,1))}.text-gray-100{--tw-text-opacity:1;color:rgb(243 244 246/var(--tw-text-opacity,1))}.text-gray-200{--tw-text-opacity:1;color:rgb(229 231 235/var(--tw-text-opacity,1))}.text-gray-300{--tw-text-opacity:1;color:rgb(209 213 219/var(--tw-text-opacity,1))}.text-gray-400{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.text-green-400{--tw-text-opacity:1;color:rgb(74 222 128/var(--tw-text-opacity,1))}.text-orange-400{--tw-text-opacity:1;color:rgb(251 146 60/var(--tw-text-opacity,1))}.text-red-300{--tw-text-opacity:1;color:rgb(252 165 165/var(--tw-text-opacity,1))}.text-red-400{--tw-text-opacity:1;color:rgb(248 113 113/var(--tw-text-opacity,1))}.text-white{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.text-white\/70{color:hsla(0,0%,100%,.7)}.text-white\/80{color:hsla(0,0%,100%,.8)}.text-xoro-black{color:var(--xoro-bg)}.text-xoro-border{color:var(--xoro-border)}.text-xoro-gold{color:var(--xoro-gold)}.text-xoro-muted{color:var(--xoro-muted)}.text-xoro-white{color:var(--xoro-text)}.text-yellow-400{--tw-text-opacity:1;color:rgb(250 204 21/var(--tw-text-opacity,1))}.underline{text-decoration-line:underline}.overline{text-decoration-line:overline}.line-through{text-decoration-line:line-through}.no-underline{text-decoration-line:none}.decoration-solid{text-decoration-style:solid}.decoration-double{text-decoration-style:double}.decoration-dotted{text-decoration-style:dotted}.decoration-dashed{text-decoration-style:dashed}.decoration-wavy{text-decoration-style:wavy}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.subpixel-antialiased{-webkit-font-smoothing:auto;-moz-osx-font-smoothing:auto}.opacity-0{opacity:0}.opacity-100{opacity:1}.opacity-40{opacity:.4}.opacity-60{opacity:.6}.bg-blend-normal{background-blend-mode:normal}.bg-blend-multiply{background-blend-mode:multiply}.bg-blend-screen{background-blend-mode:screen}.bg-blend-overlay{background-blend-mode:overlay}.bg-blend-darken{background-blend-mode:darken}.bg-blend-lighten{background-blend-mode:lighten}.bg-blend-color-dodge{background-blend-mode:color-dodge}.bg-blend-color-burn{background-blend-mode:color-burn}.bg-blend-hard-light{background-blend-mode:hard-light}.bg-blend-soft-light{background-blend-mode:soft-light}.bg-blend-difference{background-blend-mode:difference}.bg-blend-exclusion{background-blend-mode:exclusion}.bg-blend-hue{background-blend-mode:hue}.bg-blend-saturation{background-blend-mode:saturation}.bg-blend-color{background-blend-mode:color}.bg-blend-luminosity{background-blend-mode:luminosity}.mix-blend-normal{mix-blend-mode:normal}.mix-blend-multiply{mix-blend-mode:multiply}.mix-blend-screen{mix-blend-mode:screen}.mix-blend-overlay{mix-blend-mode:overlay}.mix-blend-darken{mix-blend-mode:darken}.mix-blend-lighten{mix-blend-mode:lighten}.mix-blend-color-dodge{mix-blend-mode:color-dodge}.mix-blend-color-burn{mix-blend-mode:color-burn}.mix-blend-hard-light{mix-blend-mode:hard-light}.mix-blend-soft-light{mix-blend-mode:soft-light}.mix-blend-difference{mix-blend-mode:difference}.mix-blend-exclusion{mix-blend-mode:exclusion}.mix-blend-hue{mix-blend-mode:hue}.mix-blend-saturation{mix-blend-mode:saturation}.mix-blend-color{mix-blend-mode:color}.mix-blend-luminosity{mix-blend-mode:luminosity}.mix-blend-plus-darker{mix-blend-mode:plus-darker}.mix-blend-plus-lighter{mix-blend-mode:plus-lighter}.shadow{--tw-shadow:0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px -1px rgba(0,0,0,.1);--tw-shadow-colored:0 1px 3px 0 var(--tw-shadow-color),0 1px 2px -1px var(--tw-shadow-color)}.shadow,.shadow-2xl{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 rgba(0,0,0,.25);--tw-shadow-colored:0 25px 50px -12px var(--tw-shadow-color)}.shadow-lg{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(0,0,0,.1);--tw-shadow-colored:0 10px 15px -3px var(--tw-shadow-color),0 4px 6px -4px var(--tw-shadow-color)}.shadow-lg,.shadow-xl{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 rgba(0,0,0,.1),0 8px 10px -6px rgba(0,0,0,.1);--tw-shadow-colored:0 20px 25px -5px var(--tw-shadow-color),0 8px 10px -6px var(--tw-shadow-color)}.shadow-green-500\/30{--tw-shadow-color:rgba(34,197,94,.3);--tw-shadow:var(--tw-shadow-colored)}.outline-none{outline:2px solid transparent;outline-offset:2px}.outline{outline-style:solid}.outline-dashed{outline-style:dashed}.outline-dotted{outline-style:dotted}.outline-double{outline-style:double}.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-inset{--tw-ring-inset:inset}.blur{--tw-blur:blur(8px)}.blur,.blur-2xl{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)}.blur-2xl{--tw-blur:blur(40px)}.drop-shadow{--tw-drop-shadow:drop-shadow(0 1px 2px rgba(0,0,0,.1)) drop-shadow(0 1px 1px rgba(0,0,0,.06))}.drop-shadow,.grayscale{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%)}.invert{--tw-invert:invert(100%)}.invert,.sepia{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{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-none{filter:none}.backdrop-blur{--tw-backdrop-blur:blur(8px)}.backdrop-blur,.backdrop-blur-md{-webkit-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: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-md{--tw-backdrop-blur:blur(12px)}.backdrop-blur-sm{--tw-backdrop-blur:blur(4px)}.backdrop-blur-sm,.backdrop-grayscale{-webkit-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: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-invert{--tw-backdrop-invert:invert(100%)}.backdrop-invert,.backdrop-sepia{-webkit-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: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{-webkit-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: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-none{-webkit-backdrop-filter:none;backdrop-filter:none}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-opacity{transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-transform{transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-200{transition-duration:.2s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.duration-700{transition-duration:.7s}.ease-in{transition-timing-function:cubic-bezier(.4,0,1,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}.contain-none{contain:none}.contain-content{contain:content}.contain-strict{contain:strict}.contain-size{--tw-contain-size:size}.contain-inline-size,.contain-size{contain:var(--tw-contain-size) var(--tw-contain-layout) var(--tw-contain-paint) var(--tw-contain-style)}.contain-inline-size{--tw-contain-size:inline-size}.contain-layout{--tw-contain-layout:layout}.contain-layout,.contain-paint{contain:var(--tw-contain-size) var(--tw-contain-layout) var(--tw-contain-paint) var(--tw-contain-style)}.contain-paint{--tw-contain-paint:paint}.contain-style{--tw-contain-style:style;contain:var(--tw-contain-size) var(--tw-contain-layout) var(--tw-contain-paint) var(--tw-contain-style)}.forced-color-adjust-auto{forced-color-adjust:auto}.forced-color-adjust-none{forced-color-adjust:none}:root{--xoro-gold:#84cc16;--xoro-gold-light:#a3e635;--xoro-gold-rgb:132,204,22;--xoro-bg:#000;--xoro-card:#1a1a1a;--xoro-charcoal:#141414;--xoro-text:#fff;--xoro-muted:#888;--xoro-border:#3a3a3a;--xoro-input-border:#404040;--xoro-success:#22c55e;--xoro-error:#ef4444;--xoro-warning:#f59e0b;--xoro-input-bg:#1a1a1a;--xoro-overlay:rgba(0,0,0,.8)}.placeholder\:text-gray-400::-moz-placeholder{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.placeholder\:text-gray-400::placeholder{--tw-text-opacity:1;color:rgb(156 163 175/var(--tw-text-opacity,1))}.placeholder\:text-xoro-muted::-moz-placeholder{color:var(--xoro-muted)}.placeholder\:text-xoro-muted::placeholder{color:var(--xoro-muted)}.hover\:scale-\[1\.02\]:hover{--tw-scale-x:1.02;--tw-scale-y:1.02;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\:border-xoro-gold:hover{border-color:var(--xoro-gold)}.hover\:bg-black\/80:hover{background-color:rgba(0,0,0,.8)}.hover\:bg-gray-200:hover{--tw-bg-opacity:1;background-color:rgb(229 231 235/var(--tw-bg-opacity,1))}.hover\:bg-green-400:hover{--tw-bg-opacity:1;background-color:rgb(74 222 128/var(--tw-bg-opacity,1))}.hover\:bg-green-500:hover{--tw-bg-opacity:1;background-color:rgb(34 197 94/var(--tw-bg-opacity,1))}.hover\:bg-white\/25:hover{background-color:hsla(0,0%,100%,.25)}.hover\:bg-white\/80:hover{background-color:hsla(0,0%,100%,.8)}.hover\:bg-white\/\[0\.02\]:hover{background-color:hsla(0,0%,100%,.02)}.hover\:bg-xoro-card:hover{background-color:var(--xoro-card)}.hover\:bg-xoro-gold:hover{background-color:var(--xoro-gold)}.hover\:bg-xoro-goldLight:hover{background-color:var(--xoro-gold-light)}.hover\:text-green-300:hover{--tw-text-opacity:1;color:rgb(134 239 172/var(--tw-text-opacity,1))}.hover\:text-red-400:hover{--tw-text-opacity:1;color:rgb(248 113 113/var(--tw-text-opacity,1))}.hover\:text-white:hover{--tw-text-opacity:1;color:rgb(255 255 255/var(--tw-text-opacity,1))}.hover\:text-xoro-black:hover{color:var(--xoro-bg)}.hover\:text-xoro-gold:hover{color:var(--xoro-gold)}.hover\:text-xoro-goldLight:hover{color:var(--xoro-gold-light)}.hover\:underline:hover{text-decoration-line:underline}.hover\:opacity-70:hover{opacity:.7}.hover\:shadow-lg:hover{--tw-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -4px rgba(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)}.focus\:border-xoro-gold:focus{border-color:var(--xoro-gold)}.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)}.active\:scale-95:active{--tw-scale-x:.95;--tw-scale-y:.95}.active\:scale-95:active,.active\:scale-\[0\.98\]:active{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))}.active\:scale-\[0\.98\]:active{--tw-scale-x:0.98;--tw-scale-y:0.98}.disabled\:transform-none:disabled{transform:none}.disabled\:cursor-not-allowed:disabled{cursor:not-allowed}.disabled\:opacity-50:disabled{opacity:.5}.group:hover .group-hover\:scale-110{--tw-scale-x:1.1;--tw-scale-y:1.1;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))}.group:hover .group-hover\:gap-2{gap:.5rem}.group:hover .group-hover\:text-xoro-gold{color:var(--xoro-gold)}.group:hover .group-hover\:opacity-100{opacity:1}@media (min-width:640px){.sm\:inset-4{inset:1rem}.sm\:bottom-6{bottom:1.5rem}.sm\:left-5{left:1.25rem}.sm\:left-6{left:1.5rem}.sm\:right-3{right:.75rem}.sm\:right-4{right:1rem}.sm\:right-5{right:1.25rem}.sm\:right-6{right:1.5rem}.sm\:top-3{top:.75rem}.sm\:top-4{top:1rem}.sm\:mx-0{margin-left:0;margin-right:0}.sm\:mx-auto{margin-left:auto;margin-right:auto}.sm\:mb-10{margin-bottom:2.5rem}.sm\:mb-12{margin-bottom:3rem}.sm\:mb-14{margin-bottom:3.5rem}.sm\:mb-2{margin-bottom:.5rem}.sm\:mb-3{margin-bottom:.75rem}.sm\:mb-4{margin-bottom:1rem}.sm\:mb-6{margin-bottom:1.5rem}.sm\:mb-8{margin-bottom:2rem}.sm\:mt-14{margin-top:3.5rem}.sm\:block{display:block}.sm\:inline{display:inline}.sm\:flex{display:flex}.sm\:grid{display:grid}.sm\:hidden{display:none}.sm\:aspect-\[4\/5\]{aspect-ratio:4/5}.sm\:h-1\.5{height:.375rem}.sm\:h-12{height:3rem}.sm\:h-14{height:3.5rem}.sm\:h-16{height:4rem}.sm\:h-24{height:6rem}.sm\:h-3\.5{height:.875rem}.sm\:h-4{height:1rem}.sm\:h-6{height:1.5rem}.sm\:h-7{height:1.75rem}.sm\:h-8{height:2rem}.sm\:w-1\.5{width:.375rem}.sm\:w-12{width:3rem}.sm\:w-14{width:3.5rem}.sm\:w-16{width:4rem}.sm\:w-24{width:6rem}.sm\:w-3\.5{width:.875rem}.sm\:w-4{width:1rem}.sm\:w-6{width:1.5rem}.sm\:w-7{width:1.75rem}.sm\:w-8{width:2rem}.sm\:w-auto{width:auto}.sm\:min-w-\[60px\]{min-width:60px}.sm\:max-w-md{max-width:28rem}.sm\:flex-shrink{flex-shrink:1}.sm\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.sm\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.sm\:flex-row{flex-direction:row}.sm\:items-center{align-items:center}.sm\:justify-start{justify-content:flex-start}.sm\:justify-center{justify-content:center}.sm\:gap-1\.5{gap:.375rem}.sm\:gap-2{gap:.5rem}.sm\:gap-3{gap:.75rem}.sm\:gap-4{gap:1rem}.sm\:gap-5{gap:1.25rem}.sm\:gap-6{gap:1.5rem}.sm\:space-y-2>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(.5rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.5rem*var(--tw-space-y-reverse))}.sm\:space-y-4>:not([hidden])~:not([hidden]){--tw-space-y-reverse:0;margin-top:calc(1rem*(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1rem*var(--tw-space-y-reverse))}.sm\:overflow-visible{overflow:visible}.sm\:rounded-2xl{border-radius:1rem}.sm\:rounded-3xl{border-radius:1.5rem}.sm\:rounded-xl{border-radius:.75rem}.sm\:border{border-width:1px}.sm\:p-2\.5{padding:.625rem}.sm\:p-3{padding:.75rem}.sm\:p-3\.5{padding:.875rem}.sm\:p-4{padding:1rem}.sm\:p-5{padding:1.25rem}.sm\:p-6{padding:1.5rem}.sm\:p-8{padding:2rem}.sm\:px-0{padding-left:0;padding-right:0}.sm\:px-1\.5{padding-left:.375rem;padding-right:.375rem}.sm\:px-12{padding-left:3rem;padding-right:3rem}.sm\:px-4{padding-left:1rem;padding-right:1rem}.sm\:px-5{padding-left:1.25rem;padding-right:1.25rem}.sm\:px-6{padding-left:1.5rem;padding-right:1.5rem}.sm\:px-8{padding-left:2rem;padding-right:2rem}.sm\:py-0{padding-top:0;padding-bottom:0}.sm\:py-1\.5{padding-top:.375rem;padding-bottom:.375rem}.sm\:py-10{padding-top:2.5rem;padding-bottom:2.5rem}.sm\:py-12{padding-top:3rem;padding-bottom:3rem}.sm\:py-14{padding-top:3.5rem;padding-bottom:3.5rem}.sm\:py-3{padding-top:.75rem;padding-bottom:.75rem}.sm\:py-3\.5{padding-top:.875rem;padding-bottom:.875rem}.sm\:pb-0{padding-bottom:0}.sm\:pb-20{padding-bottom:5rem}.sm\:pb-4{padding-bottom:1rem}.sm\:pb-6{padding-bottom:1.5rem}.sm\:pb-8{padding-bottom:2rem}.sm\:pt-12{padding-top:3rem}.sm\:pt-32{padding-top:8rem}.sm\:pt-4{padding-top:1rem}.sm\:text-left{text-align:left}.sm\:text-center{text-align:center}.sm\:text-2xl{font-size:1.5rem;line-height:2rem}.sm\:text-3xl{font-size:1.875rem;line-height:2.25rem}.sm\:text-4xl{font-size:2.25rem;line-height:2.5rem}.sm\:text-5xl{font-size:3rem;line-height:1}.sm\:text-\[10px\]{font-size:10px}.sm\:text-\[11px\]{font-size:11px}.sm\:text-base{font-size:1rem;line-height:1.5rem}.sm\:text-lg{font-size:1.125rem;line-height:1.75rem}.sm\:text-sm{font-size:.875rem;line-height:1.25rem}.sm\:text-xl{font-size:1.25rem;line-height:1.75rem}.sm\:text-xs{font-size:.75rem;line-height:1rem}.sm\:shadow-2xl{--tw-shadow:0 25px 50px -12px rgba(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)}.sm\:shadow-black\/40{--tw-shadow-color:rgba(0,0,0,.4);--tw-shadow:var(--tw-shadow-colored)}}@media (min-width:768px){.md\:flex{display:flex}.md\:hidden{display:none}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (min-width:1024px){.lg\:inset-x-\[20\%\]{left:20%;right:20%}.lg\:inset-y-8{top:2rem;bottom:2rem}.lg\:-right-4{right:-1rem}.lg\:order-1{order:1}.lg\:order-2{order:2}.lg\:mx-0{margin-left:0;margin-right:0}.lg\:block{display:block}.lg\:hidden{display:none}.lg\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.lg\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.lg\:grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.lg\:justify-start{justify-content:flex-start}.lg\:gap-12{gap:3rem}.lg\:gap-6{gap:1.5rem}.lg\:px-20{padding-left:5rem;padding-right:5rem}.lg\:pb-12{padding-bottom:3rem}.lg\:pb-14{padding-bottom:3.5rem}.lg\:pb-28{padding-bottom:7rem}.lg\:pt-16{padding-top:4rem}.lg\:pt-20{padding-top:5rem}.lg\:text-left{text-align:left}.lg\:text-4xl{font-size:2.25rem;line-height:2.5rem}.lg\:text-5xl{font-size:3rem;line-height:1}.lg\:text-6xl{font-size:3.75rem;line-height:1}}@media (min-width:1280px){.xl\:text-6xl{font-size:3.75rem;line-height:1}.xl\:text-7xl{font-size:4.5rem;line-height:1}}/**
 * Style X Gadget — Theme Color Variables (Dark Mode Only)
 *
 * This file provides the CSS variables that the Tailwind config (in header.php)
 * references for all xoro-* color classes.
 *
 * The actual Tailwind utility classes are generated at runtime by the
 * Tailwind Play CDN loaded in header.php.
 *
 * NOTE: Light/white theme has been completely removed per store owner request.
 *       The theme is dark-only for a consistent premium luxury aesthetic.
 */

/* ============ DARK MODE (the only mode) ============ */
:root {
    --xoro-gold: #84cc16;
    --xoro-gold-light: #a3e635;
    --xoro-gold-rgb: 132, 204, 22;

    --xoro-bg: #000000;
    --xoro-card: #1a1a1a;
    --xoro-charcoal: #141414;
    --xoro-text: #ffffff;
    --xoro-muted: #888888;
    --xoro-border: #3a3a3a;
    --xoro-input-border: #404040;

    --xoro-success: #22c55e;
    --xoro-error: #ef4444;
    --xoro-warning: #f59e0b;

    --xoro-input-bg: #1a1a1a;
    --xoro-input-border: #404040;
    --xoro-overlay: rgba(0,0,0,0.8);
}

/* ============ BODY DEFAULTS ============ */
body {
    background-color: var(--xoro-bg);
    color: var(--xoro-text);
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeSpeed;
    width: 100%;
}

/* ============ v3.134.0 — MOBILE PERFORMANCE OPTIMIZATIONS ============ */

/* Content-visibility: auto skips rendering off-screen sections → faster scroll
   v3.138.2 — Only on home page, NOT on product pages (causes zoom/layout shift) */
.home section {
    content-visibility: auto;
    contain-intrinsic-size: auto 500px;
}

/* Above-the-fold hero section: always render immediately */
.home section:first-of-type,
.home section#bestsellers {
    content-visibility: visible;
}

/* Contain layout/paint for card grids → prevents reflow cascade */
.card-gradient,
.xoro-product-card,
.xoro-chatbot__msg,
.xoro-review-card,
.xoro-wa-card {
    contain: layout style paint;
}

/* GPU acceleration for animated elements */
.xoro-hero-slide,
.xoro-wa-track,
.xoro-marquee-track,
.whatsapp-float,
.xoro-chatbot__fab,
.xoro-sizeguide-fab {
    will-change: transform;
    transform: translateZ(0); /* force GPU layer */
}

/* Smooth scrolling on mobile without jank */
* {
    -webkit-tap-highlight-color: transparent;
}

/* Optimize touch scrolling on mobile */
.xoro-wa-slider,
.xoro-chatbot__quick-scroll,
.xoro-reviews__list {
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
}

/* Reduce paint on large lists */
img {
    content-visibility: auto;
}

/* Prevent layout shift on images */
img[width][height] {
    aspect-ratio: attr(width) / attr(height);
}
/**
 * Style X Gadget — Custom CSS
 * All animations, custom styles & responsive overrides
 */

/* Base */
*{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:'Inter',system-ui,sans-serif;background:#000;color:#fff;margin:0}
::selection{background:#84cc16;color:#000}

/* Scrollbar */
.no-scrollbar::-webkit-scrollbar{display:none}
.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}

/* Gold Shimmer */
@keyframes shimmer{0%{background-position:-200% 0}100%{background-position:200% 0}}
.gold-shimmer{background:linear-gradient(90deg,#84cc16 0%,#d9f99d 50%,#84cc16 100%);background-size:200% 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:shimmer 3s ease-in-out infinite}

/* Notifications */
@keyframes slideInRight{from{transform:translateX(120%);opacity:0}to{transform:translateX(0);opacity:1}}
@keyframes slideOutRight{from{transform:translateX(0);opacity:1}to{transform:translateX(120%);opacity:0}}
.notification-in{animation:slideInRight .4s ease-out forwards}
.notification-out{animation:slideOutRight .4s ease-in forwards}

/* Pulse */
@keyframes pulse-gold{0%,100%{box-shadow:0 0 0 0 rgba(132,204,22,.4)}50%{box-shadow:0 0 0 10px rgba(132,204,22,0)}}
.pulse-gold{animation:pulse-gold 2s ease-in-out infinite}

/* Float */
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}}
.float-animation{animation:float 3s ease-in-out infinite}

/* Stock Bar */
@keyframes countdown{from{width:100%}to{width:0%}}
.stock-bar{animation:countdown 8s linear forwards}

/* WhatsApp Float */
.whatsapp-float:hover{transform:scale(1.1)}
.whatsapp-float{transition:transform .3s ease}

/* Product Card Hover */
.product-card:hover .product-image{transform:scale(1.08)}
.product-image{transition:transform .7s ease}

/* Add-to-Cart Icon Button — modern 2026 jewelry-store vibe */
.xoro-atc-icon-btn{position:relative;overflow:hidden;cursor:pointer;-webkit-tap-highlight-color:transparent}
.xoro-atc-icon-btn .xoro-atc-icon{transition:transform .35s cubic-bezier(.34,1.56,.64,1),stroke-width .2s ease;transform-origin:center}
.xoro-atc-icon-btn:hover .xoro-atc-icon{transform:translateY(-2px) scale(1.12)}
.xoro-atc-icon-btn:active .xoro-atc-icon{transform:scale(.92)}
.xoro-atc-icon-btn::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.35) 50%,transparent 70%);transform:translateX(-120%);transition:transform .6s ease;pointer-events:none}
.xoro-atc-icon-btn:hover::after{transform:translateX(120%)}
@media (prefers-reduced-motion:reduce){.xoro-atc-icon-btn .xoro-atc-icon,.xoro-atc-icon-btn::after{transition:none;transform:none}}

/* Collection Card */
.collection-card:hover .collection-overlay{opacity:1}
.collection-card:hover .collection-image{transform:scale(1.1)}
.collection-image{transition:transform .7s ease}
.collection-overlay{transition:opacity .5s ease}

/* Gallery — CSS containment for smooth mobile performance (no will-change to avoid GPU memory pressure) */
.gallery-item:hover img{transform:scale(1.1)}
#mainImageWrap{contain:layout style paint}
#mainProductImage,#mainProductVideo{contain:layout style paint}
.thumb-btn{contain:layout style paint}
.xoro-attr-selector{contain:layout style}
/* Video thumbnail placeholders — no video elements until clicked */
.video-thumb-placeholder{contain:layout style paint;cursor:pointer}

/* Line Clamp */
.line-clamp-2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* Form Elements */
input:focus,textarea:focus,select:focus{outline:none}

/* Toast Container */
.toast-container{pointer-events:none}
.toast-container>*{pointer-events:auto}

/* FAQ */
details[open] summary .faq-icon{transform:rotate(45deg)}
.faq-icon{transition:transform .3s ease}

/* Hero */
.hero-gradient{background:radial-gradient(ellipse at 50% 0%,rgba(132,204,22,.08) 0%,transparent 60%),radial-gradient(ellipse at 80% 50%,rgba(192,192,192,.05) 0%,transparent 50%),linear-gradient(180deg,#0a0a0a 0%,#000 100%)}

/* Cards */
.card-gradient{background:linear-gradient(145deg,#1a1a1a 0%,#111 100%)}

/* Borders */
.gold-border-hover:hover{border-color:rgba(132,204,22,.5)}

/* UGC Scroll */
.ugc-scroll{scroll-snap-type:x mandatory}
.ugc-scroll>*{scroll-snap-align:start}

/* Thumbnail Buttons */
.thumb-btn{border:2px solid transparent;transition:all .2s}
.thumb-btn.active{border-color:#84cc16}
.thumb-btn:hover{border-color:rgba(132,204,22,.5)}

/* Page Sections */
.page-section{display:none}
.page-section.active{display:block}

/* WooCommerce Overrides */
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button{background:#84cc16;color:#000;border-radius:9999px;font-weight:700}
.woocommerce #respond input#submit:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover{background:#a3e635;color:#000}
.woocommerce div.product p.price,
.woocommerce div.product span.price{color:#84cc16}
.woocommerce .star-rating span::before{color:#84cc16}
.woocommerce .woocommerce-breadcrumb{display:none}
.woocommerce-message{border-top-color:#84cc16}
.woocommerce-message::before{color:#84cc16}

/* Select dropdown styling */
select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23D4AF37' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 12px center;padding-right:40px}

/* Note: Order summary styles are now inline in xoro-checkout.php (co-summary, co-header, co-item, etc.) */

/* Responsive */
@media (max-width:640px){
    .hero-gradient{padding-top:2rem}
    .product-card{font-size:.85rem}
    nav .text-3xl{font-size:1.5rem}
}
/* ============================================================
   WHATSAPP CHAT SLIDER — Auto-slide, mobile-first, lightweight
   ============================================================ */
.xoro-wa-slider {
    overflow: hidden;
    position: relative;
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0%, #000 5%, #000 95%, transparent 100%);
}
.xoro-wa-track {
    display: flex;
    gap: 16px;
    will-change: transform;
}
.xoro-wa-card {
    flex-shrink: 0;
    width: 280px;
    border-radius: 16px;
    overflow: hidden;
    border: 1px solid #1a1a1a;
    background: #0d0d0d;
}
.xoro-wa-card img {
    width: 100%;
    height: auto;
    display: block;
    pointer-events: none;
}
@media (min-width: 768px) {
    .xoro-wa-card { width: 300px; }
}
/**
 * Style X Gadget — Mobile Hero Slider CSS (v3.65.0)
 * Ultra-light, GPU-accelerated, zero-CLS, mobile-first.
 * No external libraries. Pure CSS transitions on transform/opacity only.
 * Bundled size: ~3.2 KB.
 */

/* ============================================================
   Container — aspect-ratio prevents CLS (no layout shift on load)
   ============================================================ */
.xoro-hero-slider {
    position: relative;
    width: 100%;
    max-width: 480px;
    margin: 0 auto;
    border-radius: 1.5rem;
    overflow: hidden;
    background: #1a1a1a;
    aspect-ratio: 4 / 5;
    isolation: isolate; /* contain stacking context for perf */
    -webkit-tap-highlight-color: transparent;
    touch-action: pan-y; /* allow vertical scroll, capture horizontal swipe */
    user-select: none;
}

/* Desktop: slightly larger, keep elegant card */
@media (min-width: 1024px) {
    .xoro-hero-slider {
        max-width: 100%;
    }
}

/* ============================================================
   Track — holds all slides, animated via transform
   ============================================================ */
.xoro-hero-slider__track {
    position: absolute;
    inset: 0;
    display: flex;
    will-change: transform;
    /* Slide effect: translateX. Fade effect handled per-slide below. */
    transition: transform 450ms cubic-bezier(0.22, 1, 0.36, 1);
}
.xoro-hero-slider[data-effect="fade"] .xoro-hero-slider__track {
    transition: none;
    transform: none;
}

/* ============================================================
   Slide — each fills the container
   ============================================================ */
.xoro-hero-slide {
    position: relative;
    flex: 0 0 100%;
    width: 100%;
    height: 100%;
    overflow: hidden;
}
/* Fade effect: stack slides & toggle opacity */
.xoro-hero-slider[data-effect="fade"] .xoro-hero-slide {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity 600ms ease;
    pointer-events: none;
}
.xoro-hero-slider[data-effect="fade"] .xoro-hero-slide.is-active {
    opacity: 1;
    pointer-events: auto;
    z-index: 2;
}

/* Image — object-cover, fixed dimensions = zero CLS */
.xoro-hero-slide__img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    /* Subtle ken-burns on active slide for premium feel (GPU only) */
    transform: scale(1.02);
    transition: transform 6s ease-out;
    will-change: transform;
}
.xoro-hero-slide.is-active .xoro-hero-slide__img {
    transform: scale(1.08);
}

/* Bottom gradient for text legibility — pseudo element, no extra DOM */
.xoro-hero-slide::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(0, 0, 0, 0.78) 0%,
        rgba(0, 0, 0, 0.35) 38%,
        rgba(0, 0, 0, 0) 62%
    );
    pointer-events: none;
    z-index: 1;
}

/* ============================================================
   Slide content overlay — CRO optimized
   ============================================================ */
.xoro-hero-slide__content {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 1.25rem 1.25rem 1.4rem;
    z-index: 3;
    color: #fff;
}
.xoro-hero-slide__badge {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    background: rgba(132, 204, 22, 0.18);
    border: 1px solid rgba(132, 204, 22, 0.45);
    color: #d9f99d;
    font-size: 0.65rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    padding: 0.3rem 0.7rem;
    border-radius: 9999px;
    margin-bottom: 0.7rem;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.xoro-hero-slide__badge::before {
    content: "";
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #84cc16;
    box-shadow: 0 0 8px #84cc16;
    animation: xoroPulse 1.6s ease-in-out infinite;
}
@keyframes xoroPulse {
    0%, 100% { opacity: 1; transform: scale(1); }
    50% { opacity: 0.4; transform: scale(0.7); }
}

.xoro-hero-slide__title {
    font-size: 1.35rem;
    font-weight: 900;
    line-height: 1.1;
    letter-spacing: -0.02em;
    margin: 0 0 0.35rem;
    text-shadow: 0 2px 12px rgba(0, 0, 0, 0.5);
}
.xoro-hero-slide__subtitle {
    font-size: 0.85rem;
    line-height: 1.4;
    color: rgba(255, 255, 255, 0.82);
    margin: 0 0 0.85rem;
    max-width: 32ch;
}

/* Price row (shown when a WooCommerce product is linked) */
.xoro-hero-slide__price {
    display: flex;
    align-items: baseline;
    gap: 0.5rem;
    margin-bottom: 0.85rem;
}
.xoro-hero-slide__price-now {
    font-size: 1.15rem;
    font-weight: 800;
    color: #d9f99d;
}
.xoro-hero-slide__price-was {
    font-size: 0.8rem;
    text-decoration: line-through;
    color: rgba(255, 255, 255, 0.55);
}
.xoro-hero-slide__price-off {
    font-size: 0.7rem;
    font-weight: 700;
    color: #fff;
    background: #e11d48;
    padding: 0.1rem 0.4rem;
    border-radius: 0.3rem;
    margin-left: 0.2rem;
}

/* CTA button — high contrast, thumb-friendly (44px+ height) */
.xoro-hero-slide__cta {
    display: inline-flex;
    align-items: center;
    gap: 0.45rem;
    background: #84cc16;
    color: #0a0a0a;
    font-size: 0.85rem;
    font-weight: 800;
    padding: 0.7rem 1.3rem;
    border-radius: 9999px;
    text-decoration: none;
    min-height: 44px;
    transition: background 200ms ease, transform 150ms ease, box-shadow 200ms ease;
    box-shadow: 0 6px 18px rgba(132, 204, 22, 0.28);
}
.xoro-hero-slide__cta:active {
    transform: scale(0.96);
}
.xoro-hero-slide__cta:hover {
    background: #d9f99d;
    box-shadow: 0 8px 24px rgba(132, 204, 22, 0.42);
}
.xoro-hero-slide__cta svg {
    width: 16px;
    height: 16px;
    transition: transform 200ms ease;
}
.xoro-hero-slide__cta:hover svg {
    transform: translateX(3px);
}

/* ============================================================
   Navigation — Dots
   ============================================================ */
.xoro-hero-slider__dots {
    position: absolute;
    bottom: 0.55rem;
    right: 0.75rem;
    transform: none;
    display: flex;
    gap: 0.4rem;
    z-index: 4;
    padding: 0.3rem;
}
.xoro-hero-slider__dot {
    width: 5px;
    height: 5px;
    padding: 9.5px;
    border: 0;
    border-radius: 9999px;
    background: rgba(255, 255, 255, 0.45);
    cursor: pointer;
    transition: width 300ms ease, background 300ms ease;
    -webkit-appearance: none;
    appearance: none;
    box-sizing: content-box;
}
.xoro-hero-slider__dot.is-active {
    width: 22px;
    background: #84cc16;
}

/* ============================================================
   Navigation — Arrows (desktop hover, always visible on desktop)
   ============================================================ */
.xoro-hero-slider__arrow {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0.4);
    color: #fff;
    cursor: pointer;
    z-index: 4;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    transition: background 200ms ease, transform 150ms ease;
    -webkit-appearance: none;
    appearance: none;
}
.xoro-hero-slider__arrow:hover {
    background: rgba(132, 204, 22, 0.9);
    color: #0a0a0a;
}
.xoro-hero-slider__arrow:active {
    transform: translateY(-50%) scale(0.92);
}
.xoro-hero-slider__arrow svg {
    width: 20px;
    height: 20px;
}
.xoro-hero-slider__arrow--prev { left: 0.6rem; }
.xoro-hero-slider__arrow--next { right: 0.6rem; }

/* v3.142.6 — Arrows visible on ALL screen sizes (was desktop-only) */

/* Hide dots/arrows when disabled via admin */
.xoro-hero-slider[data-dots="0"] .xoro-hero-slider__dots { display: none; }
.xoro-hero-slider[data-arrows="0"] .xoro-hero-slider__arrow { display: none; }

/* ============================================================
   Slide counter (e.g. 1/3) — subtle, top-right
   ============================================================ */
.xoro-hero-slider__count {
    position: absolute;
    top: 0.75rem;
    right: 0.75rem;
    z-index: 4;
    background: rgba(0, 0, 0, 0.45);
    color: #fff;
    font-size: 0.7rem;
    font-weight: 600;
    padding: 0.2rem 0.55rem;
    border-radius: 9999px;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    font-variant-numeric: tabular-nums;
}

/* ============================================================
   Accessibility & motion preferences
   ============================================================ */
.xoro-hero-slider:focus-visible,
.xoro-hero-slider__dot:focus-visible,
.xoro-hero-slider__arrow:focus-visible,
.xoro-hero-slide__cta:focus-visible {
    outline: 2px solid #84cc16;
    outline-offset: 2px;
}

/* Respect reduced motion — disable autoplay transitions & ken-burns */
@media (prefers-reduced-motion: reduce) {
    .xoro-hero-slider__track,
    .xoro-hero-slide,
    .xoro-hero-slide__img,
    .xoro-hero-slide__cta,
    .xoro-hero-slider__dot {
        transition: none !important;
        animation: none !important;
    }
    .xoro-hero-slide.is-active .xoro-hero-slide__img {
        transform: scale(1.02);
    }
}

/* ============================================================
   Mobile-only mode: slider only shows on < lg.
   On desktop the original bestseller hero is shown instead
   (handled in PHP by conditional rendering).
   ============================================================ */
@media (min-width: 1024px) {
    .xoro-hero-slider--mobile-only { display: none !important; }
}

/* ============================================================
   Swipe hint (mobile only, auto-dismisses)
   Progressive enhancement — injected by JS, degrades gracefully.
   ============================================================ */
.xoro-hero-slider__hint {
    position: absolute;
    top: 0.75rem;
    left: 50%;
    transform: translateX(-50%);
    z-index: 5;
    display: none;
    align-items: center;
    gap: 0.35rem;
    background: rgba(0, 0, 0, 0.55);
    color: #fff;
    font-size: 0.65rem;
    font-weight: 600;
    letter-spacing: 0.04em;
    padding: 0.3rem 0.7rem;
    border-radius: 9999px;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    pointer-events: none;
    opacity: 0;
    transition: opacity 400ms ease;
}
.xoro-hero-slider__hint.is-visible { opacity: 1; }
.xoro-hero-slider__hint svg { width: 13px; height: 13px; animation: xoroSwipeNudge 1.4s ease-in-out infinite; }
@keyframes xoroSwipeNudge {
    0%, 100% { transform: translateX(0); }
    50% { transform: translateX(4px); }
}
/* Show hint only on touch / small screens */
@media (max-width: 767px) and (hover: none) {
    .xoro-hero-slider__hint { display: inline-flex; }
}
@media (prefers-reduced-motion: reduce) {
    .xoro-hero-slider__hint,
    .xoro-hero-slider__hint svg { animation: none !important; transition: none !important; }
    .xoro-hero-slider__hint { display: none !important; }
}

/* ============================================================
   MARQUEE (v3.65.0) — Pure CSS, zero JS, GPU-accelerated.
   Large Gen-Z text, jewelry CRO lines. ~1 KB.
   ============================================================ */
.xoro-marquee {
    overflow: hidden;
    white-space: nowrap;
    border-top: 1px solid rgba(132, 204, 22, 0.28);
    border-bottom: 1px solid rgba(132, 204, 22, 0.28);
    background: linear-gradient(90deg, #0d0d0d, #111 50%, #0d0d0d);
    padding: 0.85rem 0;
    /* Fade edges for a premium, modern feel */
    -webkit-mask-image: linear-gradient(to right, transparent, #000 7%, #000 93%, transparent);
    mask-image: linear-gradient(to right, transparent, #000 7%, #000 93%, transparent);
    -webkit-tap-highlight-color: transparent;
}
.xoro-marquee__track {
    display: inline-flex;
    align-items: center;
    gap: 2.25rem;
    will-change: transform;
    animation: xoroMarquee 32s linear infinite;
}
/* Two identical groups = seamless infinite loop (translate -50%) */
.xoro-marquee__group {
    display: inline-flex;
    align-items: center;
    gap: 2.25rem;
    flex-shrink: 0;
    padding-right: 2.25rem; /* match gap so last item before repeat is spaced */
}
.xoro-marquee__item {
    font-size: 1.5rem;       /* 24px mobile — large */
    font-weight: 900;
    letter-spacing: -0.02em;
    text-transform: uppercase;
    color: #fff;
    line-height: 1;
    flex-shrink: 0;
}
.xoro-marquee__item--gold { color: #84cc16; }
.xoro-marquee__sep {
    color: #84cc16;
    font-size: 1.1rem;
    flex-shrink: 0;
    opacity: 0.9;
}
@keyframes xoroMarquee {
    from { transform: translate3d(0, 0, 0); }
    to   { transform: translate3d(-50%, 0, 0); }
}
/* Pause on hover (desktop) — lets users read a line */
@media (hover: hover) {
    .xoro-marquee:hover .xoro-marquee__track { animation-play-state: paused; }
}
@media (min-width: 640px) {
    .xoro-marquee { padding: 1.05rem 0; }
    .xoro-marquee__item { font-size: 2rem; }       /* 32px */
    .xoro-marquee__sep { font-size: 1.4rem; }
    .xoro-marquee__track,
    .xoro-marquee__group { gap: 3rem; }
    .xoro-marquee__group { padding-right: 3rem; }
}
@media (min-width: 1024px) {
    .xoro-marquee__item { font-size: 2.75rem; }    /* 44px — large desktop */
    .xoro-marquee__sep { font-size: 1.7rem; }
    .xoro-marquee__track,
    .xoro-marquee__group { gap: 3.5rem; }
    .xoro-marquee__group { padding-right: 3.5rem; }
}
/* Reduced motion — stop the scroll, show static text */
@media (prefers-reduced-motion: reduce) {
    .xoro-marquee__track { animation: none; transform: none; }
}

/* ====================================================================
   v3.145.0 — Mobile in-app browser safe-area / dvh / touch fixes
   (Instagram / TikTok / FB in-app browsers with bottom toolbars)
   All rules below are ADDITIVE. env(safe-area-inset-*) returns 0 on
   desktop and standard mobile → no visual change. No existing rules
   were modified. Owner: M-3-c (mobile-css-builder).
   ==================================================================== */

/* --------------------------------------------------------------------
   FIX 1 — Sticky mobile CTA safe-area (CRITICAL)
   footer.php:54 renders <div id="stickyMobileCTA" class="fixed bottom-0 ...">
   with NO env() padding. In Insta/TikTok/FB iOS in-app browsers the bottom
   action toolbar (~44-50px) clips the Add-to-Cart / Buy-Now / Checkout buttons.
   padding-bottom: env(safe-area-inset-bottom) lifts the inner buttons above
   the toolbar while keeping the bar's background covering the toolbar area.
   !important guards against any Tailwind pb-* utility on the same element.
   -------------------------------------------------------------------- */
#stickyMobileCTA {
    padding-bottom: env(safe-area-inset-bottom, 0px) !important;
}
/* When body.xoro-in-app class is set (by JS detecting in-app browser),
   also shift the whole sticky bar above the toolbar. */
body.xoro-in-app #stickyMobileCTA {
    bottom: env(safe-area-inset-bottom, 0px);
}

/* --------------------------------------------------------------------
   FIX 2 — WhatsApp float, back-to-top, toast, sale popup safe-area
   footer.php JS (lines 186, 197, 202, 209) sets inline `style.bottom` on
   these elements (POS_BOTTOM=20px or POS_WITH_BAR=80px). CSS `bottom` would
   be overridden by inline style, so we use `margin-bottom: env(...)` which
   shifts fixed-position elements without conflicting with inline `bottom`.
   Real IDs verified in footer.php:
     - #whatsappFloat (footer.php:103, class="whatsapp-float")
     - #backToTop    (footer.php:110)
     - #toastContainer (footer.php:107, class="toast-container")
     - #xoroSalePopup (created dynamically in xoro-checkout.js:1901)
   -------------------------------------------------------------------- */
#whatsappFloat,
.whatsapp-float,
#backToTop,
#toastContainer,
.toast-container,
#xoroSalePopup {
    margin-bottom: env(safe-area-inset-bottom, 0px);
}

/* --------------------------------------------------------------------
   FIX 3 — Filter sidebar dvh fallback (HIGH)
   archive-product.php:257 (inside @media max-width:1023px) declares:
     .xoro-filter-sidebar { ... height:100vh; max-height:100vh; ... }
   100vh = the SMALL viewport height (includes area behind in-app bottom
   toolbar). The bottom "Apply"/"Clear" buttons are obscured. Override with
   100dvh (with 100vh fallback first for iOS 14 WKWebView which doesn't
   recognize dvh).
   Specificity: `body .xoro-filter-sidebar` (0,1,1) and `#xoroFilterSidebar`
   (1,0,0) both beat the inline `.xoro-filter-sidebar` (0,1,0) in archive-
   product.php's body <style> block.
   Scoped to @media(max-width:1023px) so the desktop sticky sidebar's
   `max-height: calc(100vh - 40px)` (archive-product.php:233) is NOT touched.
   -------------------------------------------------------------------- */
@media (max-width: 1023px) {
    body .xoro-filter-sidebar,
    #xoroFilterSidebar {
        height: 100vh;       /* fallback iOS 14 WKWebView */
        height: 100dvh;      /* modern — excludes in-app toolbar area */
        max-height: 100vh;   /* fallback iOS 14 WKWebView */
        max-height: 100dvh;  /* modern */
    }
}

/* --------------------------------------------------------------------
   FIX 4 — dvh fallback for other 100vh usages
   Audited xoro-all-compiled.css for `100vh` / `100dvh` / `100svh` / `100lvh`
   → NONE found (Tailwind viewport-height utilities like h-screen are applied
   via class attributes at element level, not in this stylesheet).
   Mobile-relevant 100vh usages in other owned files:
     - xoro-chatbot.css:110  desktop panel max-height: calc(100vh - 7rem)
     - xoro-chatbot.css:162-163  mobile panel height: 100dvh (no 100vh fallback)
   Both are handled in xoro-chatbot.css (FIX 5 + FIX 4 chatbot instance).
   Mobile-relevant 100vh usages in non-owned files:
     - archive-product.php:257  filter sidebar (handled by FIX 3 above)
     - xoro-checkout.php:942, 1058, 1085  cart drawer / checkout modal
       (owned by another agent — M-3-b template agent)
   No additional dvh upgrades needed in this file.
   -------------------------------------------------------------------- */

/* --------------------------------------------------------------------
   FIX 6 — Chatbot FAB skeleton (prevents CLS before async xoro-chatbot.css loads)
   xoro-chatbot.css loads ASYNC (deferred via style_loader_tag filter in
   inc/enqueue.php). Before it loads, the FAB (<button class="xoro-chatbot__fab"
   id="xoro-chatbot-toggle">, rendered in inc/xoro-chatbot.php:3549) has no
   styling → renders with default browser button styles → CLS / FOUC when the
   async CSS finally loads.
   This skeleton rule (in render-blocking xoro-all-compiled.css, loaded in <head>)
   ensures the FAB has correct position/size/background BEFORE the async CSS
   loads. Once async CSS loads, it applies the same rules with the same
   specificity → no flash. Mobile media query in xoro-chatbot.css overrides
   `bottom` and `width`/`height` for mobile (54px FAB at bottom:1rem) →
   async CSS still wins on mobile.
   Real selectors verified in inc/xoro-chatbot.php:
     - Container: <div id="xoro-chatbot" class="xoro-chatbot">  (line 3547)
     - FAB:       <button id="xoro-chatbot-toggle" class="xoro-chatbot__fab">  (line 3549)
   -------------------------------------------------------------------- */
#xoro-chatbot,
.xoro-chatbot {
    position: fixed;
    bottom: max(1.25rem, env(safe-area-inset-bottom, 0px));
    right: 1rem;
    z-index: 40;
}
#xoro-chatbot-toggle,
.xoro-chatbot__fab {
    position: relative;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    border: none;
    background: linear-gradient(135deg, #84cc16, #b8941f);
    color: #0a0a0a;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 20px rgba(132, 204, 22, 0.4), 0 2px 8px rgba(0, 0, 0, 0.3);
    -webkit-tap-highlight-color: transparent;
}

/* --------------------------------------------------------------------
   FIX 7 — backdrop-filter -webkit- prefix (MEDIUM)
   single-product.php:337 has `.xoro-compare__label { backdrop-filter:blur(4px) }`
   WITHOUT the -webkit- prefix. iOS WKWebView ≤14 (used by Insta/TikTok/FB on
   iOS ≤14) only honors the prefixed form; Safari 18 / iOS 18 added unprefixed.
   Without the prefix, the compare labels render with solid rgba background and
   NO blur (minor visual regression in older in-app browsers).
   Other inline-style backdrop-filter usages without -webkit- prefix (all in
   PHP files owned by other agents — we can't edit them, so we target the
   rendered elements here):
     - header.php:194   .xoro-recovery-overlay    blur(6px)
     - header.php:213   .xoro-burger-overlay.open blur(4px)
     - header.php:281   .xoro-sizechart-overlay   blur(6px)
     - header.php:422   .xoro-bundle-attr-overlay blur(6px)
     - inc/speed-optimization.php:210  #mainNav  blur(12px)
   Specificity: `.xoro-compare .xoro-compare__label` (0,2,0) beats the inline
   `.xoro-compare__label` (0,1,0) in single-product.php body <style>.
   @supports guard ensures rule only applies where backdrop-filter is supported.
   -------------------------------------------------------------------- */
@supports ((backdrop-filter: blur(4px)) or (-webkit-backdrop-filter: blur(4px))) {
    /* single-product.php:337 — blur(4px) */
    .xoro-compare .xoro-compare__label {
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
    }
    /* header.php inline styles — blur(6px) */
    .xoro-recovery-overlay,
    .xoro-sizechart-overlay,
    .xoro-bundle-attr-overlay {
        -webkit-backdrop-filter: blur(6px);
        backdrop-filter: blur(6px);
    }
    /* header.php:213 — blur(4px) */
    .xoro-burger-overlay.open {
        -webkit-backdrop-filter: blur(4px);
        backdrop-filter: blur(4px);
    }
    /* inc/speed-optimization.php:210 — blur(12px) */
    #mainNav {
        -webkit-backdrop-filter: blur(12px);
        backdrop-filter: blur(12px);
    }
}

/* --------------------------------------------------------------------
   FIX 10 — Scroll behavior + prefers-reduced-motion (LOW)
   header.php:6 sets class="scroll-smooth" on <html> (Tailwind utility →
   `scroll-behavior: smooth`). This is the desired default (smooth anchor
   scrolling, smooth back-to-top). However, users with vestibular disorders
   prefer reduced motion — Tailwind doesn't auto-add a reduced-motion override
   for scroll-behavior. We add it here. (Belt-and-suspenders: also re-declares
   `scroll-behavior: smooth` for browsers that don't recognize Tailwind's
   utility output.)
   Note: bfcache restore jank is mitigated by the reduced-motion override for
   affected users; other users get smooth scroll per the theme's existing UX.
   -------------------------------------------------------------------- */
html {
    scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }
}

/* --------------------------------------------------------------------
   FIX 8 — Hero slider touch-action and overscroll-behavior (MEDIUM)
   (Mirrored in assets/css/hero-slider.css — that file is bundled INTO
   xoro-all-compiled.css via static merge; this duplicate ensures the rule
   ships in the file the browser actually loads.)
   Existing .xoro-hero-slider rule (line 277-290 of this file) already has:
     - touch-action: pan-y        (allow vertical page scroll, capture horizontal swipe)
     - user-select: none
     - -webkit-tap-highlight-color: transparent
   The audit (M-1-c finding #8) confirmed `touch-action: pan-y` is CORRECT for
   a horizontal slider: pan-y lets the browser handle vertical scrolling (so
   users can scroll PAST the slider) while the slider's JS touch listeners
   capture horizontal swipes for slide navigation.
   Switching to `pan-x` (the task spec's literal suggestion) would PREVENT
   vertical page scroll when the touch starts on the slider — trapping users
   above it. So pan-y is PRESERVED (not changed to pan-x).

   Missing (added below):
     - overscroll-behavior-x: contain   — prevents iOS Safari pull-to-refresh
       from firing when a horizontal swipe is initiated at the top of the page.
     - -webkit-overflow-scrolling: touch — legacy iOS momentum scrolling hint
       (harmless on the non-scrolling slider container; future-proofs against
       any internal scroll container added later).
   -------------------------------------------------------------------- */
.xoro-hero-slider {
    overscroll-behavior-x: contain;
    -webkit-overflow-scrolling: touch;
}

/* --------------------------------------------------------------------
   FIX 9 — Global mobile touch optimizations (MEDIUM)
   (Mirrored in assets/css/custom.css — that file is bundled INTO
   xoro-all-compiled.css via static merge; this duplicate ensures the rule
   ships in the file the browser actually loads.)
   - touch-action: manipulation removes the 300ms tap delay on legacy WebViews
     (iOS WKWebView <14, older Android WebView). The theme's viewport meta
     (header.php:9, width=device-width, viewport-fit=cover) already eliminates
     the delay on modern Chrome/Safari, but in-app browsers on older iOS may
     still apply it. This rule is belt-and-suspenders for those cases.
     Note: Agent A's xoro-mobile.css (v3.145.0, enqueued in inc/enqueue.php:37)
     also adds this globally — duplicate is harmless (last rule wins, same value).
   - -webkit-tap-highlight-color: transparent removes the gray tap flash on iOS.
     xoro-all-compiled.css:84-86 already sets `* { -webkit-tap-highlight-color: transparent }`
     globally; this is a more targeted restatement for interactive elements.
   - -webkit-touch-callout: none prevents the iOS long-press image/contextual
     callout — gives an app-like feel.
   - user-select: none on UI chrome (buttons, nav links) prevents accidental
     text selection on rapid taps — app-like feel. Inputs/textareas are EXCLUDED
     so users can still select/type/edit text content.
   -------------------------------------------------------------------- */
button, a, input, select, textarea, [role="button"], [onclick] {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}
body {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none; /* prevent long-press callout on images (app-like) */
}
/* Prevent text selection on UI chrome (buttons, nav) — app-like feel.
   Excludes inputs/textareas so users can still select/type/edit text. */
button, .btn, nav a, [role="button"] {
    -webkit-user-select: none;
    user-select: none;
}