*,: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 / .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: rgb(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: }*,: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;-o-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]){-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,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;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,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::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}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]:where(:not([hidden=until-found])){display:none}h1{font-size:1.875rem;line-height:2.25rem;font-weight:700}@media (min-width: 768px){h1{font-size:3rem;line-height:1}}@media (min-width: 1024px){h1{font-size:3.5rem;line-height:1.28571429}}h2{font-size:1.5rem;line-height:2rem;font-weight:700}@media (min-width: 768px){h2{font-size:1.875rem;line-height:2.25rem}}@media (min-width: 1024px){h2{font-size:3rem;line-height:1.33333333}}h3{font-size:1.125rem;line-height:1.75rem;font-weight:700}@media (min-width: 768px){h3{font-size:1.25rem;line-height:1.75rem}}@media (min-width: 1024px){h3{font-size:1.875rem;line-height:2.25rem;line-height:1.5}}.container{width:100%;margin-right:auto;margin-left:auto;padding-right:1rem;padding-left:1rem}@media (min-width: 640px){.container{max-width:640px}}@media (min-width: 768px){.container{max-width:768px;padding-right:1.5rem;padding-left:1.5rem}}@media (min-width: 1024px){.container{max-width:1024px}}@media (min-width: 1280px){.container{max-width:1280px}}@media (min-width: 1536px){.container{max-width:1536px}}a{text-underline-offset:2px}a:hover{text-decoration-line:underline}.context-menu{position:absolute;right:0;top:100%;z-index:20;margin-top:.25rem;display:none;max-height:18rem;overflow:auto;white-space:nowrap;border-radius:.5rem;border-width:1px;--tw-border-opacity: 1;border-color:rgb(var(--color-line-tertiary) / var(--tw-border-opacity));--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-primary) / var(--tw-bg-opacity));--tw-shadow: 0px 4px 6px -2px rgba(0,0,9,.03),0px 12px 16px -4px rgba(0,0,9,.08);--tw-shadow-colored: 0px 4px 6px -2px var(--tw-shadow-color), 0px 12px 16px -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)}.context-menu[data-open],.group[data-open] .context-menu{display:block}.context-menu{min-width:8rem}.wrapper{position:relative;border-radius:2.25rem;--tw-border-opacity: 1;border-color:rgb(var(--color-contrast-secondary) / var(--tw-border-opacity));border-width:10px}.badge{display:inline-flex;border-radius:.5rem;border-width:2px;border-color:currentColor;--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-secondary) / var(--tw-bg-opacity));padding:.25rem .5rem;font-size:.875rem;line-height:1.25rem;font-weight:700}@media (min-width: 768px){.badge{font-size:1rem;line-height:1.5rem}}.badge{box-shadow:2px 2px 0 1px currentcolor}.money [data-type=fraction]{vertical-align:super;font-size:1rem;line-height:1.5rem}.button{display:inline-flex;height:3rem;align-items:center;justify-content:center;gap:.5rem;border-radius:.5rem;--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-accent) / var(--tw-bg-opacity));padding-left:1.5rem;padding-right:1.5rem;text-align:center;font-weight:500;--tw-text-opacity: 1;color:rgb(var(--color-accent) / var(--tw-text-opacity));outline-style:solid;outline-width:0px;outline-offset:2px;outline-color:rgb(var(--color-contrast-accent) / 1);transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.button:hover{text-decoration-line:none;outline-width:1px}.button:disabled{pointer-events:none;cursor:not-allowed;--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-secondary) / var(--tw-bg-opacity));opacity:.5}.button[processing]{pointer-events:none;cursor:not-allowed;opacity:.5}.button .spinner{display:none}.button[processing] .spinner{display:block}.button-primary{--tw-bg-opacity: 1;background-color:rgb(var(--color-primary) / var(--tw-bg-opacity));--tw-text-opacity: 1;color:rgb(var(--color-contrast-primary) / var(--tw-text-opacity));outline-color:rgb(var(--color-primary) / 1)}.button-sm{height:2.5rem;padding-left:1rem;padding-right:1rem}.button-outline{border-width:1px;--tw-border-opacity: 1;border-color:rgb(var(--color-line-secondary) / var(--tw-border-opacity));background-color:transparent;--tw-text-opacity: 1;color:rgb(var(--color-primary) / var(--tw-text-opacity))}.button-outline:hover{--tw-border-opacity: 1;border-color:rgb(var(--color-line-primary) / var(--tw-border-opacity));outline-width:0px}@keyframes float{0%{translate:0px 0px}50%{translate:0px -16px}to{translate:0px 0px}}.float{position:absolute;border-radius:.75rem;animation:float 6s ease-in-out infinite}.icon{position:relative;display:inline-flex;height:3.5rem;width:3.5rem;align-items:center;justify-content:center;border-radius:.75rem;border-width:2px;border-color:currentColor;--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-primary) / var(--tw-bg-opacity));padding-left:1rem;padding-right:1rem;font-weight:700}.icon i{position:relative;z-index:10;font-size:1.875rem;line-height:2.25rem}.icon:after{content:"";position:absolute;top:0;left:0;z-index:0;height:100%;width:100%;border-radius:.75rem;background-color:currentColor;opacity:.05}.icon.shadow-left{box-shadow:-1px 1px 0 1px currentcolor}.icon.shadow-right{box-shadow:1px 1px 0 1px currentcolor}.pointer-events-none{pointer-events:none}.static{position:static}.absolute{position:absolute}.relative{position:relative}.-left-6{left:-1.5rem}.-right-6{right:-1.5rem}.-top-3{top:-.75rem}.bottom-0{bottom:0}.left-0{left:0}.left-1{left:.25rem}.left-1\/2{left:50%}.left-14{left:3.5rem}.right-0{right:0}.right-1\/2{right:50%}.right-14{right:3.5rem}.top-0{top:0}.top-1{top:.25rem}.top-1\/2{top:50%}.top-full{top:100%}.z-10{z-index:10}.z-20{z-index:20}.mx-0\.5{margin-left:.125rem;margin-right:.125rem}.mx-4{margin-left:1rem;margin-right:1rem}.mx-auto{margin-left:auto;margin-right:auto}.my-10{margin-top:2.5rem;margin-bottom:2.5rem}.-ml-6{margin-left:-1.5rem}.-mt-6{margin-top:-1.5rem}.mb-10{margin-bottom:2.5rem}.mb-2{margin-bottom:.5rem}.ml-auto{margin-left:auto}.mt-1{margin-top:.25rem}.mt-10{margin-top:2.5rem}.mt-12{margin-top:3rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}.mt-6{margin-top:1.5rem}.mt-8{margin-top:2rem}.block{display:block}.flex{display:flex}.inline-flex{display:inline-flex}.grid{display:grid}.hidden{display:none}.h-10{height:2.5rem}.h-12{height:3rem}.h-14{height:3.5rem}.h-6{height:1.5rem}.h-8{height:2rem}.h-full{height:100%}.max-h-72{max-height:18rem}.max-h-max{max-height:-moz-max-content;max-height:max-content}.w-0{width:0px}.w-10{width:2.5rem}.w-12{width:3rem}.w-14{width:3.5rem}.w-60{width:15rem}.w-\[115px\]{width:115px}.w-\[150px\]{width:150px}.w-auto{width:auto}.w-full{width:100%}.max-w-3xl{max-width:48rem}.max-w-4xl{max-width:56rem}.max-w-\[140px\]{max-width:140px}.max-w-\[154px\]{max-width:154px}.max-w-md{max-width:28rem}.max-w-xl{max-width:36rem}.shrink-0{flex-shrink:0}.translate-x-1\/2{--tw-translate-x: 50%;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-10{--tw-translate-y: 2.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-rotate-\[10deg\]{--tw-rotate: -10deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-rotate-\[15deg\],.rotate-\[-15deg\]{--tw-rotate: -15deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-\[15deg\]{--tw-rotate: 15deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.rotate-\[5deg\]{--tw-rotate: 5deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.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)) skew(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)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-not-allowed{cursor:not-allowed}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.flex-col{flex-direction:column}.items-start{align-items:flex-start}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-1{gap:.25rem}.gap-12{gap:3rem}.gap-2{gap:.5rem}.gap-20{gap:5rem}.gap-3{gap:.75rem}.gap-4{gap:1rem}.gap-5{gap:1.25rem}.gap-6{gap:1.5rem}.overflow-hidden{overflow:hidden}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.whitespace-nowrap{white-space:nowrap}.rounded-3xl{border-radius:1.5rem}.rounded-4xl{border-radius:2.25rem}.rounded-full{border-radius:9999px}.rounded-lg{border-radius:.5rem}.rounded-md{border-radius:.375rem}.rounded-xl{border-radius:.75rem}.rounded-tr-4xl{border-top-right-radius:2.25rem}.border{border-width:1px}.border-2{border-width:2px}.border-l{border-left-width:1px}.border-t{border-top-width:1px}.border-contrast-secondary{--tw-border-opacity: 1;border-color:rgb(var(--color-contrast-secondary) / var(--tw-border-opacity))}.border-current{border-color:currentColor}.border-line-secondary{--tw-border-opacity: 1;border-color:rgb(var(--color-line-secondary) / var(--tw-border-opacity))}.border-line-tertiary{--tw-border-opacity: 1;border-color:rgb(var(--color-line-tertiary) / var(--tw-border-opacity))}.border-l-line-tertiary{--tw-border-opacity: 1;border-left-color:rgb(var(--color-line-tertiary) / var(--tw-border-opacity))}.bg-\[\#E7FF9B\]{--tw-bg-opacity: 1;background-color:rgb(231 255 155 / var(--tw-bg-opacity))}.bg-contrast-accent{--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-accent) / var(--tw-bg-opacity))}.bg-contrast-primary{--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-primary) / var(--tw-bg-opacity))}.bg-contrast-secondary{--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-secondary) / var(--tw-bg-opacity))}.bg-current{background-color:currentColor}.bg-line-tertiary{--tw-bg-opacity: 1;background-color:rgb(var(--color-line-tertiary) / var(--tw-bg-opacity))}.bg-primary{--tw-bg-opacity: 1;background-color:rgb(var(--color-primary) / var(--tw-bg-opacity))}.bg-secondary{--tw-bg-opacity: 1;background-color:rgb(var(--color-secondary) / var(--tw-bg-opacity))}.bg-transparent{background-color:transparent}.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-tr{background-image:linear-gradient(to top right,var(--tw-gradient-stops))}.from-\[\#171E27\]{--tw-gradient-from: #171E27 var(--tw-gradient-from-position);--tw-gradient-to: rgb(23 30 39 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-\[\#48515D\]{--tw-gradient-from: #48515D var(--tw-gradient-from-position);--tw-gradient-to: rgb(72 81 93 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-\[\#D3F36B\]{--tw-gradient-from: #D3F36B var(--tw-gradient-from-position);--tw-gradient-to: rgb(211 243 107 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.from-\[\#E7FF9B\]{--tw-gradient-from: #E7FF9B var(--tw-gradient-from-position);--tw-gradient-to: rgb(231 255 155 / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.to-\[\#000009\]{--tw-gradient-to: #000009 var(--tw-gradient-to-position)}.to-\[\#48515D\]{--tw-gradient-to: #48515D var(--tw-gradient-to-position)}.to-\[\#6BAAF3\]{--tw-gradient-to: #6BAAF3 var(--tw-gradient-to-position)}.to-\[\#CFE6FF\]{--tw-gradient-to: #CFE6FF var(--tw-gradient-to-position)}.bg-clip-text{-webkit-background-clip:text;background-clip:text}.object-cover{-o-object-fit:cover;object-fit:cover}.p-0\.5{padding:.125rem}.p-12{padding:3rem}.p-14{padding:3.5rem}.p-3{padding:.75rem}.p-4{padding:1rem}.p-8{padding:2rem}.p-9{padding:2.25rem}.p-\[10px\]{padding:10px}.px-12{padding-left:3rem;padding-right:3rem}.px-2{padding-left:.5rem;padding-right:.5rem}.px-4{padding-left:1rem;padding-right:1rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.px-9{padding-left:2.25rem;padding-right:2.25rem}.py-1{padding-top:.25rem;padding-bottom:.25rem}.py-12{padding-top:3rem;padding-bottom:3rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.pl-4{padding-left:1rem}.pr-4{padding-right:1rem}.text-left{text-align:left}.text-center{text-align:center}.align-super{vertical-align:super}.font-primary{font-family:var(--font-family-primary)}.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-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-bold{font-weight:700}.font-medium{font-weight:500}.font-semibold{font-weight:600}.uppercase{text-transform:uppercase}.capitalize{text-transform:capitalize}.not-italic{font-style:normal}.text-\[\#00A6FB\]{--tw-text-opacity: 1;color:rgb(0 166 251 / var(--tw-text-opacity))}.text-\[\#30C862\]{--tw-text-opacity: 1;color:rgb(48 200 98 / var(--tw-text-opacity))}.text-\[\#8B6BF3\]{--tw-text-opacity: 1;color:rgb(139 107 243 / var(--tw-text-opacity))}.text-\[\#9FF37B\]{--tw-text-opacity: 1;color:rgb(159 243 123 / var(--tw-text-opacity))}.text-accent{--tw-text-opacity: 1;color:rgb(var(--color-accent) / var(--tw-text-opacity))}.text-contrast-primary{--tw-text-opacity: 1;color:rgb(var(--color-contrast-primary) / var(--tw-text-opacity))}.text-primary{--tw-text-opacity: 1;color:rgb(var(--color-primary) / var(--tw-text-opacity))}.text-secondary{--tw-text-opacity: 1;color:rgb(var(--color-secondary) / var(--tw-text-opacity))}.text-tertiary{--tw-text-opacity: 1;color:rgb(var(--color-tertiary) / var(--tw-text-opacity))}.underline-offset-2{text-underline-offset:2px}.opacity-10{opacity:.1}.opacity-5{opacity:.05}.opacity-50{opacity:.5}.shadow{--tw-shadow: 0 1px 3px 0 rgb(0 0 0 / .1), 0 1px 2px -1px rgb(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-\[0px_4px_6px_-2px_rgba\(0\,0\,9\,0\.03\)\,0px_12px_16px_-4px_rgba\(0\,0\,9\,0\.08\)\]{--tw-shadow: 0px 4px 6px -2px rgba(0,0,9,.03),0px 12px 16px -4px rgba(0,0,9,.08);--tw-shadow-colored: 0px 4px 6px -2px var(--tw-shadow-color), 0px 12px 16px -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 / .1), 0 2px 4px -2px rgb(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)}.outline{outline-style:solid}.outline-0{outline-width:0px}.outline-offset-2{outline-offset:2px}.outline-contrast-accent{outline-color:rgb(var(--color-contrast-accent) / 1)}.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)}.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)}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}[x-cloak]{display:none}.bg-clip-text{-webkit-background-clip:text;-webkit-text-fill-color:transparent}@keyframes scrolling-presets{to{background-position:0px -2080px}}.scrolling-presets{position:absolute;top:0;right:0;height:100%;width:100%;--tw-rotate: 5deg;--tw-scale-x: 1.1;--tw-scale-y: 1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));opacity:.05}@media (min-width: 768px){.scrolling-presets{right:-2.5rem;width:48%;opacity:1}}.scrolling-presets{background-image:url(./presets-BuHevf0c.webp);background-size:100% auto;background-repeat:repeat-y;animation:scrolling-presets 60s linear infinite}@keyframes scrolling-images{to{background-position:center var(--scroll-to)}}#image-generator .preview{position:absolute;top:0;left:0;height:100%;width:100%;opacity:.1}@media (min-width: 1024px){#image-generator .preview{position:static;opacity:1}}#image-generator .preview>div{position:relative}#image-generator .preview .bg>div{position:absolute;width:100%;height:110%;height:calc(100% + 40px);background-size:100% auto;background-repeat:repeat-y}#image-generator .preview .bg>div:after{position:absolute;height:10rem;width:100%;--tw-gradient-from: rgb(var(--color-contrast-primary) / 1) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--color-contrast-primary) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to);content:var(--tw-content);--tw-gradient-to: transparent var(--tw-gradient-to-position)}#image-generator .preview .bg:nth-child(odd)>div{--scroll-to: -1408px;bottom:0}#image-generator .preview .bg:nth-child(odd)>div:after{top:0;content:var(--tw-content);background-image:linear-gradient(to bottom,var(--tw-gradient-stops))}#image-generator .preview .bg:nth-child(odd)>div{background-position:center bottom;animation:scrolling-images 60s linear infinite}#image-generator .preview .bg:nth-child(2n)>div{--scroll-to: 1408px;top:0}#image-generator .preview .bg:nth-child(2n)>div:after{bottom:0;content:var(--tw-content);background-image:linear-gradient(to top,var(--tw-gradient-stops))}#image-generator .preview .bg:nth-child(2n)>div{background-position:center top;animation:scrolling-images 60s linear infinite}#image-generator .preview .bg:nth-child(1)>div{background-image:url(./images1-Ct-zoJHG.webp)}#image-generator .preview .bg:nth-child(2)>div{background-image:url(./images2-Bgxorl1h.webp)}#image-generator .preview .bg:nth-child(3)>div{background-image:url(./images3-DnfVt1d6.webp)}#image-generator .preview .bg:nth-child(4)>div{background-image:url(./images4-B-U7aOLF.webp)}#image-generator .preview .bg:last-child{overflow:hidden}#image-generator .preview .bg:last-child>div{height:110%;height:calc(100% + 10px)}@keyframes enter{0%{opacity:0;--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);transform:scale(var(--scale, 1)) translate(var(--x, 0px));grayscale:1}}.enter,.enter3{--x: 0;--scale: .95;animation:enter both linear;animation-timeline:view(0px);animation-range:entry}@media only screen and (min-width: 768px){.enter3:nth-child(3n+1 of.enter3){--x: 36px;transform-origin:left center}.enter3:nth-child(3n+3 of.enter3){--x: -36px;transform-origin:right center}}.after\:absolute:after{content:var(--tw-content);position:absolute}.after\:bottom-0:after{content:var(--tw-content);bottom:0}.after\:top-0:after{content:var(--tw-content);top:0}.after\:h-40:after{content:var(--tw-content);height:10rem}.after\:w-full:after{content:var(--tw-content);width:100%}.after\:from-contrast-primary:after{content:var(--tw-content);--tw-gradient-from: rgb(var(--color-contrast-primary) / 1) var(--tw-gradient-from-position);--tw-gradient-to: rgb(var(--color-contrast-primary) / 0) var(--tw-gradient-to-position);--tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to)}.hover\:border-line-primary:hover{--tw-border-opacity: 1;border-color:rgb(var(--color-line-primary) / var(--tw-border-opacity))}.hover\:bg-contrast-accent:hover{--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-accent) / var(--tw-bg-opacity))}.hover\:bg-contrast-secondary:hover{--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-secondary) / var(--tw-bg-opacity))}.hover\:bg-line-tertiary:hover{--tw-bg-opacity: 1;background-color:rgb(var(--color-line-tertiary) / var(--tw-bg-opacity))}.hover\:text-accent:hover{--tw-text-opacity: 1;color:rgb(var(--color-accent) / var(--tw-text-opacity))}.hover\:text-primary:hover{--tw-text-opacity: 1;color:rgb(var(--color-primary) / var(--tw-text-opacity))}.hover\:underline:hover{text-decoration-line:underline}.hover\:no-underline:hover{text-decoration-line:none}.hover\:outline-1:hover{outline-width:1px}.group:hover .group-hover\:opacity-0{opacity:0}.data-\[open\]\:block[data-open]{display:block}.data-\[overlay\]\:overflow-hidden[data-overlay]{overflow:hidden}.data-\[overlay\]\:pr-\[var\(--scrollbar-width\)\][data-overlay]{padding-right:var(--scrollbar-width)}.group\/html[data-mode=dark] .group-data-\[mode\=dark\]\/html\:block,.group[data-open] .group-data-\[open\]\:block{display:block}.group\/html[data-mode=dark] .group-data-\[mode\=dark\]\/html\:hidden{display:none}.group[data-open] .group-data-\[open\]\:bg-contrast-secondary{--tw-bg-opacity: 1;background-color:rgb(var(--color-contrast-secondary) / var(--tw-bg-opacity))}.group[data-open] .group-data-\[open\]\:opacity-0{opacity:0}.dark\:block:is([data-mode=dark] *){display:block}.dark\:hidden:is([data-mode=dark] *){display:none}.dark\:bg-line-tertiary:is([data-mode=dark] *){--tw-bg-opacity: 1;background-color:rgb(var(--color-line-tertiary) / var(--tw-bg-opacity))}.dark\:text-primary:is([data-mode=dark] *){--tw-text-opacity: 1;color:rgb(var(--color-primary) / var(--tw-text-opacity))}@media (min-width: 640px){.sm\:inline{display:inline}.sm\:inline-flex{display:inline-flex}.sm\:h-10{height:2.5rem}.sm\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.sm\:gap-4{gap:1rem}.sm\:px-4{padding-left:1rem;padding-right:1rem}.sm\:py-3{padding-top:.75rem;padding-bottom:.75rem}.sm\:text-base{font-size:1rem;line-height:1.5rem}}@media (min-width: 768px){.md\:-right-10{right:-2.5rem}.md\:order-2{order:2}.md\:my-20{margin-top:5rem;margin-bottom:5rem}.md\:mt-0{margin-top:0}.md\:mt-10{margin-top:2.5rem}.md\:mt-12{margin-top:3rem}.md\:mt-14{margin-top:3.5rem}.md\:mt-6{margin-top:1.5rem}.md\:flex{display:flex}.md\:inline-flex{display:inline-flex}.md\:w-\[48\%\]{width:48%}.md\:grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.md\:gap-10{gap:2.5rem}.md\:gap-12{gap:3rem}.md\:py-40{padding-top:10rem;padding-bottom:10rem}.md\:text-3xl{font-size:1.875rem;line-height:2.25rem}.md\:text-5xl{font-size:3rem;line-height:1}.md\:text-lg{font-size:1.125rem;line-height:1.75rem}.md\:text-xl{font-size:1.25rem;line-height:1.75rem}}@media (min-width: 1024px){.lg\:static{position:static}.lg\:my-10{margin-top:2.5rem;margin-bottom:2.5rem}.lg\:mb-10{margin-bottom:2.5rem}.lg\:mt-10{margin-top:2.5rem}.lg\:mt-16{margin-top:4rem}.lg\:block{display:block}.lg\:w-1\/2{width:50%}.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\:gap-20{gap:5rem}.lg\:gap-24{gap:6rem}.lg\:py-6{padding-top:1.5rem;padding-bottom:1.5rem}.lg\:pl-0{padding-left:0}.lg\:text-2xl{font-size:1.5rem;line-height:2rem}.lg\:text-3xl{font-size:1.875rem;line-height:2.25rem}.lg\:text-5xl{font-size:3rem;line-height:1}.lg\:text-\[3\.5rem\]{font-size:3.5rem}.lg\:text-xl{font-size:1.25rem;line-height:1.75rem}.lg\:leading-\[1\.28571429\]{line-height:1.28571429}.lg\:leading-\[1\.33333333\]{line-height:1.33333333}.lg\:leading-\[1\.5\]{line-height:1.5}}@media (min-width: 1280px){.xl\:mb-28{margin-bottom:7rem}.xl\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}}.\[\&_svg\]\:h-8 svg{height:2rem}.\[\&_svg\]\:w-8 svg{width:2rem}
/* =========================================================
   NEON OVERRIDE – LIGHT + DARK
   Nach deiner bestehenden CSS laden
   ========================================================= */

/* =========================================================
   LIGHT THEME DEFAULT
   Aktiv, wenn KEIN data-mode="dark" und KEINE .dark-Klasse gesetzt ist
   ========================================================= */

:root {
  --neon-cyan: #00bcd4;
  --neon-cyan-soft: rgba(0, 188, 212, 0.12);
  --neon-cyan-border: rgba(0, 188, 212, 0.28);
  --neon-cyan-strong: rgba(0, 188, 212, 0.5);

  --neon-lime: #6fbf2f;
  --neon-lime-soft: rgba(111, 191, 47, 0.14);
  --neon-lime-border: rgba(111, 191, 47, 0.35);

  --neon-bg-main: #f5fbfc;
  --neon-bg-deep: #eaf4f6;
  --neon-surface: rgba(255, 255, 255, 0.94);
  --neon-surface-2: rgba(248, 253, 254, 0.96);

  --neon-text: rgba(10, 18, 26, 0.94);
  --neon-text-soft: rgba(10, 18, 26, 0.74);
  --neon-text-muted: rgba(10, 18, 26, 0.56);

  --neon-shadow-soft: 0 0 18px rgba(0, 188, 212, 0.1);
  --neon-shadow: 0 0 26px rgba(0, 188, 212, 0.14);
  --neon-shadow-strong: 0 0 38px rgba(0, 188, 212, 0.2);
  --neon-card-shadow: 0 10px 30px rgba(5, 28, 40, 0.12);

  --background: var(--neon-bg-main);
  --foreground: var(--neon-text);
  --card: var(--neon-surface);
  --card-foreground: var(--neon-text);
  --popover: var(--neon-surface-2);
  --popover-foreground: var(--neon-text);
  --primary: var(--neon-cyan);
  --primary-foreground: #06242b;
  --secondary: var(--neon-lime);
  --secondary-foreground: #07110a;
  --accent: rgba(0, 188, 212, 0.1);
  --accent-foreground: var(--neon-text);
  --muted: rgba(0, 0, 0, 0.045);
  --muted-foreground: var(--neon-text-muted);
  --border: rgba(0, 188, 212, 0.16);
  --input: rgba(0, 0, 0, 0.06);
  --ring: rgba(0, 188, 212, 0.42);

  --ui-panel-radius: 1rem;
  --ui-panel-radius-lg: 2rem;

  --ui-panel-border-color: rgba(0, 188, 212, 0.26);
  --ui-panel-border-color-hover: rgba(0, 188, 212, 0.42);

  --ui-panel-shadow:
    0 10px 30px rgba(5, 28, 40, 0.12),
    0 0 18px rgba(0, 188, 212, 0.08);

  --ui-panel-shadow-hover:
    0 14px 38px rgba(5, 28, 40, 0.18),
    0 0 24px rgba(0, 188, 212, 0.13);

  --ui-panel-bg:
    linear-gradient(
      180deg,
      rgba(255, 255, 255, 0.96) 0%,
      rgba(240, 250, 252, 0.94) 100%
    );
}

/* =========================================================
   DARK THEME
   Aktiv bei:
   <html data-mode="dark">
   <html class="dark">
   oder Element mit .dark / [data-mode="dark"]
   ========================================================= */

.dark,
[data-mode="dark"],
html[data-mode="dark"] {
  --neon-cyan: #00eefe;
  --neon-cyan-soft: rgba(0, 238, 254, 0.12);
  --neon-cyan-border: rgba(0, 238, 254, 0.28);
  --neon-cyan-strong: rgba(0, 238, 254, 0.5);

  --neon-lime: #d0fa7d;
  --neon-lime-soft: rgba(208, 250, 125, 0.14);
  --neon-lime-border: rgba(208, 250, 125, 0.35);

  --neon-bg-main: #08111d;
  --neon-bg-deep: #050b14;
  --neon-surface: rgba(7, 13, 24, 0.92);
  --neon-surface-2: rgba(10, 17, 30, 0.96);

  --neon-text: rgba(255, 255, 255, 0.94);
  --neon-text-soft: rgba(255, 255, 255, 0.76);
  --neon-text-muted: rgba(255, 255, 255, 0.56);

  --neon-shadow-soft: 0 0 18px rgba(0, 238, 254, 0.08);
  --neon-shadow: 0 0 26px rgba(0, 238, 254, 0.12);
  --neon-shadow-strong: 0 0 38px rgba(0, 238, 254, 0.18);
  --neon-card-shadow: 0 10px 30px rgba(0, 0, 0, 0.35);

  --background: var(--neon-bg-main);
  --foreground: var(--neon-text);
  --card: var(--neon-surface);
  --card-foreground: var(--neon-text);
  --popover: var(--neon-surface-2);
  --popover-foreground: var(--neon-text);
  --primary: var(--neon-cyan);
  --primary-foreground: #031018;
  --secondary: var(--neon-lime);
  --secondary-foreground: #07110a;
  --accent: rgba(0, 238, 254, 0.1);
  --accent-foreground: var(--neon-text);
  --muted: rgba(255, 255, 255, 0.06);
  --muted-foreground: var(--neon-text-muted);
  --border: rgba(0, 238, 254, 0.16);
  --input: rgba(255, 255, 255, 0.08);
  --ring: rgba(0, 238, 254, 0.42);

  --ui-panel-border-color: rgba(0, 238, 254, 0.26);
  --ui-panel-border-color-hover: rgba(0, 238, 254, 0.42);

  --ui-panel-shadow:
    0 10px 30px rgba(0, 0, 0, 0.34),
    0 0 18px rgba(0, 238, 254, 0.07);

  --ui-panel-shadow-hover:
    0 14px 38px rgba(0, 0, 0, 0.42),
    0 0 24px rgba(0, 238, 254, 0.11);

  --ui-panel-bg:
    linear-gradient(
      180deg,
      rgba(7, 13, 24, 0.96) 0%,
      rgba(5, 10, 20, 0.93) 100%
    );
}

/* =========================================================
   GLOBAL
   ========================================================= */

html {
  color-scheme: light;
}

html[data-mode="dark"],
html.dark,
.dark {
  color-scheme: dark;
}

body {
  background:
    radial-gradient(circle at 18% 20%, var(--neon-cyan-soft), transparent 26%),
    radial-gradient(circle at 82% 24%, var(--neon-lime-soft), transparent 20%),
    radial-gradient(circle at 55% 80%, rgba(0, 180, 255, 0.05), transparent 26%),
    linear-gradient(180deg, var(--neon-bg-main) 0%, var(--neon-bg-deep) 100%) !important;
  color: var(--neon-text) !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background:
    linear-gradient(to right, transparent 0%, var(--neon-cyan-soft) 50%, transparent 100%),
    linear-gradient(to bottom, transparent 0%, var(--neon-lime-soft) 100%);
  opacity: 0.2;
  mix-blend-mode: multiply;
}

html[data-mode="dark"] body::before,
html.dark body::before,
.dark body::before,
[data-mode="dark"] body::before {
  opacity: 1;
  mix-blend-mode: screen;
}

section,
.container,
main,
header,
footer {
  position: relative;
  z-index: 1;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  color: var(--neon-text) !important;
}

p,
li,
span,
small {
  color: inherit;
}

a {
  color: inherit;
}

a:hover {
  color: var(--neon-cyan) !important;
}

/* =========================================================
   TEXT HELPERS
   ========================================================= */

.text-primary,
.text-cyan-400,
.text-cyan-500,
.text-blue-500,
.text-primary-foreground {
  color: var(--neon-cyan) !important;
}

.text-secondary,
.text-green-400,
.text-green-500,
.text-lime-500 {
  color: var(--neon-lime) !important;
}

.text-muted,
.text-muted-foreground,
.text-gray-400,
.text-gray-500,
.text-slate-600,
.text-slate-700 {
  color: var(--neon-text-muted) !important;
}

.text-white,
.text-foreground,
.text-card-foreground,
.text-popover-foreground {
  color: var(--neon-text) !important;
}

.text-gray-300,
.text-gray-400,
.text-gray-500,
.text-gray-600,
.text-slate-600,
.text-slate-700,
.text-slate-900,
.text-sidebar-foreground,
.text-sidebar-foreground\/70 {
  color: var(--neon-text-soft) !important;
}

.text-black,
.text-background {
  color: var(--primary-foreground) !important;
}

.glow-text,
.hero-title,
.section-title,
.headline {
  text-shadow:
    0 0 10px color-mix(in srgb, var(--neon-cyan) 18%, transparent),
    0 0 24px color-mix(in srgb, var(--neon-cyan) 12%, transparent);
}

/* =========================================================
   CARDS / SURFACES
   ========================================================= */

.card,
.feature-card,
.wrapper,
[data-slot="card"],
.bg-card,
.bg-popover,
.bg-background,
.bg-muted,
.bg-accent,
[class*="card"],
[class*="feature"] {
  background-color: transparent;
}

.card,
.feature-card,
.wrapper,
[data-slot="card"] {
  background: var(--ui-panel-bg) !important;
  color: var(--neon-text) !important;
  border-color: var(--neon-cyan-border) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--neon-cyan) 10%, transparent),
    var(--neon-card-shadow),
    var(--neon-shadow-soft) !important;
}

.card:hover,
.feature-card:hover,
.wrapper:hover,
[data-slot="card"]:hover {
  border-color: var(--neon-cyan-strong) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--neon-cyan) 16%, transparent),
    var(--ui-panel-shadow-hover) !important;
}

.card::before,
.feature-card::before,
.wrapper::before,
[data-slot="card"]::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at top left, var(--neon-cyan-soft), transparent 30%),
    radial-gradient(circle at bottom right, var(--neon-lime-soft), transparent 30%);
  opacity: 0.65;
}

