/*! tailwindcss v4.1.7 | MIT License | https://tailwindcss.com */
@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,:before,:after,::backdrop{--tw-translate-x:0;--tw-translate-y:0;--tw-translate-z:0;--tw-rotate-x:initial;--tw-rotate-y:initial;--tw-rotate-z:initial;--tw-skew-x:initial;--tw-skew-y:initial;--tw-font-weight:initial;--tw-shadow:0 0 #0000;--tw-shadow-color:initial;--tw-shadow-alpha:100%;--tw-inset-shadow:0 0 #0000;--tw-inset-shadow-color:initial;--tw-inset-shadow-alpha:100%;--tw-ring-color:initial;--tw-ring-shadow:0 0 #0000;--tw-inset-ring-color:initial;--tw-inset-ring-shadow:0 0 #0000;--tw-ring-inset:initial;--tw-ring-offset-width:0px;--tw-ring-offset-color:#fff;--tw-ring-offset-shadow:0 0 #0000;--tw-duration:initial;--tw-ease:initial;--tw-outline-style:solid;--tw-scale-x:1;--tw-scale-y:1;--tw-scale-z:1}}}@layer theme{:root,:host{--font-sans:InterVariable,system-ui,sans-serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace;--color-green-100:oklch(96.2% .044 156.743);--color-green-600:oklch(62.7% .194 149.214);--color-indigo-500:oklch(58.5% .233 277.117);--color-indigo-600:oklch(51.1% .262 276.966);--color-gray-50:oklch(98.5% .002 247.839);--color-gray-300:oklch(87.2% .01 258.338);--color-gray-500:oklch(55.1% .027 264.364);--color-gray-900:oklch(21% .034 264.665);--color-white:#fff;--spacing:.25rem;--container-lg:32rem;--text-sm:.875rem;--text-sm--line-height:calc(1.25/.875);--text-base:1rem;--text-base--line-height:calc(1.5/1);--font-weight-semibold:600;--radius-md:.375rem;--radius-lg:.5rem;--ease-in:cubic-bezier(.4,0,1,1);--ease-out:cubic-bezier(0,0,.2,1);--default-transition-duration:.15s;--default-transition-timing-function:cubic-bezier(.4,0,.2,1);--default-font-family:var(--font-sans);--default-font-feature-settings:var(--font-sans--font-feature-settings);--default-mono-font-family:var(--font-mono);--font-sans--font-feature-settings:"cv02","cv03","cv04","cv11"}}@layer base{*,:after,:before,::backdrop{box-sizing:border-box;border:0 solid;margin:0;padding:0}::file-selector-button{box-sizing:border-box;border:0 solid;margin:0;padding:0}html,:host{-webkit-text-size-adjust:100%;tab-size:4;line-height:1.5;font-family:var(--default-font-family,ui-sans-serif,system-ui,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji");font-feature-settings:var(--default-font-feature-settings,normal);font-variation-settings:var(--default-font-variation-settings,normal);-webkit-tap-highlight-color:transparent}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;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;-webkit-text-decoration:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:var(--default-mono-font-family,ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace);font-feature-settings:var(--default-mono-font-feature-settings,normal);font-variation-settings:var(--default-mono-font-variation-settings,normal);font-size:1em}small{font-size:80%}sub,sup{vertical-align:baseline;font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}:-moz-focusring{outline:auto}progress{vertical-align:baseline}summary{display:list-item}ol,ul,menu{list-style:none}img,svg,video,canvas,audio,iframe,embed,object{vertical-align:middle;display:block}img,video{max-width:100%;height:auto}button,input,select,optgroup,textarea{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}::file-selector-button{font:inherit;font-feature-settings:inherit;font-variation-settings:inherit;letter-spacing:inherit;color:inherit;opacity:1;background-color:#0000;border-radius:0}:where(select:is([multiple],[size])) optgroup{font-weight:bolder}:where(select:is([multiple],[size])) optgroup option{padding-inline-start:20px}::file-selector-button{margin-inline-end:4px}::placeholder{opacity:1}@supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px){::placeholder{color:currentColor}@supports (color:color-mix(in lab, red, red)){::placeholder{color:color-mix(in oklab,currentcolor 50%,transparent)}}}textarea{resize:vertical}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-date-and-time-value{min-height:1lh;text-align:inherit}::-webkit-datetime-edit{display:inline-flex}::-webkit-datetime-edit-fields-wrapper{padding:0}::-webkit-datetime-edit{padding-block:0}::-webkit-datetime-edit-year-field{padding-block:0}::-webkit-datetime-edit-month-field{padding-block:0}::-webkit-datetime-edit-day-field{padding-block:0}::-webkit-datetime-edit-hour-field{padding-block:0}::-webkit-datetime-edit-minute-field{padding-block:0}::-webkit-datetime-edit-second-field{padding-block:0}::-webkit-datetime-edit-millisecond-field{padding-block:0}::-webkit-datetime-edit-meridiem-field{padding-block:0}:-moz-ui-invalid{box-shadow:none}button,input:where([type=button],[type=reset],[type=submit]){appearance:button}::file-selector-button{appearance:button}::-webkit-inner-spin-button{height:auto}::-webkit-outer-spin-button{height:auto}[hidden]:where(:not([hidden=until-found])){display:none!important}}@layer components;@layer utilities{.fixed{position:fixed}.relative{position:relative}.inset-0{inset:calc(var(--spacing)*0)}.z-10{z-index:10}.mx-auto{margin-inline:auto}.mt-2{margin-top:calc(var(--spacing)*2)}.mt-3{margin-top:calc(var(--spacing)*3)}.mt-5{margin-top:calc(var(--spacing)*5)}.flex{display:flex}.inline-flex{display:inline-flex}.size-6{width:calc(var(--spacing)*6);height:calc(var(--spacing)*6)}.size-12{width:calc(var(--spacing)*12);height:calc(var(--spacing)*12)}.min-h-full{min-height:100%}.w-full{width:100%}.w-screen{width:100vw}.translate-y-0{--tw-translate-y:calc(var(--spacing)*0);translate:var(--tw-translate-x)var(--tw-translate-y)}.translate-y-4{--tw-translate-y:calc(var(--spacing)*4);translate:var(--tw-translate-x)var(--tw-translate-y)}.transform{transform:var(--tw-rotate-x,)var(--tw-rotate-y,)var(--tw-rotate-z,)var(--tw-skew-x,)var(--tw-skew-y,)}.items-center{align-items:center}.items-end{align-items:flex-end}.justify-center{justify-content:center}.overflow-hidden{overflow:hidden}.overflow-y-auto{overflow-y:auto}.rounded-full{border-radius:3.40282e38px}.rounded-lg{border-radius:var(--radius-lg)}.rounded-md{border-radius:var(--radius-md)}.bg-gray-300{background-color:var(--color-gray-300)}.bg-gray-500\/75{background-color:#6a7282bf}@supports (color:color-mix(in lab, red, red)){.bg-gray-500\/75{background-color:color-mix(in oklab,var(--color-gray-500)75%,transparent)}}.bg-green-100{background-color:var(--color-green-100)}.bg-indigo-600{background-color:var(--color-indigo-600)}.bg-white{background-color:var(--color-white)}.p-4{padding:calc(var(--spacing)*4)}.px-3{padding-inline:calc(var(--spacing)*3)}.px-4{padding-inline:calc(var(--spacing)*4)}.py-2{padding-block:calc(var(--spacing)*2)}.pt-5{padding-top:calc(var(--spacing)*5)}.pb-4{padding-bottom:calc(var(--spacing)*4)}.text-center{text-align:center}.text-left{text-align:left}.text-base{font-size:var(--text-base);line-height:var(--tw-leading,var(--text-base--line-height))}.text-sm{font-size:var(--text-sm);line-height:var(--tw-leading,var(--text-sm--line-height))}.font-semibold{--tw-font-weight:var(--font-weight-semibold);font-weight:var(--font-weight-semibold)}.text-gray-500{color:var(--color-gray-500)}.text-gray-900{color:var(--color-gray-900)}.text-green-600{color:var(--color-green-600)}.text-white{color:var(--color-white)}.opacity-0{opacity:0}.opacity-100{opacity:1}.shadow-xl{--tw-shadow:0 20px 25px -5px var(--tw-shadow-color,#0000001a),0 8px 10px -6px var(--tw-shadow-color,#0000001a);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.shadow-xs{--tw-shadow:0 1px 2px 0 var(--tw-shadow-color,#0000000d);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-1{--tw-ring-shadow:var(--tw-ring-inset,)0 0 0 calc(1px + var(--tw-ring-offset-width))var(--tw-ring-color,currentcolor);box-shadow:var(--tw-inset-shadow),var(--tw-inset-ring-shadow),var(--tw-ring-offset-shadow),var(--tw-ring-shadow),var(--tw-shadow)}.ring-gray-300{--tw-ring-color:var(--color-gray-300)}.transition{transition-property:color,background-color,border-color,outline-color,text-decoration-color,fill,stroke,--tw-gradient-from,--tw-gradient-via,--tw-gradient-to,opacity,box-shadow,transform,translate,scale,rotate,filter,-webkit-backdrop-filter,backdrop-filter,display,visibility,content-visibility,overlay,pointer-events;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-all{transition-property:all;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.transition-opacity{transition-property:opacity;transition-timing-function:var(--tw-ease,var(--default-transition-timing-function));transition-duration:var(--tw-duration,var(--default-transition-duration))}.duration-200{--tw-duration:.2s;transition-duration:.2s}.duration-300{--tw-duration:.3s;transition-duration:.3s}.ease-in{--tw-ease:var(--ease-in);transition-timing-function:var(--ease-in)}.ease-out{--tw-ease:var(--ease-out);transition-timing-function:var(--ease-out)}.ring-inset{--tw-ring-inset:inset}@media (hover:hover) {
    .hover\:bg-gray-50:hover {
        background-color: var(--color-gray-50)
    }

    .hover\:bg-indigo-…

    /*! tailwindcss v4.1.8 | MIT License | https://tailwindcss.com */
    @layer properties {
        @supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))) {
            *, :before, :after, ::backdrop {
                --tw-space-y-reverse: 0;
                --tw-border-style: solid;
                --tw-font-weight: initial;
                --tw-shadow: 0 0 #0000;
                --tw-shadow-color: initial;
                --tw-shadow-alpha: 100%;
                --tw-inset-shadow: 0 0 #0000;
                --tw-inset-shadow-color: initial;
                --tw-inset-shadow-alpha: 100%;
                --tw-ring-color: initial;
                --tw-ring-shadow: 0 0 #0000;
                --tw-inset-ring-color: initial;
                --tw-inset-ring-shadow: 0 0 #0000;
                --tw-ring-inset: initial;
                --tw-ring-offset-width: 0px;
                --tw-ring-offset-color: #fff;
                --tw-ring-offset-shadow: 0 0 #0000;
                --tw-outline-style: solid;
                --tw-content: ""
            }
        }
    }@layer theme {
        :root, :host {
            --font-sans: InterVariable, system-ui, sans-serif;
            --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
            --color-indigo-500: oklch(58.5% .233 277.117);
            --color-indigo-600: oklch(51.1% .262 276.966);
            --color-gray-50: oklch(98.5% .002 247.839);
            --color-gray-100: oklch(96.7% .003 264.542);
            --color-gray-300: oklch(87.2% .01 258.338);
            --color-gray-400: oklch(70.7% .022 261.325);
            --color-gray-500: oklch(55.1% .027 264.364);
            --color-gray-600: oklch(44.6% .03 256.802);
            --color-gray-900: oklch(21% .034 264.665);
            --color-gray-950: oklch(13% .028 261.692);
            --color-white: #fff;
            --spacing: .25rem;
            --container-2xl: 42rem;
            --container-7xl: 80rem;
            --text-xs: .75rem;
            --text-sm: .875rem;
            --text-sm--line-height: calc(1.25 / .875);
            --text-base: 1rem;
            --text-base--line-height: calc(1.5 / 1);
            --font-weight-medium: 500;
            --font-weight-semibold: 600;
            --radius-sm: .25rem;
            --radius-md: .375rem;
            --radius-lg: .5rem;
            --default-font-family: var(--font-sans);
            --default-font-feature-settings: var(--font-sans--font-feature-settings);
            --default-mono-font-family: var(--font-mono);
            --font-sans--font-feature-settings: "cv02", "cv03", "cv04", "cv11"
        }
    }@layer base {
        *, :after, :before, ::backdrop {
            box-sizing: border-box;
            border: 0 solid;
            margin: 0;
            padding: 0
        }

        ::file-selector-button {
            box-sizing: border-box;
            border: 0 solid;
            margin: 0;
            padding: 0
        }

        html, :host {
            -webkit-text-size-adjust: 100%;
            tab-size: 4;
            line-height: 1.5;
            font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji");
            font-feature-settings: var(--default-font-feature-settings, normal);
            font-variation-settings: var(--default-font-variation-settings, normal);
            -webkit-tap-highlight-color: transparent
        }

        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;
            -webkit-text-decoration: inherit;
            -webkit-text-decoration: inherit;
            -webkit-text-decoration: inherit;
            text-decoration: inherit
        }

        b, strong {
            font-weight: bolder
        }

        code, kbd, samp, pre {
            font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace);
            font-feature-settings: var(--default-mono-font-feature-settings, normal);
            font-variation-settings: var(--default-mono-font-variation-settings, normal);
            font-size: 1em
        }

        small {
            font-size: 80%
        }

        sub, sup {
            vertical-align: baseline;
            font-size: 75%;
            line-height: 0;
            position: relative
        }

        sub {
            bottom: -.25em
        }

        sup {
            top: -.5em
        }

        table {
            text-indent: 0;
            border-color: inherit;
            border-collapse: collapse
        }

        :-moz-focusring {
            outline: auto
        }

        progress {
            vertical-align: baseline
        }

        summary {
            display: list-item
        }

        ol, ul, menu {
            list-style: none
        }

        img, svg, video, canvas, audio, iframe, embed, object {
            vertical-align: middle;
            display: block
        }

        img, video {
            max-width: 100%;
            height: auto
        }

        button, input, select, optgroup, textarea {
            font: inherit;
            font-feature-settings: inherit;
            font-variation-settings: inherit;
            letter-spacing: inherit;
            color: inherit;
            opacity: 1;
            background-color: #0000;
            border-radius: 0
        }

        ::file-selector-button {
            font: inherit;
            font-feature-settings: inherit;
            font-variation-settings: inherit;
            letter-spacing: inherit;
            color: inherit;
            opacity: 1;
            background-color: #0000;
            border-radius: 0
        }

        :where(select:is([multiple],[size])) optgroup {
            font-weight: bolder
        }

        :where(select:is([multiple],[size])) optgroup option {
            padding-inline-start: 20px
        }

        ::file-selector-button {
            margin-inline-end: 4px
        }

        ::placeholder {
            opacity: 1
        }

        @supports (not ((-webkit-appearance:-apple-pay-button))) or (contain-intrinsic-size:1px) {
            ::placeholder {
                color: currentColor
            }

            @supports (color:color-mix(in lab, red, red)) {
                ::placeholder {
                    color: color-mix(in oklab, currentcolor 50%, transparent)
                }
            }
        }textarea {
             resize: vertical
         }

        ::-webkit-search-decoration {
            -webkit-appearance: none
        }

        ::-webkit-date-and-time-value {
            min-height: 1lh;
            text-align: inherit
        }

        ::-webkit-datetime-edit {
            display: inline-flex
        }

        ::-webkit-datetime-edit-fields-wrapper {
            padding: 0
        }

        ::-webkit-datetime-edit {
            padding-block: 0
        }

        ::-webkit-datetime-edit-year-field {
            padding-block: 0
        }

        ::-webkit-datetime-edit-month-field {
            padding-block: 0
        }

        ::-webkit-datetime-edit-day-field {
            padding-block: 0
        }

        ::-webkit-datetime-edit-hour-field {
            padding-block: 0
        }

        ::-webkit-datetime-edit-minute-field {
            padding-block: 0
        }

        ::-webkit-datetime-edit-second-field {
            padding-block: 0
        }

        ::-webkit-datetime-edit-millisecond-field {
            padding-block: 0
        }

        ::-webkit-datetime-edit-meridiem-field {
            padding-block: 0
        }

        :-moz-ui-invalid {
            box-shadow: none
        }

        button, input:where([type=button],[type=reset],[type=submit]) {
            appearance: button
        }

        ::file-selector-button {
            appearance: button
        }

        ::-webkit-inner-spin-button {
            height: auto
        }

        ::-webkit-outer-spin-button {
            height: auto
        }

        [hidden]:where(:not([hidden=until-found])) {
            display: none !important
        }
    }@layer components;@layer utilities {
        .pointer-events-none {
            pointer-events: none
        }

        .sr-only {
            clip: rect(0, 0, 0, 0);
            white-space: nowrap;
            border-width: 0;
            width: 1px;
            height: 1px;
            margin: -1px;
            padding: 0;
            position: absolute;
            overflow: hidden
        }

        .relative {
            position: relative
        }

        .col-span-full {
            grid-column: 1/-1
        }

        .col-start-1 {
            grid-column-start: 1
        }

        .row-start-1 {
            grid-row-start: 1
        }

        .mx-auto {
            margin-inline: auto
        }

        .mt-1 {
            margin-top: calc(var(--spacing) * 1)
        }

        .mt-2 {
            margin-top: calc(var(--spacing) * 2)
        }

        .mt-3 {
            margin-top: calc(var(--spacing) * 3)
        }

        .mt-4 {
            margin-top: calc(var(--spacing) * 4)
        }

        .mt-6 {
            margin-top: calc(var(--spacing) * 6)
        }

        .mt-10 {
            margin-top: calc(var(--spacing) * 10)
        }

        .mr-2 {
            margin-right: calc(var(--spacing) * 2)
        }

        .block {
            display: block
        }

        .flex {
            display: flex
        }

        .grid {
            display: grid
        }

        .size-3\.5 {
            width: calc(var(--spacing) * 3.5);
            height: calc(var(--spacing) * 3.5)
        }

        .size-4 {
            width: calc(var(--spacing) * 4);
            height: calc(var(--spacing) * 4)
        }

        .size-5 {
            width: calc(var(--spacing) * 5);
            height: calc(var(--spacing) * 5)
        }

        .size-12 {
            width: calc(var(--spacing) * 12);
            height: calc(var(--spacing) * 12)
        }

        .h-6 {
            height: calc(var(--spacing) * 6)
        }

        .w-full {
            width: 100%
        }

        .max-w-2xl {
            max-width: var(--container-2xl)
        }

        .max-w-7xl {
            max-width: var(--container-7xl)
        }

        .min-w-0 {
            min-width: calc(var(--spacing) * 0)
        }

        .shrink-0 {
            flex-shrink: 0
        }

        .grow {
            flex-grow: 1
        }

        .cursor-pointer {
            cursor: pointer
        }

        .appearance-none {
            appearance: none
        }

        .grid-cols-1 {
            grid-template-columns:repeat(1, minmax(0, 1fr))
        }

        .items-center {
            align-items: center
        }

        .justify-center {
            justify-content: center
        }

        .justify-end {
            justify-content: flex-end
        }

        .gap-3 {
            gap: calc(var(--spacing) * 3)
        }

        :where(.space-y-6>:not(:last-child)) {
            --tw-space-y-reverse: 0;
            margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));
            margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)))
        }

        :where(.space-y-10>:not(:last-child)) {
            --tw-space-y-reverse: 0;
            margin-block-start: calc(calc(var(--spacing) * 10) * var(--tw-space-y-reverse));
            margin-block-end: calc(calc(var(--spacing) * 10) * calc(1 - var(--tw-space-y-reverse)))
        }

        :where(.space-y-12>:not(:last-child)) {
            --tw-space-y-reverse: 0;
            margin-block-start: calc(calc(var(--spacing) * 12) * var(--tw-space-y-reverse));
            margin-block-end: calc(calc(var(--spacing) * 12) * calc(1 - var(--tw-space-y-reverse)))
        }

        .gap-x-3 {
            column-gap: calc(var(--spacing) * 3)
        }

        .gap-x-6 {
            column-gap: calc(var(--spacing) * 6)
        }

        .gap-y-8 {
            row-gap: calc(var(--spacing) * 8)
        }

        .self-center {
            align-self: center
        }

        .justify-self-center {
            justify-self: center
        }

        .justify-self-end {
            justify-self: flex-end
        }

        .rounded-full {
            border-radius: 3.40282e38px
        }

        .rounded-lg {
            border-radius: var(--radius-lg)
        }

        .rounded-md {
            border-radius: var(--radius-md)
        }

        .rounded-sm {
            border-radius: var(--radius-sm)
        }

        .border {
            border-style: var(--tw-border-style);
            border-width: 1px
        }

        .border-b {
            border-bottom-style: var(--tw-border-style);
            border-bottom-width: 1px
        }

        .border-dashed {
            --tw-border-style: dashed;
            border-style: dashed
        }

        .border-gray-300 {
            border-color: var(--color-gray-300)
        }

        .border-gray-900\/10 {
            border-color: #1018281a
        }

        @supports (color:color-mix(in lab, red, red)) {
            .border-gray-900\/10 {
                border-color: color-mix(in oklab, var(--color-gray-900) 10%, transparent)
            }
        }.border-gray-900\/25 {
             border-color: #10182840
         }

        @supports (color:color-mix(in lab, red, red)) {
            .border-gray-900\/25 {
                border-color: color-mix(in oklab, var(--color-gray-900) 25%, transparent)
            }
        }.bg-indigo-600 {
             background-color: var(--color-indigo-600)
         }

        .bg-white {
            background-color: var(--color-white)
        }

        .stroke-white {
            stroke: var(--color-white)
        }

        .px-2\.5 {
            padding-inline: calc(var(--spacing) * 2.5)
        }

        .px-3 {
            padding-inline: calc(var(--spacing) * 3)
        }

        .px-4 {
            padding-inline: calc(var(--spacing) * 4)
        }

        .px-6 {
            padding-inline: calc(var(--spacing) * 6)
        }

        .py-1\.5 {
            padding-block: calc(var(--spacing) * 1.5)
        }

        .py-2 {
            padding-block: calc(var(--spacing) * 2)
        }

        .py-10 {
            padding-block: calc(var(--spacing) * 10)
        }

        .py-24 {
            padding-block: calc(var(--spacing) * 24)
        }

        .pr-3 {
            padding-right: calc(var(--spacing) * 3)
        }

        .pr-8 {
            padding-right: calc(var(--spacing) * 8)
        }

        .pb-12 {
            padding-bottom: calc(var(--spacing) * 12)
        }

        .pl-1 {
            padding-left: calc(var(--spacing) * 1)
        }

        .pl-3 {
            padding-left: calc(var(--spacing) * 3)
        }

        .text-center {
            text-align: center
        }

        .text-base {
            font-size: var(--text-base);
            line-height: var(--tw-leading, var(--text-base--line-height))
        }

        .text-base\/7 {
            font-size: var(--text-base);
            line-height: calc(var(--spacing) * 7)
        }

        .text-sm {
            font-size: var(--text-sm);
            line-height: var(--tw-leading, var(--text-sm--line-height))
        }

        .text-sm\/6 {
            font-size: var(--text-sm);
            line-height: calc(var(--spacing) * 6)
        }

        .text-xs\/5 {
            font-size: var(--text-xs);
            line-height: calc(var(--spacing) * 5)
        }

        .font-medium {
            --tw-font-weight: var(--font-weight-medium);
            font-weight: var(--font-weight-medium)
        }

        .font-semibold {
            --tw-font-weight: var(--font-weight-semibold);
            font-weight: var(--font-weight-semibold)
        }

        .text-gray-300 {
            color: var(--color-gray-300)
        }

        .text-gray-500 {
            color: var(--color-gray-500)
        }

        .text-gray-600 {
            color: var(--color-gray-600)
        }

        .text-gray-900 {
            color: var(--color-gray-900)
        }

        .text-indigo-600 {
            color: var(--color-indigo-600)
        }

        .text-white {
            color: var(--color-white)
        }

        .opacity-0 {
            opacity: 0
        }

        .shadow-xs {
            --tw-shadow: 0 1px 2px 0 var(--tw-shadow-color, #0000000d);
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .ring-1 {
            --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .ring-gray-300 {
            --tw-ring-color: var(--color-gray-300)
        }

        .outline-1 {
            outline-style: var(--tw-outline-style);
            outline-width: 1px
        }

        .-outline-offset-1 {
            outline-offset: calc(1px * -1)
        }

        .outline-gray-300 {
            outline-color: var(--color-gray-300)
        }

        .select-none {
            -webkit-user-select: none;
            user-select: none
        }

        .ring-inset {
            --tw-ring-inset: inset
        }

        .group-has-checked\:opacity-100:is(:where(.group):has(:checked) *), .group-has-indeterminate\:opacity-100:is(:where(.group):has(:indeterminate) *) {
            opacity: 1
        }

        .group-has-disabled\:stroke-gray-950\/25:is(:where(.group):has(:disabled) *) {
            stroke: #03071240
        }

        @supports (color:color-mix(in lab, red, red)) {
            .group-has-disabled\:stroke-gray-950\/25:is(:where(.group):has(:disabled) *) {
                stroke: color-mix(in oklab, var(--color-gray-950) 25%, transparent)
            }
        }.placeholder\:text-gray-400::placeholder {
             color: var(--color-gray-400)
         }

        .before\:absolute:before {
            content: var(--tw-content);
            position: absolute
        }

        .before\:inset-1:before {
            content: var(--tw-content);
            inset: calc(var(--spacing) * 1)
        }

        .before\:rounded-full:before {
            content: var(--tw-content);
            border-radius: 3.40282e38px
        }

        .before\:bg-white:before {
            content: var(--tw-content);
            background-color: var(--color-white)
        }

        .not-checked\:before\:hidden:not(:checked):before {
            content: var(--tw-content);
            display: none
        }

        .checked\:border-indigo-600:checked {
            border-color: var(--color-indigo-600)
        }

        .checked\:bg-indigo-600:checked {
            background-color: var(--color-indigo-600)
        }

        .indeterminate\:border-indigo-600:indeterminate {
            border-color: var(--color-indigo-600)
        }

        .indeterminate\:bg-indigo-600:indeterminate {
            background-color: var(--color-indigo-600)
        }

        .focus-within\:ring-2:focus-within {
            --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
            box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow)
        }

        .focus-within\:ring-indigo-600:focus-within {
            --tw-ring-color: var(--color-indigo-600)
        }

        .focus-within\:ring-offset-2:focus-within {
            --tw-ring-offset-width: 2px;
            --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color)
        }

        .focus-within\:outline-hidden:focus-within {
            --tw-outline-style: none;
            outline-style: none
        }

        @media (forced-colors: active) {
            .focus-within\:outline-hidden:focus-within {
                outline-offset: 2px;
                outline: 2px solid #0000
            }
        }.focus-within\:outline-2:focus-within {
             outline-style: var(--tw-outline-style);
             outline-width: 2px
         }

        .focus-within\:-outline-offset-2:focus-within {
            outline-offset: calc(2px * -1)
        }

        .focus-within\:outline-indigo-600:focus-within {
            outline-color: var(--color-indigo-600)
        }

        @media (hover: hover) {
            .hover\:bg-gray-50:hover {
                background-color: var(--color-gray-50)
            }

            .hover\:bg-indigo-500:hover {
                background-color: var(--color-indigo-500)
            }

            .hover\:text-indigo-500:hover {
                color: var(--color-indigo-500)
            }
        }.focus\:outline-2:focus {
             outline-style: var(--tw-outline-style);
             outline-width: 2px
         }

        .focus\:-outline-offset-2:focus {
            outline-offset: calc(2px * -1)
        }

        .focus\:outline-indigo-600:focus {
            outline-color: var(--color-indigo-600)
        }

        .focus\:outline-none:focus {
            --tw-outline-style: none;
            outline-style: none
        }

        .focus-visible\:outline-2:focus-visible {
            outline-style: var(--tw-outline-style);
            outline-width: 2px
        }

        .focus-visible\:outline-offset-2:focus-visible {
            outline-offset: 2px
        }

        .focus-visible\:outline-indigo-600:focus-visible {
            outline-color: var(--color-indigo-600)
        }

        .disabled\:border-gray-300:disabled {
            border-color: var(--color-gray-300)
        }

        .disabled\:bg-gray-100:disabled {
            background-color: var(--color-gray-100)
        }

        .disabled\:before\:bg-gray-400:disabled:before {
            content: var(--tw-content);
            background-color: var(--color-gray-400)
        }

        .disabled\:checked\:bg-gray-100:disabled:checked {
            background-color: var(--color-gray-100)
        }

        @media (min-width: 40rem) {
            .sm\:col-span-2 {
                grid-column: span 2/span 2
            }

            .sm\:col-span-3 {
                grid-column: span 3/span 3
            }

            .sm\:col-span-4 {
                grid-column: span 4/span 4
            }

            .sm\:col-start-1 {
                grid-column-start: 1
            }

            .sm\:size-4 {
                width: calc(var(--spacing) * 4);
                height: calc(var(--spacing) * 4)
            }

            .sm\:grid-cols-6 {
                grid-template-columns:repeat(6, minmax(0, 1fr))
            }

            .sm\:px-6 {
                padding-inline: calc(var(--spacing) * 6)
            }

            .sm\:py-32 {
                padding-block: calc(var(--spacing) * 32)
            }

            .sm\:text-sm\/6 {
                font-size: var(--text-sm);
                line-height: calc(var(--spacing) * 6)
            }
        }@media (min-width: 64rem) {
            .lg\:px-8 {
                padding-inline: calc(var(--spacing) * 8)
            }
        }@media (forced-colors: active) {
            .forced-colors\:appearance-auto {
                appearance: auto
            }

            .forced-colors\:before\:hidden:before {
                content: var(--tw-content);
                display: none
            }
        } @media (max-width: 640px) {
            .newsletter-modal .container {
                padding: 0;
                border-radius: 0.75rem;
                max-width: 98vw;
            }
            .newsletter-modal header,
            .newsletter-modal main {
                padding: 1rem;
                padding-top: 0px !important;
            }
            .newsletter-modal #sign-up-form {
                padding: 1rem;
            }
            .newsletter-modal ul {
                font-size: 1rem;
            }
            .newsletter-modal form {
                font-size: 1rem;
            }
            .newsletter-modal button[type="submit"],
            .newsletter-modal button[type="button"] {
                width: 100%;
                margin-right: 0;
                margin-top: 8px;
            }
            .newsletter-modal .form-group {
                margin-bottom: 0.8rem;
            }
            .newsletter-modal [style*="display: flex; justify-content: flex-end;"] {
                flex-direction: column;
                align-items: stretch;
                gap: 0.5rem;
            }
        }
    }@property --tw-space-y-reverse {
        syntax: "*";
        inherits: false;
        initial-value: 0
    }@property --tw-border-style {
        syntax: "*";
        inherits: false;
        initial-value: solid
    }@property --tw-font-weight {
        syntax: "*";
        inherits: false
    }@property --tw-shadow {
        syntax: "*";
        inherits: false;
        initial-value: 0 0 #0000
    }@property --tw-shadow-color {
        syntax: "*";
        inherits: false
    }@property --tw-shadow-alpha {
        syntax: "<percentage>";
        inherits: false;
        initial-value: 100%
    }@property --tw-inset-shadow {
        syntax: "*";
        inherits: false;
        initial-value: 0 0 #0000
    }@property --tw-inset-shadow-color {
        syntax: "*";
        inherits: false
    }@property --tw-inset-shadow-alpha {
        syntax: "<percentage>";
        inherits: false;
        initial-value: 100%
    }@property --tw-ring-color {
        syntax: "*";
        inherits: false
    }@property --tw-ring-shadow {
        syntax: "*";
        inherits: false;
        initial-value: 0 0 #0000
    }@property --tw-inset-ring-color {
        syntax: "*";
        inherits: false
    }@property --tw-inset-ring-shadow {
        syntax: "*";
        inherits: false;
        initial-value: 0 0 #0000
    }@property --tw-ring-inset {
        syntax: "*";
        inherits: false
    }@property --tw-ring-offset-width {
        syntax: "<length>";
        inherits: false;
        initial-value: 0
    }@property --tw-ring-offset-color {
        syntax: "*";
        inherits: false;
        initial-value: #fff
    }@property --tw-ring-offset-shadow {
        syntax: "*";
        inherits: false;
        initial-value: 0 0 #0000
    }@property --tw-outline-style {
        syntax: "*";
        inherits: false;
        initial-value: solid
    }@property --tw-content {
        syntax: "*";
        inherits: false;
        initial-value: ""
    }
}
}


