blue-chestnut-solar-expert 0.0.11 → 0.0.12

package/dist/components/p-D6cs3r7j.js.map

@@ -0,0 +1 @@
+{"file":"p-D6cs3r7j.js","mappings":"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","names":["__stencil_proxyCustomElement","HTMLElement"],"sources":["src/config.ts","src/utils/lang/english.ts","src/utils/lang/german.ts","src/utils/lang/spanish.ts","src/utils/lang/general.ts","src/output.css?tag=solar-system-form","src/components/solar-system-form/solar-system-form.tsx"],"sourcesContent":["import { SolarPanelType } from \"./utils/solar\";\r\n\r\nexport interface SolarExpertConfig {\r\n    openRoofColor: string;\r\n    closedRoofColor: string;\r\n    openObstructionColor: string;\r\n    closedObstructionColor: string;\r\n    roofPolygonFillColor: string;\r\n    obstructionPolygonFillColor: string;\r\n    roofPolygonHoverFillColor: string;\r\n    obstructionPolygonHoverFillColor: string;\r\n    roofPolygonSelectedFillColor: string;\r\n    obstructionPolygonSelectedFillColor: string;\r\n}\r\n\r\nexport const DEFAULT_SOLAR_EXPERT_CONFIG: SolarExpertConfig = {\r\n    openRoofColor: \"#d6eeff\",\r\n    closedRoofColor: \"#ffffff\",\r\n    openObstructionColor: \"#f57242\",\r\n    closedObstructionColor: \"rgba(255, 132, 107, 0.8)\",\r\n    roofPolygonFillColor: \"rgba(92, 187, 255, 0.5)\",\r\n    obstructionPolygonFillColor: \"rgba(255, 132, 107, 0.5)\",\r\n    roofPolygonHoverFillColor: \"rgba(92, 187, 255, 0.8)\",\r\n    obstructionPolygonHoverFillColor: \"rgba(255, 132, 107, 0.8)\",\r\n    roofPolygonSelectedFillColor: \"rgba(92, 187, 255, 0.7)\",\r\n    obstructionPolygonSelectedFillColor: \"rgba(255, 132, 107, 0.7)\",\r\n}\r\n\r\nexport const DEFAULT_SOLAR_PANEL_TYPE: SolarPanelType = {\r\n    widthMeters: 1.134,\r\n    heightMeters: 1.762,\r\n    kWattPeak: 0.455,\r\n    efficiency: 0.224,\r\n    price: 77.68,\r\n}\r\n","import { LanguageStrings } from \"../../types/lang\";\r\n\r\nexport const en: LanguageStrings = {\r\n    solarExpert: {\r\n        searchPlaceholder: \"Search for a location\"\r\n    },\r\n    solarSystemForm: {\r\n        title: \"Solar System Configuration\",\r\n        systemInformation: \"System Information\",\r\n        numberOfPanels: \"Number of Solar Panels\",\r\n        panelPeakPower: \"Panel Peak Power (kW)\",\r\n        totalSystemPeakPower: \"Total System Peak Power (kW)\",\r\n        electricityPrice: \"Electricity Price (€/kWh)\",\r\n        compensationRate: \"Compensation Rate (€/kWh)\",\r\n        autonomy: \"Autonomy\",\r\n        costSavings: \"Cost Savings (€/year)\",\r\n        householdConsumptionTitle: \"Household Electricity Consumption\",\r\n        consumptionProfileTitle: \"Consumption Profile\",\r\n        electricityCostsTitle: \"Electricity Costs\",\r\n        compensationRateTitle: \"Compensation Rate\",\r\n        resultsTitle: \"Results\",\r\n        savingsDisclaimer: \"Disclaimer: The savings are based on the average electricity price in Spain.\",\r\n        annualConsumption: \"Annual Consumption (kWh)\",\r\n        name: \"Name\",\r\n        email: \"Email\",\r\n        nameError: \"Please enter your name\",\r\n        emailError: \"Please enter a valid email address\",\r\n        consumptionProfiles: {\r\n            mostlyAtHome: \"Mostly at home\",\r\n            mostlyAway: \"Mostly away\",\r\n        },\r\n        chart: {\r\n            consumption: \"Consumption\",\r\n            production: \"Production\",\r\n            consumptionProfile: \"Consumption Profile\",\r\n            relativeConsumption: \"Relative Consumption\",\r\n            hourOfDay: \"Hour of Day\",\r\n        },\r\n        validEmailError: \"Please enter a valid email address\",\r\n        requestOffer: \"Request Offer\",\r\n        requestOfferButton: \"Request Offer\",\r\n        year: \"year\",\r\n    },\r\n    mapDraw: {\r\n        noPolygonSelected: \"No polygon selected\",\r\n        noAddressSelected: \"Please select an address\",\r\n        information: \"Information\",\r\n        calculateSolarPanels: \"Calculate Solar Panels\",\r\n        panels: \"Panels\",\r\n        area: \"Area\",\r\n        azimuth: \"Azimuth\",\r\n        pitch: \"Pitch\",\r\n        tools: {\r\n            roof: {\r\n                name: \"Roof\",\r\n                explanation: \"Draw the roof of the building\",\r\n                ariaLabel: \"Roof\",\r\n            },\r\n            obstruction: {\r\n                name: \"Obstruction\",\r\n                explanation: \"Draw the obstruction of the building\",\r\n                ariaLabel: \"Obstruction\",\r\n            },\r\n            delete: {\r\n                name: \"Delete\",\r\n                explanation: \"Delete the selected polygon\",\r\n                ariaLabel: \"Delete\",\r\n            },\r\n            move: {\r\n                name: \"Move\",\r\n                explanation: \"Move the selected polygon\",\r\n                ariaLabel: \"Move\",\r\n            },\r\n        },\r\n    }\r\n}","import { LanguageStrings } from \"../../types/lang\";\r\n\r\nexport const de: LanguageStrings = {\r\n    solarExpert: {\r\n        searchPlaceholder: \"Suche nach einer Adresse\"\r\n    },\r\n    solarSystemForm: {\r\n        title: \"Solarsystem Konfiguration\",\r\n        systemInformation: \"System Information\",\r\n        numberOfPanels: \"Anzahl der Solarpanel\",\r\n        panelPeakPower: \"Panelleistung (kW)\",\r\n        totalSystemPeakPower: \"Maximale Anlagengröße (kWp)\",\r\n        electricityPrice: \"Strompreis (€/kWh)\",\r\n        compensationRate: \"Einspeisevergütung (€/kWh)\",\r\n        autonomy: \"Autonomie\",\r\n        costSavings: \"Einsparungen (€/Jahr)\",\r\n        householdConsumptionTitle: \"Haushaltsverbrauch\",\r\n        consumptionProfileTitle: \"Verbrauchprofil\",\r\n        electricityCostsTitle: \"Stromkosten\",\r\n        compensationRateTitle: \"Einspeisevergütung\",\r\n        resultsTitle: \"Ergebnisse\",\r\n        savingsDisclaimer: \"Disclaimer: Die Einsparungen basieren auf dem durchschnittlichen Strompreis in Spanien.\",\r\n        annualConsumption: \"Jährlicher Verbrauch (kWh)\",\r\n        name: \"Name\",\r\n        email: \"Email\",\r\n        nameError: \"Bitte geben Sie Ihren Namen ein\",\r\n        emailError: \"Bitte geben Sie eine gültige E-Mail-Adresse ein\",\r\n        consumptionProfiles: {\r\n            mostlyAtHome: \"Hauptsächlich zu Hause\",\r\n            mostlyAway: \"Erwerbstätig\",\r\n        },\r\n        chart: {\r\n            consumption: \"Verbrauch\",\r\n            production: \"Produktion\",\r\n            consumptionProfile: \"Verbrauchprofil\",\r\n            relativeConsumption: \"Verbrauch\",\r\n            hourOfDay: \"Stunde des Tages\",\r\n        },\r\n        validEmailError: \"Bitte geben Sie eine gültige E-Mail-Adresse ein\",\r\n        requestOffer: \"Angebot anfordern\",\r\n        requestOfferButton: \"Angebot anfordern\",\r\n        year: \"Jahr\",\r\n    },\r\n    mapDraw: {\r\n        noPolygonSelected: \"Kein Polygon ausgewählt\",\r\n        noAddressSelected: \"Bitte wählen Sie eine Adresse\",\r\n        information: \"Information\",\r\n        calculateSolarPanels: \"Berechnen Sie die Solarpanele\",\r\n        panels: \"Panele\",\r\n        area: \"Fläche\",\r\n        azimuth: \"Ausrichtung\",\r\n        pitch: \"Neigung\",\r\n        tools: {\r\n            roof: {\r\n                name: \"Dach\",\r\n                explanation: \"Zeichnen Sie das Dach des Gebäudes\",\r\n                ariaLabel: \"Dach\",\r\n            },\r\n            obstruction: {\r\n                name: \"Hindernis\",\r\n                explanation: \"Zeichnen Sie das Hindernis des Gebäudes\",\r\n                ariaLabel: \"Hindernis\",\r\n            },\r\n            delete: {\r\n                name: \"Löschen\",\r\n                explanation: \"Löschen Sie das ausgewählte Polygon\",\r\n                ariaLabel: \"Löschen\",\r\n            },\r\n            move: {\r\n                name: \"Verschieben\",\r\n                explanation: \"Verschieben Sie Punkte des ausgewählten Polygons\",\r\n                ariaLabel: \"Verschieben\",\r\n            },\r\n        },\r\n    }\r\n}","import { LanguageStrings } from \"../../types/lang\";\r\n\r\nexport const es: LanguageStrings = {\r\n    solarExpert: {\r\n        searchPlaceholder: \"Suche nach einer Adresse\"\r\n    },\r\n    solarSystemForm: {\r\n        title: \"Configuración del sistema solar\",\r\n        systemInformation: \"Información del sistema\",\r\n        numberOfPanels: \"Número de paneles solares\",\r\n        panelPeakPower: \"Potencia pico del panel (kW)\",\r\n        totalSystemPeakPower: \"Potencia pico total del sistema (kW)\",\r\n        electricityPrice: \"Precio de la electricidad (€/kWh)\",\r\n        compensationRate: \"Tasa de compensación (€/kWh)\",\r\n        autonomy: \"Autonomía\",\r\n        costSavings: \"Ahorro (€/año)\",\r\n        householdConsumptionTitle: \"Consumo de la casa\",\r\n        consumptionProfileTitle: \"Perfil de consumo\",\r\n        electricityCostsTitle: \"Costes de la electricidad\",\r\n        compensationRateTitle: \"Tasa de compensación\",\r\n        resultsTitle: \"Resultados\",\r\n        savingsDisclaimer: \"Nota: Los ahorros se basan en el precio promedio de la electricidad en España.\",\r\n        annualConsumption: \"Consumo anual (kWh)\",\r\n        name: \"Nombre\",\r\n        email: \"Email\",\r\n        nameError: \"Por favor, ingrese su nombre\",\r\n        emailError: \"Por favor, ingrese una dirección de correo electrónico válida\",\r\n        consumptionProfiles: {\r\n            mostlyAtHome: \"Principalmente en casa\",\r\n            mostlyAway: \"Empleo\",\r\n        },\r\n        chart: {\r\n            consumption: \"Consumo\",\r\n            production: \"Producción\",\r\n            consumptionProfile: \"Perfil de consumo\",\r\n            relativeConsumption: \"Consumo\",\r\n            hourOfDay: \"Hora del día\",\r\n        },\r\n        validEmailError: \"Por favor, ingrese una dirección de correo electrónico válida\",\r\n        requestOffer: \"Solicitar una oferta\",\r\n        requestOfferButton: \"Solicitar oferta\",\r\n        year: \"Año\",\r\n    },\r\n    mapDraw: {\r\n        noPolygonSelected: \"No se ha seleccionado un polígono\",\r\n        noAddressSelected: \"Por favor, seleccione una dirección\",\r\n        information: \"Información\",\r\n        calculateSolarPanels: \"Calcular paneles solares\",\r\n        panels: \"Paneles\",\r\n        area: \"Área\",\r\n        azimuth: \"Azimut\",\r\n        pitch: \"Inclinación\",\r\n        tools: {\r\n            roof: {\r\n                name: \"Tejado\",\r\n                explanation: \"Dibuje el tejado del edificio\",\r\n                ariaLabel: \"Tejado\",\r\n            },\r\n            obstruction: {\r\n                name: \"Obstrucción\",\r\n                explanation: \"Dibuje la obstrucción del edificio\",\r\n                ariaLabel: \"Obstrucción\",\r\n            },\r\n            delete: {\r\n                name: \"Eliminar\",\r\n                explanation: \"Elimine el polígono seleccionado\",\r\n                ariaLabel: \"Eliminar\",\r\n            },\r\n            move: {\r\n                name: \"Mover\",\r\n                explanation: \"Mueva los puntos del polígono seleccionado\",\r\n                ariaLabel: \"Mover\",\r\n            },\r\n        },\r\n    }\r\n}","import { Language, LanguageStrings } from \"../../types/lang\";\r\nimport { en } from \"./english\";\r\nimport { de } from \"./german\";\r\nimport { es } from \"./spanish\";\r\n\r\nconst languageStrings: Record<Language, LanguageStrings> = {\r\n    en: en,\r\n    es: es,\r\n    de: de,\r\n}\r\n\r\n\r\nexport function getLanguageStrings(lang: Language): LanguageStrings {\r\n    const defaultLang = languageStrings[\"en\"];\r\n    if (lang === \"en\") {\r\n        return defaultLang;\r\n    }\r\n    const langStrings = languageStrings[lang];\r\n    \r\n    // Deep merge the default language strings with the selected language strings\r\n    const mergedStrings = JSON.parse(JSON.stringify(defaultLang)); // Deep clone default\r\n    \r\n    function deepMerge(target: any, source: any) {\r\n        for (const key in source) {\r\n            if (source[key] instanceof Object && key in target) {\r\n                deepMerge(target[key], source[key]);\r\n            } else if (source[key] !== undefined) {\r\n                target[key] = source[key];\r\n            }\r\n        }\r\n    }\r\n    \r\n    deepMerge(mergedStrings, langStrings);\r\n    return mergedStrings;\r\n}\r\n","/*! tailwindcss v4.1.7 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n  :root, :host {\n    --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n      \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n      \"Courier New\", monospace;\n    --color-red-500: oklch(63.7% 0.237 25.331);\n    --color-green-600: oklch(62.7% 0.194 149.214);\n    --color-blue-500: oklch(62.3% 0.214 259.815);\n    --color-purple-500: oklch(62.7% 0.265 303.9);\n    --color-gray-50: oklch(98.5% 0.002 247.839);\n    --color-gray-200: oklch(92.8% 0.006 264.531);\n    --color-gray-300: oklch(87.2% 0.01 258.338);\n    --color-gray-400: oklch(70.7% 0.022 261.325);\n    --color-gray-500: oklch(55.1% 0.027 264.364);\n    --color-gray-600: oklch(44.6% 0.03 256.802);\n    --color-gray-700: oklch(37.3% 0.034 259.733);\n    --color-gray-800: oklch(27.8% 0.033 256.848);\n    --color-black: #000;\n    --color-white: #fff;\n    --spacing: 0.25rem;\n    --container-xl: 36rem;\n    --container-2xl: 42rem;\n    --container-3xl: 48rem;\n    --text-sm: 0.875rem;\n    --text-sm--line-height: calc(1.25 / 0.875);\n    --text-lg: 1.125rem;\n    --text-lg--line-height: calc(1.75 / 1.125);\n    --text-xl: 1.25rem;\n    --text-xl--line-height: calc(1.75 / 1.25);\n    --text-2xl: 1.5rem;\n    --text-2xl--line-height: calc(2 / 1.5);\n    --text-3xl: 1.875rem;\n    --text-3xl--line-height: calc(2.25 / 1.875);\n    --font-weight-medium: 500;\n    --font-weight-semibold: 600;\n    --font-weight-bold: 700;\n    --radius-lg: 0.5rem;\n    --radius-xl: 0.75rem;\n    --radius-2xl: 1rem;\n    --radius-4xl: 2rem;\n    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n    --animate-spin: spin 1s linear infinite;\n    --default-transition-duration: 150ms;\n    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    --default-font-family: var(--font-sans);\n    --default-mono-font-family: var(--font-mono);\n  }\n}\n@layer base {\n  *, ::after, ::before, ::backdrop, ::file-selector-button {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n    border: 0 solid;\n  }\n  html, :host {\n    line-height: 1.5;\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    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\");\n    font-feature-settings: var(--default-font-feature-settings, normal);\n    font-variation-settings: var(--default-font-variation-settings, normal);\n    -webkit-tap-highlight-color: transparent;\n  }\n  hr {\n    height: 0;\n    color: inherit;\n    border-top-width: 1px;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1, h2, h3, h4, h5, h6 {\n    font-size: inherit;\n    font-weight: inherit;\n  }\n  a {\n    color: inherit;\n    -webkit-text-decoration: inherit;\n    text-decoration: inherit;\n  }\n  b, strong {\n    font-weight: bolder;\n  }\n  code, kbd, samp, pre {\n    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n    font-feature-settings: var(--default-mono-font-feature-settings, normal);\n    font-variation-settings: var(--default-mono-font-variation-settings, normal);\n    font-size: 1em;\n  }\n  small {\n    font-size: 80%;\n  }\n  sub, sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n  sub {\n    bottom: -0.25em;\n  }\n  sup {\n    top: -0.5em;\n  }\n  table {\n    text-indent: 0;\n    border-color: inherit;\n    border-collapse: collapse;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  summary {\n    display: list-item;\n  }\n  ol, ul, menu {\n    list-style: none;\n  }\n  img, svg, video, canvas, audio, iframe, embed, object {\n    display: block;\n    vertical-align: middle;\n  }\n  img, video {\n    max-width: 100%;\n    height: auto;\n  }\n  button, input, select, optgroup, textarea, ::file-selector-button {\n    font: inherit;\n    font-feature-settings: inherit;\n    font-variation-settings: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n    border-radius: 0;\n    background-color: transparent;\n    opacity: 1;\n  }\n  :where(select:is([multiple], [size])) optgroup {\n    font-weight: bolder;\n  }\n  :where(select:is([multiple], [size])) optgroup option {\n    padding-inline-start: 20px;\n  }\n  ::file-selector-button {\n    margin-inline-end: 4px;\n  }\n  ::placeholder {\n    opacity: 1;\n  }\n  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {\n    ::placeholder {\n      color: currentcolor;\n      @supports (color: color-mix(in lab, red, red)) {\n        color: color-mix(in oklab, currentcolor 50%, transparent);\n      }\n    }\n  }\n  textarea {\n    resize: vertical;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-date-and-time-value {\n    min-height: 1lh;\n    text-align: inherit;\n  }\n  ::-webkit-datetime-edit {\n    display: inline-flex;\n  }\n  ::-webkit-datetime-edit-fields-wrapper {\n    padding: 0;\n  }\n  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n    padding-block: 0;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n    appearance: button;\n  }\n  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [hidden]:where(:not([hidden=\"until-found\"])) {\n    display: none !important;\n  }\n}\n@layer utilities {\n  .pointer-events-none {\n    pointer-events: none;\n  }\n  .absolute {\n    position: absolute;\n  }\n  .relative {\n    position: relative;\n  }\n  .inset-0 {\n    inset: calc(var(--spacing) * 0);\n  }\n  .top-0 {\n    top: calc(var(--spacing) * 0);\n  }\n  .top-1 {\n    top: calc(var(--spacing) * 1);\n  }\n  .top-1\\/2 {\n    top: calc(1/2 * 100%);\n  }\n  .bottom-full {\n    bottom: 100%;\n  }\n  .left-0 {\n    left: calc(var(--spacing) * 0);\n  }\n  .left-1 {\n    left: calc(var(--spacing) * 1);\n  }\n  .left-1\\/2 {\n    left: calc(1/2 * 100%);\n  }\n  .left-3 {\n    left: calc(var(--spacing) * 3);\n  }\n  .z-1 {\n    z-index: 1;\n  }\n  .z-10 {\n    z-index: 10;\n  }\n  .z-20 {\n    z-index: 20;\n  }\n  .container {\n    width: 100%;\n    @media (width >= 40rem) {\n      max-width: 40rem;\n    }\n    @media (width >= 48rem) {\n      max-width: 48rem;\n    }\n    @media (width >= 64rem) {\n      max-width: 64rem;\n    }\n    @media (width >= 80rem) {\n      max-width: 80rem;\n    }\n    @media (width >= 96rem) {\n      max-width: 96rem;\n    }\n  }\n  .m-auto {\n    margin: auto;\n  }\n  .mt-1 {\n    margin-top: calc(var(--spacing) * 1);\n  }\n  .mt-4 {\n    margin-top: calc(var(--spacing) * 4);\n  }\n  .mb-1 {\n    margin-bottom: calc(var(--spacing) * 1);\n  }\n  .mb-2 {\n    margin-bottom: calc(var(--spacing) * 2);\n  }\n  .mb-4 {\n    margin-bottom: calc(var(--spacing) * 4);\n  }\n  .block {\n    display: block;\n  }\n  .flex {\n    display: flex;\n  }\n  .grid {\n    display: grid;\n  }\n  .hidden {\n    display: none;\n  }\n  .inline {\n    display: inline;\n  }\n  .inline-block {\n    display: inline-block;\n  }\n  .table {\n    display: table;\n  }\n  .h-4 {\n    height: calc(var(--spacing) * 4);\n  }\n  .h-5 {\n    height: calc(var(--spacing) * 5);\n  }\n  .h-16 {\n    height: calc(var(--spacing) * 16);\n  }\n  .h-48 {\n    height: calc(var(--spacing) * 48);\n  }\n  .h-full {\n    height: 100%;\n  }\n  .w-4 {\n    width: calc(var(--spacing) * 4);\n  }\n  .w-5 {\n    width: calc(var(--spacing) * 5);\n  }\n  .w-16 {\n    width: calc(var(--spacing) * 16);\n  }\n  .w-20 {\n    width: calc(var(--spacing) * 20);\n  }\n  .w-52 {\n    width: calc(var(--spacing) * 52);\n  }\n  .w-64 {\n    width: calc(var(--spacing) * 64);\n  }\n  .w-full {\n    width: 100%;\n  }\n  .max-w-2xl {\n    max-width: var(--container-2xl);\n  }\n  .max-w-3xl {\n    max-width: var(--container-3xl);\n  }\n  .max-w-xl {\n    max-width: var(--container-xl);\n  }\n  .flex-1 {\n    flex: 1;\n  }\n  .border-collapse {\n    border-collapse: collapse;\n  }\n  .-translate-x-1 {\n    --tw-translate-x: calc(var(--spacing) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-x-1\\/2 {\n    --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-y-1 {\n    --tw-translate-y: calc(var(--spacing) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-y-1\\/2 {\n    --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .transform {\n    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n  }\n  .animate-spin {\n    animation: var(--animate-spin);\n  }\n  .cursor-help {\n    cursor: help;\n  }\n  .resize {\n    resize: both;\n  }\n  .appearance-none {\n    appearance: none;\n  }\n  .auto-cols-max {\n    grid-auto-columns: max-content;\n  }\n  .grid-flow-col {\n    grid-auto-flow: column;\n  }\n  .grid-cols-2 {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n  .grid-cols-4 {\n    grid-template-columns: repeat(4, minmax(0, 1fr));\n  }\n  .grid-rows-2 {\n    grid-template-rows: repeat(2, minmax(0, 1fr));\n  }\n  .flex-col {\n    flex-direction: column;\n  }\n  .flex-row {\n    flex-direction: row;\n  }\n  .flex-wrap {\n    flex-wrap: wrap;\n  }\n  .place-items-stretch {\n    place-items: stretch;\n  }\n  .items-center {\n    align-items: center;\n  }\n  .items-start {\n    align-items: flex-start;\n  }\n  .justify-between {\n    justify-content: space-between;\n  }\n  .justify-center {\n    justify-content: center;\n  }\n  .justify-start {\n    justify-content: flex-start;\n  }\n  .gap-0 {\n    gap: calc(var(--spacing) * 0);\n  }\n  .gap-1 {\n    gap: calc(var(--spacing) * 1);\n  }\n  .gap-2 {\n    gap: calc(var(--spacing) * 2);\n  }\n  .gap-4 {\n    gap: calc(var(--spacing) * 4);\n  }\n  .space-y-4 {\n    :where(& > :not(:last-child)) {\n      --tw-space-y-reverse: 0;\n      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n    }\n  }\n  .space-y-6 {\n    :where(& > :not(:last-child)) {\n      --tw-space-y-reverse: 0;\n      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n    }\n  }\n  .overflow-hidden {\n    overflow: hidden;\n  }\n  .rounded-4xl {\n    border-radius: var(--radius-4xl);\n  }\n  .rounded-full {\n    border-radius: calc(infinity * 1px);\n  }\n  .rounded-lg {\n    border-radius: var(--radius-lg);\n  }\n  .border {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n  }\n  .border-t {\n    border-top-style: var(--tw-border-style);\n    border-top-width: 1px;\n  }\n  .border-t-2 {\n    border-top-style: var(--tw-border-style);\n    border-top-width: 2px;\n  }\n  .border-b-2 {\n    border-bottom-style: var(--tw-border-style);\n    border-bottom-width: 2px;\n  }\n  .border-\\[\\#271200\\] {\n    border-color: #271200;\n  }\n  .border-gray-200 {\n    border-color: var(--color-gray-200);\n  }\n  .border-gray-300 {\n    border-color: var(--color-gray-300);\n  }\n  .border-red-500 {\n    border-color: var(--color-red-500);\n  }\n  .bg-\\[\\#271200\\] {\n    background-color: #271200;\n  }\n  .bg-\\[\\#f3ebda\\] {\n    background-color: #f3ebda;\n  }\n  .bg-black {\n    background-color: var(--color-black);\n  }\n  .bg-gray-200 {\n    background-color: var(--color-gray-200);\n  }\n  .bg-gray-500 {\n    background-color: var(--color-gray-500);\n  }\n  .bg-gray-800 {\n    background-color: var(--color-gray-800);\n  }\n  .bg-transparent {\n    background-color: transparent;\n  }\n  .bg-white {\n    background-color: var(--color-white);\n  }\n  .object-contain {\n    object-fit: contain;\n  }\n  .p-1 {\n    padding: calc(var(--spacing) * 1);\n  }\n  .p-2 {\n    padding: calc(var(--spacing) * 2);\n  }\n  .p-3 {\n    padding: calc(var(--spacing) * 3);\n  }\n  .p-4 {\n    padding: calc(var(--spacing) * 4);\n  }\n  .p-6 {\n    padding: calc(var(--spacing) * 6);\n  }\n  .px-4 {\n    padding-inline: calc(var(--spacing) * 4);\n  }\n  .py-2 {\n    padding-block: calc(var(--spacing) * 2);\n  }\n  .pt-4 {\n    padding-top: calc(var(--spacing) * 4);\n  }\n  .pt-7 {\n    padding-top: calc(var(--spacing) * 7);\n  }\n  .pr-4 {\n    padding-right: calc(var(--spacing) * 4);\n  }\n  .pb-3 {\n    padding-bottom: calc(var(--spacing) * 3);\n  }\n  .pl-2 {\n    padding-left: calc(var(--spacing) * 2);\n  }\n  .pl-10 {\n    padding-left: calc(var(--spacing) * 10);\n  }\n  .text-center {\n    text-align: center;\n  }\n  .text-2xl {\n    font-size: var(--text-2xl);\n    line-height: var(--tw-leading, var(--text-2xl--line-height));\n  }\n  .text-lg {\n    font-size: var(--text-lg);\n    line-height: var(--tw-leading, var(--text-lg--line-height));\n  }\n  .text-sm {\n    font-size: var(--text-sm);\n    line-height: var(--tw-leading, var(--text-sm--line-height));\n  }\n  .text-xl {\n    font-size: var(--text-xl);\n    line-height: var(--tw-leading, var(--text-xl--line-height));\n  }\n  .font-bold {\n    --tw-font-weight: var(--font-weight-bold);\n    font-weight: var(--font-weight-bold);\n  }\n  .font-medium {\n    --tw-font-weight: var(--font-weight-medium);\n    font-weight: var(--font-weight-medium);\n  }\n  .font-semibold {\n    --tw-font-weight: var(--font-weight-semibold);\n    font-weight: var(--font-weight-semibold);\n  }\n  .text-\\[\\#271200\\] {\n    color: #271200;\n  }\n  .text-gray-400 {\n    color: var(--color-gray-400);\n  }\n  .text-gray-500 {\n    color: var(--color-gray-500);\n  }\n  .text-gray-600 {\n    color: var(--color-gray-600);\n  }\n  .text-green-600 {\n    color: var(--color-green-600);\n  }\n  .text-red-500 {\n    color: var(--color-red-500);\n  }\n  .text-white {\n    color: var(--color-white);\n  }\n  .underline {\n    text-decoration-line: underline;\n  }\n  .accent-\\[\\#271200\\] {\n    accent-color: #271200;\n  }\n  .opacity-0 {\n    opacity: 0%;\n  }\n  .shadow {\n    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .outline {\n    outline-style: var(--tw-outline-style);\n    outline-width: 1px;\n  }\n  .transition-colors {\n    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n    transition-duration: var(--tw-duration, var(--default-transition-duration));\n  }\n  .transition-opacity {\n    transition-property: opacity;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n    transition-duration: var(--tw-duration, var(--default-transition-duration));\n  }\n  .duration-200 {\n    --tw-duration: 200ms;\n    transition-duration: 200ms;\n  }\n  .group-hover\\:opacity-100 {\n    &:is(:where(.group):hover *) {\n      @media (hover: hover) {\n        opacity: 100%;\n      }\n    }\n  }\n  .hover\\:bg-\\[\\#964500\\] {\n    &:hover {\n      @media (hover: hover) {\n        background-color: #964500;\n      }\n    }\n  }\n  .hover\\:bg-\\[\\#ffffff\\] {\n    &:hover {\n      @media (hover: hover) {\n        background-color: #ffffff;\n      }\n    }\n  }\n  .hover\\:bg-gray-50 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-50);\n      }\n    }\n  }\n  .hover\\:bg-gray-200 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-200);\n      }\n    }\n  }\n  .hover\\:bg-gray-500 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-500);\n      }\n    }\n  }\n  .hover\\:bg-white {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-white);\n      }\n    }\n  }\n  .hover\\:text-\\[\\#271200\\] {\n    &:hover {\n      @media (hover: hover) {\n        color: #271200;\n      }\n    }\n  }\n  .focus\\:border-transparent {\n    &:focus {\n      border-color: transparent;\n    }\n  }\n  .focus\\:ring-2 {\n    &:focus {\n      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n    }\n  }\n  .focus\\:ring-\\[\\#964500\\] {\n    &:focus {\n      --tw-ring-color: #964500;\n    }\n  }\n  .focus\\:ring-blue-500 {\n    &:focus {\n      --tw-ring-color: var(--color-blue-500);\n    }\n  }\n  .focus\\:outline-none {\n    &:focus {\n      --tw-outline-style: none;\n      outline-style: none;\n    }\n  }\n  .lg\\:gap-4 {\n    @media (width >= 64rem) {\n      gap: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:h-4 {\n    &::-moz-range-thumb {\n      height: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:w-4 {\n    &::-moz-range-thumb {\n      width: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:cursor-pointer {\n    &::-moz-range-thumb {\n      cursor: pointer;\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:appearance-none {\n    &::-moz-range-thumb {\n      appearance: none;\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:rounded-full {\n    &::-moz-range-thumb {\n      border-radius: calc(infinity * 1px);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:bg-\\[\\#271200\\] {\n    &::-moz-range-thumb {\n      background-color: #271200;\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-track\\]\\:h-2 {\n    &::-moz-range-track {\n      height: calc(var(--spacing) * 2);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-track\\]\\:rounded-full {\n    &::-moz-range-track {\n      border-radius: calc(infinity * 1px);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-track\\]\\:bg-gray-200 {\n    &::-moz-range-track {\n      background-color: var(--color-gray-200);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:h-2 {\n    &::-webkit-slider-runnable-track {\n      height: calc(var(--spacing) * 2);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:rounded-full {\n    &::-webkit-slider-runnable-track {\n      border-radius: calc(infinity * 1px);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:bg-black\\/25 {\n    &::-webkit-slider-runnable-track {\n      background-color: color-mix(in srgb, #000 25%, transparent);\n      @supports (color: color-mix(in lab, red, red)) {\n        background-color: color-mix(in oklab, var(--color-black) 25%, transparent);\n      }\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:bg-gray-200 {\n    &::-webkit-slider-runnable-track {\n      background-color: var(--color-gray-200);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:bg-white {\n    &::-webkit-slider-runnable-track {\n      background-color: var(--color-white);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-4 {\n    &::-webkit-slider-thumb {\n      height: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-\\[5px\\] {\n    &::-webkit-slider-thumb {\n      height: 5px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-\\[10px\\] {\n    &::-webkit-slider-thumb {\n      height: 10px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-\\[50px\\] {\n    &::-webkit-slider-thumb {\n      height: 50px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-4 {\n    &::-webkit-slider-thumb {\n      width: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[5px\\] {\n    &::-webkit-slider-thumb {\n      width: 5px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n    &::-webkit-slider-thumb {\n      width: 10px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[50px\\] {\n    &::-webkit-slider-thumb {\n      width: 50px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:cursor-pointer {\n    &::-webkit-slider-thumb {\n      cursor: pointer;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:appearance-none {\n    &::-webkit-slider-thumb {\n      appearance: none;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:rounded-full {\n    &::-webkit-slider-thumb {\n      border-radius: calc(infinity * 1px);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:bg-\\[\\#271200\\] {\n    &::-webkit-slider-thumb {\n      background-color: #271200;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:bg-purple-500 {\n    &::-webkit-slider-thumb {\n      background-color: var(--color-purple-500);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:bg-white {\n    &::-webkit-slider-thumb {\n      background-color: var(--color-white);\n    }\n  }\n}\n@property --tw-translate-x {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-translate-y {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-translate-z {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-rotate-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-z {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-space-y-reverse {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-border-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-font-weight {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-inset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-offset-width {\n  syntax: \"<length>\";\n  inherits: false;\n  initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-duration {\n  syntax: \"*\";\n  inherits: false;\n}\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@layer properties {\n  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n    *, ::before, ::after, ::backdrop {\n      --tw-translate-x: 0;\n      --tw-translate-y: 0;\n      --tw-translate-z: 0;\n      --tw-rotate-x: initial;\n      --tw-rotate-y: initial;\n      --tw-rotate-z: initial;\n      --tw-skew-x: initial;\n      --tw-skew-y: initial;\n      --tw-space-y-reverse: 0;\n      --tw-border-style: solid;\n      --tw-font-weight: initial;\n      --tw-shadow: 0 0 #0000;\n      --tw-shadow-color: initial;\n      --tw-shadow-alpha: 100%;\n      --tw-inset-shadow: 0 0 #0000;\n      --tw-inset-shadow-color: initial;\n      --tw-inset-shadow-alpha: 100%;\n      --tw-ring-color: initial;\n      --tw-ring-shadow: 0 0 #0000;\n      --tw-inset-ring-color: initial;\n      --tw-inset-ring-shadow: 0 0 #0000;\n      --tw-ring-inset: initial;\n      --tw-ring-offset-width: 0px;\n      --tw-ring-offset-color: #fff;\n      --tw-ring-offset-shadow: 0 0 #0000;\n      --tw-outline-style: solid;\n      --tw-duration: initial;\n    }\n  }\n}\n","import { Component, h, Prop, State, Watch } from \"@stencil/core\";\r\n// import Chart from \"chart.js/auto\";\r\nimport { DEFAULT_SOLAR_PANEL_TYPE } from \"../../config\";\r\nimport { SolarPanelSystemPart } from \"../../utils/geometry/fitting\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { Polygon } from \"../../types/shapes\";\r\n\r\nconst SOLAR_RADIATION = [\r\n    0,\r\n    0,\r\n    0,\r\n    0,\r\n    0,\r\n    0, // 00:00 - 05:00 - 6\r\n    0,\r\n    0.1,\r\n    0.2, // 8\r\n    0.4,\r\n    0.8,\r\n    1, // 06:00 - 11:00 - 12\r\n    1,\r\n    1,\r\n    1,\r\n    0.7,\r\n    0.5,\r\n    0.3, // 12:00 - 17:00 - 18\r\n    0.16,\r\n    0.02,\r\n    0,\r\n    0,\r\n    0,\r\n    0, // 18:00 - 23:00 - 24\r\n];\r\nconst CONSUMPTION_PROFILES = {\r\n    mostly_at_home: [\r\n        0.1,\r\n        0.1,\r\n        0.1,\r\n        0.1,\r\n        0.1,\r\n        0.15, // 00:00 - 05:00 - 6\r\n        0.23,\r\n        0.26,\r\n        0.16,\r\n        0.16,\r\n        0.15,\r\n        0.19, // 06:00 - 11:00 - 12\r\n        0.23,\r\n        0.24,\r\n        0.35,\r\n        0.28,\r\n        0.275,\r\n        0.8, // 12:00 - 17:00 - 18\r\n        0.78,\r\n        0.74,\r\n        0.75,\r\n        0.73,\r\n        0.26,\r\n        0.1, // 18:00 - 23:00 - 24\r\n    ],\r\n    mostly_away: [\r\n        0.1,\r\n        0.1,\r\n        0.1,\r\n        0.1,\r\n        0.1,\r\n        0.15, // 00:00 - 05:00 - 6\r\n        0.29,\r\n        0.32,\r\n        0.25,\r\n        0.15,\r\n        0.12,\r\n        0.14, // 06:00 - 11:00 - 12\r\n        0.15,\r\n        0.12,\r\n        0.16,\r\n        0.21,\r\n        0.285,\r\n        1, // 12:00 - 17:00 - 18\r\n        0.81,\r\n        0.77,\r\n        0.79,\r\n        0.73,\r\n        0.26,\r\n        0.1, // 18:00 - 23:00 - 24\r\n    ],\r\n};\r\n\r\n@Component({\r\n    tag: \"solar-system-form\",\r\n    styleUrl: \"../../output.css\",\r\n    shadow: false,\r\n})\r\nexport class SolarSystemForm {\r\n    @Prop()\r\n    systemConfigs: { [id: string]: SolarPanelSystemPart } = {};\r\n    @Prop()\r\n    language: Language = \"en\";\r\n    @Prop()\r\n    roofPolygons: { [id: string]: Polygon } = {};\r\n    @Prop()\r\n    obstructionPolygons: { [id: string]: Polygon } = {};\r\n\r\n    @State()\r\n    householdConsumption: number = 3500;\r\n    @State()\r\n    consumptionProfile: \"mostly_at_home\" | \"mostly_away\" = \"mostly_at_home\";\r\n    @State()\r\n    electricityPrice: number = 0.3;\r\n    @State()\r\n    compensationRate: number = 0.07;\r\n    @State()\r\n    autonomy: number = 0;\r\n    @State()\r\n    costSavings: number = 0;\r\n    @State()\r\n    numberOfPanels: number = 5;\r\n    @State()\r\n    panelPeakPower: number = 0.4; // kW per panel\r\n    @State()\r\n    name: string = \"\";\r\n    @State()\r\n    email: string = \"\";\r\n    @State()\r\n    nameError: string = \"\";\r\n    @State()\r\n    emailError: string = \"\";\r\n    @State()\r\n    electricCar: boolean = false;\r\n    @State()\r\n    heatPump: number = 0;\r\n    @State()\r\n    battery: number = 0;\r\n\r\n    // private chart: Chart | null = null;\r\n    // private chartRef: HTMLCanvasElement | null = null;\r\n\r\n    @Watch(\"systemConfigs\")\r\n    updateSystemConfigs() {\r\n        if (Object.keys(this.systemConfigs).length === 0) {\r\n            this.numberOfPanels = 0;\r\n            return;\r\n        }\r\n        this.numberOfPanels = Object.keys(this.systemConfigs).reduce(\r\n            (acc, curr) =>\r\n                acc + this.systemConfigs[curr].positionedPanels.length,\r\n            0,\r\n        );\r\n\r\n        this.panelPeakPower =\r\n            Object.entries(this.systemConfigs)[0][1].positionedPanels[0].panel\r\n                .kWattPeak;\r\n\r\n        this.recalculate();\r\n        this.updateChart();\r\n    }\r\n\r\n    private recalculate() {\r\n        const data = CONSUMPTION_PROFILES[this.consumptionProfile];\r\n        const norm = data.reduce((acc, curr) => acc + curr, 0);\r\n\r\n        const peakKwh = this.numberOfPanels * this.panelPeakPower;\r\n        const production = SOLAR_RADIATION.map((radiation) =>\r\n            radiation * peakKwh\r\n        );\r\n        let energyUsageOfProduction = 0;\r\n\r\n        for (let i = 0; i < data.length; i++) {\r\n            data[i] = data[i] * this.householdConsumption / norm / 365;\r\n            if (data[i] <= production[i]) {\r\n                energyUsageOfProduction += data[i];\r\n            } else if (data[i] > production[i]) {\r\n                energyUsageOfProduction += production[i];\r\n            }\r\n        }\r\n        const energyDifference = production.map((p, i) => data[i] - p);\r\n        const soldEnergy = -energyDifference.filter((e) => e < 0).reduce(\r\n            (acc, curr) => acc + curr,\r\n            0,\r\n        );\r\n        // Calculate the cost savings\r\n        this.costSavings = soldEnergy * this.compensationRate * 365 +\r\n            energyUsageOfProduction * 365 * this.electricityPrice;\r\n\r\n        this.autonomy =\r\n            (energyUsageOfProduction / (this.householdConsumption / 365)) *\r\n            100;\r\n    }\r\n\r\n    private updateChart() {\r\n        // if (!this.chartRef) return;\r\n\r\n        // const ctx = this.chartRef.getContext(\"2d\");\r\n        // if (!ctx) return;\r\n\r\n        // if (this.chart) {\r\n        //     this.chart.destroy();\r\n        // }\r\n\r\n        // const hours = Array.from({ length: 24 }, (_, i) => `${i}:00`);\r\n        // const data = CONSUMPTION_PROFILES[this.consumptionProfile];\r\n        // const norm = data.reduce((acc, curr) => acc + curr, 0);\r\n\r\n        // const peakKwh = this.numberOfPanels * this.panelPeakPower;\r\n        // const production = SOLAR_RADIATION.map((radiation) =>\r\n        //     radiation * peakKwh\r\n        // );\r\n\r\n        // for (let i = 0; i < data.length; i++) {\r\n        //     data[i] = data[i] * this.householdConsumption / norm / 365;\r\n        // }\r\n\r\n        // let datasets = [{\r\n        //     label: \"Energy Consumption\",\r\n        //     data: data,\r\n        //     borderColor: \"#964500\",\r\n        //     backgroundColor: \"rgba(150, 69, 0, 0.1)\",\r\n        //     fill: true,\r\n        //     tension: 0.4,\r\n        // }, {\r\n        //     label: \"Energy Production\",\r\n        //     data: production,\r\n        //     borderColor: \"#000000\",\r\n        //     backgroundColor: \"rgba(0, 0, 0, 0.1)\",\r\n        //     fill: true,\r\n        // }];\r\n\r\n        // this.chart = new Chart(ctx, {\r\n        //     type: \"line\",\r\n        //     data: {\r\n        //         labels: hours,\r\n        //         datasets: datasets,\r\n        //     },\r\n        //     options: {\r\n        //         responsive: true,\r\n        //         plugins: {\r\n        //             title: {\r\n        //                 display: true,\r\n        //                 text: \"Daily Consumption Profile\",\r\n        //             },\r\n        //         },\r\n        //         scales: {\r\n        //             y: {\r\n        //                 beginAtZero: true,\r\n        //                 title: {\r\n        //                     display: true,\r\n        //                     text: \"Relative Consumption\",\r\n        //                 },\r\n        //             },\r\n        //             x: {\r\n        //                 title: {\r\n        //                     display: true,\r\n        //                     text: \"Hour of Day\",\r\n        //                 },\r\n        //             },\r\n        //         },\r\n        //     },\r\n        // });\r\n    }\r\n\r\n    componentWillLoad() {\r\n        this.updateSystemConfigs();\r\n    }\r\n\r\n    private validateForm(): boolean {\r\n        let isValid = true;\r\n        const t = getLanguageStrings(this.language);\r\n\r\n        // Validate name\r\n        if (!this.name.trim()) {\r\n            this.nameError = t.solarSystemForm.nameError;\r\n            isValid = false;\r\n        } else {\r\n            this.nameError = \"\";\r\n        }\r\n\r\n        // Validate email\r\n        const emailRegex = /^[^\\s@]+@[^\\s@]+\\.[^\\s@]+$/;\r\n        if (!this.email.trim()) {\r\n            this.emailError = t.solarSystemForm.emailError;\r\n            isValid = false;\r\n        } else if (!emailRegex.test(this.email)) {\r\n            this.emailError = t.solarSystemForm.validEmailError;\r\n            isValid = false;\r\n        } else {\r\n            this.emailError = \"\";\r\n        }\r\n\r\n        return isValid;\r\n    }\r\n\r\n    private handleRequestOffer() {\r\n        if (!this.validateForm()) {\r\n            return;\r\n        }\r\n        // Here you can implement the logic to handle the offer request\r\n        console.log(\"Requesting offer for: \", {\r\n            name: this.name,\r\n            email: this.email,\r\n            systemConfig: this.systemConfigs,\r\n            consumption: this.householdConsumption,\r\n            autonomy: this.autonomy,\r\n            costSavings: this.costSavings,\r\n            roofPolygons: this.roofPolygons,\r\n            obstructionPolygons: this.obstructionPolygons,\r\n        });\r\n    }\r\n\r\n    render() {\r\n        const t = getLanguageStrings(this.language);\r\n        return (\r\n            <div class=\"flex flex-col justify-center items-center w-full h-full pt-4\" // style={{\r\n                //     display: (Object.keys(this.systemConfigs).length === 0)\r\n                //         ? \"none\"\r\n                //         : \"flex\",\r\n                // }}\r\n            >\r\n                <h1 class=\"text-2xl font-bold text-[#271200] mb-4 w-full\">\r\n                    {t.solarSystemForm.title}\r\n                </h1>\r\n\r\n                <div class=\"w-full bg-[#f3ebda] rounded-4xl p-6 space-y-6\">\r\n                    {/* System Info Section */}\r\n                    <div class=\"space-y-4\">\r\n                        <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n                            {t.solarSystemForm.systemInformation}\r\n                        </h2>\r\n                        <div class=\"grid grid-rows-2 gap-0\">\r\n                            <div class=\"grid grid-cols-2 gap-4\">\r\n                                <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n                                    {t.solarSystemForm.numberOfPanels}\r\n                                </label>\r\n                                <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n                                    {t.solarSystemForm.panelPeakPower}\r\n                                </label>\r\n                            </div>\r\n                            <div class=\"grid grid-cols-2 gap-4\">\r\n                                <input\r\n                                    type=\"number\"\r\n                                    class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n                                    value={this.numberOfPanels}\r\n                                    readOnly\r\n                                />\r\n                                <input\r\n                                    type=\"number\"\r\n                                    class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n                                    value={this.panelPeakPower}\r\n                                    readonly\r\n                                />\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"bg-white rounded-4xl p-4\">\r\n                            <div class=\"flex items-center justify-between\">\r\n                                <span class=\"text-gray-600\">\r\n                                    {t.solarSystemForm.totalSystemPeakPower}\r\n                                </span>\r\n                                <span class=\"text-xl font-bold text-[#271200]\">\r\n                                    {(DEFAULT_SOLAR_PANEL_TYPE.kWattPeak *\r\n                                        this.numberOfPanels).toFixed(1)} kW\r\n                                </span>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n                    {/* Household Consumption Section */}\r\n                    <div class=\"space-y-4\">\r\n                        <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n                            {t.solarSystemForm.householdConsumptionTitle}\r\n                        </h2>\r\n                        <div class=\"grid grid-rows-2 gap-0\">\r\n                            <div class=\"grid grid-cols-2 gap-4\">\r\n                                <label class=\"block text-sm font-medium text-gray-600\">\r\n                                    {t.solarSystemForm.annualConsumption}\r\n                                </label>\r\n                                <label class=\"block text-sm font-medium text-gray-600\">\r\n                                    {t.solarSystemForm.consumptionProfileTitle}\r\n                                </label>\r\n                            </div>\r\n                            <div class=\"grid grid-cols-2 gap-4\">\r\n                                <input\r\n                                    type=\"number\"\r\n                                    class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n                                    value={this.householdConsumption}\r\n                                    onInput={(e) => {\r\n                                        this.householdConsumption = parseInt(\r\n                                            (e.target as HTMLInputElement)\r\n                                                .value,\r\n                                        );\r\n                                        this.recalculate();\r\n                                        this.updateChart();\r\n                                    }}\r\n                                />\r\n                                <select\r\n                                    class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n                                    onChange={(e) => {\r\n                                        this.consumptionProfile =\r\n                                            (e.target as HTMLSelectElement)\r\n                                                .value as\r\n                                                    | \"mostly_at_home\"\r\n                                                    | \"mostly_away\";\r\n                                        this.recalculate();\r\n                                        this.updateChart();\r\n                                    }}\r\n                                >\r\n                                    <option\r\n                                        value=\"mostly_at_home\"\r\n                                        selected={this.consumptionProfile ===\r\n                                            \"mostly_at_home\"}\r\n                                    >\r\n                                        {t.solarSystemForm.consumptionProfiles\r\n                                            .mostlyAtHome}\r\n                                    </option>\r\n                                    <option\r\n                                        value=\"mostly_away\"\r\n                                        selected={this.consumptionProfile ===\r\n                                            \"mostly_away\"}\r\n                                    >\r\n                                        {t.solarSystemForm.consumptionProfiles\r\n                                            .mostlyAway}\r\n                                    </option>\r\n                                </select>\r\n                            </div>\r\n                        </div>\r\n                        {\r\n                            /* <div class=\"mt-4 h-48\">\r\n                            <canvas ref={(el) => this.chartRef = el}></canvas>\r\n                        </div> */\r\n                        }\r\n                    </div>\r\n                    <div class=\"space-y-4\">\r\n                        <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n                            Additional Components\r\n                        </h2>\r\n                        <div class=\"grid grid-rows-2 gap-4\">\r\n                        </div>\r\n                    </div>\r\n\r\n                    {/* Heat Pump Section */}\r\n\r\n                    {/* Battery Section */}\r\n\r\n                    {/* Electric Car Section */}\r\n\r\n                    {/* Electricity Price and Compensation Section */}\r\n                    <div class=\"space-y-4\">\r\n                        <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n                            {t.solarSystemForm.electricityCostsTitle}\r\n                        </h2>\r\n                        <div class=\"grid grid-rows-2 gap-0\">\r\n                            <div class=\"grid grid-cols-2 gap-4\">\r\n                                <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n                                    {t.solarSystemForm.electricityPrice}\r\n                                </label>\r\n                                <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n                                    {t.solarSystemForm.compensationRate}\r\n                                </label>\r\n                            </div>\r\n                            <div class=\"grid grid-cols-2 gap-4\">\r\n                                <input\r\n                                    type=\"number\"\r\n                                    step=\"0.01\"\r\n                                    class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n                                    value={this.electricityPrice.toFixed(2)}\r\n                                    onInput={(e) => {\r\n                                        this.electricityPrice = parseFloat(\r\n                                            (e.target as HTMLInputElement)\r\n                                                .value,\r\n                                        );\r\n                                        this.recalculate();\r\n                                        this.updateChart();\r\n                                    }}\r\n                                />\r\n                                <input\r\n                                    type=\"number\"\r\n                                    step=\"0.01\"\r\n                                    class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white\"\r\n                                    value={this.compensationRate.toFixed(2)}\r\n                                    onInput={(e) => {\r\n                                        this.compensationRate = parseFloat(\r\n                                            (e.target as HTMLInputElement)\r\n                                                .value,\r\n                                        );\r\n                                        this.recalculate();\r\n                                        this.updateChart();\r\n                                    }}\r\n                                />\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n\r\n                    {/* Results Section */}\r\n                    <div class=\"space-y-4 pt-4 border-t border-gray-200\">\r\n                        <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n                            {t.solarSystemForm.resultsTitle}\r\n                        </h2>\r\n                        <div class=\"bg-white rounded-4xl p-4\">\r\n                            <div class=\"flex items-center justify-between\">\r\n                                <span class=\"text-gray-600\">\r\n                                    {t.solarSystemForm.autonomy}\r\n                                </span>\r\n                                <span class=\"text-xl font-bold text-[#271200]\">\r\n                                    {this.autonomy.toFixed(1)}%\r\n                                </span>\r\n                            </div>\r\n                            <div class=\"flex items-center justify-between mt-4\">\r\n                                <div class=\"flex items-center gap-2\">\r\n                                    <span class=\"text-gray-600\">\r\n                                        {t.solarSystemForm.costSavings}\r\n                                    </span>\r\n                                    <div class=\"relative group\">\r\n                                        <svg\r\n                                            xmlns=\"http://www.w3.org/2000/svg\"\r\n                                            class=\"h-5 w-5 text-gray-400 cursor-help\"\r\n                                            viewBox=\"0 0 20 20\"\r\n                                            fill=\"currentColor\"\r\n                                        >\r\n                                            <path\r\n                                                fill-rule=\"evenodd\"\r\n                                                d=\"M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-8-3a1 1 0 00-.867.5 1 1 0 11-1.731-1A3 3 0 0113 8a3.001 3.001 0 01-2 2.83V11a1 1 0 11-2 0v-1a1 1 0 011-1 1 1 0 100-2zm0 8a1 1 0 100-2 1 1 0 000 2z\"\r\n                                                clip-rule=\"evenodd\"\r\n                                            />\r\n                                        </svg>\r\n                                        <div class=\"absolute bottom-full left-1/2 transform -translate-x-1/2 mb-2 w-64 p-2 bg-gray-800 text-white text-sm rounded-lg opacity-0 group-hover:opacity-100 transition-opacity duration-200 pointer-events-none\">\r\n                                            {t.solarSystemForm\r\n                                                .savingsDisclaimer}\r\n                                        </div>\r\n                                    </div>\r\n                                </div>\r\n                                <span class=\"text-xl font-bold text-green-600\">\r\n                                    {this.costSavings.toFixed(2)}€/{t\r\n                                        .solarSystemForm.year}\r\n                                </span>\r\n                            </div>\r\n                        </div>\r\n                    </div>\r\n\r\n                    {/* Contact Information Section */}\r\n                    <div class=\"space-y-4 pt-4 border-t border-gray-200\">\r\n                        <h2 class=\"text-lg font-semibold text-[#271200]\">\r\n                            {t.solarSystemForm.requestOffer}\r\n                        </h2>\r\n                        <div class=\"grid grid-rows-2 gap-0\">\r\n                            <div class=\"grid grid-cols-2 gap-4\">\r\n                                <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n                                    {t.solarSystemForm.name}\r\n                                </label>\r\n                                <label class=\"block text-sm font-medium text-gray-600 mb-1\">\r\n                                    {t.solarSystemForm.email}\r\n                                </label>\r\n                            </div>\r\n                            <div class=\"grid grid-cols-2 gap-4\">\r\n                                <input\r\n                                    type=\"text\"\r\n                                    class={`w-full px-4 py-2 rounded-4xl border ${\r\n                                        this.nameError\r\n                                            ? \"border-red-500\"\r\n                                            : \"border-gray-300\"\r\n                                    } focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white`}\r\n                                    value={this.name}\r\n                                    onInput={(e) => {\r\n                                        this.name =\r\n                                            (e.target as HTMLInputElement)\r\n                                                .value;\r\n                                        this.validateForm();\r\n                                    }}\r\n                                    placeholder=\"Your name\"\r\n                                />\r\n                                {this.nameError && (\r\n                                    <p class=\"text-red-500 text-sm mt-1\">\r\n                                        {this.nameError}\r\n                                    </p>\r\n                                )}\r\n                                <input\r\n                                    type=\"email\"\r\n                                    class={`w-full px-4 py-2 rounded-4xl border ${\r\n                                        this.emailError\r\n                                            ? \"border-red-500\"\r\n                                            : \"border-gray-300\"\r\n                                    } focus:ring-2 focus:ring-[#964500] focus:border-transparent bg-white`}\r\n                                    value={this.email}\r\n                                    onInput={(e) => {\r\n                                        this.email =\r\n                                            (e.target as HTMLInputElement)\r\n                                                .value;\r\n                                        this.validateForm();\r\n                                    }}\r\n                                    placeholder=\"your.email@example.com\"\r\n                                />\r\n                                {this.emailError && (\r\n                                    <p class=\"text-red-500 text-sm mt-1\">\r\n                                        {this.emailError}\r\n                                    </p>\r\n                                )}\r\n                            </div>\r\n                        </div>\r\n                        <div class=\"flex justify-center\">\r\n                            <button\r\n                                onClick={() => this.handleRequestOffer()}\r\n                                disabled={!this.name.trim() ||\r\n                                    !this.email.trim() || !!this.nameError ||\r\n                                    !!this.emailError}\r\n                                class=\"px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#964500] transition-colors duration-200\"\r\n                                style={{ color: \"white\" }}\r\n                            >\r\n                                {t.solarSystemForm.requestOfferButton}\r\n                            </button>\r\n                        </div>\r\n                    </div>\r\n                </div>\r\n            </div>\r\n        );\r\n    }\r\n}\r\n"],"version":3}