/* =========================================================
   GENERIC BORDERS
   ========================================================= */

.border,
.border-border,
.border-input,
.border-primary\/20,
.border-primary\/30,
.border-primary\/40,
.border-white\/10,
.border-white\/20,
.border-gray-500\/30,
.border-gray-700,
.border-gray-800 {
  border-color: var(--neon-cyan-border) !important;
}

hr,
.border-t,
.border-b,
.border-l,
.border-r {
  border-color: color-mix(in srgb, var(--neon-cyan) 18%, transparent) !important;
}

table,
[data-slot="table"],
.pricing,
.pricing-card,
[class*="pricing"] {
  color: var(--neon-text);
}

table th,
table td {
  border-color: color-mix(in srgb, var(--neon-cyan) 14%, transparent) !important;
}

/* =========================================================
   BACKGROUNDS
   ========================================================= */

.bg-black,
.bg-black\/20,
.bg-black\/30,
.bg-black\/50,
.bg-black\/60,
.bg-black\/90,
.bg-background,
.bg-background\/50,
.bg-background\/80,
.bg-background\/90,
.bg-background\/95,
.bg-card,
.bg-popover,
.bg-muted,
.bg-muted\/10,
.bg-muted\/30,
.bg-muted\/50,
.bg-input,
.bg-sidebar {
  background-color: var(--card) !important;
}