/* Modal overlay and centering */
.newsletter-modal {
    position: fixed;
    z-index: 9999;
    inset: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow-y: auto;
}
.newsletter-modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(30, 30, 30, 0.65);
    z-index: 9999;
}
.newsletter-modal-center {
    position: relative;
    z-index: 10000;
    width: 100vw;
    min-height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    pointer-events: none;
}
.newsletter-modal .container {
    position: relative;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 10px 30px rgba(0,0,0,0.15);
    overflow: hidden;
    width: 90vw;
    max-width: 500px;
    margin: 24px 0;
    pointer-events: auto;
    padding: 0;
    display: flex;
    flex-direction: column;
}

/* Header with gradient */
.newsletter-modal header {
    background: linear-gradient(135deg, #6e8efb, #a777e3);
    color: white;
    text-align: center;
    height: 3.5em;
}
.newsletter-modal h1 {
    font-size: 2rem;
    margin-bottom: 0.5rem;
}
.newsletter-modal main {
    padding-left: 2rem;
    padding-right: 2rem;
    padding-bottom: .25em;
}
.newsletter-modal #benefits {
    margin-bottom: 2rem;
}
.newsletter-modal ul {
    list-style-type: none;
}
.newsletter-modal li {
    margin-bottom: 0.5rem;
    padding-left: 1.5rem;
    position: relative;
}
.newsletter-modal li::before {
    content: '✓';
    color: #6e8efb;
    position: absolute;
    left: 0;
}