package/dist/components/{p-CwSYsL57.js → p-DEfwuR25.js}

@@ -1,12 +1,12 @@
 import { p as proxyCustomElement, H, h } from './index.js';
 import { f as fetchSolarData, b as getBuildingImages } from './p-DCSfVybE.js';
-import { d as defineCustomElement$1, D as DEFAULT_SOLAR_EXPERT_CONFIG, a as DEFAULT_SOLAR_PANEL_TYPE, g as getLanguageStrings } from './p-CllhWhkE.js';
-import { d as defineCustomElement$7 } from './p-BfS46GQh.js';
-import { d as defineCustomElement$6 } from './p-CX4Jw4PK.js';
-import { d as defineCustomElement$5 } from './p-BwC0qfb_.js';
-import { d as defineCustomElement$4 } from './p-OliNFLPu.js';
-import { d as defineCustomElement$3 } from './p-9ZUfi3zn.js';
-import { d as defineCustomElement$2 } from './p-uvNP9DQ_.js';
+import { d as defineCustomElement$1, D as DEFAULT_SOLAR_EXPERT_CONFIG, a as DEFAULT_SOLAR_PANEL_TYPE, g as getLanguageStrings } from './p-D6cs3r7j.js';
+import { d as defineCustomElement$7 } from './p-CB8h41UZ.js';
+import { d as defineCustomElement$6 } from './p-C46bD4Bg.js';
+import { d as defineCustomElement$5 } from './p-Cg3h6HF4.js';
+import { d as defineCustomElement$4 } from './p-DP1y5q1K.js';
+import { d as defineCustomElement$3 } from './p-BGspvo5S.js';
+import { d as defineCustomElement$2 } from './p-CHsmfSJD.js';
 
 /*
  Copyright 2023 Google LLC
@@ -734,7 +734,6 @@ function getOptimalSolarPosition(roof, obstacles, solarPanel, angle) {
         minY: minY,
         maxY: maxY
     };
-    console.log("solar", solarPanel);
     const horizontalSolarPanel = {
         ...solarPanel,
         widthMeters: solarPanel.widthMeters * Math.cos(angle * Math.PI / 180),
@@ -873,9 +872,8 @@ function getOptimalSolarPositionFully(roof, obstacles, solarPanel, azimuth, inse
     return unprojectedPanels;
 }
 
-const outputCss = "/*! tailwindcss v4.1.7 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n  :root, :host {\n    --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n      \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n      \"Courier New\", monospace;\n    --color-red-500: oklch(63.7% 0.237 25.331);\n    --color-green-600: oklch(62.7% 0.194 149.214);\n    --color-blue-500: oklch(62.3% 0.214 259.815);\n    --color-gray-50: oklch(98.5% 0.002 247.839);\n    --color-gray-200: oklch(92.8% 0.006 264.531);\n    --color-gray-300: oklch(87.2% 0.01 258.338);\n    --color-gray-400: oklch(70.7% 0.022 261.325);\n    --color-gray-500: oklch(55.1% 0.027 264.364);\n    --color-gray-600: oklch(44.6% 0.03 256.802);\n    --color-gray-700: oklch(37.3% 0.034 259.733);\n    --color-gray-800: oklch(27.8% 0.033 256.848);\n    --color-black: #000;\n    --color-white: #fff;\n    --spacing: 0.25rem;\n    --container-xl: 36rem;\n    --container-2xl: 42rem;\n    --container-3xl: 48rem;\n    --text-sm: 0.875rem;\n    --text-sm--line-height: calc(1.25 / 0.875);\n    --text-lg: 1.125rem;\n    --text-lg--line-height: calc(1.75 / 1.125);\n    --text-xl: 1.25rem;\n    --text-xl--line-height: calc(1.75 / 1.25);\n    --text-2xl: 1.5rem;\n    --text-2xl--line-height: calc(2 / 1.5);\n    --text-3xl: 1.875rem;\n    --text-3xl--line-height: calc(2.25 / 1.875);\n    --font-weight-medium: 500;\n    --font-weight-semibold: 600;\n    --font-weight-bold: 700;\n    --radius-lg: 0.5rem;\n    --radius-xl: 0.75rem;\n    --radius-2xl: 1rem;\n    --radius-4xl: 2rem;\n    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n    --animate-spin: spin 1s linear infinite;\n    --default-transition-duration: 150ms;\n    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    --default-font-family: var(--font-sans);\n    --default-mono-font-family: var(--font-mono);\n  }\n}\n@layer base {\n  *, ::after, ::before, ::backdrop, ::file-selector-button {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n    border: 0 solid;\n  }\n  html, :host {\n    line-height: 1.5;\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    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\");\n    font-feature-settings: var(--default-font-feature-settings, normal);\n    font-variation-settings: var(--default-font-variation-settings, normal);\n    -webkit-tap-highlight-color: transparent;\n  }\n  hr {\n    height: 0;\n    color: inherit;\n    border-top-width: 1px;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1, h2, h3, h4, h5, h6 {\n    font-size: inherit;\n    font-weight: inherit;\n  }\n  a {\n    color: inherit;\n    -webkit-text-decoration: inherit;\n    text-decoration: inherit;\n  }\n  b, strong {\n    font-weight: bolder;\n  }\n  code, kbd, samp, pre {\n    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n    font-feature-settings: var(--default-mono-font-feature-settings, normal);\n    font-variation-settings: var(--default-mono-font-variation-settings, normal);\n    font-size: 1em;\n  }\n  small {\n    font-size: 80%;\n  }\n  sub, sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n  sub {\n    bottom: -0.25em;\n  }\n  sup {\n    top: -0.5em;\n  }\n  table {\n    text-indent: 0;\n    border-color: inherit;\n    border-collapse: collapse;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  summary {\n    display: list-item;\n  }\n  ol, ul, menu {\n    list-style: none;\n  }\n  img, svg, video, canvas, audio, iframe, embed, object {\n    display: block;\n    vertical-align: middle;\n  }\n  img, video {\n    max-width: 100%;\n    height: auto;\n  }\n  button, input, select, optgroup, textarea, ::file-selector-button {\n    font: inherit;\n    font-feature-settings: inherit;\n    font-variation-settings: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n    border-radius: 0;\n    background-color: transparent;\n    opacity: 1;\n  }\n  :where(select:is([multiple], [size])) optgroup {\n    font-weight: bolder;\n  }\n  :where(select:is([multiple], [size])) optgroup option {\n    padding-inline-start: 20px;\n  }\n  ::file-selector-button {\n    margin-inline-end: 4px;\n  }\n  ::placeholder {\n    opacity: 1;\n  }\n  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {\n    ::placeholder {\n      color: currentcolor;\n      @supports (color: color-mix(in lab, red, red)) {\n        color: color-mix(in oklab, currentcolor 50%, transparent);\n      }\n    }\n  }\n  textarea {\n    resize: vertical;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-date-and-time-value {\n    min-height: 1lh;\n    text-align: inherit;\n  }\n  ::-webkit-datetime-edit {\n    display: inline-flex;\n  }\n  ::-webkit-datetime-edit-fields-wrapper {\n    padding: 0;\n  }\n  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n    padding-block: 0;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n    appearance: button;\n  }\n  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [hidden]:where(:not([hidden=\"until-found\"])) {\n    display: none !important;\n  }\n}\n@layer utilities {\n  .pointer-events-none {\n    pointer-events: none;\n  }\n  .absolute {\n    position: absolute;\n  }\n  .relative {\n    position: relative;\n  }\n  .top-0 {\n    top: calc(var(--spacing) * 0);\n  }\n  .top-1 {\n    top: calc(var(--spacing) * 1);\n  }\n  .top-1\\/2 {\n    top: calc(1/2 * 100%);\n  }\n  .bottom-full {\n    bottom: 100%;\n  }\n  .left-0 {\n    left: calc(var(--spacing) * 0);\n  }\n  .left-1 {\n    left: calc(var(--spacing) * 1);\n  }\n  .left-1\\/2 {\n    left: calc(1/2 * 100%);\n  }\n  .left-3 {\n    left: calc(var(--spacing) * 3);\n  }\n  .z-1 {\n    z-index: 1;\n  }\n  .z-10 {\n    z-index: 10;\n  }\n  .z-20 {\n    z-index: 20;\n  }\n  .m-auto {\n    margin: auto;\n  }\n  .mt-1 {\n    margin-top: calc(var(--spacing) * 1);\n  }\n  .mt-4 {\n    margin-top: calc(var(--spacing) * 4);\n  }\n  .mb-1 {\n    margin-bottom: calc(var(--spacing) * 1);\n  }\n  .mb-2 {\n    margin-bottom: calc(var(--spacing) * 2);\n  }\n  .mb-4 {\n    margin-bottom: calc(var(--spacing) * 4);\n  }\n  .block {\n    display: block;\n  }\n  .flex {\n    display: flex;\n  }\n  .grid {\n    display: grid;\n  }\n  .inline {\n    display: inline;\n  }\n  .inline-block {\n    display: inline-block;\n  }\n  .table {\n    display: table;\n  }\n  .h-4 {\n    height: calc(var(--spacing) * 4);\n  }\n  .h-5 {\n    height: calc(var(--spacing) * 5);\n  }\n  .h-16 {\n    height: calc(var(--spacing) * 16);\n  }\n  .h-48 {\n    height: calc(var(--spacing) * 48);\n  }\n  .h-full {\n    height: 100%;\n  }\n  .w-4 {\n    width: calc(var(--spacing) * 4);\n  }\n  .w-5 {\n    width: calc(var(--spacing) * 5);\n  }\n  .w-16 {\n    width: calc(var(--spacing) * 16);\n  }\n  .w-52 {\n    width: calc(var(--spacing) * 52);\n  }\n  .w-64 {\n    width: calc(var(--spacing) * 64);\n  }\n  .w-full {\n    width: 100%;\n  }\n  .max-w-2xl {\n    max-width: var(--container-2xl);\n  }\n  .max-w-3xl {\n    max-width: var(--container-3xl);\n  }\n  .max-w-xl {\n    max-width: var(--container-xl);\n  }\n  .flex-1 {\n    flex: 1;\n  }\n  .border-collapse {\n    border-collapse: collapse;\n  }\n  .-translate-x-1 {\n    --tw-translate-x: calc(var(--spacing) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-x-1\\/2 {\n    --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-y-1 {\n    --tw-translate-y: calc(var(--spacing) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-y-1\\/2 {\n    --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .transform {\n    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n  }\n  .animate-spin {\n    animation: var(--animate-spin);\n  }\n  .cursor-help {\n    cursor: help;\n  }\n  .resize {\n    resize: both;\n  }\n  .auto-cols-max {\n    grid-auto-columns: max-content;\n  }\n  .grid-flow-col {\n    grid-auto-flow: column;\n  }\n  .grid-cols-2 {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n  .grid-cols-4 {\n    grid-template-columns: repeat(4, minmax(0, 1fr));\n  }\n  .grid-rows-2 {\n    grid-template-rows: repeat(2, minmax(0, 1fr));\n  }\n  .flex-col {\n    flex-direction: column;\n  }\n  .flex-row {\n    flex-direction: row;\n  }\n  .flex-wrap {\n    flex-wrap: wrap;\n  }\n  .place-items-stretch {\n    place-items: stretch;\n  }\n  .items-center {\n    align-items: center;\n  }\n  .items-start {\n    align-items: flex-start;\n  }\n  .justify-between {\n    justify-content: space-between;\n  }\n  .justify-center {\n    justify-content: center;\n  }\n  .justify-start {\n    justify-content: flex-start;\n  }\n  .gap-0 {\n    gap: calc(var(--spacing) * 0);\n  }\n  .gap-1 {\n    gap: calc(var(--spacing) * 1);\n  }\n  .gap-2 {\n    gap: calc(var(--spacing) * 2);\n  }\n  .gap-4 {\n    gap: calc(var(--spacing) * 4);\n  }\n  .space-y-4 {\n    :where(& > :not(:last-child)) {\n      --tw-space-y-reverse: 0;\n      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n    }\n  }\n  .space-y-6 {\n    :where(& > :not(:last-child)) {\n      --tw-space-y-reverse: 0;\n      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n    }\n  }\n  .rounded-4xl {\n    border-radius: var(--radius-4xl);\n  }\n  .rounded-full {\n    border-radius: calc(infinity * 1px);\n  }\n  .rounded-lg {\n    border-radius: var(--radius-lg);\n  }\n  .border {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n  }\n  .border-t {\n    border-top-style: var(--tw-border-style);\n    border-top-width: 1px;\n  }\n  .border-t-2 {\n    border-top-style: var(--tw-border-style);\n    border-top-width: 2px;\n  }\n  .border-b-2 {\n    border-bottom-style: var(--tw-border-style);\n    border-bottom-width: 2px;\n  }\n  .border-\\[\\#271200\\] {\n    border-color: #271200;\n  }\n  .border-gray-200 {\n    border-color: var(--color-gray-200);\n  }\n  .border-gray-300 {\n    border-color: var(--color-gray-300);\n  }\n  .border-red-500 {\n    border-color: var(--color-red-500);\n  }\n  .bg-\\[\\#271200\\] {\n    background-color: #271200;\n  }\n  .bg-\\[\\#f3ebda\\] {\n    background-color: #f3ebda;\n  }\n  .bg-black {\n    background-color: var(--color-black);\n  }\n  .bg-gray-200 {\n    background-color: var(--color-gray-200);\n  }\n  .bg-gray-500 {\n    background-color: var(--color-gray-500);\n  }\n  .bg-gray-800 {\n    background-color: var(--color-gray-800);\n  }\n  .bg-white {\n    background-color: var(--color-white);\n  }\n  .object-contain {\n    object-fit: contain;\n  }\n  .p-1 {\n    padding: calc(var(--spacing) * 1);\n  }\n  .p-2 {\n    padding: calc(var(--spacing) * 2);\n  }\n  .p-3 {\n    padding: calc(var(--spacing) * 3);\n  }\n  .p-4 {\n    padding: calc(var(--spacing) * 4);\n  }\n  .p-6 {\n    padding: calc(var(--spacing) * 6);\n  }\n  .px-4 {\n    padding-inline: calc(var(--spacing) * 4);\n  }\n  .py-2 {\n    padding-block: calc(var(--spacing) * 2);\n  }\n  .pt-4 {\n    padding-top: calc(var(--spacing) * 4);\n  }\n  .pt-7 {\n    padding-top: calc(var(--spacing) * 7);\n  }\n  .pr-4 {\n    padding-right: calc(var(--spacing) * 4);\n  }\n  .pb-3 {\n    padding-bottom: calc(var(--spacing) * 3);\n  }\n  .pl-2 {\n    padding-left: calc(var(--spacing) * 2);\n  }\n  .pl-10 {\n    padding-left: calc(var(--spacing) * 10);\n  }\n  .text-center {\n    text-align: center;\n  }\n  .text-2xl {\n    font-size: var(--text-2xl);\n    line-height: var(--tw-leading, var(--text-2xl--line-height));\n  }\n  .text-lg {\n    font-size: var(--text-lg);\n    line-height: var(--tw-leading, var(--text-lg--line-height));\n  }\n  .text-sm {\n    font-size: var(--text-sm);\n    line-height: var(--tw-leading, var(--text-sm--line-height));\n  }\n  .text-xl {\n    font-size: var(--text-xl);\n    line-height: var(--tw-leading, var(--text-xl--line-height));\n  }\n  .font-bold {\n    --tw-font-weight: var(--font-weight-bold);\n    font-weight: var(--font-weight-bold);\n  }\n  .font-medium {\n    --tw-font-weight: var(--font-weight-medium);\n    font-weight: var(--font-weight-medium);\n  }\n  .font-semibold {\n    --tw-font-weight: var(--font-weight-semibold);\n    font-weight: var(--font-weight-semibold);\n  }\n  .text-\\[\\#271200\\] {\n    color: #271200;\n  }\n  .text-gray-400 {\n    color: var(--color-gray-400);\n  }\n  .text-gray-500 {\n    color: var(--color-gray-500);\n  }\n  .text-gray-600 {\n    color: var(--color-gray-600);\n  }\n  .text-green-600 {\n    color: var(--color-green-600);\n  }\n  .text-red-500 {\n    color: var(--color-red-500);\n  }\n  .text-white {\n    color: var(--color-white);\n  }\n  .underline {\n    text-decoration-line: underline;\n  }\n  .opacity-0 {\n    opacity: 0%;\n  }\n  .shadow {\n    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .outline {\n    outline-style: var(--tw-outline-style);\n    outline-width: 1px;\n  }\n  .transition-colors {\n    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n    transition-duration: var(--tw-duration, var(--default-transition-duration));\n  }\n  .transition-opacity {\n    transition-property: opacity;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n    transition-duration: var(--tw-duration, var(--default-transition-duration));\n  }\n  .duration-200 {\n    --tw-duration: 200ms;\n    transition-duration: 200ms;\n  }\n  .group-hover\\:opacity-100 {\n    &:is(:where(.group):hover *) {\n      @media (hover: hover) {\n        opacity: 100%;\n      }\n    }\n  }\n  .hover\\:bg-\\[\\#964500\\] {\n    &:hover {\n      @media (hover: hover) {\n        background-color: #964500;\n      }\n    }\n  }\n  .hover\\:bg-\\[\\#ffffff\\] {\n    &:hover {\n      @media (hover: hover) {\n        background-color: #ffffff;\n      }\n    }\n  }\n  .hover\\:bg-gray-50 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-50);\n      }\n    }\n  }\n  .hover\\:bg-gray-200 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-200);\n      }\n    }\n  }\n  .hover\\:bg-gray-500 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-500);\n      }\n    }\n  }\n  .hover\\:bg-white {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-white);\n      }\n    }\n  }\n  .hover\\:text-\\[\\#271200\\] {\n    &:hover {\n      @media (hover: hover) {\n        color: #271200;\n      }\n    }\n  }\n  .focus\\:border-transparent {\n    &:focus {\n      border-color: transparent;\n    }\n  }\n  .focus\\:ring-2 {\n    &:focus {\n      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n    }\n  }\n  .focus\\:ring-\\[\\#964500\\] {\n    &:focus {\n      --tw-ring-color: #964500;\n    }\n  }\n  .focus\\:ring-blue-500 {\n    &:focus {\n      --tw-ring-color: var(--color-blue-500);\n    }\n  }\n  .focus\\:outline-none {\n    &:focus {\n      --tw-outline-style: none;\n      outline-style: none;\n    }\n  }\n  .lg\\:gap-4 {\n    @media (width >= 64rem) {\n      gap: calc(var(--spacing) * 4);\n    }\n  }\n}\n@property --tw-translate-x {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-translate-y {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-translate-z {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-rotate-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-z {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-space-y-reverse {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-border-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-font-weight {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-inset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-offset-width {\n  syntax: \"<length>\";\n  inherits: false;\n  initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-duration {\n  syntax: \"*\";\n  inherits: false;\n}\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@layer properties {\n  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n    *, ::before, ::after, ::backdrop {\n      --tw-translate-x: 0;\n      --tw-translate-y: 0;\n      --tw-translate-z: 0;\n      --tw-rotate-x: initial;\n      --tw-rotate-y: initial;\n      --tw-rotate-z: initial;\n      --tw-skew-x: initial;\n      --tw-skew-y: initial;\n      --tw-space-y-reverse: 0;\n      --tw-border-style: solid;\n      --tw-font-weight: initial;\n      --tw-shadow: 0 0 #0000;\n      --tw-shadow-color: initial;\n      --tw-shadow-alpha: 100%;\n      --tw-inset-shadow: 0 0 #0000;\n      --tw-inset-shadow-color: initial;\n      --tw-inset-shadow-alpha: 100%;\n      --tw-ring-color: initial;\n      --tw-ring-shadow: 0 0 #0000;\n      --tw-inset-ring-color: initial;\n      --tw-inset-ring-shadow: 0 0 #0000;\n      --tw-ring-inset: initial;\n      --tw-ring-offset-width: 0px;\n      --tw-ring-offset-color: #fff;\n      --tw-ring-offset-shadow: 0 0 #0000;\n      --tw-outline-style: solid;\n      --tw-duration: initial;\n    }\n  }\n}\n";
+const outputCss = "/*! tailwindcss v4.1.7 | MIT License | https://tailwindcss.com */\n@layer properties;\n@layer theme, base, components, utilities;\n@layer theme {\n  :root, :host {\n    --font-sans: ui-sans-serif, system-ui, sans-serif, \"Apple Color Emoji\",\n      \"Segoe UI Emoji\", \"Segoe UI Symbol\", \"Noto Color Emoji\";\n    --font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\",\n      \"Courier New\", monospace;\n    --color-red-500: oklch(63.7% 0.237 25.331);\n    --color-green-600: oklch(62.7% 0.194 149.214);\n    --color-blue-500: oklch(62.3% 0.214 259.815);\n    --color-purple-500: oklch(62.7% 0.265 303.9);\n    --color-gray-50: oklch(98.5% 0.002 247.839);\n    --color-gray-200: oklch(92.8% 0.006 264.531);\n    --color-gray-300: oklch(87.2% 0.01 258.338);\n    --color-gray-400: oklch(70.7% 0.022 261.325);\n    --color-gray-500: oklch(55.1% 0.027 264.364);\n    --color-gray-600: oklch(44.6% 0.03 256.802);\n    --color-gray-700: oklch(37.3% 0.034 259.733);\n    --color-gray-800: oklch(27.8% 0.033 256.848);\n    --color-black: #000;\n    --color-white: #fff;\n    --spacing: 0.25rem;\n    --container-xl: 36rem;\n    --container-2xl: 42rem;\n    --container-3xl: 48rem;\n    --text-sm: 0.875rem;\n    --text-sm--line-height: calc(1.25 / 0.875);\n    --text-lg: 1.125rem;\n    --text-lg--line-height: calc(1.75 / 1.125);\n    --text-xl: 1.25rem;\n    --text-xl--line-height: calc(1.75 / 1.25);\n    --text-2xl: 1.5rem;\n    --text-2xl--line-height: calc(2 / 1.5);\n    --text-3xl: 1.875rem;\n    --text-3xl--line-height: calc(2.25 / 1.875);\n    --font-weight-medium: 500;\n    --font-weight-semibold: 600;\n    --font-weight-bold: 700;\n    --radius-lg: 0.5rem;\n    --radius-xl: 0.75rem;\n    --radius-2xl: 1rem;\n    --radius-4xl: 2rem;\n    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);\n    --animate-spin: spin 1s linear infinite;\n    --default-transition-duration: 150ms;\n    --default-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n    --default-font-family: var(--font-sans);\n    --default-mono-font-family: var(--font-mono);\n  }\n}\n@layer base {\n  *, ::after, ::before, ::backdrop, ::file-selector-button {\n    box-sizing: border-box;\n    margin: 0;\n    padding: 0;\n    border: 0 solid;\n  }\n  html, :host {\n    line-height: 1.5;\n    -webkit-text-size-adjust: 100%;\n    tab-size: 4;\n    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\");\n    font-feature-settings: var(--default-font-feature-settings, normal);\n    font-variation-settings: var(--default-font-variation-settings, normal);\n    -webkit-tap-highlight-color: transparent;\n  }\n  hr {\n    height: 0;\n    color: inherit;\n    border-top-width: 1px;\n  }\n  abbr:where([title]) {\n    -webkit-text-decoration: underline dotted;\n    text-decoration: underline dotted;\n  }\n  h1, h2, h3, h4, h5, h6 {\n    font-size: inherit;\n    font-weight: inherit;\n  }\n  a {\n    color: inherit;\n    -webkit-text-decoration: inherit;\n    text-decoration: inherit;\n  }\n  b, strong {\n    font-weight: bolder;\n  }\n  code, kbd, samp, pre {\n    font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, \"Liberation Mono\", \"Courier New\", monospace);\n    font-feature-settings: var(--default-mono-font-feature-settings, normal);\n    font-variation-settings: var(--default-mono-font-variation-settings, normal);\n    font-size: 1em;\n  }\n  small {\n    font-size: 80%;\n  }\n  sub, sup {\n    font-size: 75%;\n    line-height: 0;\n    position: relative;\n    vertical-align: baseline;\n  }\n  sub {\n    bottom: -0.25em;\n  }\n  sup {\n    top: -0.5em;\n  }\n  table {\n    text-indent: 0;\n    border-color: inherit;\n    border-collapse: collapse;\n  }\n  :-moz-focusring {\n    outline: auto;\n  }\n  progress {\n    vertical-align: baseline;\n  }\n  summary {\n    display: list-item;\n  }\n  ol, ul, menu {\n    list-style: none;\n  }\n  img, svg, video, canvas, audio, iframe, embed, object {\n    display: block;\n    vertical-align: middle;\n  }\n  img, video {\n    max-width: 100%;\n    height: auto;\n  }\n  button, input, select, optgroup, textarea, ::file-selector-button {\n    font: inherit;\n    font-feature-settings: inherit;\n    font-variation-settings: inherit;\n    letter-spacing: inherit;\n    color: inherit;\n    border-radius: 0;\n    background-color: transparent;\n    opacity: 1;\n  }\n  :where(select:is([multiple], [size])) optgroup {\n    font-weight: bolder;\n  }\n  :where(select:is([multiple], [size])) optgroup option {\n    padding-inline-start: 20px;\n  }\n  ::file-selector-button {\n    margin-inline-end: 4px;\n  }\n  ::placeholder {\n    opacity: 1;\n  }\n  @supports (not (-webkit-appearance: -apple-pay-button))  or (contain-intrinsic-size: 1px) {\n    ::placeholder {\n      color: currentcolor;\n      @supports (color: color-mix(in lab, red, red)) {\n        color: color-mix(in oklab, currentcolor 50%, transparent);\n      }\n    }\n  }\n  textarea {\n    resize: vertical;\n  }\n  ::-webkit-search-decoration {\n    -webkit-appearance: none;\n  }\n  ::-webkit-date-and-time-value {\n    min-height: 1lh;\n    text-align: inherit;\n  }\n  ::-webkit-datetime-edit {\n    display: inline-flex;\n  }\n  ::-webkit-datetime-edit-fields-wrapper {\n    padding: 0;\n  }\n  ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field {\n    padding-block: 0;\n  }\n  :-moz-ui-invalid {\n    box-shadow: none;\n  }\n  button, input:where([type=\"button\"], [type=\"reset\"], [type=\"submit\"]), ::file-selector-button {\n    appearance: button;\n  }\n  ::-webkit-inner-spin-button, ::-webkit-outer-spin-button {\n    height: auto;\n  }\n  [hidden]:where(:not([hidden=\"until-found\"])) {\n    display: none !important;\n  }\n}\n@layer utilities {\n  .pointer-events-none {\n    pointer-events: none;\n  }\n  .absolute {\n    position: absolute;\n  }\n  .relative {\n    position: relative;\n  }\n  .inset-0 {\n    inset: calc(var(--spacing) * 0);\n  }\n  .top-0 {\n    top: calc(var(--spacing) * 0);\n  }\n  .top-1 {\n    top: calc(var(--spacing) * 1);\n  }\n  .top-1\\/2 {\n    top: calc(1/2 * 100%);\n  }\n  .bottom-full {\n    bottom: 100%;\n  }\n  .left-0 {\n    left: calc(var(--spacing) * 0);\n  }\n  .left-1 {\n    left: calc(var(--spacing) * 1);\n  }\n  .left-1\\/2 {\n    left: calc(1/2 * 100%);\n  }\n  .left-3 {\n    left: calc(var(--spacing) * 3);\n  }\n  .z-1 {\n    z-index: 1;\n  }\n  .z-10 {\n    z-index: 10;\n  }\n  .z-20 {\n    z-index: 20;\n  }\n  .container {\n    width: 100%;\n    @media (width >= 40rem) {\n      max-width: 40rem;\n    }\n    @media (width >= 48rem) {\n      max-width: 48rem;\n    }\n    @media (width >= 64rem) {\n      max-width: 64rem;\n    }\n    @media (width >= 80rem) {\n      max-width: 80rem;\n    }\n    @media (width >= 96rem) {\n      max-width: 96rem;\n    }\n  }\n  .m-auto {\n    margin: auto;\n  }\n  .mt-1 {\n    margin-top: calc(var(--spacing) * 1);\n  }\n  .mt-4 {\n    margin-top: calc(var(--spacing) * 4);\n  }\n  .mb-1 {\n    margin-bottom: calc(var(--spacing) * 1);\n  }\n  .mb-2 {\n    margin-bottom: calc(var(--spacing) * 2);\n  }\n  .mb-4 {\n    margin-bottom: calc(var(--spacing) * 4);\n  }\n  .block {\n    display: block;\n  }\n  .flex {\n    display: flex;\n  }\n  .grid {\n    display: grid;\n  }\n  .hidden {\n    display: none;\n  }\n  .inline {\n    display: inline;\n  }\n  .inline-block {\n    display: inline-block;\n  }\n  .table {\n    display: table;\n  }\n  .h-4 {\n    height: calc(var(--spacing) * 4);\n  }\n  .h-5 {\n    height: calc(var(--spacing) * 5);\n  }\n  .h-16 {\n    height: calc(var(--spacing) * 16);\n  }\n  .h-48 {\n    height: calc(var(--spacing) * 48);\n  }\n  .h-full {\n    height: 100%;\n  }\n  .w-4 {\n    width: calc(var(--spacing) * 4);\n  }\n  .w-5 {\n    width: calc(var(--spacing) * 5);\n  }\n  .w-16 {\n    width: calc(var(--spacing) * 16);\n  }\n  .w-20 {\n    width: calc(var(--spacing) * 20);\n  }\n  .w-52 {\n    width: calc(var(--spacing) * 52);\n  }\n  .w-64 {\n    width: calc(var(--spacing) * 64);\n  }\n  .w-full {\n    width: 100%;\n  }\n  .max-w-2xl {\n    max-width: var(--container-2xl);\n  }\n  .max-w-3xl {\n    max-width: var(--container-3xl);\n  }\n  .max-w-xl {\n    max-width: var(--container-xl);\n  }\n  .flex-1 {\n    flex: 1;\n  }\n  .border-collapse {\n    border-collapse: collapse;\n  }\n  .-translate-x-1 {\n    --tw-translate-x: calc(var(--spacing) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-x-1\\/2 {\n    --tw-translate-x: calc(calc(1/2 * 100%) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-y-1 {\n    --tw-translate-y: calc(var(--spacing) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .-translate-y-1\\/2 {\n    --tw-translate-y: calc(calc(1/2 * 100%) * -1);\n    translate: var(--tw-translate-x) var(--tw-translate-y);\n  }\n  .transform {\n    transform: var(--tw-rotate-x,) var(--tw-rotate-y,) var(--tw-rotate-z,) var(--tw-skew-x,) var(--tw-skew-y,);\n  }\n  .animate-spin {\n    animation: var(--animate-spin);\n  }\n  .cursor-help {\n    cursor: help;\n  }\n  .resize {\n    resize: both;\n  }\n  .appearance-none {\n    appearance: none;\n  }\n  .auto-cols-max {\n    grid-auto-columns: max-content;\n  }\n  .grid-flow-col {\n    grid-auto-flow: column;\n  }\n  .grid-cols-2 {\n    grid-template-columns: repeat(2, minmax(0, 1fr));\n  }\n  .grid-cols-4 {\n    grid-template-columns: repeat(4, minmax(0, 1fr));\n  }\n  .grid-rows-2 {\n    grid-template-rows: repeat(2, minmax(0, 1fr));\n  }\n  .flex-col {\n    flex-direction: column;\n  }\n  .flex-row {\n    flex-direction: row;\n  }\n  .flex-wrap {\n    flex-wrap: wrap;\n  }\n  .place-items-stretch {\n    place-items: stretch;\n  }\n  .items-center {\n    align-items: center;\n  }\n  .items-start {\n    align-items: flex-start;\n  }\n  .justify-between {\n    justify-content: space-between;\n  }\n  .justify-center {\n    justify-content: center;\n  }\n  .justify-start {\n    justify-content: flex-start;\n  }\n  .gap-0 {\n    gap: calc(var(--spacing) * 0);\n  }\n  .gap-1 {\n    gap: calc(var(--spacing) * 1);\n  }\n  .gap-2 {\n    gap: calc(var(--spacing) * 2);\n  }\n  .gap-4 {\n    gap: calc(var(--spacing) * 4);\n  }\n  .space-y-4 {\n    :where(& > :not(:last-child)) {\n      --tw-space-y-reverse: 0;\n      margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n      margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n    }\n  }\n  .space-y-6 {\n    :where(& > :not(:last-child)) {\n      --tw-space-y-reverse: 0;\n      margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n      margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n    }\n  }\n  .overflow-hidden {\n    overflow: hidden;\n  }\n  .rounded-4xl {\n    border-radius: var(--radius-4xl);\n  }\n  .rounded-full {\n    border-radius: calc(infinity * 1px);\n  }\n  .rounded-lg {\n    border-radius: var(--radius-lg);\n  }\n  .border {\n    border-style: var(--tw-border-style);\n    border-width: 1px;\n  }\n  .border-t {\n    border-top-style: var(--tw-border-style);\n    border-top-width: 1px;\n  }\n  .border-t-2 {\n    border-top-style: var(--tw-border-style);\n    border-top-width: 2px;\n  }\n  .border-b-2 {\n    border-bottom-style: var(--tw-border-style);\n    border-bottom-width: 2px;\n  }\n  .border-\\[\\#271200\\] {\n    border-color: #271200;\n  }\n  .border-gray-200 {\n    border-color: var(--color-gray-200);\n  }\n  .border-gray-300 {\n    border-color: var(--color-gray-300);\n  }\n  .border-red-500 {\n    border-color: var(--color-red-500);\n  }\n  .bg-\\[\\#271200\\] {\n    background-color: #271200;\n  }\n  .bg-\\[\\#f3ebda\\] {\n    background-color: #f3ebda;\n  }\n  .bg-black {\n    background-color: var(--color-black);\n  }\n  .bg-gray-200 {\n    background-color: var(--color-gray-200);\n  }\n  .bg-gray-500 {\n    background-color: var(--color-gray-500);\n  }\n  .bg-gray-800 {\n    background-color: var(--color-gray-800);\n  }\n  .bg-transparent {\n    background-color: transparent;\n  }\n  .bg-white {\n    background-color: var(--color-white);\n  }\n  .object-contain {\n    object-fit: contain;\n  }\n  .p-1 {\n    padding: calc(var(--spacing) * 1);\n  }\n  .p-2 {\n    padding: calc(var(--spacing) * 2);\n  }\n  .p-3 {\n    padding: calc(var(--spacing) * 3);\n  }\n  .p-4 {\n    padding: calc(var(--spacing) * 4);\n  }\n  .p-6 {\n    padding: calc(var(--spacing) * 6);\n  }\n  .px-4 {\n    padding-inline: calc(var(--spacing) * 4);\n  }\n  .py-2 {\n    padding-block: calc(var(--spacing) * 2);\n  }\n  .pt-4 {\n    padding-top: calc(var(--spacing) * 4);\n  }\n  .pt-7 {\n    padding-top: calc(var(--spacing) * 7);\n  }\n  .pr-4 {\n    padding-right: calc(var(--spacing) * 4);\n  }\n  .pb-3 {\n    padding-bottom: calc(var(--spacing) * 3);\n  }\n  .pl-2 {\n    padding-left: calc(var(--spacing) * 2);\n  }\n  .pl-10 {\n    padding-left: calc(var(--spacing) * 10);\n  }\n  .text-center {\n    text-align: center;\n  }\n  .text-2xl {\n    font-size: var(--text-2xl);\n    line-height: var(--tw-leading, var(--text-2xl--line-height));\n  }\n  .text-lg {\n    font-size: var(--text-lg);\n    line-height: var(--tw-leading, var(--text-lg--line-height));\n  }\n  .text-sm {\n    font-size: var(--text-sm);\n    line-height: var(--tw-leading, var(--text-sm--line-height));\n  }\n  .text-xl {\n    font-size: var(--text-xl);\n    line-height: var(--tw-leading, var(--text-xl--line-height));\n  }\n  .font-bold {\n    --tw-font-weight: var(--font-weight-bold);\n    font-weight: var(--font-weight-bold);\n  }\n  .font-medium {\n    --tw-font-weight: var(--font-weight-medium);\n    font-weight: var(--font-weight-medium);\n  }\n  .font-semibold {\n    --tw-font-weight: var(--font-weight-semibold);\n    font-weight: var(--font-weight-semibold);\n  }\n  .text-\\[\\#271200\\] {\n    color: #271200;\n  }\n  .text-gray-400 {\n    color: var(--color-gray-400);\n  }\n  .text-gray-500 {\n    color: var(--color-gray-500);\n  }\n  .text-gray-600 {\n    color: var(--color-gray-600);\n  }\n  .text-green-600 {\n    color: var(--color-green-600);\n  }\n  .text-red-500 {\n    color: var(--color-red-500);\n  }\n  .text-white {\n    color: var(--color-white);\n  }\n  .underline {\n    text-decoration-line: underline;\n  }\n  .accent-\\[\\#271200\\] {\n    accent-color: #271200;\n  }\n  .opacity-0 {\n    opacity: 0%;\n  }\n  .shadow {\n    --tw-shadow: 0 1px 3px 0 var(--tw-shadow-color, rgb(0 0 0 / 0.1)), 0 1px 2px -1px var(--tw-shadow-color, rgb(0 0 0 / 0.1));\n    box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n  }\n  .outline {\n    outline-style: var(--tw-outline-style);\n    outline-width: 1px;\n  }\n  .transition-colors {\n    transition-property: color, background-color, border-color, outline-color, text-decoration-color, fill, stroke, --tw-gradient-from, --tw-gradient-via, --tw-gradient-to;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n    transition-duration: var(--tw-duration, var(--default-transition-duration));\n  }\n  .transition-opacity {\n    transition-property: opacity;\n    transition-timing-function: var(--tw-ease, var(--default-transition-timing-function));\n    transition-duration: var(--tw-duration, var(--default-transition-duration));\n  }\n  .duration-200 {\n    --tw-duration: 200ms;\n    transition-duration: 200ms;\n  }\n  .group-hover\\:opacity-100 {\n    &:is(:where(.group):hover *) {\n      @media (hover: hover) {\n        opacity: 100%;\n      }\n    }\n  }\n  .hover\\:bg-\\[\\#964500\\] {\n    &:hover {\n      @media (hover: hover) {\n        background-color: #964500;\n      }\n    }\n  }\n  .hover\\:bg-\\[\\#ffffff\\] {\n    &:hover {\n      @media (hover: hover) {\n        background-color: #ffffff;\n      }\n    }\n  }\n  .hover\\:bg-gray-50 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-50);\n      }\n    }\n  }\n  .hover\\:bg-gray-200 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-200);\n      }\n    }\n  }\n  .hover\\:bg-gray-500 {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-gray-500);\n      }\n    }\n  }\n  .hover\\:bg-white {\n    &:hover {\n      @media (hover: hover) {\n        background-color: var(--color-white);\n      }\n    }\n  }\n  .hover\\:text-\\[\\#271200\\] {\n    &:hover {\n      @media (hover: hover) {\n        color: #271200;\n      }\n    }\n  }\n  .focus\\:border-transparent {\n    &:focus {\n      border-color: transparent;\n    }\n  }\n  .focus\\:ring-2 {\n    &:focus {\n      --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);\n      box-shadow: var(--tw-inset-shadow), var(--tw-inset-ring-shadow), var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow);\n    }\n  }\n  .focus\\:ring-\\[\\#964500\\] {\n    &:focus {\n      --tw-ring-color: #964500;\n    }\n  }\n  .focus\\:ring-blue-500 {\n    &:focus {\n      --tw-ring-color: var(--color-blue-500);\n    }\n  }\n  .focus\\:outline-none {\n    &:focus {\n      --tw-outline-style: none;\n      outline-style: none;\n    }\n  }\n  .lg\\:gap-4 {\n    @media (width >= 64rem) {\n      gap: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:h-4 {\n    &::-moz-range-thumb {\n      height: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:w-4 {\n    &::-moz-range-thumb {\n      width: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:cursor-pointer {\n    &::-moz-range-thumb {\n      cursor: pointer;\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:appearance-none {\n    &::-moz-range-thumb {\n      appearance: none;\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:rounded-full {\n    &::-moz-range-thumb {\n      border-radius: calc(infinity * 1px);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-thumb\\]\\:bg-\\[\\#271200\\] {\n    &::-moz-range-thumb {\n      background-color: #271200;\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-track\\]\\:h-2 {\n    &::-moz-range-track {\n      height: calc(var(--spacing) * 2);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-track\\]\\:rounded-full {\n    &::-moz-range-track {\n      border-radius: calc(infinity * 1px);\n    }\n  }\n  .\\[\\&\\:\\:-moz-range-track\\]\\:bg-gray-200 {\n    &::-moz-range-track {\n      background-color: var(--color-gray-200);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:h-2 {\n    &::-webkit-slider-runnable-track {\n      height: calc(var(--spacing) * 2);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:rounded-full {\n    &::-webkit-slider-runnable-track {\n      border-radius: calc(infinity * 1px);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:bg-black\\/25 {\n    &::-webkit-slider-runnable-track {\n      background-color: color-mix(in srgb, #000 25%, transparent);\n      @supports (color: color-mix(in lab, red, red)) {\n        background-color: color-mix(in oklab, var(--color-black) 25%, transparent);\n      }\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:bg-gray-200 {\n    &::-webkit-slider-runnable-track {\n      background-color: var(--color-gray-200);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-runnable-track\\]\\:bg-white {\n    &::-webkit-slider-runnable-track {\n      background-color: var(--color-white);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-4 {\n    &::-webkit-slider-thumb {\n      height: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-\\[5px\\] {\n    &::-webkit-slider-thumb {\n      height: 5px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-\\[10px\\] {\n    &::-webkit-slider-thumb {\n      height: 10px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:h-\\[50px\\] {\n    &::-webkit-slider-thumb {\n      height: 50px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-4 {\n    &::-webkit-slider-thumb {\n      width: calc(var(--spacing) * 4);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[5px\\] {\n    &::-webkit-slider-thumb {\n      width: 5px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n    &::-webkit-slider-thumb {\n      width: 10px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[50px\\] {\n    &::-webkit-slider-thumb {\n      width: 50px;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:cursor-pointer {\n    &::-webkit-slider-thumb {\n      cursor: pointer;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:appearance-none {\n    &::-webkit-slider-thumb {\n      appearance: none;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:rounded-full {\n    &::-webkit-slider-thumb {\n      border-radius: calc(infinity * 1px);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:bg-\\[\\#271200\\] {\n    &::-webkit-slider-thumb {\n      background-color: #271200;\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:bg-purple-500 {\n    &::-webkit-slider-thumb {\n      background-color: var(--color-purple-500);\n    }\n  }\n  .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:bg-white {\n    &::-webkit-slider-thumb {\n      background-color: var(--color-white);\n    }\n  }\n}\n@property --tw-translate-x {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-translate-y {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-translate-z {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-rotate-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-rotate-z {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-x {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-skew-y {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-space-y-reverse {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0;\n}\n@property --tw-border-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-font-weight {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-inset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-inset-shadow-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-shadow-alpha {\n  syntax: \"<percentage>\";\n  inherits: false;\n  initial-value: 100%;\n}\n@property --tw-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-inset-ring-color {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-inset-ring-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-ring-inset {\n  syntax: \"*\";\n  inherits: false;\n}\n@property --tw-ring-offset-width {\n  syntax: \"<length>\";\n  inherits: false;\n  initial-value: 0px;\n}\n@property --tw-ring-offset-color {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: #fff;\n}\n@property --tw-ring-offset-shadow {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: 0 0 #0000;\n}\n@property --tw-outline-style {\n  syntax: \"*\";\n  inherits: false;\n  initial-value: solid;\n}\n@property --tw-duration {\n  syntax: \"*\";\n  inherits: false;\n}\n@keyframes spin {\n  to {\n    transform: rotate(360deg);\n  }\n}\n@layer properties {\n  @supports ((-webkit-hyphens: none) and (not (margin-trim: inline))) or ((-moz-orient: inline) and (not (color:rgb(from red r g b)))) {\n    *, ::before, ::after, ::backdrop {\n      --tw-translate-x: 0;\n      --tw-translate-y: 0;\n      --tw-translate-z: 0;\n      --tw-rotate-x: initial;\n      --tw-rotate-y: initial;\n      --tw-rotate-z: initial;\n      --tw-skew-x: initial;\n      --tw-skew-y: initial;\n      --tw-space-y-reverse: 0;\n      --tw-border-style: solid;\n      --tw-font-weight: initial;\n      --tw-shadow: 0 0 #0000;\n      --tw-shadow-color: initial;\n      --tw-shadow-alpha: 100%;\n      --tw-inset-shadow: 0 0 #0000;\n      --tw-inset-shadow-color: initial;\n      --tw-inset-shadow-alpha: 100%;\n      --tw-ring-color: initial;\n      --tw-ring-shadow: 0 0 #0000;\n      --tw-inset-ring-color: initial;\n      --tw-inset-ring-shadow: 0 0 #0000;\n      --tw-ring-inset: initial;\n      --tw-ring-offset-width: 0px;\n      --tw-ring-offset-color: #fff;\n      --tw-ring-offset-shadow: 0 0 #0000;\n      --tw-outline-style: solid;\n      --tw-duration: initial;\n    }\n  }\n}\n";
 
-const FACTOR = 1;
 const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
     constructor() {
         super();
@@ -921,6 +919,8 @@ const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
     componentDidLoad() {
         if (this.latitude && this.longitude) {
             this.loadingState = "loading";
+            this.getBuildingInsights();
+            this.getBuildingImages();
         }
         requestAnimationFrame(() => {
             if (this.canvasElement) {
@@ -1018,10 +1018,44 @@ const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
         this.pixelInMeters = getPixelInMeters(this.rgbTiff);
         this.loadingState = "loaded";
     }
+    convertToCanvasCoordinates(event) {
+        const rect = this.polygonCanvas.getBoundingClientRect();
+        const siteX = event.clientX - rect.left;
+        const siteY = event.clientY - rect.top;
+        return {
+            x: siteX / (rect.right - rect.left) * this.canvasElement.width,
+            y: siteY / (rect.bottom - rect.top) * this.canvasElement.height,
+        };
+    }
     async drawMap() {
         if (!this.canvasElement || !this.rgbTiff || !this.buildingInsights)
             return;
-        this.sizeCanvas(this.rgbTiff.width, this.rgbTiff.height);
+        // Get the container dimensions
+        const container = this.canvasElement.parentElement;
+        if (!container)
+            return;
+        const containerRect = container.getBoundingClientRect();
+        const containerWidth = containerRect.width;
+        const containerHeight = containerRect.height;
+        // Calculate the scale to fit the image while maintaining aspect ratio
+        const imageAspect = this.rgbTiff.width / this.rgbTiff.height;
+        const containerAspect = containerWidth / containerHeight;
+        let width, height;
+        if (imageAspect > containerAspect) {
+            width = containerWidth;
+            height = containerWidth / imageAspect;
+        }
+        else {
+            height = containerHeight;
+            width = containerHeight * imageAspect;
+        }
+        // Set the canvas dimensions
+        this.canvasElement.width = width;
+        this.canvasElement.height = height;
+        this.sizeCanvas(width, height);
+        // this.sizeCanvas(this.rgbTiff.width, this.rgbTiff.height);
+        // Update zoom factor based on new size
+        this.zoom = width / this.rgbTiff.width;
         renderCombinedWithZoom({
             rgb: this.rgbTiff,
             zoom: this.zoom,
@@ -1031,9 +1065,8 @@ const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
     handleMouseMove(event) {
         if (!this.polygonCanvas || !this.polygonCtx)
             return;
-        const rect = this.polygonCanvas.getBoundingClientRect();
-        const x = event.clientX - rect.left;
-        const y = event.clientY - rect.top;
+        // translate the website pixel coordinates to the canvas coordinates
+        const { x, y } = this.convertToCanvasCoordinates(event);
         this.mousePoint = { x, y };
         const currentPolygon = this.getCurrentPolygon();
         // Check for point hover
@@ -1185,10 +1218,7 @@ const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
             return;
         if (!this.polygonCanvas.contains(event.target))
             return;
-        // get the mouse position in the polygon canvas
-        const rect = this.polygonCanvas.getBoundingClientRect();
-        let x = event.clientX - rect.left;
-        let y = event.clientY - rect.top;
+        let { x, y } = this.convertToCanvasCoordinates(event);
         if (this.currentTool.name === "delete") {
             if (!this.hoveredPolygon) {
                 return;
@@ -1380,9 +1410,9 @@ const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
     render() {
         const t = getLanguageStrings(this.language);
         const currentPolygon = this.getCurrentPolygon();
-        return (h("div", { key: 'c1074bbc3cffffaa59d6b72d65460e3b58dae40e', class: "flex flex-col justify-center items-center w-full h-full gap-4" }, this.showInstructions && (h("div", { key: '2ec73b13be80dea76f8058750f49f8be5b9e56b3', class: "w-full rounded-4xl p-4", style: {
+        return (h("div", { key: '5c4bffa29e1584486b5f1b479fd00bc0495d60c3', class: "flex flex-col justify-center items-center w-full h-full gap-4" }, this.showInstructions && (h("div", { key: 'b1320f8e49b39f0c922c78781e1c74835fa1802b', class: "w-full rounded-4xl p-4", style: {
                 backgroundColor: "rgba(0, 0, 0, 0.1)",
-            } }, "After you have searched and selected your address. Highlight the part of your roof that you want to add solar panels to. Mark each surface with a polygon with the roof tool", " ", h("icon-selector", { key: '8fd5c274bd72dc287ffaf13622332c5000009a29', name: "house", inline: true }), " ", ". If you have skylights or other obstructions where you don't want to add solar panels, mark those as well with the obstruction tool", " ", h("icon-selector", { key: '21c377c9a081e89527090b3fd2f23972cbb7f085', name: "octagon-minus", inline: true }), ". You can delete polygons with the delete tool", " ", h("icon-selector", { key: '3bbd6ed32192bf4b0423d12234836dd20cd8d961', name: "eraser", inline: true }), ". If you want to change the azimuth or pitch of a polygon, select the move tool", " ", h("icon-selector", { key: '40ec20b5c99f6845edb56ff253d9d552d96fd739', name: "move", inline: true }), ", select the polygon you want to change and drag and drop the edges.")), h("div", { key: 'e6da73387ea43a51c1f5eb0e499af8a9ef3cf201', class: "flex lg:gap-4 rounded-4xl bg-[#f3ebda] p-4 flex-wrap justify-center w-full" }, tools.map((tool) => {
+            } }, "After you have searched and selected your address. Highlight the part of your roof that you want to add solar panels to. Mark each surface with a polygon with the roof tool", " ", h("icon-selector", { key: '3592c6d05baaca45ea0ccc28c59600fea84ecd0b', name: "house", inline: true }), " ", ". If you have skylights or other obstructions where you don't want to add solar panels, mark those as well with the obstruction tool", " ", h("icon-selector", { key: 'b9430ece54f0c405970c00f8aec2df37f0eb4cc5', name: "octagon-minus", inline: true }), ". You can delete polygons with the delete tool", " ", h("icon-selector", { key: '48d24aac3f043f09b533cabd8593b951c38fbc55', name: "eraser", inline: true }), ". If you want to change the azimuth or pitch of a polygon, select the move tool", " ", h("icon-selector", { key: 'd69c5da3e5cbb7c1766a81abd3c2b165a33880b4', name: "move", inline: true }), ", select the polygon you want to change and drag and drop the edges.")), h("div", { key: 'd096fb986027c4532ae0a282000bf098be3d58c3', class: "flex lg:gap-4 rounded-4xl bg-[#f3ebda] p-4 flex-wrap justify-center w-full" }, tools.map((tool) => {
             const toolStrings = t.mapDraw.tools[tool.name];
             return (h("button", { class: `px-4 py-2 rounded-4xl transition-colors duration-200 hover:bg-[#ffffff] ${this.currentTool.name === tool.name
                     ? "bg-[#271200] hover:bg-gray-500"
@@ -1391,24 +1421,25 @@ const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
                         ? "#ffffff"
                         : "#000000",
                 }, "aria-label": toolStrings.ariaLabel, title: toolStrings.explanation, onClick: () => this.handleToolSelect(tool) }, h("div", { class: "flex items-center gap-1 flex-col" }, h("icon-selector", { name: tool.icon }), h("span", null, toolStrings.name))));
-        })), this.loadingState === "empty" && (h("div", { key: 'fcd755d5b1034b65ee91f0e86ddb6255748cda0c', class: "w-full" }, h("p", { key: 'a139b9301c89a76d69ab400be70574478498069f', class: "text-white text-center flex items-center justify-center rounded-4xl p-4 w-full", style: {
+        })), this.loadingState === "empty" && (h("div", { key: '16a1968748a9ade0dded7a43d8eb56de252f47d0', class: "w-full" }, h("p", { key: '7c1779caab5a9466fb200116cb4d8bee2739fe26', class: "text-white text-center flex items-center justify-center rounded-4xl p-4 w-full", style: {
                 backgroundColor: "rgba(0, 0, 0, 0.5)",
             } }, t.mapDraw.noAddressSelected))), (this.latitude && this.longitude &&
-            this.loadingState === "loading") && (h("div", { key: '1c6fde5a93a076b82c7ea676325126e064b4fd7b', class: "flex items-center justify-center bg-white bg-opacity-75 z-20 pt-7 rounded-4xl" }, h("div", { key: '1e3011375805e4fcddf65a2e077894349190e1b0', class: "animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]" }))), h("div", { key: '73cf21d0d11f0228688158ce4955c78ff034699a', class: "flex gap-4 items-start justify-center h-full" }, h("div", { key: '3294d1bf9edb999fa0a3b31f92a5da34246d694f', class: "relative flex-1 h-full p-4 rounded-4xl flex items-center justify-center", style: {
-                width: `${this.rgbTiff?.width * FACTOR || 0}px`,
-                height: `${this.rgbTiff?.height * FACTOR || 0}px`,
-            } }, h("canvas", { key: '12d9b7110cebb4022f8d25d0b6b62d1e83fc91c2', ref: (el) => this.canvasElement = el, class: `absolute top-0 left-0 z-1 rounded-4xl m-auto`, style: {
+            this.loadingState === "loading") && (h("div", { key: 'a2e36a6868392806295dd188d5a6dcf09ad375b3', class: "flex items-center justify-center w-full bg-opacity-75 z-20 pt-7 rounded-4xl" }, h("div", { key: '38730ad2043af72356f5b61aaf835aa1bf605f1a', class: "animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]" }))), h("div", { key: 'a727bc7ab694c998ea870085d2624ed71b190491', class: "flex items-start justify-center h-full w-full bg-[#f3ebda] rounded-4xl" }, h("div", { key: '25175a8d357fcc9535fc21a6d96b026978afcc0e', class: "relative h-full flex items-center justify-center w-full rounded-4xl bg-[#271200]", style: {
+                aspectRatio: this.rgbTiff
+                    ? `${this.rgbTiff.width}/${this.rgbTiff.height}`
+                    : "1/1",
+            } }, h("canvas", { key: '662e580303a7b7b347bc05646bc0a71bade4692f', ref: (el) => this.canvasElement = el, class: "absolute top-0 left-0 w-full h-full rounded-4xl", style: {
                 cursor: this.currentTool.cursor,
-            } }), h("canvas", { key: 'f2f116e61c23ff59db85610814ea748210618151', ref: (el) => this.polygonCanvas = el, class: `absolute top-0 left-0 z-10 rounded-4xl m-auto`, style: {
+            } }), h("canvas", { key: '6bb0d1340336296a5ec4ebf42931422d0cf8d076', ref: (el) => this.polygonCanvas = el, class: "absolute top-0 left-0 w-full h-full rounded-4xl", style: {
                 cursor: this.currentTool.cursor,
-            } }))), h("div", { key: 'ee1ca6d0acdd3b8a1200657a985726d0dd6c91a6', class: "flex gap-4 flex-row justify-center items-center w-full" }, h("div", { key: 'f3bcb0608a35c24886efdf49feebed250f504e82', class: "w-full bg-[#f3ebda] rounded-4xl p-4" }, h("h3", { key: 'c7e3efa275edfedb2dc99715fc6896e830c00ce1', class: "text-lg font-semibold mb-4 text-center" }, t.mapDraw.information), currentPolygon?.details
+            } }))), h("div", { key: 'f67881f3f696aa658aba1d3bc94ea31912c4bcc4', class: "flex gap-4 flex-row justify-center items-center w-full" }, h("div", { key: '8bc9da72573d53e564c97203d5f20a399b995cfd', class: "w-full bg-[#f3ebda] rounded-4xl p-4" }, h("h3", { key: 'fc679612cc3a3e77dfb79bb0fb69ae536a0f9bca', class: "text-lg font-semibold mb-4 text-center" }, t.mapDraw.information), currentPolygon?.details
             ? (h("div", { class: "space-y-4" }, h("div", { class: "flex flex-col gap-2" }, h("button", { class: "px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#ffffff] hover:text-[#271200] transition-colors duration-200", onClick: () => this.calculateSolarPanels(), style: {
                     color: "#ffffff",
                 } }, t.mapDraw.calculateSolarPanels), this
                 .roofPolygonsSolarPanels[currentPolygon._id] && (h("p", { class: "text-lg text-center" }, this
                 .roofPolygonsSolarPanels[currentPolygon._id].positionedPanels
                 .length, " ", t.mapDraw.panels))), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600" }, t.mapDraw.area), h("p", { class: "text-lg" }, currentPolygon.details?.area
-                .toFixed(2), " m\u00B2")), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600" }, "Orientation"), h("div", { class: "flex gap-2 flex-row justify-start bg-white rounded-4xl p-2" }, h("input", { class: "text-lg w-full", onKeyDown: (e) => {
+                .toFixed(2), " m\u00B2")), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600" }, t.mapDraw.azimuth), h("div", { class: "flex gap-2 flex-row justify-start bg-white rounded-4xl p-2" }, h("input", { class: "text-lg w-full", onKeyDown: (e) => {
                     if (e.key === "Enter") {
                         this.handleAzimuthChange(e);
                         e.target
@@ -1417,7 +1448,21 @@ const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
                 }, value: currentPolygon
                     .details
                     ?.azimuth }), "(", azimuthToCardinal(currentPolygon.details
-                ?.azimuth), ")")), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600 pl-2" }, t.mapDraw.pitch), h("div", { class: "flex gap-2 flex-row justify-start bg-white rounded-4xl p-2" }, h("input", { class: "text-lg w-full", onKeyDown: (e) => {
+                ?.azimuth), ")"), h("input", { type: "range", min: "0", max: "360", class: "w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white", value: currentPolygon
+                    .details?.azimuth, onInput: (e) => {
+                    const target = e
+                        .target;
+                    const azimuth = parseFloat(target.value);
+                    currentPolygon.details
+                        .azimuth = azimuth;
+                    if (currentPolygon
+                        .type ===
+                        "roof" &&
+                        this.roofPolygonsSolarPanels[currentPolygon
+                            ._id]) {
+                        this.calculateSolarPanels();
+                    }
+                } })), h("div", null, h("h4", { class: "text-sm font-medium text-gray-600 pl-2" }, t.mapDraw.pitch), h("div", { class: "flex gap-2 flex-row justify-start bg-white rounded-4xl p-2" }, h("input", { class: "text-lg w-full", onKeyDown: (e) => {
                     if (e.key === "Enter") {
                         this.handlePitchChange(e);
                         e.target
@@ -1425,8 +1470,22 @@ const MapDraw = /*@__PURE__*/ proxyCustomElement(class MapDraw extends H {
                     }
                 }, value: currentPolygon
                     .details
-                    ?.pitch }), "\u00B0"))))
-            : (h("p", { class: "text-gray-500 text-center" }, t.mapDraw.noPolygonSelected)))), h("div", { key: '1596027c6a5acffa915c99366f9e74e619f102a7', class: "w-full" }, h("solar-system-form", { key: 'a7712ddf9330d6fa6833d7c717d33af12e8fcfe5', systemConfigs: this.roofPolygonsSolarPanels, language: this.language, roofPolygons: this.roofPolygons, obstructionPolygons: this.obstructionPolygons }))));
+                    ?.pitch }), "\u00B0"), h("input", { type: "range", min: "0", max: "90", class: "w-full custom-range appearance-none rounded-full bg-transparent [&::-webkit-slider-runnable-track]:rounded-full [&::-webkit-slider-runnable-track]:bg-black/25 [&::-webkit-slider-thumb]:appearance-none [&::-webkit-slider-thumb]:h-[10px] [&::-webkit-slider-thumb]:w-[10px] [&::-webkit-slider-thumb]:rounded-full [&::-webkit-slider-thumb]:bg-white", value: currentPolygon
+                    .details?.pitch, onInput: (e) => {
+                    const target = e
+                        .target;
+                    const pitch = parseFloat(target.value);
+                    currentPolygon.details
+                        .pitch = pitch;
+                    if (currentPolygon
+                        .type ===
+                        "roof" &&
+                        this.roofPolygonsSolarPanels[currentPolygon
+                            ._id]) {
+                        this.calculateSolarPanels();
+                    }
+                } }))))
+            : (h("p", { class: "text-gray-500 text-center" }, t.mapDraw.noPolygonSelected)))), h("div", { key: '4bf7b06b1ba3e654336eee59fadbd84acc106fa6', class: "w-full" }, h("solar-system-form", { key: 'd4f07caf0bf86edacd638e88f459a85076035168', systemConfigs: this.roofPolygonsSolarPanels, language: this.language, roofPolygons: this.roofPolygons, obstructionPolygons: this.obstructionPolygons }))));
     }
     static get watchers() { return {
         "latitude": ["getBuildingInsights", "getBuildingImages"],
@@ -1519,6 +1578,6 @@ function defineCustomElement() {
 defineCustomElement();
 
 export { MapDraw as M, defineCustomElement as d };
-//# sourceMappingURL=p-CwSYsL57.js.map
+//# sourceMappingURL=p-DEfwuR25.js.map
 
-//# sourceMappingURL=p-CwSYsL57.js.map
+//# sourceMappingURL=p-DEfwuR25.js.map