/* =========================================================
   ICONS
   ========================================================= */

.icon,
.feature-icon,
.card-icon,
[class*="icon"] {
  color: var(--neon-cyan);
}

.icon,
.feature-icon,
.card-icon {
  background:
    linear-gradient(
      180deg,
      color-mix(in srgb, var(--neon-cyan) 14%, transparent),
      color-mix(in srgb, var(--neon-cyan) 6%, transparent)
    ) !important;
  border-color: color-mix(in srgb, var(--neon-cyan) 24%, transparent) !important;
  box-shadow:
    0 0 18px color-mix(in srgb, var(--neon-cyan) 14%, transparent),
    inset 0 0 12px color-mix(in srgb, var(--neon-cyan) 7%, transparent) !important;
}

/* =========================================================
   TAGS / BADGES / PILLS
   ========================================================= */

.badge,
.tag,
.pill,
[data-slot="badge"],
.rounded-full.border,
[class*="badge"],
[class*="tag"] {
  color: var(--neon-cyan) !important;
  border-color: color-mix(in srgb, var(--neon-cyan) 32%, transparent) !important;
  background: color-mix(in srgb, var(--neon-cyan) 9%, transparent) !important;
  box-shadow: inset 0 0 10px color-mix(in srgb, var(--neon-cyan) 5%, transparent);
}