/* Form styling */
.newsletter-modal #sign-up-form {
    background-color: #f8f9fa;
    padding: 1.5rem;
    border-radius: 8px;
}
.newsletter-modal form {
    display: flex;
    flex-direction: column;
}
.newsletter-modal .form-group {
    margin-bottom: 1rem;
}
.newsletter-modal label {
    display: block;
    margin-bottom: 0.5rem;
    font-weight: bold;
}
.newsletter-modal input[type="email"],
.newsletter-modal input[type="text"],
.newsletter-modal input[type="tel"],
.newsletter-modal textarea {
    width: 100%;
    padding: 0.75rem;
    border: 2px solid #ced4da;
    border-radius: 4px;
    font-size: 1rem;
    transition: border-color 0.3s ease;
    margin-bottom: 0.5rem;
}
.newsletter-modal input[type="email"]:focus,
.newsletter-modal input[type="text"]:focus,
.newsletter-modal textarea:focus {
    outline: none;
    border-color: #6e8efb;
}
.newsletter-modal input.invalid {
    border-color: #dc3545;
}
.newsletter-modal .error-message {
    color: #dc3545;
    font-size: 0.875rem;
    margin-top: 0.25rem;
    display: block;
}

/* Button styling */
.newsletter-modal button[type="submit"],
.newsletter-modal button[type="button"] {
    padding: 0.75rem;
    background: linear-gradient(135deg, #6e8efb, #a777e3);
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 1rem;
    transition: opacity 0.3s ease;
    margin-top: 8px;
}
.newsletter-modal button[type="button"] {
    background: #eee;
    color: #333;
    margin-right: 8px;
}
.newsletter-modal button:hover {
    opacity: 0.9;
}
.newsletter-modal footer {
    text-align: center;
    padding: 1rem;
    color: #6c757d;
    font-size: 0.875rem;
}

/* MOBILE OVERRIDES */
@media (max-width: 640px) {
    .newsletter-modal header,
    .newsletter-modal main {
        padding: 1rem;
        padding-top: 0px !important;
    }
    .newsletter-modal #sign-up-form {
        padding: 1rem;
    }
    .newsletter-modal .container {
        border-radius: 0.75rem;
        max-width: 99vw;
        margin: 8px 0;
    }
    .newsletter-modal ul {
        font-size: 1rem;
    }
    .newsletter-modal form {
        font-size: 1rem;
    }
    .newsletter-modal button[type="submit"],
    .newsletter-modal button[type="button"] {
        width: 100%;
        margin-right: 0;
        margin-top: 8px;
    }
    .newsletter-modal .form-group {
        margin-bottom: 0.8rem;
    }
}