.badge:hover,
.tag:hover,
.pill:hover,
[data-slot="badge"]:hover {
  border-color: color-mix(in srgb, var(--neon-cyan) 48%, transparent) !important;
  background: color-mix(in srgb, var(--neon-cyan) 13%, transparent) !important;
}

.badge-new,
.new-badge,
.neu-badge {
  background: linear-gradient(180deg, #00f5a0, #00d98b) !important;
  color: #04120d !important;
  border-color: rgba(0, 255, 170, 0.4) !important;
  box-shadow:
    0 0 18px rgba(0, 255, 170, 0.24),
    0 0 28px rgba(0, 255, 170, 0.1) !important;
}

/* =========================================================
   BUTTONS
   ========================================================= */

.button,
.btn,
.button-primary,
.bg-primary,
a[class*="button"],
button[class*="button"] {
  background:
    linear-gradient(180deg, var(--neon-lime) 0%, var(--neon-cyan) 100%) !important;
  color: var(--primary-foreground) !important;
  border-color: var(--neon-cyan-strong) !important;
  box-shadow:
    0 8px 24px color-mix(in srgb, var(--neon-cyan) 22%, transparent),
    0 0 18px color-mix(in srgb, var(--neon-cyan) 10%, transparent) !important;
}

.button:hover,
.btn:hover,
.button-primary:hover,
a[class*="button"]:hover,
button[class*="button"]:hover {
  filter: brightness(1.04);
}

.button-outline,
.btn-outline,
.border-primary,
.border-primary\/50 {
  background: color-mix(in srgb, var(--neon-cyan) 6%, transparent) !important;
  color: var(--neon-text) !important;
  border-color: color-mix(in srgb, var(--neon-cyan) 30%, transparent) !important;
  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.08),
    0 0 16px color-mix(in srgb, var(--neon-cyan) 6%, transparent) !important;
}

.button-outline:hover,
.btn-outline:hover {
  background: color-mix(in srgb, var(--neon-cyan) 10%, transparent) !important;
  border-color: color-mix(in srgb, var(--neon-cyan) 48%, transparent) !important;
}

/* =========================================================
   INPUTS / FORMS
   ========================================================= */

input,
textarea,
select {
  background: var(--input) !important;
  color: var(--neon-text) !important;
  border-color: color-mix(in srgb, var(--neon-cyan) 22%, transparent) !important;
}

input::placeholder,
textarea::placeholder {
  color: var(--neon-text-muted) !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: color-mix(in srgb, var(--neon-cyan) 48%, transparent) !important;
  box-shadow:
    0 0 0 3px color-mix(in srgb, var(--neon-cyan) 10%, transparent),
    0 0 18px color-mix(in srgb, var(--neon-cyan) 10%, transparent) !important;
}

/* =========================================================
   MENUS / DROPDOWNS / POPOVERS
   ========================================================= */

.context-menu,
.dropdown,
.menu,
[data-slot="popover-content"] {
  background: var(--ui-panel-bg) !important;
  color: var(--neon-text) !important;
  border-color: color-mix(in srgb, var(--neon-cyan) 24%, transparent) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--neon-cyan) 8%, transparent),
    0 12px 36px rgba(0, 0, 0, 0.18),
    0 0 20px color-mix(in srgb, var(--neon-cyan) 8%, transparent) !important;
}

/* =========================================================
   NEON FILLS / SPECIAL BLOCKS
   ========================================================= */

.neon-fill,
.bg-cyan-500,
.bg-cyan-500\/10,
.bg-blue-500\/10,
.bg-primary\/10,
.bg-primary\/20 {
  background-color: color-mix(in srgb, var(--neon-cyan) 12%, transparent) !important;
  color: var(--neon-cyan) !important;
}

.neon-success,
.bg-green-500\/10,
.bg-green-500\/90 {
  background-color: color-mix(in srgb, var(--neon-lime) 15%, transparent) !important;
  color: var(--neon-lime) !important;
}

/* =========================================================
   SMALL CARDS
   ========================================================= */

.software-card,
.tool-card,
.feature-box,
.mini-card {
  background: var(--ui-panel-bg) !important;
  border-color: color-mix(in srgb, var(--neon-cyan) 22%, transparent) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--neon-cyan) 6%, transparent),
    0 8px 22px rgba(0, 0, 0, 0.08),
    0 0 16px color-mix(in srgb, var(--neon-cyan) 7%, transparent) !important;
}

/* =========================================================
   FOOTER
   ========================================================= */

footer,
.footer {
  background: var(--ui-panel-bg) !important;
  color: var(--neon-text-soft) !important;
  border-top: 1px solid color-mix(in srgb, var(--neon-cyan) 18%, transparent) !important;
}

footer.wrapper {
  margin-top: 3rem;
  border-radius: 2rem !important;
  border: 1px solid color-mix(in srgb, var(--neon-cyan) 24%, transparent) !important;
  background: var(--ui-panel-bg) !important;
  box-shadow:
    0 0 0 1px color-mix(in srgb, var(--neon-cyan) 8%, transparent),
    var(--ui-panel-shadow) !important;
  overflow: hidden;
  position: relative;
}

footer.wrapper::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at top left, var(--neon-cyan-soft), transparent 28%),
    radial-gradient(circle at bottom right, var(--neon-lime-soft), transparent 24%);
  opacity: 0.85;
}

footer.wrapper > div {
  background: transparent !important;
  padding: 3rem !important;
  position: relative;
  z-index: 1;
}

footer .bg-contrast-secondary {
  background: transparent !important;
}

footer img {
  display: block;
  max-width: 140px;
  height: auto;
}

footer address {
  color: var(--neon-text-soft);
  font-style: normal;
  line-height: 1.7;
}

footer nav a {
  color: var(--neon-text);
  text-decoration: none;
  transition:
    color 0.18s ease,
    text-shadow 0.18s ease,
    opacity 0.18s ease;
}

footer nav a:hover {
  color: var(--neon-cyan) !important;
  text-shadow: 0 0 14px color-mix(in srgb, var(--neon-cyan) 24%, transparent);
}

footer .text-secondary {
  color: var(--neon-lime) !important;
}

footer .text-sm {
  line-height: 1.6;
}

footer strong {
  color: inherit;
  font-weight: 700;
}

footer .mt-12 {
  margin-top: 2.75rem !important;
  padding-top: 1.25rem;
  border-top: 1px solid color-mix(in srgb, var(--neon-cyan) 14%, transparent);
}

footer ul:empty {
  display: none;
}

/* =========================================================
   UNIFY CARD BORDERS
   Einheitliche Randstärke und Glow
   ========================================================= */

.card,
.feature-card,
.wrapper,
[data-slot="card"],
.software-card,
.tool-card,
.feature-box,
.mini-card,
.pricing-card,
[class*="pricing"],
.faq-item,
[data-slot="popover-content"],
.context-menu,
.dropdown,
.menu {
  border-width: 5px !important;
  border-style: solid !important;
  border-color: var(--ui-panel-border-color) !important;
  box-shadow: var(--ui-panel-shadow) !important;
  background: var(--ui-panel-bg) !important;
}

.card::after,
.feature-card::after,
.wrapper::after,
[data-slot="card"]::after,
.software-card::after,
.tool-card::after,
.feature-box::after,
.mini-card::after,
.pricing-card::after,
[class*="pricing"]::after {
  content: none !important;
}

.card:hover,
.feature-card:hover,
.wrapper:hover,
[data-slot="card"]:hover,
.software-card:hover,
.tool-card:hover,
.feature-box:hover,
.mini-card:hover,
.pricing-card:hover,
[class*="pricing"]:hover {
  border-color: var(--ui-panel-border-color-hover) !important;
  box-shadow: var(--ui-panel-shadow-hover) !important;
}

.card,
.feature-card,
[data-slot="card"],
.software-card,
.tool-card,
.feature-box,
.mini-card,
.pricing-card,
[class*="pricing"],
.faq-item,
[data-slot="popover-content"],
.context-menu,
.dropdown,
.menu {
  border-radius: var(--ui-panel-radius) !important;
  overflow: hidden;
}

.wrapper {
  border-radius: var(--ui-panel-radius) !important;
}

footer.wrapper {
  border-radius: var(--ui-panel-radius-lg) !important;
  border-width: 5px !important;
  border-style: solid !important;
  border-color: var(--ui-panel-border-color) !important;
  box-shadow: var(--ui-panel-shadow) !important;
}

footer.wrapper:hover {
  border-color: var(--ui-panel-border-color-hover) !important;
  box-shadow: var(--ui-panel-shadow-hover) !important;
}

.card,
.feature-card,
.wrapper,
[data-slot="card"],
.software-card,
.tool-card,
.feature-box,
.mini-card,
.pricing-card,
[class*="pricing"] {
  outline: none !important;
}

.border,
.border-border,
.border-input,
.border-primary\/20,
.border-primary\/30,
.border-primary\/40,
.border-primary\/50,
.border-white\/10,
.border-white\/20,
.border-gray-500\/30,
.border-gray-700,
.border-gray-800,
.border-t,
.border-b,
.border-l,
.border-r {
  border-color: var(--ui-panel-border-color) !important;
}

.bg-card,
.bg-popover,
.bg-background,
.bg-muted,
.bg-accent,
.bg-sidebar {
  border-color: var(--ui-panel-border-color) !important;
}

.pricing-card,
[class*="pricing"] {
  box-shadow: var(--ui-panel-shadow) !important;
  border: 1px solid var(--ui-panel-border-color) !important;
}

.faq-item,
details,
summary + * {
  border-color: var(--ui-panel-border-color) !important;
}

/* =========================================================
   HOVER HELPERS
   ========================================================= */

.hover\:text-primary:hover,
.hover\:text-foreground:hover {
  color: var(--neon-cyan) !important;
}

.hover\:bg-primary\/20:hover,
.hover\:bg-accent:hover,
.hover\:bg-accent\/50:hover,
.hover\:bg-muted:hover,
.hover\:bg-muted\/50:hover,
.hover\:bg-white\/10:hover,
.hover\:bg-white\/20:hover {
  background-color: color-mix(in srgb, var(--neon-cyan) 10%, transparent) !important;
}

.hover\:border-primary:hover,
.hover\:border-primary\/30:hover,
.hover\:border-primary\/50:hover {
  border-color: color-mix(in srgb, var(--neon-cyan) 48%, transparent) !important;
}

/* =========================================================
   DARK MODE SPECIFIC FIXES
   ========================================================= */

html[data-mode="dark"] .bg-black,
html[data-mode="dark"] .bg-black\/20,
html[data-mode="dark"] .bg-black\/30,
html[data-mode="dark"] .bg-black\/50,
html[data-mode="dark"] .bg-black\/60,
html[data-mode="dark"] .bg-black\/90,
html[data-mode="dark"] .bg-background,
html[data-mode="dark"] .bg-background\/50,
html[data-mode="dark"] .bg-background\/80,
html[data-mode="dark"] .bg-background\/90,
html[data-mode="dark"] .bg-background\/95,
html[data-mode="dark"] .bg-card,
html[data-mode="dark"] .bg-popover,
html[data-mode="dark"] .bg-muted,
html[data-mode="dark"] .bg-muted\/10,
html[data-mode="dark"] .bg-muted\/30,
html[data-mode="dark"] .bg-muted\/50,
html[data-mode="dark"] .bg-input,
html[data-mode="dark"] .bg-sidebar,
html.dark .bg-black,
html.dark .bg-black\/20,
html.dark .bg-black\/30,
html.dark .bg-black\/50,
html.dark .bg-black\/60,
html.dark .bg-black\/90,
html.dark .bg-background,
html.dark .bg-background\/50,
html.dark .bg-background\/80,
html.dark .bg-background\/90,
html.dark .bg-background\/95,
html.dark .bg-card,
html.dark .bg-popover,
html.dark .bg-muted,
html.dark .bg-muted\/10,
html.dark .bg-muted\/30,
html.dark .bg-muted\/50,
html.dark .bg-input,
html.dark .bg-sidebar {
  background-color: rgba(7, 13, 24, 0.9) !important;
}

/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 767px) {
  :root {
    --ui-panel-radius: 0.9rem;
    --ui-panel-radius-lg: 1.5rem;
  }

  footer.wrapper {
    border-radius: 1.5rem !important;
  }

  footer.wrapper > div {
    padding: 1.5rem !important;
  }

  footer nav {
    gap: 2.5rem !important;
  }

  footer .mt-12 {
    margin-top: 2rem !important;
    padding-top: 1rem;
  }

  footer .text-right {
    text-align: left !important;
  }
}