npm - blue-chestnut-solar-expert - Versions diffs - 0.0.11 → 0.0.12 - Mend

blue-chestnut-solar-expert 0.0.11 → 0.0.12

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

Files changed (110) hide show

package/dist/stencil-library/p-a8d15c85.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"names":["outputCss","EraserIcon","inline","render","h","key","xmlns","width","height","viewBox","fill","stroke","class","this","d","HouseIcon","Icon","name","renderRGB","rgb","mask","canvas","document","createElement","dw","dh","ctx","getContext","img","getImageData","y","x","rgbIdx","Math","floor","imgIdx","factor","data","round","rasters","putImageData","renderSolarPanel","solarPanel","panelWidth","panelHeight","azimuthAngle","pitchAngle","pixelPosition","cos","PI","horizontal","save","translate","rotate","fillStyle","fillRect","strokeStyle","lineWidth","strokeRect","restore","renderCombinedWithZoom","zoom","rgbCanvas","undefined","imgData","zoomedWidth","zoomedHeight","startX","startY","zoomedImgData","ImageData","i","zoomedX","zoomedY","zoomedI","DOTTED_LINE_COLOR","ROW_SPACING","COLUMN_SPACING","BORDER_INSET","DEFAULT_SUNNINESS","projectPointPerpendicularToLine","lastPoint","secondLastPoint","dx","dy","perpDx","perpDy","perpLength","sqrt","normalizedPerpDx","normalizedPerpDy","vectorToMouse","projectionLength","drawPolygon","polygonCtx","polygonCanvas","polygon","shiftKeyPressed","mousePoint","strokeColor","fillColor","beginPath","points","forEach","point","index","moveTo","lineTo","closed","length","projectedPoint","drawPerpendicularDottedLine","startPoint","endPoint","drawCircle","radius","distance","pow","arc","dashPattern","setLineDash","isPointInPolygon","num_vertices","inside","p1","p2","min","max","x_intersection","polygonKeyboardCombinations","description","moveTool","ariaLabel","icon","cursor","keyboardShortcut","explanation","roofTool","keyboardCombinations","obstructionTool","deleteTool","tools","DEFAULT_SOLAR_EXPERT_CONFIG","openRoofColor","closedRoofColor","openObstructionColor","closedObstructionColor","roofPolygonFillColor","obstructionPolygonFillColor","roofPolygonHoverFillColor","obstructionPolygonHoverFillColor","roofPolygonSelectedFillColor","obstructionPolygonSelectedFillColor","DEFAULT_SOLAR_PANEL_TYPE","widthMeters","heightMeters","kWattPeak","efficiency","price","getFillColor","selectedPolygon","hoveredPolygon","_id","config","isHovered","type","isSelected","byteToHex","push","toString","slice","unsafeStringify","arr","offset","toLowerCase","getRandomValues","rnds8","Uint8Array","rng","crypto","bind","Error","randomUUID","native","v4","options","buf","rnds","random","calculatePolygonArea","area","j","abs","azimuthToCardinal","azimuth","latLngToPixel","bounds","latLng","latToPixel","lat","south","north","lngToPixel","lng","west","east","longitude","latitude","getPixelInMeters","rgbTiff","latDiff","pixelHeight","pixelInMeters","projectPoint","angle","sin","projectPolygon","map","details","offsetPolygon","offsetX","offsetY","minX","minY","maxX","maxY","newPoints","equalsPoints","point1","point2","intersects","line1","line2","start","end","p3","p4","d1","d2","d3","d4","getBestFittingRoofSegment","roof","roofSegmentStats","polygonBounds","p","bestSegment","bestIoU","segment","sw","boundingBox","ne","segmentBounds","interLeft","interRight","interTop","interBottom","interWidth","interHeight","intersectionArea","polygonArea","segmentArea","unionArea","iou","generateGrid","minMax","anker","rowSpacing","columnSpacing","grid","widthCount","ceil","heightCount","widthOffset","heightOffset","row","positionedSolarPanel","panel","getSolarPanelLines","lines","solarPanelInObstacle","obstacle","nextPoint","border","line","solarPanelInPolygon","isPanelObstructed","obstacles","getSolarPanelsInPolygon","solarPanels","newRow","isObstructed","getOptimalSolarPosition","horizontalSolarPanel","verticalSolarPanel","numberOfPanels","solarPanelsInPolygon","numberOfPanelsInPolygon","reduce","acc","projectObstacles","inset","result","offsetObstacle","projectedObstacle","insetObstacle","insetPolygon","isClockwise","sum","curr","next","isClockwisePolygon","insetPoints","prev","v1","v2","perp1","perp2","length1","length2","bisector","bisectorLength","insetPoint","getOptimalSolarPositionFully","insetRoof","projectedOffset","projectedObstacles","horizontalSolarPanels","unprojectedPanels","flat","unprojectedPanel","offsetPosition","en","solarExpert","searchPlaceholder","solarSystemForm","title","systemInformation","panelPeakPower","totalSystemPeakPower","electricityPrice","compensationRate","autonomy","costSavings","householdConsumptionTitle","consumptionProfileTitle","electricityCostsTitle","compensationRateTitle","resultsTitle","savingsDisclaimer","annualConsumption","email","nameError","emailError","consumptionProfiles","mostlyAtHome","mostlyAway","chart","consumption","production","consumptionProfile","relativeConsumption","hourOfDay","validEmailError","requestOffer","requestOfferButton","year","mapDraw","noPolygonSelected","noAddressSelected","information","calculateSolarPanels","panels","pitch","obstruction","delete","move","de","es","languageStrings","getLanguageStrings","lang","defaultLang","langStrings","mergedStrings","JSON","parse","stringify","deepMerge","target","source","Object","MapDraw","language","apiKey","showInstructions","loadingState","draggedPointIndex","hoveredPointIndex","altKeyPressed","currentTool","roofPolygons","roofPolygonsSolarPanels","obstructionPolygons","buildingInsights","showAzimuth","canvasElement","getCurrentPolygon","componentDidLoad","getBuildingInsights","getBuildingImages","requestAnimationFrame","rect","getBoundingClientRect","drawMap","sizeCanvas","sameLocation","center","clearRect","fetchSolarData","alert","convertToCanvasCoordinates","event","siteX","clientX","left","siteY","clientY","top","right","bottom","container","parentElement","containerRect","containerWidth","containerHeight","imageAspect","containerAspect","handleMouseMove","currentPolygon","newHoveredPointIndex","findIndex","newHoveredPolygon","values","drawPolygons","convertedSolarPanel","positionedPanels","deletePolygon","handleKeyDown","HTMLInputElement","shiftKey","altKey","pop","pressedKey","tool","find","t","handleKeyUp","handleMouseDown","contains","pointIndex","newPolygon","uuidv4","firstPoint","closePolygon","handleMouseUp","metersInPixels","bestMatch","solarPotential","azimuthDegrees","pitchDegrees","sunniness","assignedRoofStats","stats","sunshineQuantiles","buildingStats","handlePitchChange","parseFloat","value","handleAzimuthChange","handleToolSelect","style","backgroundColor","toolStrings","color","onClick","aspectRatio","ref","el","toFixed","onKeyDown","e","blur","onInput","systemConfigs","MoveIcon","OctagonMinusIcon","SearchIcon","cx","cy","r","SolarExpert","Env","GOOGLE_MAPS_API_KEY","isLoaded","autocomplete","place","inputElement","componentWillLoad","loadGoogleMapsScript","loader","Loader","libraries","places","importLibrary","initializeAutocomplete","error","console","Autocomplete","addListener","getPlace","geometry","location","placeholder","SOLAR_RADIATION","CONSUMPTION_PROFILES","mostly_at_home","mostly_away","SolarSystemForm","householdConsumption","electricCar","heatPump","battery","updateSystemConfigs","keys","entries","recalculate","updateChart","norm","peakKwh","radiation","energyUsageOfProduction","energyDifference","soldEnergy","filter","validateForm","isValid","trim","emailRegex","test","handleRequestOffer","log","systemConfig","readOnly","readonly","parseInt","onChange","selected","step","disabled"],"sources":["src/output.css?tag=eraser-icon","src/components/icons/eraser.tsx","src/output.css?tag=house-icon","src/components/icons/house.tsx","src/output.css?tag=icon-selector","src/components/icons/icon.tsx","src/utils/visualize.ts","src/constants.ts","src/utils/render/projection.ts","src/utils/render/polygon.ts","src/utils/render/tools.ts","src/config.ts","src/utils/render/color.ts","../../node_modules/uuid/dist/esm-browser/stringify.js","../../node_modules/uuid/dist/esm-browser/rng.js","../../node_modules/uuid/dist/esm-browser/native.js","../../node_modules/uuid/dist/esm-browser/v4.js","src/utils/utils.ts","src/utils/geometry/fitting.ts","src/utils/geometry/gridMatch.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=map-draw","src/components/map-draw/map-draw.tsx","src/output.css?tag=move-icon","src/components/icons/move.tsx","src/output.css?tag=octagon-minus-icon","src/components/icons/octagonMinus.tsx","src/output.css?tag=search-icon","src/components/icons/search.tsx","src/output.css?tag=solar-expert","src/components/solar-expert/solar-expert.tsx","src/output.css?tag=solar-system-form","src/components/solar-system-form/solar-system-form.tsx"],"sourcesContent":["/*! 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 } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"eraser-icon\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class EraserIcon {\r\n @Prop()\r\n inline: boolean = false;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n class={`lucide lucide-eraser-icon lucide-eraser ${\r\n this.inline ? \"inline-block\" : \"\"\r\n }`}\r\n >\r\n <path d=\"m7 21-4.3-4.3c-1-1-1-2.5 0-3.4l9.6-9.6c1-1 2.5-1 3.4 0l5.6 5.6c1 1 1 2.5 0 3.4L13 21\" />\r\n <path d=\"M22 21H7\" />\r\n <path d=\"m5 11 9 9\" />\r\n </svg>\r\n );\r\n }\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 } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"house-icon\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class HouseIcon {\r\n @Prop()\r\n inline: boolean = false;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n class={`lucide lucide-house-icon lucide-house ${\r\n this.inline ? \"inline-block\" : \"\"\r\n }`}\r\n >\r\n <path d=\"M15 21v-8a1 1 0 0 0-1-1h-4a1 1 0 0 0-1 1v8\" />\r\n <path d=\"M3 10a2 2 0 0 1 .709-1.528l7-5.999a2 2 0 0 1 2.582 0l7 5.999A2 2 0 0 1 21 10v9a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2z\" />\r\n </svg>\r\n );\r\n }\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 } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"icon-selector\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class Icon {\r\n @Prop()\r\n name: string;\r\n @Prop()\r\n inline: boolean = false;\r\n\r\n render() {\r\n if (this.name === \"search\") {\r\n return <search-icon inline={this.inline} />;\r\n }\r\n if (this.name === \"house\") {\r\n return <house-icon inline={this.inline} />;\r\n }\r\n if (this.name === \"move\") {\r\n return <move-icon inline={this.inline} />;\r\n }\r\n if (this.name === \"octagon-minus\") {\r\n return <octagon-minus-icon inline={this.inline} />;\r\n }\r\n if (this.name === \"eraser\") {\r\n return <eraser-icon inline={this.inline} />;\r\n }\r\n return (\r\n <div class={`${this.inline ? \"inline-block\" : \"\"}`}>\r\n Icon {this.name}\r\n </div>\r\n );\r\n }\r\n}\r\n","/*\r\n Copyright 2023 Google LLC\r\n\r\n Licensed under the Apache License, Version 2.0 (the \"License\");\r\n you may not use this file except in compliance with the License.\r\n You may obtain a copy of the License at\r\n\r\n https://www.apache.org/licenses/LICENSE-2.0\r\n\r\n Unless required by applicable law or agreed to in writing, software\r\n distributed under the License is distributed on an \"AS IS\" BASIS,\r\n WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\r\n See the License for the specific language governing permissions and\r\n limitations under the License.\r\n */\r\n\r\n import { PositionedSolarPanel } from './geometry/fitting';\r\nimport type { Bounds, GeoTiff, InternalSolarPanelConfig } from './solar';\r\n\r\n // [START visualize_render_rgb]\r\n /**\r\n * Renders an RGB GeoTiff image into an HTML canvas.\r\n *\r\n * The GeoTiff image must include 3 rasters (bands) which\r\n * correspond to [Red, Green, Blue] in that order.\r\n *\r\n * @param {GeoTiff} rgb GeoTiff with RGB values of the image.\r\n * @param {GeoTiff} mask Optional mask for transparency, defaults to opaque.\r\n * @return {HTMLCanvasElement} Canvas element with the rendered image.\r\n */\r\n export function renderRGB(rgb: GeoTiff, mask?: GeoTiff, canvas?: HTMLCanvasElement | null): HTMLCanvasElement {\r\n // Create an HTML canvas to draw the image.\r\n // https://www.w3schools.com/tags/canvas_createimagedata.asp\r\n if (!canvas) {\r\n canvas = document.createElement('canvas');\r\n }\r\n \r\n // Set the canvas size to the mask size if it's available,\r\n // otherwise set it to the RGB data layer size.\r\n canvas.width = mask ? mask.width : rgb.width;\r\n canvas.height = mask ? mask.height : rgb.height;\r\n \r\n // Since the mask size can be different than the RGB data layer size,\r\n // we calculate the \"delta\" between the RGB layer size and the canvas/mask\r\n // size. For example, if the RGB layer size is the same as the canvas size,\r\n // the delta is 1. If the RGB layer size is smaller than the canvas size,\r\n // the delta would be greater than 1.\r\n // This is used to translate the index from the canvas to the RGB layer.\r\n const dw = rgb.width / canvas.width;\r\n const dh = rgb.height / canvas.height;\r\n \r\n // Get the canvas image data buffer.\r\n const ctx = canvas.getContext('2d')!;\r\n const img = ctx.getImageData(0, 0, canvas.width, canvas.height);\r\n \r\n // Fill in every pixel in the canvas with the corresponding RGB layer value.\r\n // Since Javascript doesn't support multidimensional arrays or tensors,\r\n // everything is stored in flat arrays and we have to keep track of the\r\n // indices for each row and column ourselves.\r\n for (let y = 0; y < canvas.height; y++) {\r\n for (let x = 0; x < canvas.width; x++) {\r\n // RGB index keeps track of the RGB layer position.\r\n // This is multiplied by the deltas since it might be a different\r\n // size than the image size.\r\n const rgbIdx = Math.floor(y * dh) * rgb.width + Math.floor(x * dw);\r\n // Mask index keeps track of the mask layer position.\r\n const maskIdx = y * canvas.width + x;\r\n \r\n // Image index keeps track of the canvas image position.\r\n // HTML canvas expects a flat array with consecutive RGBA values.\r\n // Each value in the image buffer must be between 0 and 255.\r\n // The Alpha value is the transparency of that pixel,\r\n // if a mask was not provided, we default to 255 which is opaque.\r\n const imgIdx = y * canvas.width * 4 + x * 4;\r\n const factor = 0.65;\r\n img.data[imgIdx + 0] = Math.round(rgb.rasters[0][rgbIdx] * factor); // Red\r\n img.data[imgIdx + 1] = Math.round(rgb.rasters[1][rgbIdx] * factor); // Green\r\n img.data[imgIdx + 2] = Math.round(rgb.rasters[2][rgbIdx] * factor); // Blue\r\n img.data[imgIdx + 3] = mask // Alpha\r\n ? mask.rasters[0][maskIdx] * 255\r\n : 255;\r\n }\r\n }\r\n \r\n // Draw the image data buffer into the canvas context.\r\n ctx.putImageData(img, 0, 0);\r\n return canvas;\r\n }\r\n // [END visualize_render_rgb]\r\n \r\n // [START visualize_render_palette]\r\n /**\r\n * Renders a single value GeoTiff image into an HTML canvas.\r\n *\r\n * The GeoTiff image must include 1 raster (band) which contains\r\n * the values we want to display.\r\n *\r\n * @param {GeoTiff} data GeoTiff with the values of interest.\r\n * @param {GeoTiff} mask Optional mask for transparency, defaults to opaque.\r\n * @param {string[]} colors Hex color palette, defaults to ['000000', 'ffffff'].\r\n * @param {number} min Minimum value of the data range, defaults to 0.\r\n * @param {number} max Maximum value of the data range, defaults to 1.\r\n * @param {number} index Raster index for the data, defaults to 0.\r\n * @return {HTMLCanvasElement} Canvas element with the rendered image.\r\n */\r\n export function renderPalette({\r\n data,\r\n mask,\r\n colors,\r\n min,\r\n max,\r\n index,\r\n canvas,\r\n }: {\r\n data: GeoTiff;\r\n mask?: GeoTiff;\r\n colors?: string[];\r\n min?: number;\r\n max?: number;\r\n index?: number;\r\n canvas?: HTMLCanvasElement | null\t;\r\n }): HTMLCanvasElement {\r\n // First create a palette from a list of hex colors.\r\n const palette = createPalette(colors ?? ['000000', 'ffffff']);\r\n // Normalize each value of our raster/band of interest into indices,\r\n // such that they always map into a value within the palette.\r\n const indices = data.rasters[index ?? 0]\r\n .map((x) => normalize(x, max ?? 1, min ?? 0))\r\n .map((x) => Math.round(x * (palette.length - 1)));\r\n return renderRGB(\r\n {\r\n ...data,\r\n // Map each index into the corresponding RGB values.\r\n rasters: [\r\n indices.map((i: number) => palette[i].r),\r\n indices.map((i: number) => palette[i].g),\r\n indices.map((i: number) => palette[i].b),\r\n ],\r\n },\r\n mask,\r\n canvas,\r\n );\r\n }\r\n \r\n /**\r\n * Creates an {r, g, b} color palette from a hex list of colors.\r\n *\r\n * Each {r, g, b} value is a number between 0 and 255.\r\n * The created palette is always of size 256, regardless of the number of\r\n * hex colors passed in. Inbetween values are interpolated.\r\n *\r\n * @param {string[]} hexColors List of hex colors for the palette.\r\n * @return {{r, g, b}[]} RGB values for the color palette.\r\n */\r\n export function createPalette(hexColors: string[]): { r: number; g: number; b: number }[] {\r\n // Map each hex color into an RGB value.\r\n const rgb = hexColors.map(colorToRGB);\r\n // Create a palette with 256 colors derived from our rgb colors.\r\n const size = 256;\r\n const step = (rgb.length - 1) / (size - 1);\r\n return Array(size)\r\n .fill(0)\r\n .map((_, i) => {\r\n // Get the lower and upper indices for each color.\r\n const index = i * step;\r\n const lower = Math.floor(index);\r\n const upper = Math.ceil(index);\r\n // Interpolate between the colors to get the shades.\r\n return {\r\n r: lerp(rgb[lower].r, rgb[upper].r, index - lower),\r\n g: lerp(rgb[lower].g, rgb[upper].g, index - lower),\r\n b: lerp(rgb[lower].b, rgb[upper].b, index - lower),\r\n };\r\n });\r\n }\r\n \r\n /**\r\n * Convert a hex color into an {r, g, b} color.\r\n *\r\n * @param {string} color Hex color like 0099FF or #0099FF.\r\n * @return {{r, g, b}} RGB values for that color.\r\n */\r\n export function colorToRGB(color: string): { r: number; g: number; b: number } {\r\n const hex = color.startsWith('#') ? color.slice(1) : color;\r\n return {\r\n r: parseInt(hex.substring(0, 2), 16),\r\n g: parseInt(hex.substring(2, 4), 16),\r\n b: parseInt(hex.substring(4, 6), 16),\r\n };\r\n }\r\n \r\n /**\r\n * Normalizes a number to a given data range.\r\n *\r\n * @param {number} x Value of interest.\r\n * @param {number} max Maximum value in data range, defaults to 1.\r\n * @param {number} min Minimum value in data range, defaults to 0.\r\n * @return {number} Normalized value.\r\n */\r\n export function normalize(x: number, max: number = 1, min: number = 0): number {\r\n const y = (x - min) / (max - min);\r\n return clamp(y, 0, 1);\r\n }\r\n \r\n /**\r\n * Calculates the linear interpolation for a value within a range.\r\n *\r\n * @param {number} x Lower value in the range, when `t` is 0.\r\n * @param {number} y Upper value in the range, when `t` is 1.\r\n * @param {number} t \"Time\" between 0 and 1.\r\n * @return {number} Inbetween value for that \"time\".\r\n */\r\n export function lerp(x: number, y: number, t: number): number {\r\n return x + t * (y - x);\r\n }\r\n \r\n /**\r\n * Clamps a value to always be within a range.\r\n *\r\n * @param {number} x Value to clamp.\r\n * @param {number} min Minimum value in the range.\r\n * @param {number} max Maximum value in the range.\r\n * @return {number} Clamped value.\r\n */\r\n export function clamp(x: number, min: number, max: number): number {\r\n return Math.min(Math.max(x, min), max);\r\n }\r\n // [END visualize_render_palette]\r\n \r\n export function rgbToColor({ r, g, b }: { r: number; g: number; b: number }): string {\r\n const f = (x: number) => {\r\n const hex = Math.round(x).toString(16);\r\n return hex.length == 1 ? `0${hex}` : hex;\r\n };\r\n return `#${f(r)}${f(g)}${f(b)}`;\r\n }\r\n\r\n export function renderAzimuth(azimuth: number, ctx: CanvasRenderingContext2D) {\r\n if (azimuth === undefined) {\r\n return;\r\n }\r\n ctx.save();\r\n ctx.moveTo(0, 0);\r\n ctx.rotate((azimuth - 90) * Math.PI / 180);\r\n ctx.translate(ctx.canvas.width-100, 100);\r\n \r\n // Set arrow style\r\n ctx.strokeStyle = 'rgba(255, 255, 255, 0.8)';\r\n ctx.fillStyle = 'rgba(255, 255, 255, 0.8)';\r\n ctx.lineWidth = 2;\r\n\r\n ctx.moveTo(-50, 0);\r\n ctx.lineTo(50,0);\r\n ctx.lineTo(40,-10);\r\n ctx.moveTo(50,0);\r\n ctx.lineTo(40,10);\r\n ctx.stroke();\r\n\r\n ctx.moveTo(0, 0);\r\n ctx.beginPath();\r\n ctx.arc(0, 0, 50, 0, Math.PI * 2);\r\n ctx.stroke();\r\n\r\n // Arrow parameters\r\n // const arrowLength = 100;\r\n // const arrowHeadLength = 15;\r\n // const arrowHeadAngle = Math.PI / 6; // 30 degrees\r\n\r\n // // Convert azimuth to radians (subtract 90 degrees to align with standard compass)\r\n // const angle = (azimuth - 90) * Math.PI / 180;\r\n\r\n // // Calculate arrow end point\r\n // const endX = arrowLength * Math.cos(angle);\r\n // const endY = arrowLength * Math.sin(angle);\r\n\r\n // // Draw main arrow line\r\n // ctx.beginPath();\r\n // ctx.moveTo(0, 0);\r\n // ctx.lineTo(endX, endY);\r\n // ctx.stroke();\r\n\r\n // // Calculate arrowhead points\r\n // const arrowHeadAngle1 = angle + Math.PI - arrowHeadAngle;\r\n // const arrowHeadAngle2 = angle + Math.PI + arrowHeadAngle;\r\n\r\n // const arrowHead1X = endX + arrowHeadLength * Math.cos(arrowHeadAngle1);\r\n // const arrowHead1Y = endY + arrowHeadLength * Math.sin(arrowHeadAngle1);\r\n // const arrowHead2X = endX + arrowHeadLength * Math.cos(arrowHeadAngle2);\r\n // const arrowHead2Y = endY + arrowHeadLength * Math.sin(arrowHeadAngle2);\r\n\r\n // // Draw arrowhead\r\n // ctx.beginPath();\r\n // ctx.moveTo(endX, endY);\r\n // ctx.lineTo(arrowHead1X, arrowHead1Y);\r\n // ctx.lineTo(arrowHead2X, arrowHead2Y);\r\n // ctx.closePath();\r\n // ctx.fill();\r\n\r\n // ctx.translate(ctx.canvas.width/2, 50);\r\n\r\n ctx.restore();\r\n\r\n console.log(\"renderAzimuth\", azimuth);\r\n }\r\n\r\n export function renderSolarPanel(solarPanel: PositionedSolarPanel, ctx: CanvasRenderingContext2D, panelWidth: number, panelHeight: number, azimuthAngle: number, pitchAngle: number) {\r\n const { x, y } = solarPanel.pixelPosition;\r\n let width = panelWidth;\r\n let height = panelHeight * Math.cos(pitchAngle * Math.PI / 180);\r\n if (solarPanel.horizontal) {\r\n width = panelHeight;\r\n height = panelWidth * Math.cos(pitchAngle * Math.PI / 180);\r\n }\r\n\r\n // Save the current context state\r\n ctx.save();\r\n \r\n // Translate to the panel's center point\r\n ctx.translate(x, y);\r\n \r\n // Rotate by the azimuth angle (convert to radians)\r\n ctx.rotate((azimuthAngle * Math.PI) / 180);\r\n \r\n // Draw panel rectangle centered at origin (since we translated)\r\n ctx.fillStyle = 'rgba(115, 143, 255, 1)';\r\n ctx.fillRect(-width/2, -height/2, width, height);\r\n \r\n // Draw panel border\r\n ctx.strokeStyle = 'rgba(0, 0, 0, 0.8)';\r\n ctx.lineWidth = 1;\r\n ctx.strokeRect(-width/2, -height/2, width, height);\r\n \r\n // Restore the context state\r\n ctx.restore();\r\n}\r\n\r\n export function renderPanels({canvas, panelConfig, bounds, zoom, roofSegments}: \r\n {canvas: HTMLCanvasElement | null, panelConfig: InternalSolarPanelConfig, bounds: Bounds, zoom: number, roofSegments: Record<number, { pitchDegrees: number; azimuthDegrees: number }>}): HTMLCanvasElement {\r\n if (!canvas) {\r\n canvas = document.createElement('canvas');\r\n }\r\n \r\n const ctx = canvas.getContext(\"2d\")!;\r\n\r\n // Calculate pre zoomed dimensions the canvas is already zoomed\r\n const preZoomedWidth = Math.floor(canvas.width / zoom);\r\n const preZoomedHeight = Math.floor(canvas.height / zoom);\r\n const startX = Math.floor((preZoomedWidth - canvas.width) / 2);\r\n const startY = Math.floor((preZoomedHeight - canvas.height) / 2);\r\n\r\n // Calculate the scale factors to convert lat/lng to pixel coordinates\r\n const latToPixel = (lat: number) => {\r\n return preZoomedHeight * (1 - (lat - bounds.south) / (bounds.north - bounds.south)) - startY;\r\n };\r\n \r\n const lngToPixel = (lng: number) => {\r\n return preZoomedWidth * (lng - bounds.west) / (bounds.east - bounds.west) - startX;\r\n };\r\n \r\n // Draw each panel\r\n for (const panel of panelConfig.panels) {\r\n // Convert panel center coordinates to pixel coordinates\r\n const centerX = lngToPixel(panel.center.longitude);\r\n const centerY = latToPixel(panel.center.latitude);\r\n \r\n // Calculate panel dimensions (assuming standard panel size)\r\n const panelWidth = panel.orientation === 'LANDSCAPE' ? 19 : 10; // pixels\r\n const panelHeight = panel.orientation === 'LANDSCAPE' ? 10 : 19;\r\n \r\n // Get the roof segment's azimuth angle for this panel\r\n const roofSegment = roofSegments[panel.segmentIndex];\r\n const azimuthAngle = roofSegment ? roofSegment.azimuthDegrees : 0;\r\n \r\n // Save the current context state\r\n ctx.save();\r\n \r\n // Translate to the panel's center point\r\n ctx.translate(centerX, centerY);\r\n \r\n // Rotate by the azimuth angle (convert to radians)\r\n ctx.rotate((azimuthAngle * Math.PI) / 180);\r\n \r\n // Draw panel rectangle centered at origin (since we translated)\r\n ctx.fillStyle = 'rgba(115, 143, 255, 1)';\r\n ctx.fillRect(-panelWidth/2, -panelHeight/2, panelWidth, panelHeight);\r\n \r\n // Draw panel border\r\n ctx.strokeStyle = 'rgba(0, 0, 0, 0.8)';\r\n ctx.lineWidth = 1;\r\n ctx.strokeRect(-panelWidth/2, -panelHeight/2, panelWidth, panelHeight);\r\n \r\n // Restore the context state\r\n ctx.restore();\r\n }\r\n \r\n return canvas;\r\n }\r\n \r\n export function renderCombinedWithZoom({\r\n rgb,\r\n zoom = 1,\r\n canvas,\r\n}: {\r\n rgb: GeoTiff;\r\n zoom?: number;\r\n canvas?: HTMLCanvasElement | null;\r\n}): HTMLCanvasElement {\r\n // First render the RGB image\r\n const rgbCanvas = renderRGB(rgb, undefined, canvas);\r\n const ctx = rgbCanvas.getContext(\"2d\")!;\r\n const imgData = ctx.getImageData(0, 0, rgbCanvas.width, rgbCanvas.height);\r\n\r\n // Calculate the center portion to show based on zoom\r\n const width = rgbCanvas.width;\r\n const height = rgbCanvas.height;\r\n const zoomedWidth = Math.floor(width * zoom);\r\n const zoomedHeight = Math.floor(height * zoom);\r\n const startX = Math.floor((width - zoomedWidth) / 2);\r\n const startY = Math.floor((height - zoomedHeight) / 2);\r\n\r\n // Create a new image data for the zoomed portion\r\n const zoomedImgData = new ImageData(zoomedWidth, zoomedHeight);\r\n \r\n // Copy RGB data and apply palette where mask is non-zero\r\n for (let y = 0; y < height; y++) {\r\n for (let x = 0; x < width; x++) {\r\n const i = (y * width + x) * 4;\r\n \r\n if (x >= startX && x < startX + zoomedWidth && \r\n y >= startY && y < startY + zoomedHeight) {\r\n // Calculate position in zoomed image\r\n const zoomedX = x - startX;\r\n const zoomedY = y - startY;\r\n const zoomedI = (zoomedY * zoomedWidth + zoomedX) * 4;\r\n \r\n zoomedImgData.data[zoomedI] = imgData.data[i];\r\n zoomedImgData.data[zoomedI + 1] = imgData.data[i + 1];\r\n zoomedImgData.data[zoomedI + 2] = imgData.data[i + 2];\r\n zoomedImgData.data[zoomedI + 3] = 255; // Alpha channel\r\n }\r\n }\r\n }\r\n\r\n // Resize canvas to match zoomed dimensions\r\n rgbCanvas.width = zoomedWidth;\r\n rgbCanvas.height = zoomedHeight;\r\n \r\n // Put the zoomed image data back to the canvas\r\n ctx.putImageData(zoomedImgData, 0, 0);\r\n return rgbCanvas;\r\n}\r\n ","\r\nconst OPEN_POLYGON_COLOR = \"red\"; //\"#ffffff\";\r\nconst CLOSED_POLYGON_COLOR = \"#fcba03\";\r\nconst DOTTED_LINE_COLOR = \"rgba(0, 0, 0, 0.5)\";\r\n\r\nconst ROW_SPACING = 1;\r\nconst COLUMN_SPACING = 1;\r\n\r\nconst BORDER_INSET = 0.2;\r\nconst DEFAULT_SUNNINESS = 600;\r\n\r\nexport { OPEN_POLYGON_COLOR, CLOSED_POLYGON_COLOR, DOTTED_LINE_COLOR, ROW_SPACING, COLUMN_SPACING, BORDER_INSET, DEFAULT_SUNNINESS };\r\n","import { Point } from \"../../types/shapes\";\r\n\r\nexport function projectPointPerpendicularToLine({\r\n x,\r\n y,\r\n lastPoint,\r\n secondLastPoint,\r\n}: {\r\n x: number;\r\n y: number;\r\n lastPoint: { x: number; y: number };\r\n secondLastPoint: { x: number; y: number };\r\n}): Point {\r\n\r\n // Calculate the direction vector of the last line\r\n const dx = lastPoint.x - secondLastPoint.x;\r\n const dy = lastPoint.y - secondLastPoint.y;\r\n\r\n // Calculate perpendicular vector (rotate 90 degrees)\r\n const perpDx = -dy;\r\n const perpDy = dx;\r\n\r\n // Normalize the perpendicular vector\r\n const perpLength = Math.sqrt(perpDx * perpDx + perpDy * perpDy);\r\n const normalizedPerpDx = perpDx / perpLength;\r\n const normalizedPerpDy = perpDy / perpLength;\r\n\r\n // Project the mouse point onto the perpendicular line\r\n const vectorToMouse = {\r\n x: x - lastPoint.x,\r\n y: y - lastPoint.y,\r\n };\r\n\r\n // Calculate the projection length (dot product)\r\n const projectionLength = vectorToMouse.x * normalizedPerpDx +\r\n vectorToMouse.y * normalizedPerpDy;\r\n\r\n // Calculate the new point position using the projected length\r\n x = lastPoint.x + normalizedPerpDx * projectionLength;\r\n y = lastPoint.y + normalizedPerpDy * projectionLength;\r\n return { x, y };\r\n}\r\n","import { DOTTED_LINE_COLOR } from \"../../constants\";\r\nimport { Point, Polygon } from \"../../types/shapes\";\r\nimport { projectPointPerpendicularToLine } from \"./projection\";\r\n\r\nexport interface DrawPolygonProps {\r\n polygonCtx: CanvasRenderingContext2D;\r\n polygonCanvas: HTMLCanvasElement;\r\n polygon: Polygon;\r\n pixelInMeters: number;\r\n shiftKeyPressed: boolean;\r\n mousePoint: Point | null;\r\n strokeColor: string;\r\n fillColor?: string;\r\n}\r\n\r\nexport interface Line{\r\n start: Point;\r\n end: Point;\r\n}\r\n\r\nexport interface DrawCircleProps {\r\n ctx: CanvasRenderingContext2D;\r\n x: number;\r\n y: number;\r\n radius: number;\r\n strokeStyle?: string;\r\n lineWidth?: number;\r\n}\r\n\r\nexport function drawPolygon({\r\n polygonCtx, polygonCanvas, polygon, shiftKeyPressed, mousePoint, strokeColor, fillColor\r\n}: DrawPolygonProps) {\r\n if (!polygonCtx || !polygonCanvas) return;\r\n\r\n // Draw the polygon\r\n polygonCtx.beginPath();\r\n polygonCtx.strokeStyle = strokeColor;\r\n polygonCtx.lineWidth = 2;\r\n\r\n polygon.points.forEach((point, index) => {\r\n if (index === 0) {\r\n polygonCtx.moveTo(point.x, point.y);\r\n } else {\r\n polygonCtx.lineTo(point.x, point.y);\r\n }\r\n });\r\n\r\n if (polygon.closed) {\r\n polygonCtx.lineTo(polygon.points[0].x, polygon.points[0].y);\r\n if (fillColor) {\r\n polygonCtx.fillStyle = fillColor;\r\n polygonCtx.fill();\r\n }\r\n }\r\n\r\n if (polygon.points.length > 0) {\r\n polygonCtx.stroke();\r\n }\r\n\r\n if (polygon.points.length > 1 && !polygon.closed && shiftKeyPressed) {\r\n const projectedPoint = projectPointPerpendicularToLine({\r\n x: mousePoint.x,\r\n y: mousePoint.y,\r\n lastPoint: polygon.points[polygon.points.length - 1],\r\n secondLastPoint: polygon.points[polygon.points.length - 2],\r\n });\r\n drawPerpendicularDottedLine({\r\n ctx: polygonCtx,\r\n startPoint: projectedPoint,\r\n endPoint: polygon.points[polygon.points.length - 1],\r\n strokeStyle: DOTTED_LINE_COLOR,\r\n });\r\n }\r\n\r\n if (shiftKeyPressed && polygon.points.length > 1 && !polygon.closed) {\r\n const projectedPoint = projectPointPerpendicularToLine({\r\n x: mousePoint.x,\r\n y: mousePoint.y,\r\n lastPoint: polygon.points[polygon.points.length - 1],\r\n secondLastPoint: polygon.points[polygon.points.length - 2],\r\n });\r\n drawCircle({\r\n ctx: polygonCtx,\r\n x: projectedPoint.x,\r\n y: projectedPoint.y,\r\n radius: 5,\r\n strokeStyle: DOTTED_LINE_COLOR,\r\n });\r\n }\r\n\r\n // Draw circles around each point\r\n polygon.points.forEach((point) => {\r\n polygonCtx.beginPath();\r\n const strokeStyle = strokeColor;\r\n const distance = Math.sqrt(\r\n Math.pow(point.x - mousePoint.x, 2) + Math.pow(point.y - mousePoint.y, 2)\r\n );\r\n\r\n // Highlight the point if it's being hovered or dragged\r\n if (\r\n distance < 10\r\n ) {\r\n drawCircle({\r\n ctx: polygonCtx,\r\n x: point.x,\r\n y: point.y,\r\n strokeStyle,\r\n radius: 8,\r\n });\r\n } else {\r\n drawCircle({\r\n ctx: polygonCtx,\r\n x: point.x,\r\n y: point.y,\r\n strokeStyle,\r\n radius: 5,\r\n });\r\n }\r\n\r\n polygonCtx.stroke();\r\n });\r\n}\r\n\r\nexport function drawCircle({\r\n ctx,\r\n x,\r\n y,\r\n radius,\r\n strokeStyle = \"black\",\r\n lineWidth = 2\r\n}: DrawCircleProps) {\r\n ctx.beginPath();\r\n ctx.strokeStyle = strokeStyle;\r\n ctx.lineWidth = lineWidth;\r\n \r\n ctx.arc(x, y, radius, 0, 2 * Math.PI);\r\n ctx.stroke();\r\n}\r\n\r\nexport function drawPerpendicularDottedLine({\r\n ctx,\r\n startPoint,\r\n endPoint,\r\n dashPattern = [5, 5],\r\n strokeStyle = \"black\",\r\n lineWidth = 2\r\n}: {\r\n ctx: CanvasRenderingContext2D;\r\n startPoint: Point;\r\n endPoint: Point;\r\n dashPattern?: number[];\r\n strokeStyle?: string;\r\n lineWidth?: number;\r\n}) {\r\n // Set up the line style\r\n ctx.beginPath();\r\n ctx.strokeStyle = strokeStyle;\r\n ctx.lineWidth = lineWidth;\r\n ctx.setLineDash(dashPattern);\r\n \r\n // Draw the dotted line\r\n ctx.moveTo(startPoint.x, startPoint.y);\r\n ctx.lineTo(endPoint.x, endPoint.y);\r\n ctx.stroke();\r\n \r\n // Reset the line dash\r\n ctx.setLineDash([]);\r\n}\r\n\r\nexport function isPointOnBorder(point: Point, polygon: Polygon): boolean {\r\n if (!polygon.closed || polygon.points.length < 3) return false;\r\n\r\n const x = point.x;\r\n const y = point.y;\r\n\r\n // For each edge of the polygon\r\n for (let i = 0; i < polygon.points.length; i++) {\r\n const p1 = polygon.points[i];\r\n const p2 = polygon.points[(i + 1) % polygon.points.length];\r\n // calculate the distance from point p1 to p2\r\n const distance = Math.sqrt(Math.pow(p1.x - p2.x, 2) + Math.pow(p1.y - p2.y, 2));\r\n const distanceToPoint = Math.sqrt(Math.pow(p1.x - x, 2) + Math.pow(p1.y - y, 2));\r\n const distanceFromPoint = Math.sqrt(Math.pow(p2.x - x, 2) + Math.pow(p2.y - y, 2));\r\n if (distance === distanceToPoint + distanceFromPoint) {\r\n return true;\r\n }\r\n }\r\n return false;\r\n}\r\n\r\nexport function isPointInPolygon(point: Point, polygon: Polygon): boolean {\r\n if (!polygon.closed || polygon.points.length < 3) return false;\r\n\r\n const num_vertices = polygon.points.length;\r\n const x = point.x;\r\n const y = point.y;\r\n let inside = false;\r\n\r\n let p1 = polygon.points[0];\r\n let p2: Point;\r\n\r\n for (let i = 1; i <= num_vertices; i++) {\r\n p2 = polygon.points[i % num_vertices];\r\n\r\n if (y > Math.min(p1.y, p2.y)) {\r\n if (y <= Math.max(p1.y, p2.y)) {\r\n if (x <= Math.max(p1.x, p2.x)) {\r\n const x_intersection = ((y - p1.y) * (p2.x - p1.x)) / (p2.y - p1.y) + p1.x;\r\n\r\n if (p1.x === p2.x || x <= x_intersection) {\r\n inside = !inside;\r\n }\r\n }\r\n }\r\n }\r\n\r\n p1 = p2;\r\n }\r\n\r\n return inside;\r\n}","export type ToolType = \"move\" | \"roof\" | \"obstruction\" | \"delete\";\r\n\r\nexport interface KeyboardCombination {\r\n key: string;\r\n description: string;\r\n}\r\n\r\nexport interface Tool {\r\n name: ToolType;\r\n ariaLabel: string;\r\n icon: string;\r\n cursor: string;\r\n keyboardShortcut?: string;\r\n keyboardCombinations?: KeyboardCombination[];\r\n explanation?: string;\r\n}\r\n\r\nconst polygonKeyboardCombinations: KeyboardCombination[] = [\r\n {\r\n key: \"shift\",\r\n description: \"add one point on perpendicular line\",\r\n },\r\n // {\r\n // key: \"alt\",\r\n // description: \"add parallel line\",\r\n // },\r\n];\r\n\r\nexport const moveTool: Tool = {\r\n name: \"move\",\r\n ariaLabel: \"Move\",\r\n icon: \"move\",\r\n cursor: \"move\",\r\n keyboardShortcut: \"m\",\r\n explanation: \"Move points of the active polygon\",\r\n}\r\n\r\nexport const roofTool: Tool = {\r\n name: \"roof\",\r\n ariaLabel: \"Roof Area\",\r\n icon: \"house\",\r\n cursor: \"crosshair\",\r\n keyboardShortcut: \"r\",\r\n keyboardCombinations: polygonKeyboardCombinations,\r\n explanation: \"Draw the roof of the building\",\r\n}\r\n\r\nexport const obstructionTool: Tool = {\r\n name: \"obstruction\",\r\n ariaLabel: \"Obstruction\",\r\n icon: \"octagon-minus\",\r\n cursor: \"crosshair\",\r\n keyboardShortcut: \"o\",\r\n keyboardCombinations: polygonKeyboardCombinations,\r\n explanation: \"Draw the obstruction of the building\",\r\n}\r\n\r\nexport const deleteTool: Tool = {\r\n name: \"delete\",\r\n ariaLabel: \"Delete\",\r\n icon: \"eraser\",\r\n cursor: \"default\",\r\n keyboardShortcut: \"d\",\r\n explanation: \"Delete the active polygon\",\r\n}\r\n\r\nexport const tools: Tool[] = [\r\n moveTool,\r\n roofTool,\r\n obstructionTool,\r\n deleteTool,\r\n];\r\n","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 { Polygon, SelectedPolygon } from \"../../types/shapes\";\r\nimport { SolarExpertConfig } from \"../../config\";\r\n\r\n\r\nexport function getFillColor(selectedPolygon: SelectedPolygon | null, hoveredPolygon: SelectedPolygon | null, _id: string, polygon: Polygon, config: SolarExpertConfig): string | undefined {\r\n const isHovered = hoveredPolygon?.type === polygon.type && hoveredPolygon?._id === _id;\r\n if (isHovered) {\r\n return polygon.type === \"roof\" ? config.roofPolygonHoverFillColor : config.obstructionPolygonHoverFillColor;\r\n }\r\n \r\n const isSelected = selectedPolygon?.type === polygon.type && selectedPolygon?._id === _id;\r\n\r\n if (isSelected) {\r\n return polygon.type === \"roof\" ? config.roofPolygonSelectedFillColor : config.obstructionPolygonSelectedFillColor;\r\n }\r\n\r\n if (polygon.type === \"roof\") {\r\n return polygon.closed ? config.roofPolygonFillColor : undefined;\r\n }\r\n return polygon.closed ? config.obstructionPolygonFillColor : undefined;\r\n}\r\n","import validate from './validate.js';\n\n/**\n * Convert array of 16 byte values to UUID string format of the form:\n * XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX\n */\nvar byteToHex = [];\nfor (var i = 0; i < 256; ++i) {\n byteToHex.push((i + 0x100).toString(16).slice(1));\n}\nexport function unsafeStringify(arr, offset = 0) {\n // Note: Be careful editing this code! It's been tuned for performance\n // and works in ways you may not expect. See https://github.com/uuidjs/uuid/pull/434\n //\n // Note to future-self: No, you can't remove the `toLowerCase()` call.\n // REF: https://github.com/uuidjs/uuid/pull/677#issuecomment-1757351351\n return (byteToHex[arr[offset + 0]] + byteToHex[arr[offset + 1]] + byteToHex[arr[offset + 2]] + byteToHex[arr[offset + 3]] + '-' + byteToHex[arr[offset + 4]] + byteToHex[arr[offset + 5]] + '-' + byteToHex[arr[offset + 6]] + byteToHex[arr[offset + 7]] + '-' + byteToHex[arr[offset + 8]] + byteToHex[arr[offset + 9]] + '-' + byteToHex[arr[offset + 10]] + byteToHex[arr[offset + 11]] + byteToHex[arr[offset + 12]] + byteToHex[arr[offset + 13]] + byteToHex[arr[offset + 14]] + byteToHex[arr[offset + 15]]).toLowerCase();\n}\nfunction stringify(arr, offset = 0) {\n var uuid = unsafeStringify(arr, offset);\n // Consistency check for valid UUID. If this throws, it's likely due to one\n // of the following:\n // - One or more input array values don't map to a hex octet (leading to\n // \"undefined\" in the uuid)\n // - Invalid input values for the RFC `version` or `variant` fields\n if (!validate(uuid)) {\n throw TypeError('Stringified UUID is invalid');\n }\n return uuid;\n}\nexport default stringify;","// Unique ID creation requires a high quality random # generator. In the browser we therefore\n// require the crypto API and do not support built-in fallback to lower quality random number\n// generators (like Math.random()).\n\nvar getRandomValues;\nvar rnds8 = new Uint8Array(16);\nexport default function rng() {\n // lazy load so that environments that need to polyfill have a chance to do so\n if (!getRandomValues) {\n // getRandomValues needs to be invoked in a context where \"this\" is a Crypto implementation.\n getRandomValues = typeof crypto !== 'undefined' && crypto.getRandomValues && crypto.getRandomValues.bind(crypto);\n if (!getRandomValues) {\n throw new Error('crypto.getRandomValues() not supported. See https://github.com/uuidjs/uuid#getrandomvalues-not-supported');\n }\n }\n return getRandomValues(rnds8);\n}","var randomUUID = typeof crypto !== 'undefined' && crypto.randomUUID && crypto.randomUUID.bind(crypto);\nexport default {\n randomUUID\n};","import native from './native.js';\nimport rng from './rng.js';\nimport { unsafeStringify } from './stringify.js';\nfunction v4(options, buf, offset) {\n if (native.randomUUID && !buf && !options) {\n return native.randomUUID();\n }\n options = options || {};\n var rnds = options.random || (options.rng || rng)();\n\n // Per 4.4, set bits for version and `clock_seq_hi_and_reserved`\n rnds[6] = rnds[6] & 0x0f | 0x40;\n rnds[8] = rnds[8] & 0x3f | 0x80;\n\n // Copy bytes to buffer, if provided\n if (buf) {\n offset = offset || 0;\n for (var i = 0; i < 16; ++i) {\n buf[offset + i] = rnds[i];\n }\n return buf;\n }\n return unsafeStringify(rnds);\n}\nexport default v4;","import { Point } from \"../types/shapes\";\r\nimport { Bounds, GeoTiff, LatLng } from \"./solar\";\r\n\r\nexport function calculatePolygonArea(points: Point[]): number {\r\n let area = 0;\r\n for (let i = 0; i < points.length; i++) {\r\n const j = (i + 1) % points.length;\r\n area += points[i].x * points[j].y;\r\n area -= points[j].x * points[i].y;\r\n }\r\n return Math.abs(area / 2);\r\n};\r\n\r\nexport function azimuthToCardinal(azimuth: number): string {\r\n // Convert angle to cardinal direction\r\n if (azimuth >= 337.5 || azimuth < 22.5) return \"North\";\r\n if (azimuth >= 22.5 && azimuth < 67.5) return \"Northeast\";\r\n if (azimuth >= 67.5 && azimuth < 112.5) return \"East\";\r\n if (azimuth >= 112.5 && azimuth < 157.5) return \"Southeast\";\r\n if (azimuth >= 157.5 && azimuth < 202.5) return \"South\";\r\n if (azimuth >= 202.5 && azimuth < 247.5) return \"Southwest\";\r\n if (azimuth >= 247.5 && azimuth < 292.5) return \"West\";\r\n return \"Northwest\";\r\n}\r\n\r\nexport function calculatePolygonOrientation(points: Point[]): number {\r\n if (points.length < 3) return 0;\r\n\r\n // Calculate the average direction of the polygon\r\n let totalAngle = 0;\r\n for (let i = 0; i < points.length; i++) {\r\n const j = (i + 1) % points.length;\r\n const angle = Math.atan2(\r\n points[j].y - points[i].y,\r\n points[j].x - points[i].x,\r\n );\r\n totalAngle += angle;\r\n }\r\n\r\n const avgAngle = (totalAngle / points.length) * (180 / Math.PI);\r\n const normalizedAngle = (avgAngle + 360) % 360;\r\n return normalizedAngle;\r\n};\r\n\r\nexport function calculatePolygonAngle(points: Point[]): number {\r\n if (points.length < 3) return 0;\r\n\r\n // Calculate the average angle of the polygon\r\n let totalAngle = 0;\r\n for (let i = 0; i < points.length; i++) {\r\n const j = (i + 1) % points.length;\r\n const k = (i + 2) % points.length;\r\n\r\n const v1 = {\r\n x: points[j].x - points[i].x,\r\n y: points[j].y - points[i].y,\r\n };\r\n const v2 = {\r\n x: points[k].x - points[j].x,\r\n y: points[k].y - points[j].y,\r\n };\r\n\r\n const dot = v1.x * v2.x + v1.y * v2.y;\r\n const mag1 = Math.sqrt(v1.x * v1.x + v1.y * v1.y);\r\n const mag2 = Math.sqrt(v2.x * v2.x + v2.y * v2.y);\r\n\r\n const angle = Math.acos(dot / (mag1 * mag2));\r\n totalAngle += angle;\r\n }\r\n\r\n return (totalAngle / points.length) * (180 / Math.PI);\r\n};\r\n\r\nexport function latLngToPixel(bounds: Bounds, canvas: HTMLCanvasElement, latLng: LatLng): Point {\r\n const ctx = canvas.getContext('2d');\r\n if (!ctx) {\r\n throw new Error('Canvas context not found');\r\n }\r\n const latToPixel = (lat: number) => {\r\n return canvas.height * (1 - (lat - bounds.south) / (bounds.north - bounds.south));\r\n };\r\n \r\n const lngToPixel = (lng: number) => {\r\n return canvas.width * (lng - bounds.west) / (bounds.east - bounds.west);\r\n };\r\n\r\n return {\r\n x: lngToPixel(latLng.longitude),\r\n y: latToPixel(latLng.latitude),\r\n };\r\n}\r\n\r\nexport function getPixelInMeters(rgbTiff: GeoTiff): number {\r\n const latDiff = rgbTiff.bounds.north - rgbTiff.bounds.south;\r\n // const lngDiff = rgbTiff.bounds.east - rgbTiff.bounds.west;\r\n // const pixelWidth = rgbTiff.width;\r\n const pixelHeight = rgbTiff.height;\r\n const pixelInMeters = latDiff * 111320 / pixelHeight;\r\n // const latAvg = (rgbTiff.bounds.north + rgbTiff.bounds.south) / 2;\r\n // const pixelInMetersLng = lngDiff * 111320 * Math.cos(latAvg * Math.PI / 180) / pixelWidth;\r\n return pixelInMeters\r\n}","import { LineSegment, Polygon, SegmentMatch } from \"../../types/shapes\";\r\nimport { Bounds, LatLng, RoofSegmentSizeAndSunshineStats, SolarPanelType } from \"../solar\";\r\nimport { latLngToPixel } from \"../utils\";\r\nimport { Point } from \"../../types/shapes\";\r\nimport { isPointInPolygon, isPointOnBorder, Line } from \"../render/polygon\";\r\n\r\n\r\nexport interface SolarPanelSystemPart {\r\n positionedPanels: PositionedSolarPanel[];\r\n sunniness: number;\r\n}\r\n\r\nexport interface PositionedSolarPanel {\r\n panel: SolarPanelType;\r\n pixelPosition: {\r\n x: number;\r\n y: number;\r\n };\r\n horizontal: boolean;\r\n}\r\n\r\n/**\r\n * Get the intersections of a line parallel to the x-axis of the projected coordinate system with a polygon.\r\n * @param projectedPoint the point to draw the line from\r\n * @param projectedPolygon the polygon to get the intersections with\r\n * @returns the intersections of the line with the polygon\r\n */\r\nexport function getIntersections(projectedPoint: Point, projectedPolygon: Polygon): Point[] {\r\n const intersections: Point[] = [];\r\n\r\n if (projectedPolygon.points.length === 0) {\r\n return intersections;\r\n }\r\n \r\n // For each edge of the polygon\r\n for (let i = 0; i < projectedPolygon.points.length; i++) {\r\n const p1 = projectedPolygon.points[i];\r\n const p2 = projectedPolygon.points[(i + 1) % projectedPolygon.points.length];\r\n \r\n // Calculate intersection point\r\n const t = (projectedPoint.y - p1.y) / (p2.y - p1.y);\r\n const x = p1.x + t * (p2.x - p1.x);\r\n \r\n if (t > 0 && t <= 1) {\r\n intersections.push({ x, y: projectedPoint.y });\r\n }\r\n if (t === 0) {\r\n intersections.push({ x: p1.x, y: projectedPoint.y });\r\n }\r\n }\r\n \r\n // Sort intersections by y-coordinate\r\n return intersections.sort((a, b) => a.x - b.x);\r\n}\r\n\r\nexport function projectPoint(point: Point, azimuth: number): Point {\r\n const angle = azimuth * (Math.PI / 180);\r\n const x = point.x * Math.cos(angle) - point.y * Math.sin(angle);\r\n const y = point.x * Math.sin(angle) + point.y * Math.cos(angle);\r\n return { x, y };\r\n}\r\n\r\nexport function projectPolygon(polygon: Polygon, azimuth: number): Polygon {\r\n return {\r\n points: polygon.points.map((point) => projectPoint(point, azimuth)),\r\n type: polygon.type,\r\n closed: polygon.closed,\r\n _id: polygon._id,\r\n details: polygon.details,\r\n };\r\n}\r\n\r\nexport function offsetPolygon(polygon: Polygon, offset?: {x: number, y: number}): {polygon: Polygon, offset: {x: number, y: number}} {\r\n if (polygon.points.length === 0) {\r\n return { polygon: polygon, offset: {x: 0, y: 0} };\r\n }\r\n\r\n let offsetX = 0;\r\n let offsetY = 0;\r\n if (!offset) {\r\n const minX = Math.min(...polygon.points.map((point) => point.x));\r\n const minY = Math.min(...polygon.points.map((point) => point.y));\r\n const maxX = Math.max(...polygon.points.map((point) => point.x));\r\n const maxY = Math.max(...polygon.points.map((point) => point.y));\r\n\r\n offsetX = minX + (maxX - minX) / 2;\r\n offsetY = minY + (maxY - minY) / 2;\r\n }\r\n else {\r\n offsetX = offset.x;\r\n offsetY = offset.y;\r\n }\r\n\r\n const newPoints = polygon.points.map((point) => ({\r\n x: point.x - offsetX,\r\n y: point.y - offsetY,\r\n }));\r\n\r\n return { polygon: { ...polygon, points: newPoints }, offset: {x: offsetX, y: offsetY} };\r\n}\r\n\r\nfunction equalsPoints(point1: Point, point2: Point): boolean {\r\n return point1.x === point2.x && point1.y === point2.y;\r\n}\r\n\r\n/**\r\n * Checks if two lines intersect.\r\n * if the lines intersect in a start or end point they are not considered as intersecting\r\n * @param line1 The first line.\r\n * @param line2 The second line.\r\n * @returns True if the lines intersect, false otherwise.\r\n */\r\nexport function intersects(line1: Line, line2: Line): boolean {\r\n // Get the points of each line\r\n const p1 = line1.start;\r\n const p2 = line1.end;\r\n const p3 = line2.start;\r\n const p4 = line2.end;\r\n\r\n if (equalsPoints(p1, p3) || equalsPoints(p1, p4) || equalsPoints(p2, p3) || equalsPoints(p2, p4)) {\r\n return false;\r\n }\r\n\r\n // Calculate the cross products\r\n const d1 = (p4.x - p3.x) * (p1.y - p3.y) - (p4.y - p3.y) * (p1.x - p3.x);\r\n const d2 = (p4.x - p3.x) * (p2.y - p3.y) - (p4.y - p3.y) * (p2.x - p3.x);\r\n const d3 = (p2.x - p1.x) * (p3.y - p1.y) - (p2.y - p1.y) * (p3.x - p1.x);\r\n const d4 = (p2.x - p1.x) * (p4.y - p1.y) - (p2.y - p1.y) * (p4.x - p1.x);\r\n\r\n // Check if the lines intersect\r\n return (d1 * d2 < 0) && (d3 * d4 < 0);\r\n}\r\n\r\nexport function undoOffsetPolygon(polygon: Polygon, offset: {x: number, y: number}): Polygon {\r\n return {\r\n ...polygon,\r\n points: polygon.points.map((point) => ({\r\n x: point.x + offset.x,\r\n y: point.y + offset.y,\r\n })),\r\n };\r\n}\r\n\r\nexport function segmentPolygon(polygon: Polygon) {\r\n const segments: LineSegment[] = [];\r\n const segmentsMap: Record<string, boolean> = {};\r\n\r\n for (const point of polygon.points) {\r\n const intersections = getIntersections(point, polygon);\r\n for (const [index, intersection] of intersections.slice(0, -1).entries()) {\r\n const nextIntersection = intersections[index + 1];\r\n \r\n const halfPoint = {\r\n x: (intersection.x + nextIntersection.x) / 2,\r\n y: (intersection.y + nextIntersection.y) / 2,\r\n };\r\n\r\n const isInner = isPointInPolygon(halfPoint, polygon);\r\n const isOnBorder = isPointOnBorder(halfPoint, polygon);\r\n const key = `${intersection.x}-${intersection.y}-${nextIntersection.x}-${nextIntersection.y}`;\r\n \r\n if (segmentsMap[key]) {\r\n continue;\r\n }\r\n segments.push({ start: intersection, end: nextIntersection, type: isOnBorder ? \"border\" : (isInner ? \"inner\" : \"outer\") });\r\n segmentsMap[key] = true;\r\n }\r\n }\r\n return segments;\r\n}\r\n\r\n/**\r\n * for each segment this method will find all the following segments that are connected to it\r\n * \r\n * first the method subdivides the segments into y levels (all segments that have the same y coordinate are in the same level)\r\n * then it will check for each segment in each level if there is a following segment that is connected to it by checking it the \r\n * start point of the top segment to the end point of the bottom segment does not intersect with any of the polygon borders and the center point of the connection is in the polygon\r\n * \r\n * @param segments \r\n * @param roof \r\n * @returns \r\n */\r\nexport function matchSegments(segments: LineSegment[], roof: Polygon): {matches: SegmentMatch[], map: Record<string, LineSegment>} {\r\n const matches: SegmentMatch[] = [];\r\n const map: Record<string, LineSegment> = {};\r\n\r\n for (const segment of segments) {\r\n map[`${segment.start.x}-${segment.start.y}-${segment.end.x}-${segment.end.y}`] = segment;\r\n }\r\n \r\n // Group segments by y-coordinate (level)\r\n const levels: Record<number, LineSegment[]> = {};\r\n segments.forEach(segment => {\r\n const y = segment.start.y;\r\n if (!levels[y]) {\r\n levels[y] = [];\r\n }\r\n levels[y].push(segment);\r\n });\r\n\r\n // Sort levels by y-coordinate\r\n const sortedLevels = Object.keys(levels).map(Number).sort((a, b) => a - b);\r\n\r\n // For each level except the last one\r\n for (let i = 0; i < sortedLevels.length - 1; i++) {\r\n const currentLevel = levels[sortedLevels[i]];\r\n const nextLevel = levels[sortedLevels[i + 1]];\r\n\r\n // For each segment in current level\r\n for (const currentSegment of currentLevel) {\r\n if (currentSegment.type === \"outer\") {\r\n continue;\r\n }\r\n const matchedSegments: LineSegment[] = [];\r\n \r\n // For each segment in next level\r\n for (const nextSegment of nextLevel) {\r\n // Check if segments can be connected\r\n const connectionStart = currentSegment.start;\r\n const connectionEnd = nextSegment.end;\r\n\r\n let intersected = false;\r\n for (let i = 0; i < roof.points.length; i++) {\r\n const line = {\r\n start: roof.points[i],\r\n end: roof.points[(i + 1) % roof.points.length]\r\n };\r\n if (intersects(line, {start: connectionStart, end: connectionEnd})) {\r\n intersected = true;\r\n break;\r\n }\r\n }\r\n\r\n if (intersected) {\r\n continue;\r\n }\r\n\r\n // Check if center point of connection is inside polygon\r\n const centerPoint = {\r\n x: (connectionStart.x + connectionEnd.x) / 2,\r\n y: (connectionStart.y + connectionEnd.y) / 2\r\n };\r\n\r\n if (isPointInPolygon(centerPoint, roof)) {\r\n matchedSegments.push(nextSegment);\r\n }\r\n }\r\n\r\n if (matchedSegments.length > 0) {\r\n matches.push({\r\n segment: `${currentSegment.start.x}-${currentSegment.start.y}-${currentSegment.end.x}-${currentSegment.end.y}`,\r\n matchedSegments: matchedSegments.map(segment => `${segment.start.x}-${segment.start.y}-${segment.end.x}-${segment.end.y}`)\r\n });\r\n }\r\n }\r\n }\r\n\r\n return {matches, map};\r\n}\r\n\r\n/**\r\n * Fits panels to a roof polygon.\r\n * \r\n * Starts with positioning a solar panel row (a rectangle with the height of the solar panel and the width in the direction of the perpendicular of\r\n * the azimuth of the roof) at each corner of the roof.\r\n * For each corner there are four possible cases (the width is the width of the whole roof in the direction of the perpendicular of the azimuth):\r\n * 1. The row has height of the solar panel height and sits below the point in the direction of the azimuth of the roof.\r\n * 2. The row has height of the solar panel height and sits above the point in the direction of the azimuth of the roof.\r\n * 3. The row has the height of the solar panel width (solar panels are rotated) and sits below the point in the direction of the azimuth of the roof.\r\n * 4. The row has the height of the solar panel width (solar panels are rotated) and sits above the point in the direction of the azimuth of the roof.\r\n * \r\n * For each of these cases the function then places the solar panel rows directly above and below the current row.\r\n * \r\n * after the function has positioned all the rows it places the solar panels in the spaces between the rows.\r\n * For each of the four scenarios of each corner the number of panels are counted and the optimal placement is chosen.\r\n * \r\n * @param roof - The roof polygon.\r\n * @param panelType - The type of panel to fit.\r\n * @param borderOffset - The offset of the panel from the border of the roof. If negative, the panel can be partially overhanging the roof.\r\n * @param azimuth - The azimuth of the roof.\r\n * @returns The positioned panels.\r\n */\r\nexport function fitPanelsToRoof(roof: Polygon, panelType: SolarPanelType, borderOffset: number = 0, azimuth: number = 0): PositionedSolarPanel[] {\r\n if (!roof || !panelType || !roof.points || !roof.details) {\r\n return [];\r\n }\r\n console.log(borderOffset, azimuth)\r\n return [];\r\n \r\n // const minX = Math.min(...roof.points.map(p => p.x));\r\n // const maxX = Math.max(...roof.points.map(p => p.x));\r\n // const minY = Math.min(...roof.points.map(p => p.y));\r\n // const maxY = Math.max(...roof.points.map(p => p.y));\r\n\r\n // const projectedRoof = projectPolygon(roof, azimuth);\r\n // const projectedOffsetRoof = offsetPolygon(projectedRoof);\r\n\r\n // const segments = segmentPolygon(projectedOffsetRoof.polygon);\r\n // const {matches, map} = matchSegments(segments, projectedOffsetRoof.polygon);\r\n // const matchesMap: Record<string, LineSegment[]> = {};\r\n // for (const match of matches) {\r\n // matchesMap[match.segment] = match.matchedSegments.map(segment => map[segment]);\r\n // }\r\n\r\n // let panels: PositionedSolarPanel[] = [];\r\n // let undidPanels: PositionedSolarPanel[] = [];\r\n\r\n // for (const segment of segments) {\r\n // if (segment.type === \"outer\") {\r\n // continue;\r\n // }\r\n\r\n // const matches = matchesMap[`${segment.start.x}-${segment.start.y}-${segment.end.x}-${segment.end.y}`];\r\n // if (!matches || matches.length === 0) {\r\n // continue;\r\n // }\r\n\r\n // // Combine segments until we reach panel height\r\n // let combinedSegments: Array<Array<LineSegment>> = [[segment]];\r\n // let currentHeight = 0;\r\n // let currentMatches = matches;\r\n\r\n // // while (currentHeight < panelType.heightMeters && currentMatches.length > 0) {\r\n // // const nextSegment = currentMatches[0];\r\n // // combinedSegments.push(nextSegment);\r\n // // currentHeight += Math.abs(nextSegment.start.y - segment.start.y);\r\n // // currentMatches = matchesMap[`${nextSegment.start.x}-${nextSegment.start.y}-${nextSegment.end.x}-${nextSegment.end.y}`] || [];\r\n // // }\r\n\r\n // if (currentHeight < panelType.heightMeters) {\r\n // continue;\r\n // }\r\n\r\n // // Calculate minimum width\r\n // // let minEnd = Math.max(...combinedSegments.map(s => s.end.x));\r\n // // let maxStart = Math.min(...combinedSegments.map(s => s.start.x));\r\n // // let width = minEnd - maxStart;\r\n\r\n // // if (width >= panelType.widthMeters) {\r\n // // // Find highest segment for starting position\r\n // // const highestSegment = combinedSegments.reduce((prev, curr) => \r\n // // curr.start.y < prev.start.y ? curr : prev\r\n // // );\r\n\r\n // // // Place panels in a grid\r\n // // const panelSpacing = panelType.widthMeters + borderOffset;\r\n // // const rowSpacing = panelType.heightMeters + borderOffset;\r\n // // let currentX = maxStart;\r\n // // let currentY = highestSegment.start.y;\r\n\r\n // // while (currentX + panelType.widthMeters <= minEnd) {\r\n // // while (currentY + panelType.heightMeters <= highestSegment.start.y + currentHeight) {\r\n // // const panelCenter = {\r\n // // x: currentX + panelType.widthMeters / 2,\r\n // // y: currentY + panelType.heightMeters / 2\r\n // // };\r\n\r\n // // if (isPointInPolygon(panelCenter, projectedOffsetRoof.polygon)) {\r\n // // panels.push({\r\n // // panel: panelType,\r\n // // pixelPosition: panelCenter\r\n // // });\r\n // // }\r\n\r\n // // currentY += rowSpacing;\r\n // // }\r\n // // currentX += panelSpacing;\r\n // // currentY = highestSegment.start.y;\r\n // // }\r\n // // }\r\n // }\r\n\r\n // for (const panel of panels) {\r\n // const undoOffset = {\r\n // x: panel.pixelPosition.x + projectedOffsetRoof.offset.x,\r\n // y: panel.pixelPosition.y + projectedOffsetRoof.offset.y,\r\n // };\r\n // const projectedPanel = projectPoint(undoOffset, azimuth);\r\n // undidPanels.push({\r\n // panel: panel.panel,\r\n // pixelPosition: projectedPanel,\r\n // });\r\n // }\r\n\r\n // return panels;\r\n\r\n // project the polygon points such that the azimuth is 0 degrees\r\n // this means that the solar panel are aligned perfectly with the coordinate system\r\n //\r\n // 1. below point and height is height\r\n // for each point do the following\r\n // draw a line along the y-axis of the projected coordinate system (this is the perpendicular of the azimuth)\r\n // find all the intersection of that line with the roof polygon\r\n // get all points that are within the height of the solar panel in the direction of the azimuth\r\n // \r\n\r\n // for each point generate a line along the y-axis of the projected coordinate system (this is the perpendicular of the azimuth)\r\n // find all points on that line that intersect with the roof polygon bounds\r\n // if the number of points is even \r\n\r\n // \r\n\r\n // const positionedPanels: PositionedSolarPanel[] = [];\r\n // let bestPanelCount = 0;\r\n // let bestPanelArrangement: PositionedSolarPanel[] = [];\r\n\r\n // // Get roof details\r\n // const { azimuth } = roof.details;\r\n // const perpendicularAzimuth = (azimuth + 90) % 360;\r\n\r\n // for (const point of roof.points) {\r\n // const row = createPanelRow(point, false, false);\r\n // positionedPanels.push(...row);\r\n // }\r\n\r\n // Helper function to create a panel row\r\n // const createPanelRow = (startPoint: Point, isRotated: boolean, isAbove: boolean): PositionedSolarPanel[] => {\r\n // const rowPanels: PositionedSolarPanel[] = [];\r\n // const panelWidth = isRotated ? panelType.heightMeters : panelType.widthMeters;\r\n // const panelHeight = isRotated ? panelType.widthMeters : panelType.heightMeters;\r\n\r\n // // Calculate row direction based on azimuth\r\n // const rowAngle = perpendicularAzimuth * (Math.PI / 180);\r\n // const rowDirX = Math.cos(rowAngle);\r\n // const rowDirY = Math.sin(rowAngle);\r\n\r\n // // Calculate panel spacing direction based on azimuth\r\n // const panelAngle = azimuth * (Math.PI / 180);\r\n // const panelDirX = Math.cos(panelAngle);\r\n // const panelDirY = Math.sin(panelAngle);\r\n\r\n // // Calculate row width (distance from start to end of roof in perpendicular direction)\r\n // let maxRowWidth = 0;\r\n // for (const point of roof.points) {\r\n // const dx = point.x - startPoint.x;\r\n // const dy = point.y - startPoint.y;\r\n // const width = Math.abs(dx * rowDirX + dy * rowDirY);\r\n // maxRowWidth = Math.max(maxRowWidth, width);\r\n // }\r\n\r\n // // Place panels along the row\r\n // const numPanels = Math.floor(maxRowWidth / panelWidth);\r\n // for (let i = 0; i < numPanels; i++) {\r\n // const panelX = startPoint.x + i * panelWidth * rowDirX;\r\n // const panelY = startPoint.y + i * panelWidth * rowDirY;\r\n\r\n // // Check if panel center is within roof polygon\r\n // const panelCenter = {\r\n // x: panelX + (panelWidth / 2) * rowDirX + (panelHeight / 2) * panelDirX,\r\n // y: panelY + (panelWidth / 2) * rowDirY + (panelHeight / 2) * panelDirY\r\n // };\r\n\r\n // if (isPointInPolygon(panelCenter, roof)) {\r\n // rowPanels.push({\r\n // panel: panelType,\r\n // pixelPosition: {\r\n // x: panelCenter.x,\r\n // y: panelCenter.y\r\n // }\r\n // });\r\n // }\r\n // }\r\n\r\n // return rowPanels;\r\n // };\r\n\r\n // // Try each corner and arrangement\r\n // for (const corner of roof.points) {\r\n // // Try all four arrangements for this corner\r\n // const arrangements = [\r\n // { isRotated: false, isAbove: false },\r\n // { isRotated: false, isAbove: true },\r\n // { isRotated: true, isAbove: false },\r\n // { isRotated: true, isAbove: true }\r\n // ];\r\n\r\n // for (const arrangement of arrangements) {\r\n // const currentPanels: PositionedSolarPanel[] = [];\r\n // const { isRotated, isAbove } = arrangement;\r\n\r\n // // Create initial row\r\n // const initialRow = createPanelRow(corner, isRotated, isAbove);\r\n // currentPanels.push(...initialRow);\r\n\r\n // // Add rows above and below\r\n // const panelHeight = isRotated ? panelType.widthMeters : panelType.heightMeters;\r\n // const rowSpacing = panelHeight + borderOffset;\r\n\r\n // // Calculate direction for adding rows\r\n // const rowAngle = azimuth * (Math.PI / 180);\r\n // const rowDirX = Math.cos(rowAngle);\r\n // const rowDirY = Math.sin(rowAngle);\r\n\r\n // // Add rows in both directions\r\n // let rowOffset = rowSpacing;\r\n // while (true) {\r\n // const newRowPoint = {\r\n // x: corner.x + rowOffset * rowDirX,\r\n // y: corner.y + rowOffset * rowDirY\r\n // };\r\n // const newRow = createPanelRow(newRowPoint, isRotated, isAbove);\r\n // if (newRow.length === 0) break;\r\n // currentPanels.push(...newRow);\r\n // rowOffset += rowSpacing;\r\n // }\r\n\r\n // rowOffset = -rowSpacing;\r\n // while (true) {\r\n // const newRowPoint = {\r\n // x: corner.x + rowOffset * rowDirX,\r\n // y: corner.y + rowOffset * rowDirY\r\n // };\r\n // const newRow = createPanelRow(newRowPoint, isRotated, isAbove);\r\n // if (newRow.length === 0) break;\r\n // currentPanels.push(...newRow);\r\n // rowOffset -= rowSpacing;\r\n // }\r\n\r\n // // Update best arrangement if this one has more panels\r\n // if (currentPanels.length > bestPanelCount) {\r\n // bestPanelCount = currentPanels.length;\r\n // bestPanelArrangement = currentPanels;\r\n // }\r\n // }\r\n // }\r\n\r\n // return bestPanelArrangement;\r\n}\r\n\r\n/**\r\n * Uses the bounding box of the roof and the roof segment bounding boxes to find the best fitting roof segment.\r\n * @param roof the roof shape\r\n * @param roofSegmentStats the stats of the roof segments\r\n * @returns the best fitting roof segment\r\n */\r\nexport function getBestFittingRoofSegment(roof: Polygon, roofSegmentStats: RoofSegmentSizeAndSunshineStats[], bounds: Bounds, canvas: HTMLCanvasElement): RoofSegmentSizeAndSunshineStats {\r\n const polygonBounds = {\r\n minX: Math.min(...roof.points.map((p) => p.x)),\r\n maxX: Math.max(...roof.points.map((p) => p.x)),\r\n minY: Math.min(...roof.points.map((p) => p.y)),\r\n maxY: Math.max(...roof.points.map((p) => p.y)),\r\n };\r\n\r\n let bestSegment = null;\r\n let bestIoU = 0;\r\n\r\n for (const segment of roofSegmentStats) {\r\n const sw = latLngToPixel(bounds, canvas, {\r\n latitude: segment.boundingBox.sw.latitude,\r\n longitude: segment.boundingBox.sw.longitude,\r\n } as LatLng);\r\n const ne = latLngToPixel(bounds, canvas, {\r\n latitude: segment.boundingBox.ne.latitude,\r\n longitude: segment.boundingBox.ne.longitude,\r\n } as LatLng);\r\n const segmentBounds = {\r\n minX: sw.x,\r\n maxX: ne.x,\r\n minY: ne.y,\r\n maxY: sw.y,\r\n };\r\n\r\n // Calculate intersection\r\n const interLeft = Math.max(polygonBounds.minX, segmentBounds.minX);\r\n const interRight = Math.min(polygonBounds.maxX, segmentBounds.maxX);\r\n const interTop = Math.max(polygonBounds.minY, segmentBounds.minY);\r\n const interBottom = Math.min(polygonBounds.maxY, segmentBounds.maxY);\r\n\r\n const interWidth = interRight - interLeft;\r\n const interHeight = interBottom - interTop;\r\n let intersectionArea = 0;\r\n if (interWidth > 0 && interHeight > 0) {\r\n intersectionArea = interWidth * interHeight;\r\n }\r\n\r\n const polygonArea = (polygonBounds.maxX - polygonBounds.minX) * (polygonBounds.maxY - polygonBounds.minY);\r\n const segmentArea = (segmentBounds.maxX - segmentBounds.minX) * (segmentBounds.maxY - segmentBounds.minY);\r\n const unionArea = polygonArea + segmentArea - intersectionArea;\r\n const iou = unionArea > 0 ? intersectionArea / unionArea : 0;\r\n\r\n if (iou > bestIoU) {\r\n bestIoU = iou;\r\n bestSegment = segment;\r\n }\r\n }\r\n\r\n return bestSegment;\r\n}\r\n","import { COLUMN_SPACING, ROW_SPACING } from \"../../constants\";\r\nimport { Point, Polygon } from \"../../types/shapes\";\r\nimport { isPointInPolygon, Line } from \"../render/polygon\";\r\nimport { SolarPanelType } from \"../solar\";\r\nimport { intersects, offsetPolygon, PositionedSolarPanel, projectPoint, projectPolygon } from \"./fitting\";\r\n\r\nexport interface MinMax {\r\n minX: number;\r\n maxX: number;\r\n minY: number;\r\n maxY: number;\r\n}\r\n\r\nexport function generateGrid(minMax: MinMax, solarPanel: SolarPanelType, horizontal: boolean, anker: Point, rowSpacing: number, columnSpacing: number): Array<Array<PositionedSolarPanel>> {\r\n const grid: Array<Array<PositionedSolarPanel>> = [];\r\n const width = horizontal ? solarPanel.heightMeters : solarPanel.widthMeters;\r\n const widthCount = Math.ceil((minMax.maxX - minMax.minX) / width);\r\n const height = horizontal ? solarPanel.widthMeters : solarPanel.heightMeters;\r\n const heightCount = Math.ceil((minMax.maxY - minMax.minY) / height);\r\n\r\n const widthOffset = width / 2;\r\n const heightOffset = height / 2;\r\n\r\n // calculate the starting point based on the anker\r\n const startX = anker.x - (Math.ceil((anker.x - minMax.minX) / width) * width);\r\n const startY = anker.y - (Math.ceil((anker.y - minMax.minY) / height) * height);\r\n\r\n for (let i = 0; i < heightCount; i++) {\r\n const row: Array<PositionedSolarPanel> = [];\r\n for (let j = 0; j < widthCount; j++) {\r\n const x = startX + j * width + j * columnSpacing + widthOffset;\r\n const y = startY + i * height + i * rowSpacing + heightOffset;\r\n const positionedSolarPanel: PositionedSolarPanel = {\r\n panel: solarPanel,\r\n pixelPosition: {\r\n x: x,\r\n y: y\r\n },\r\n horizontal: horizontal\r\n }\r\n row.push(positionedSolarPanel);\r\n }\r\n grid.push(row);\r\n }\r\n return grid;\r\n}\r\n\r\nfunction getSolarPanelLines(positionedSolarPanel: PositionedSolarPanel, horizontal: boolean): Array<Line> {\r\n const width = horizontal ? positionedSolarPanel.panel.heightMeters : positionedSolarPanel.panel.widthMeters;\r\n const height = horizontal ? positionedSolarPanel.panel.widthMeters : positionedSolarPanel.panel.heightMeters;\r\n const p1 = {\r\n x: positionedSolarPanel.pixelPosition.x - width / 2,\r\n y: positionedSolarPanel.pixelPosition.y - height / 2\r\n }\r\n const p2 = {\r\n x: positionedSolarPanel.pixelPosition.x - width / 2,\r\n y: positionedSolarPanel.pixelPosition.y + height / 2\r\n }\r\n const p3 = {\r\n x: positionedSolarPanel.pixelPosition.x + width / 2,\r\n y: positionedSolarPanel.pixelPosition.y + height / 2\r\n }\r\n const p4 = {\r\n x: positionedSolarPanel.pixelPosition.x + width / 2,\r\n y: positionedSolarPanel.pixelPosition.y - height / 2\r\n }\r\n const lines = [\r\n {\r\n start: p1,\r\n end: p2\r\n },\r\n {\r\n start: p2,\r\n end: p3\r\n },\r\n {\r\n start: p3,\r\n end: p4\r\n },\r\n {\r\n start: p4,\r\n end: p1\r\n }\r\n ]\r\n return lines;\r\n}\r\n\r\n\r\nexport function solarPanelInObstacle(positionedSolarPanel: PositionedSolarPanel, obstacle: Polygon, horizontal: boolean): boolean {\r\n const lines = getSolarPanelLines(positionedSolarPanel, horizontal);\r\n if (isPointInPolygon(positionedSolarPanel.pixelPosition, obstacle)) {\r\n return true;\r\n }\r\n for (let i = 0; i < obstacle.points.length; i++) {\r\n const point = obstacle.points[i];\r\n const nextPoint = obstacle.points[(i + 1) % obstacle.points.length];\r\n const border = {\r\n start: point,\r\n end: nextPoint\r\n }\r\n for (const line of lines) {\r\n if (intersects(line, border)) {\r\n return true;\r\n }\r\n }\r\n }\r\n return false;\r\n}\r\n\r\nexport function solarPanelInPolygon(positionedSolarPanel: PositionedSolarPanel, polygon: Polygon, horizontal: boolean): boolean {\r\n const lines = getSolarPanelLines(positionedSolarPanel, horizontal);\r\n\r\n for (let i = 0; i < polygon.points.length; i++) {\r\n const point = polygon.points[i];\r\n const nextPoint = polygon.points[(i + 1) % polygon.points.length];\r\n const border = {\r\n start: point,\r\n end: nextPoint\r\n }\r\n for (const line of lines) {\r\n if (intersects(line, border)) {\r\n return false;\r\n }\r\n }\r\n }\r\n\r\n return isPointInPolygon(positionedSolarPanel.pixelPosition, polygon);\r\n}\r\n\r\nexport interface Obstacle {\r\n polygon: Polygon;\r\n boundingBox: {\r\n minX: number;\r\n maxX: number;\r\n minY: number;\r\n maxY: number;\r\n }\r\n}\r\n\r\nexport function isPanelObstructed(positionedSolarPanel: PositionedSolarPanel, obstacles: Obstacle[], horizontal: boolean): boolean {\r\n for (const obstacle of obstacles) {\r\n if (solarPanelInObstacle(positionedSolarPanel, obstacle.polygon, horizontal)) {\r\n return true;\r\n }\r\n }\r\n return false;\r\n}\r\n\r\nexport function getSolarPanelsInPolygon(grid: Array<Array<PositionedSolarPanel>>, polygon: Polygon, horizontal: boolean, obstacles: Obstacle[]): Array<Array<PositionedSolarPanel>> {\r\n const solarPanels: Array<Array<PositionedSolarPanel>> = [];\r\n for (const row of grid) {\r\n let newRow: Array<PositionedSolarPanel> = [];\r\n for (const positionedSolarPanel of row) {\r\n const isObstructed = isPanelObstructed(positionedSolarPanel, obstacles, horizontal);\r\n if (solarPanelInPolygon(positionedSolarPanel, polygon, horizontal) && !isObstructed) {\r\n newRow.push(positionedSolarPanel);\r\n }\r\n }\r\n solarPanels.push(newRow);\r\n }\r\n return solarPanels;\r\n}\r\n\r\nexport function getOptimalSolarPosition(roof: Polygon, obstacles: Obstacle[], solarPanel: SolarPanelType, angle: number): Array<Array<PositionedSolarPanel>> {\r\n const minX = Math.min(...roof.points.map(p => p.x));\r\n const maxX = Math.max(...roof.points.map(p => p.x));\r\n const minY = Math.min(...roof.points.map(p => p.y));\r\n const maxY = Math.max(...roof.points.map(p => p.y));\r\n const minMax = {\r\n minX: minX,\r\n maxX: maxX,\r\n minY: minY,\r\n maxY: maxY\r\n } as MinMax; \r\n\r\n const horizontalSolarPanel = {\r\n ...solarPanel,\r\n widthMeters: solarPanel.widthMeters * Math.cos(angle * Math.PI / 180),\r\n heightMeters: solarPanel.heightMeters\r\n } as SolarPanelType;\r\n\r\n const verticalSolarPanel = {\r\n ...solarPanel,\r\n widthMeters: solarPanel.widthMeters,\r\n heightMeters: solarPanel.heightMeters * Math.cos(angle * Math.PI / 180)\r\n } as SolarPanelType;\r\n\r\n let solarPanels: Array<Array<PositionedSolarPanel>> = [];\r\n let numberOfPanels = 0;\r\n for (const point of roof.points) {\r\n for (const horizontal of [false]) { // TODO removed true\r\n const grid = generateGrid(minMax, horizontal ? horizontalSolarPanel : verticalSolarPanel, horizontal, point, ROW_SPACING, COLUMN_SPACING);\r\n const solarPanelsInPolygon = getSolarPanelsInPolygon(grid, roof, horizontal, obstacles);\r\n\r\n const numberOfPanelsInPolygon = solarPanelsInPolygon.reduce((acc, row) => acc + row.length, 0);\r\n if (numberOfPanelsInPolygon > numberOfPanels) {\r\n numberOfPanels = numberOfPanelsInPolygon;\r\n solarPanels = solarPanelsInPolygon;\r\n }\r\n }\r\n break;\r\n }\r\n return solarPanels;\r\n}\r\n\r\nfunction projectObstacles(obstacles: Polygon[], azimuth: number, offset: {x: number, y: number}, inset: number): Array<Obstacle> {\r\n const result: Array<Obstacle> = [];\r\n for (const obstacle of obstacles) {\r\n const offsetObstacle = offsetPolygon(obstacle, offset);\r\n const projectedObstacle = projectPolygon(offsetObstacle.polygon, -azimuth);\r\n const insetObstacle = insetPolygon(projectedObstacle, -inset);\r\n\r\n const minX = Math.min(...insetObstacle.points.map(p => p.x));\r\n const maxX = Math.max(...insetObstacle.points.map(p => p.x));\r\n const minY = Math.min(...insetObstacle.points.map(p => p.y));\r\n const maxY = Math.max(...insetObstacle.points.map(p => p.y));\r\n const boundingBox = {\r\n minX: minX,\r\n maxX: maxX,\r\n minY: minY,\r\n maxY: maxY\r\n } as MinMax;\r\n result.push({\r\n polygon: projectedObstacle,\r\n boundingBox: boundingBox\r\n });\r\n }\r\n return result;\r\n}\r\n\r\nfunction isClockwise(points: Point[]): boolean {\r\n let sum = 0;\r\n for (let i = 0; i < points.length; i++) {\r\n const curr = points[i];\r\n const next = points[(i + 1) % points.length];\r\n sum += (next.x - curr.x) * (next.y + curr.y);\r\n }\r\n return sum > 0;\r\n}\r\n\r\nexport function insetPolygon(polygon: Polygon, inset: number): Polygon {\r\n const points = polygon.points;\r\n const isClockwisePolygon = isClockwise(points);\r\n inset = inset * Math.sqrt(2) * (isClockwisePolygon ? -1 : 1);\r\n const insetPoints: Point[] = [];\r\n \r\n for (let i = 0; i < points.length; i++) {\r\n const prev = points[(i - 1 + points.length) % points.length];\r\n const curr = points[i];\r\n const next = points[(i + 1) % points.length];\r\n \r\n // Calculate vectors for the two edges meeting at current point\r\n const v1 = {\r\n x: curr.x - prev.x,\r\n y: curr.y - prev.y\r\n };\r\n const v2 = {\r\n x: next.x - curr.x,\r\n y: next.y - curr.y\r\n };\r\n \r\n // Calculate perpendicular vectors (90 degrees clockwise)\r\n const perp1 = {\r\n x: -v1.y,\r\n y: v1.x\r\n };\r\n const perp2 = {\r\n x: -v2.y,\r\n y: v2.x\r\n };\r\n \r\n // Normalize the perpendicular vectors\r\n const length1 = Math.sqrt(perp1.x * perp1.x + perp1.y * perp1.y);\r\n const length2 = Math.sqrt(perp2.x * perp2.x + perp2.y * perp2.y);\r\n \r\n perp1.x /= length1;\r\n perp1.y /= length1;\r\n perp2.x /= length2;\r\n perp2.y /= length2;\r\n \r\n // Calculate the bisector vector\r\n const bisector = {\r\n x: perp1.x + perp2.x,\r\n y: perp1.y + perp2.y\r\n };\r\n \r\n // Normalize the bisector\r\n const bisectorLength = Math.sqrt(bisector.x * bisector.x + bisector.y * bisector.y);\r\n bisector.x /= bisectorLength;\r\n bisector.y /= bisectorLength;\r\n \r\n // Calculate the inset point\r\n const insetPoint = {\r\n x: curr.x + bisector.x * inset,\r\n y: curr.y + bisector.y * inset\r\n };\r\n \r\n insetPoints.push(insetPoint);\r\n }\r\n \r\n return {\r\n points: insetPoints,\r\n type: polygon.type,\r\n closed: polygon.closed,\r\n _id: polygon._id,\r\n details: polygon.details\r\n };\r\n}\r\n\r\nexport function getOptimalSolarPositionFully(roof: Polygon, obstacles: Polygon[], solarPanel: SolarPanelType, azimuth: number, inset: number, angle: number): Array<PositionedSolarPanel> {\r\n const insetRoof = insetPolygon(roof, inset);\r\n const offset = offsetPolygon(insetRoof);\r\n const projectedOffset = projectPolygon(offset.polygon, -azimuth);\r\n\r\n const projectedObstacles = projectObstacles(obstacles, azimuth, offset.offset, inset);\r\n\r\n const horizontalSolarPanels = getOptimalSolarPosition(projectedOffset, projectedObstacles, solarPanel, angle);\r\n const unprojectedPanels: Array<PositionedSolarPanel> = [];\r\n\r\n for (const panel of horizontalSolarPanels.flat()) {\r\n const unprojectedPanel = projectPoint(panel.pixelPosition, azimuth);\r\n const offsetPosition = {\r\n x: unprojectedPanel.x + offset.offset.x,\r\n y: unprojectedPanel.y + offset.offset.y\r\n }\r\n unprojectedPanels.push({\r\n panel: panel.panel,\r\n pixelPosition: offsetPosition,\r\n horizontal: panel.horizontal\r\n });\r\n }\r\n return unprojectedPanels;\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 {\r\n Component,\r\n Element,\r\n h,\r\n Listen,\r\n Prop,\r\n State,\r\n Watch,\r\n} from \"@stencil/core\";\r\n\r\nimport {\r\n renderCombinedWithZoom,\r\n renderSolarPanel,\r\n} from \"../../utils/visualize\";\r\nimport {\r\n BuildingInsightsResponse,\r\n GeoTiff,\r\n SolarPanelType,\r\n} from \"../../utils/solar\";\r\nimport { fetchSolarData, getBuildingImages } from \"../../utils/api\";\r\nimport { drawPolygon, isPointInPolygon } from \"../../utils/render/polygon\";\r\nimport { projectPointPerpendicularToLine } from \"../../utils/render/projection\";\r\nimport { Point, Polygon, SelectedPolygon } from \"../../types/shapes\";\r\nimport { moveTool, roofTool, Tool, tools } from \"../../utils/render/tools\";\r\nimport {\r\n DEFAULT_SOLAR_EXPERT_CONFIG,\r\n DEFAULT_SOLAR_PANEL_TYPE,\r\n SolarExpertConfig,\r\n} from \"../../config\";\r\nimport { getFillColor } from \"../../utils/render/color\";\r\nimport { v4 as uuidv4 } from \"uuid\";\r\nimport {\r\n azimuthToCardinal,\r\n calculatePolygonArea,\r\n getPixelInMeters,\r\n} from \"../../utils/utils\";\r\nimport {\r\n getBestFittingRoofSegment,\r\n SolarPanelSystemPart,\r\n} from \"../../utils/geometry/fitting\";\r\nimport { getOptimalSolarPositionFully } from \"../../utils/geometry/gridMatch\";\r\nimport { BORDER_INSET, DEFAULT_SUNNINESS } from \"../../constants\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n tag: \"map-draw\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class MapDraw {\r\n @Prop()\r\n language: Language = \"en\";\r\n @Prop()\r\n apiKey: string = \"\";\r\n @Prop()\r\n latitude: number | null = null;\r\n @Prop()\r\n longitude: number | null = null;\r\n @Prop()\r\n config: SolarExpertConfig = DEFAULT_SOLAR_EXPERT_CONFIG;\r\n @Prop()\r\n solarPanel: SolarPanelType = DEFAULT_SOLAR_PANEL_TYPE;\r\n\r\n @State()\r\n showInstructions: boolean = true;\r\n @State()\r\n zoom: number = 1;\r\n @State()\r\n loadingState: \"empty\" | \"loading\" | \"loaded\" = \"empty\";\r\n @State()\r\n rgbTiff: GeoTiff | null = null;\r\n @State()\r\n draggedPointIndex: number | null = null;\r\n @State()\r\n hoveredPointIndex: number | null = null;\r\n @State()\r\n hoveredPolygon: SelectedPolygon | null = null;\r\n @State()\r\n shiftKeyPressed: boolean = false;\r\n @State()\r\n altKeyPressed: boolean = false;\r\n @State()\r\n mousePoint: Point | null = null;\r\n @State()\r\n currentTool: Tool = roofTool;\r\n @State()\r\n roofPolygons: { [id: string]: Polygon } = {};\r\n @State()\r\n roofPolygonsSolarPanels: { [id: string]: SolarPanelSystemPart } = {};\r\n @State()\r\n obstructionPolygons: { [id: string]: Polygon } = {};\r\n @State()\r\n selectedPolygon: SelectedPolygon | null = null;\r\n @State()\r\n buildingInsights: BuildingInsightsResponse | null = null;\r\n @State()\r\n pixelInMeters: number = 0.2;\r\n @State()\r\n showAzimuth: boolean = true; // TODO: make this false\r\n\r\n @Element()\r\n el: HTMLElement;\r\n private canvasElement?: HTMLCanvasElement;\r\n private polygonCanvas?: HTMLCanvasElement;\r\n private polygonCtx?: CanvasRenderingContext2D;\r\n\r\n private getCurrentPolygon(): Polygon | null {\r\n if (!this.selectedPolygon) {\r\n return null;\r\n }\r\n const { _id, type } = this.selectedPolygon;\r\n return type === \"roof\"\r\n ? this.roofPolygons[_id]\r\n : this.obstructionPolygons[_id];\r\n }\r\n\r\n componentDidLoad() {\r\n if (this.latitude && this.longitude) {\r\n this.loadingState = \"loading\";\r\n this.getBuildingInsights();\r\n this.getBuildingImages();\r\n }\r\n\r\n requestAnimationFrame(() => {\r\n if (this.canvasElement) {\r\n const rect = this.canvasElement.getBoundingClientRect();\r\n this.canvasElement.width = rect.width;\r\n this.canvasElement.height = rect.height;\r\n this.drawMap();\r\n }\r\n });\r\n }\r\n\r\n // // Initial size update\r\n // requestAnimationFrame(() => {\r\n // this.updateCanvasSize();\r\n // });\r\n // }\r\n\r\n // disconnectedCallback() {\r\n // if (this.resizeObserver) {\r\n // this.resizeObserver.disconnect();\r\n // }\r\n // }\r\n\r\n // private updateCanvasSize() {\r\n // if (!this.containerRef || !this.canvasElement || !this.polygonCanvas) {\r\n // return;\r\n // }\r\n\r\n // const containerRect = this.containerRef.getBoundingClientRect();\r\n // const containerWidth = containerRect.width;\r\n // const containerHeight = containerRect.height;\r\n\r\n // // Calculate the scale to fit the image while maintaining aspect ratio\r\n // if (this.rgbTiff) {\r\n // const imageAspect = this.rgbTiff.width / this.rgbTiff.height;\r\n // const containerAspect = containerWidth / containerHeight;\r\n\r\n // let width, height;\r\n // if (imageAspect > containerAspect) {\r\n // width = containerWidth;\r\n // height = containerWidth / imageAspect;\r\n // } else {\r\n // height = containerHeight;\r\n // width = containerHeight * imageAspect;\r\n // }\r\n\r\n // // Set the canvas dimensions\r\n // this.canvasElement.width = width;\r\n // this.canvasElement.height = height;\r\n // this.polygonCanvas.width = width;\r\n // this.polygonCanvas.height = height;\r\n // this.polygonCtx = this.polygonCanvas.getContext(\"2d\");\r\n\r\n // // Update zoom factor based on new size\r\n // this.zoom = width / this.rgbTiff.width;\r\n\r\n // // Force a redraw\r\n // this.drawMap();\r\n // }\r\n // }\r\n\r\n private sizeCanvas(width: number, height: number) {\r\n if (this.polygonCanvas) {\r\n this.polygonCanvas.width = width;\r\n this.polygonCanvas.height = height;\r\n this.polygonCtx = this.polygonCanvas.getContext(\"2d\");\r\n }\r\n }\r\n\r\n @Watch(\"latitude\")\r\n @Watch(\"longitude\")\r\n async getBuildingInsights() {\r\n if (!this.latitude || !this.longitude) {\r\n return;\r\n }\r\n this.loadingState = \"loading\";\r\n\r\n if (this.buildingInsights) {\r\n const sameLocation =\r\n this.buildingInsights.center.latitude === this.latitude &&\r\n this.buildingInsights.center.longitude === this.longitude;\r\n if (sameLocation) {\r\n return;\r\n }\r\n this.obstructionPolygons = {};\r\n this.roofPolygons = {};\r\n this.selectedPolygon = null;\r\n this.hoveredPolygon = null;\r\n this.canvasElement.getContext(\"2d\")?.clearRect(\r\n 0,\r\n 0,\r\n this.canvasElement.width,\r\n this.canvasElement.height,\r\n );\r\n this.polygonCtx?.clearRect(\r\n 0,\r\n 0,\r\n this.polygonCanvas.width,\r\n this.polygonCanvas.height,\r\n );\r\n this.rgbTiff = null;\r\n }\r\n this.buildingInsights = await fetchSolarData(\r\n this.latitude,\r\n this.longitude,\r\n this.apiKey,\r\n );\r\n if (!this.buildingInsights) {\r\n alert(\"No building insights found. Please enter them manually.\");\r\n }\r\n }\r\n\r\n @Watch(\"latitude\")\r\n @Watch(\"longitude\")\r\n async getBuildingImages() {\r\n if (!this.latitude || !this.longitude) {\r\n return;\r\n }\r\n if (this.buildingInsights) {\r\n const sameLocation =\r\n this.buildingInsights.center.latitude === this.latitude &&\r\n this.buildingInsights.center.longitude === this.longitude;\r\n if (sameLocation) {\r\n return;\r\n }\r\n }\r\n this.rgbTiff = await getBuildingImages(\r\n this.latitude,\r\n this.longitude,\r\n this.apiKey,\r\n );\r\n this.pixelInMeters = getPixelInMeters(this.rgbTiff);\r\n this.loadingState = \"loaded\";\r\n }\r\n\r\n private convertToCanvasCoordinates(event: MouseEvent): Point {\r\n const rect = this.polygonCanvas.getBoundingClientRect();\r\n const siteX = event.clientX - rect.left;\r\n const siteY = event.clientY - rect.top;\r\n return {\r\n x: siteX / (rect.right - rect.left) * this.canvasElement.width,\r\n y: siteY / (rect.bottom - rect.top) * this.canvasElement.height,\r\n };\r\n }\r\n\r\n @Watch(\"rgbTiff\")\r\n @Watch(\"buildingInsights\")\r\n @Watch(\"canvasElement\")\r\n async drawMap() {\r\n if (\r\n !this.canvasElement || !this.rgbTiff || !this.buildingInsights\r\n ) return;\r\n\r\n // Get the container dimensions\r\n const container = this.canvasElement.parentElement;\r\n if (!container) return;\r\n\r\n const containerRect = container.getBoundingClientRect();\r\n const containerWidth = containerRect.width;\r\n const containerHeight = containerRect.height;\r\n\r\n // Calculate the scale to fit the image while maintaining aspect ratio\r\n const imageAspect = this.rgbTiff.width / this.rgbTiff.height;\r\n const containerAspect = containerWidth / containerHeight;\r\n\r\n let width, height;\r\n if (imageAspect > containerAspect) {\r\n width = containerWidth;\r\n height = containerWidth / imageAspect;\r\n } else {\r\n height = containerHeight;\r\n width = containerHeight * imageAspect;\r\n }\r\n\r\n // Set the canvas dimensions\r\n this.canvasElement.width = width;\r\n this.canvasElement.height = height;\r\n this.sizeCanvas(width, height);\r\n // this.sizeCanvas(this.rgbTiff.width, this.rgbTiff.height);\r\n\r\n // Update zoom factor based on new size\r\n this.zoom = width / this.rgbTiff.width;\r\n\r\n renderCombinedWithZoom({\r\n rgb: this.rgbTiff,\r\n zoom: this.zoom,\r\n canvas: this.canvasElement,\r\n });\r\n }\r\n\r\n @Listen(\"mousemove\", { target: \"document\" })\r\n handleMouseMove(event: MouseEvent) {\r\n if (!this.polygonCanvas || !this.polygonCtx) return;\r\n\r\n // translate the website pixel coordinates to the canvas coordinates\r\n const { x, y } = this.convertToCanvasCoordinates(event);\r\n this.mousePoint = { x, y };\r\n\r\n const currentPolygon = this.getCurrentPolygon();\r\n\r\n // Check for point hover\r\n const newHoveredPointIndex = currentPolygon?.points.findIndex(\r\n (point) => {\r\n const distance = Math.sqrt(\r\n Math.pow(x - point.x, 2) + Math.pow(y - point.y, 2),\r\n );\r\n return distance < 10;\r\n },\r\n );\r\n\r\n // Check for polygon hover\r\n let newHoveredPolygon = null;\r\n for (const polygon of Object.values(this.obstructionPolygons)) {\r\n if (isPointInPolygon({ x, y }, polygon)) {\r\n newHoveredPolygon = { _id: polygon._id, type: \"obstruction\" };\r\n break;\r\n }\r\n }\r\n // obstruction polygons get priority\r\n if (!newHoveredPolygon) {\r\n for (const polygon of Object.values(this.roofPolygons)) {\r\n if (isPointInPolygon({ x, y }, polygon)) {\r\n newHoveredPolygon = { _id: polygon._id, type: \"roof\" };\r\n break;\r\n }\r\n }\r\n }\r\n\r\n // Only redraw if hover state changed\r\n if (\r\n newHoveredPointIndex !== this.hoveredPointIndex ||\r\n JSON.stringify(newHoveredPolygon) !==\r\n JSON.stringify(this.hoveredPolygon)\r\n ) {\r\n this.hoveredPointIndex = newHoveredPointIndex;\r\n this.hoveredPolygon = newHoveredPolygon;\r\n this.drawPolygons();\r\n }\r\n\r\n // Handle dragging\r\n if (\r\n this.draggedPointIndex !== null && currentPolygon &&\r\n this.currentTool.name === \"move\"\r\n ) {\r\n currentPolygon.points[this.draggedPointIndex] = { x, y };\r\n this.drawPolygons();\r\n }\r\n\r\n if (this.shiftKeyPressed) {\r\n this.drawPolygons();\r\n }\r\n }\r\n\r\n private drawPolygons() {\r\n if (!this.polygonCanvas || !this.polygonCtx) return;\r\n\r\n // Clear the canvas and redraw the map\r\n this.polygonCtx.clearRect(\r\n 0,\r\n 0,\r\n this.polygonCanvas.width,\r\n this.polygonCanvas.height,\r\n );\r\n\r\n // draw roof polygons\r\n for (const polygon of Object.values(this.roofPolygons)) {\r\n const fillColor = getFillColor(\r\n this.selectedPolygon,\r\n this.hoveredPolygon,\r\n polygon._id,\r\n polygon,\r\n this.config,\r\n );\r\n\r\n drawPolygon({\r\n polygonCtx: this.polygonCtx,\r\n polygonCanvas: this.polygonCanvas,\r\n polygon,\r\n strokeColor: polygon.closed\r\n ? this.config.closedRoofColor\r\n : this.config.openRoofColor,\r\n fillColor,\r\n pixelInMeters: this.pixelInMeters,\r\n shiftKeyPressed: this.shiftKeyPressed,\r\n mousePoint: this.mousePoint,\r\n });\r\n\r\n const solarPanels = this.roofPolygonsSolarPanels[polygon._id];\r\n const convertedSolarPanel: SolarPanelType = {\r\n ...this.solarPanel,\r\n widthMeters: this.solarPanel.widthMeters / this.pixelInMeters,\r\n heightMeters: this.solarPanel.heightMeters / this.pixelInMeters,\r\n };\r\n if (solarPanels) {\r\n for (const panel of solarPanels.positionedPanels) {\r\n renderSolarPanel(\r\n panel,\r\n this.polygonCtx,\r\n convertedSolarPanel.widthMeters,\r\n convertedSolarPanel.heightMeters,\r\n polygon.details?.azimuth,\r\n polygon.details?.pitch,\r\n );\r\n }\r\n }\r\n }\r\n\r\n // draw obstruction polygons\r\n for (const polygon of Object.values(this.obstructionPolygons)) {\r\n const fillColor = getFillColor(\r\n this.selectedPolygon,\r\n this.hoveredPolygon,\r\n polygon._id,\r\n polygon,\r\n this.config,\r\n );\r\n\r\n drawPolygon({\r\n polygonCtx: this.polygonCtx,\r\n polygonCanvas: this.polygonCanvas,\r\n polygon,\r\n pixelInMeters: this.pixelInMeters,\r\n shiftKeyPressed: this.shiftKeyPressed,\r\n mousePoint: this.mousePoint,\r\n strokeColor: polygon.closed\r\n ? this.config.closedObstructionColor\r\n : this.config.openObstructionColor,\r\n fillColor,\r\n });\r\n }\r\n\r\n // if (this.showAzimuth && this.selectedPolygon) {\r\n // const currentPolygon = this.getCurrentPolygon();\r\n // renderAzimuth(currentPolygon.details?.azimuth, this.polygonCtx);\r\n // }\r\n }\r\n\r\n private deletePolygon(_id: string) {\r\n if (this.selectedPolygon?._id === _id) {\r\n this.selectedPolygon = null;\r\n }\r\n if (this.roofPolygons[_id]) {\r\n delete this.roofPolygons[_id];\r\n delete this.roofPolygonsSolarPanels[_id];\r\n }\r\n if (this.obstructionPolygons[_id]) {\r\n delete this.obstructionPolygons[_id];\r\n }\r\n }\r\n\r\n @Listen(\"keydown\", { target: \"document\" })\r\n handleKeyDown(event: KeyboardEvent) {\r\n if (event.target instanceof HTMLInputElement) {\r\n return;\r\n }\r\n // Handle shift key for perpendicular points\r\n if (event.shiftKey && !this.shiftKeyPressed) {\r\n this.shiftKeyPressed = true;\r\n this.drawPolygons();\r\n return;\r\n }\r\n if (event.altKey && !this.altKeyPressed) {\r\n this.altKeyPressed = true;\r\n return;\r\n }\r\n if (\r\n (event.key === \"Delete\" || event.key === \"Backspace\") &&\r\n this.selectedPolygon\r\n ) {\r\n const currentPolygon = this.getCurrentPolygon();\r\n if (currentPolygon.closed) {\r\n this.deletePolygon(currentPolygon._id);\r\n this.drawPolygons();\r\n return;\r\n }\r\n currentPolygon.points.pop();\r\n this.drawPolygons();\r\n return;\r\n }\r\n\r\n // Handle tool selection shortcuts\r\n const pressedKey = event.key.toLowerCase();\r\n const tool = tools.find((t) =>\r\n t.keyboardShortcut?.toLowerCase() === pressedKey\r\n );\r\n if (tool) {\r\n this.currentTool = tool;\r\n }\r\n }\r\n\r\n @Listen(\"keyup\", { target: \"document\" })\r\n handleKeyUp(event: KeyboardEvent) {\r\n if (!event.shiftKey && this.shiftKeyPressed) {\r\n this.shiftKeyPressed = false;\r\n this.drawPolygons();\r\n }\r\n if (!event.altKey && this.altKeyPressed) {\r\n this.altKeyPressed = false;\r\n }\r\n }\r\n\r\n @Listen(\"mousedown\", { target: \"document\" })\r\n handleMouseDown(event: MouseEvent) {\r\n if (!this.polygonCanvas || !this.polygonCtx) return;\r\n if (!this.polygonCanvas.contains(event.target as Node)) return;\r\n\r\n let { x, y } = this.convertToCanvasCoordinates(event);\r\n\r\n if (this.currentTool.name === \"delete\") {\r\n if (!this.hoveredPolygon) {\r\n return;\r\n }\r\n const { _id, type } = this.hoveredPolygon;\r\n if (type === \"roof\") {\r\n delete this.roofPolygons[_id];\r\n delete this.roofPolygonsSolarPanels[_id];\r\n } else if (type === \"obstruction\") {\r\n delete this.obstructionPolygons[_id];\r\n }\r\n this.hoveredPolygon = null;\r\n if (this.selectedPolygon?._id === _id) {\r\n this.selectedPolygon = null;\r\n }\r\n this.drawPolygons();\r\n return;\r\n }\r\n if (this.currentTool.name === \"move\") {\r\n // Check if we're clicking on a point of the selected polygon\r\n if (this.selectedPolygon) {\r\n const currentPolygon = this.getCurrentPolygon();\r\n const pointIndex = currentPolygon?.points.findIndex((point) => {\r\n const distance = Math.sqrt(\r\n Math.pow(x - point.x, 2) + Math.pow(y - point.y, 2),\r\n );\r\n return distance < 10;\r\n });\r\n if (pointIndex !== undefined && pointIndex !== -1) {\r\n this.draggedPointIndex = pointIndex;\r\n return;\r\n }\r\n\r\n if (this.hoveredPolygon) {\r\n this.selectedPolygon = this.hoveredPolygon;\r\n return;\r\n }\r\n }\r\n this.selectedPolygon = null;\r\n this.drawPolygons();\r\n return;\r\n }\r\n\r\n if (!this.selectedPolygon || this.getCurrentPolygon()?.closed) {\r\n // no polygon is active, create a new one\r\n const newPolygon: Polygon = {\r\n _id: uuidv4(),\r\n points: [{ x, y }],\r\n type: this.currentTool.name,\r\n closed: false,\r\n };\r\n let _id;\r\n if (this.currentTool.name === \"roof\") {\r\n this.roofPolygons = {\r\n ...this.roofPolygons,\r\n [newPolygon._id]: newPolygon,\r\n };\r\n _id = newPolygon._id;\r\n } else if (this.currentTool.name === \"obstruction\") {\r\n this.obstructionPolygons = {\r\n ...this.obstructionPolygons,\r\n [newPolygon._id]: newPolygon,\r\n };\r\n _id = newPolygon._id;\r\n }\r\n this.selectedPolygon = { _id, type: this.currentTool.name };\r\n this.drawPolygons();\r\n return;\r\n }\r\n\r\n const { _id, type } = this.selectedPolygon;\r\n const currentPolygon = type === \"roof\"\r\n ? this.roofPolygons[_id]\r\n : this.obstructionPolygons[_id];\r\n\r\n if (currentPolygon.closed) {\r\n return;\r\n }\r\n\r\n // If we have at least one point, check if we're clicking near the first point\r\n if (currentPolygon.points.length > 2) {\r\n const firstPoint = currentPolygon.points[0];\r\n const distance = Math.sqrt(\r\n Math.pow(x - firstPoint.x, 2) + Math.pow(y - firstPoint.y, 2),\r\n );\r\n\r\n if (distance < 10) {\r\n this.closePolygon();\r\n return;\r\n }\r\n }\r\n\r\n // Handle shift key for perpendicular points\r\n if (event.shiftKey && currentPolygon?.points.length >= 2) {\r\n const projectedPoint = projectPointPerpendicularToLine({\r\n x,\r\n y,\r\n lastPoint:\r\n currentPolygon.points[currentPolygon.points.length - 1],\r\n secondLastPoint:\r\n currentPolygon.points[currentPolygon.points.length - 2],\r\n });\r\n x = projectedPoint.x;\r\n y = projectedPoint.y;\r\n }\r\n\r\n currentPolygon.points = [...currentPolygon.points, { x, y }];\r\n this.drawPolygons();\r\n }\r\n\r\n @Listen(\"mouseup\", { target: \"document\" })\r\n handleMouseUp() {\r\n this.draggedPointIndex = null;\r\n }\r\n\r\n private closePolygon() {\r\n const currentPolygon = this.getCurrentPolygon();\r\n if (\r\n currentPolygon.points.length >= 3 &&\r\n (this.currentTool.name === \"roof\" ||\r\n this.currentTool.name === \"obstruction\")\r\n ) {\r\n currentPolygon.closed = true;\r\n }\r\n\r\n if (currentPolygon.type === \"roof\") {\r\n // Calculate basic polygon details\r\n const metersInPixels = 1 / this.pixelInMeters;\r\n const area = calculatePolygonArea(currentPolygon.points) /\r\n (metersInPixels * metersInPixels);\r\n const bestMatch = getBestFittingRoofSegment(\r\n currentPolygon,\r\n this.buildingInsights?.solarPotential.roofSegmentStats,\r\n this.rgbTiff.bounds,\r\n this.canvasElement,\r\n );\r\n\r\n if (bestMatch) {\r\n currentPolygon.details = {\r\n area,\r\n azimuth: bestMatch.azimuthDegrees,\r\n pitch: bestMatch.pitchDegrees,\r\n };\r\n } else {\r\n currentPolygon.details = {\r\n area,\r\n azimuth: 0,\r\n pitch: 0,\r\n };\r\n }\r\n }\r\n\r\n this.drawPolygons();\r\n this.currentTool = moveTool;\r\n }\r\n\r\n private calculateSolarPanels() {\r\n const currentPolygon = this.getCurrentPolygon();\r\n\r\n if (!currentPolygon.details) {\r\n return;\r\n }\r\n\r\n if (this.roofPolygonsSolarPanels[currentPolygon._id]) {\r\n delete this.roofPolygonsSolarPanels[currentPolygon._id];\r\n }\r\n\r\n const convertedSolarPanel: SolarPanelType = {\r\n ...this.solarPanel,\r\n widthMeters: this.solarPanel.widthMeters / this.pixelInMeters,\r\n heightMeters: this.solarPanel.heightMeters / this.pixelInMeters,\r\n };\r\n const inset = BORDER_INSET / this.pixelInMeters;\r\n const solarPanels = getOptimalSolarPositionFully(\r\n currentPolygon,\r\n Object.values(this.obstructionPolygons),\r\n convertedSolarPanel,\r\n currentPolygon.details?.azimuth,\r\n inset,\r\n currentPolygon.details?.pitch,\r\n );\r\n this.roofPolygonsSolarPanels = {\r\n ...this.roofPolygonsSolarPanels,\r\n [currentPolygon._id]: {\r\n positionedPanels: solarPanels,\r\n sunniness: currentPolygon.details?.assignedRoofStats?.stats\r\n .sunshineQuantiles[5] ??\r\n this.buildingInsights.solarPotential.buildingStats\r\n .sunshineQuantiles[5] ??\r\n DEFAULT_SUNNINESS,\r\n },\r\n };\r\n this.drawPolygons();\r\n }\r\n\r\n private handlePitchChange(event: Event) {\r\n const target = event.target as HTMLInputElement;\r\n const pitch = parseFloat(target.value);\r\n const currentPolygon = this.getCurrentPolygon();\r\n if (currentPolygon) {\r\n this.roofPolygons[currentPolygon._id].details.pitch = pitch;\r\n }\r\n if (\r\n currentPolygon.type === \"roof\" &&\r\n this.roofPolygonsSolarPanels[currentPolygon._id]\r\n ) {\r\n this.calculateSolarPanels();\r\n return;\r\n }\r\n }\r\n\r\n private handleAzimuthChange(event: Event) {\r\n const target = event.target as HTMLInputElement;\r\n const azimuth = parseFloat(target.value);\r\n const currentPolygon = this.getCurrentPolygon();\r\n if (currentPolygon) {\r\n this.roofPolygons[currentPolygon._id].details.azimuth = azimuth;\r\n }\r\n if (\r\n currentPolygon.type === \"roof\" &&\r\n this.roofPolygonsSolarPanels[currentPolygon._id]\r\n ) {\r\n this.calculateSolarPanels();\r\n return;\r\n }\r\n }\r\n\r\n private handleToolSelect(tool: Tool) {\r\n this.currentTool = tool;\r\n }\r\n\r\n render() {\r\n const t = getLanguageStrings(this.language);\r\n const currentPolygon = this.getCurrentPolygon();\r\n return (\r\n <div class=\"flex flex-col justify-center items-center w-full h-full gap-4\">\r\n {this.showInstructions && (\r\n <div\r\n class=\"w-full rounded-4xl p-4\"\r\n style={{\r\n backgroundColor: \"rgba(0, 0, 0, 0.1)\",\r\n }}\r\n >\r\n After you have searched and selected your address.\r\n Highlight the part of your roof that you want to add\r\n solar panels to. Mark each surface with a polygon with\r\n the roof tool{\" \"}\r\n <icon-selector name=\"house\" inline={true} />{\" \"}\r\n . If you have skylights or other obstructions where you\r\n don't want to add solar panels, mark those as well with\r\n the obstruction tool{\" \"}\r\n <icon-selector name=\"octagon-minus\" inline={true} />.\r\n You can delete polygons with the delete tool{\" \"}\r\n <icon-selector name=\"eraser\" inline={true} />. If you\r\n want to change the azimuth or pitch of a polygon, select\r\n the move tool{\" \"}\r\n <icon-selector name=\"move\" inline={true} />, select the\r\n polygon you want to change and drag and drop the edges.\r\n </div>\r\n )}\r\n <div class=\"flex lg:gap-4 rounded-4xl bg-[#f3ebda] p-4 flex-wrap justify-center w-full\">\r\n {tools.map((tool) => {\r\n const toolStrings = t.mapDraw.tools[tool.name];\r\n return (\r\n <button\r\n class={`px-4 py-2 rounded-4xl transition-colors duration-200 hover:bg-[#ffffff] ${\r\n this.currentTool.name === tool.name\r\n ? \"bg-[#271200] hover:bg-gray-500\"\r\n : \"bg-[#f3ebda] hover:bg-[#ffffff]\"\r\n }`}\r\n style={{\r\n color: this.currentTool.name === tool.name\r\n ? \"#ffffff\"\r\n : \"#000000\",\r\n }}\r\n aria-label={toolStrings.ariaLabel}\r\n title={toolStrings.explanation}\r\n onClick={() => this.handleToolSelect(tool)}\r\n >\r\n <div class=\"flex items-center gap-1 flex-col\">\r\n <icon-selector name={tool.icon} />\r\n <span>{toolStrings.name}</span>\r\n </div>\r\n </button>\r\n );\r\n })}\r\n </div>\r\n {this.loadingState === \"empty\" && (\r\n <div class=\"w-full\">\r\n <p\r\n class=\"text-white text-center flex items-center justify-center rounded-4xl p-4 w-full\"\r\n style={{\r\n backgroundColor: \"rgba(0, 0, 0, 0.5)\",\r\n }}\r\n >\r\n {t.mapDraw.noAddressSelected}\r\n </p>\r\n </div>\r\n )}\r\n {(this.latitude && this.longitude &&\r\n this.loadingState === \"loading\") && (\r\n <div class=\"flex items-center justify-center w-full bg-opacity-75 z-20 pt-7 rounded-4xl\">\r\n <div class=\"animate-spin rounded-full h-16 w-16 border-t-2 border-b-2 border-[#271200]\">\r\n </div>\r\n </div>\r\n )}\r\n <div class=\"flex items-start justify-center h-full w-full bg-[#f3ebda] rounded-4xl\">\r\n <div\r\n class=\"relative h-full flex items-center justify-center w-full rounded-4xl bg-[#271200]\"\r\n style={{\r\n aspectRatio: this.rgbTiff\r\n ? `${this.rgbTiff.width}/${this.rgbTiff.height}`\r\n : \"1/1\",\r\n }}\r\n >\r\n <canvas\r\n ref={(el) => this.canvasElement = el}\r\n class=\"absolute top-0 left-0 w-full h-full rounded-4xl\"\r\n style={{\r\n cursor: this.currentTool.cursor,\r\n }}\r\n >\r\n </canvas>\r\n <canvas\r\n ref={(el) => this.polygonCanvas = el}\r\n class=\"absolute top-0 left-0 w-full h-full rounded-4xl\"\r\n style={{\r\n cursor: this.currentTool.cursor,\r\n }}\r\n >\r\n </canvas>\r\n </div>\r\n </div>\r\n <div class=\"flex gap-4 flex-row justify-center items-center w-full\">\r\n <div class=\"w-full bg-[#f3ebda] rounded-4xl p-4\">\r\n <h3 class=\"text-lg font-semibold mb-4 text-center\">\r\n {t.mapDraw.information}\r\n </h3>\r\n {currentPolygon?.details\r\n ? (\r\n <div class=\"space-y-4\">\r\n <div class=\"flex flex-col gap-2\">\r\n <button\r\n class=\"px-4 py-2 bg-[#271200] rounded-4xl hover:bg-[#ffffff] hover:text-[#271200] transition-colors duration-200\"\r\n onClick={() =>\r\n this.calculateSolarPanels()}\r\n style={{\r\n color: \"#ffffff\",\r\n }}\r\n >\r\n {t.mapDraw.calculateSolarPanels}\r\n </button>\r\n {this\r\n .roofPolygonsSolarPanels[\r\n currentPolygon._id\r\n ] && (\r\n <p class=\"text-lg text-center\">\r\n {this\r\n .roofPolygonsSolarPanels[\r\n currentPolygon._id\r\n ].positionedPanels\r\n .length} {t.mapDraw.panels}\r\n </p>\r\n )}\r\n </div>\r\n <div>\r\n <h4 class=\"text-sm font-medium text-gray-600\">\r\n {t.mapDraw.area}\r\n </h4>\r\n <p class=\"text-lg\">\r\n {currentPolygon.details?.area\r\n .toFixed(2)} m²\r\n </p>\r\n </div>\r\n <div>\r\n <h4 class=\"text-sm font-medium text-gray-600\">\r\n {t.mapDraw.azimuth}\r\n </h4>\r\n <div class=\"flex gap-2 flex-row justify-start bg-white rounded-4xl p-2\">\r\n <input\r\n class=\"text-lg w-full\"\r\n onKeyDown={(e) => {\r\n if (e.key === \"Enter\") {\r\n this.handleAzimuthChange(\r\n e,\r\n );\r\n (e.target as HTMLInputElement)\r\n .blur();\r\n }\r\n }}\r\n value={currentPolygon\r\n .details\r\n ?.azimuth}\r\n />\r\n ({azimuthToCardinal(\r\n currentPolygon.details\r\n ?.azimuth,\r\n )})\r\n </div>\r\n <input\r\n type=\"range\"\r\n min=\"0\"\r\n max=\"360\"\r\n 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\"\r\n value={currentPolygon\r\n .details?.azimuth}\r\n onInput={(e) => {\r\n const target = e\r\n .target as HTMLInputElement;\r\n const azimuth = parseFloat(\r\n target.value,\r\n );\r\n currentPolygon.details\r\n .azimuth = azimuth;\r\n if (\r\n currentPolygon\r\n .type ===\r\n \"roof\" &&\r\n this.roofPolygonsSolarPanels[\r\n currentPolygon\r\n ._id\r\n ]\r\n ) {\r\n this.calculateSolarPanels();\r\n }\r\n }}\r\n />\r\n </div>\r\n <div>\r\n <h4 class=\"text-sm font-medium text-gray-600 pl-2\">\r\n {t.mapDraw.pitch}\r\n </h4>\r\n <div class=\"flex gap-2 flex-row justify-start bg-white rounded-4xl p-2\">\r\n <input\r\n class=\"text-lg w-full\"\r\n onKeyDown={(e) => {\r\n if (e.key === \"Enter\") {\r\n this.handlePitchChange(\r\n e,\r\n );\r\n (e.target as HTMLInputElement)\r\n .blur();\r\n }\r\n }}\r\n value={currentPolygon\r\n .details\r\n ?.pitch}\r\n />\r\n °\r\n </div>\r\n <input\r\n type=\"range\"\r\n min=\"0\"\r\n max=\"90\"\r\n 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\"\r\n value={currentPolygon\r\n .details?.pitch}\r\n onInput={(e) => {\r\n const target = e\r\n .target as HTMLInputElement;\r\n const pitch = parseFloat(\r\n target.value,\r\n );\r\n currentPolygon.details\r\n .pitch = pitch;\r\n if (\r\n currentPolygon\r\n .type ===\r\n \"roof\" &&\r\n this.roofPolygonsSolarPanels[\r\n currentPolygon\r\n ._id\r\n ]\r\n ) {\r\n this.calculateSolarPanels();\r\n }\r\n }}\r\n />\r\n </div>\r\n </div>\r\n )\r\n : (\r\n <p class=\"text-gray-500 text-center\">\r\n {t.mapDraw.noPolygonSelected}\r\n </p>\r\n )}\r\n </div>\r\n </div>\r\n <div class=\"w-full\">\r\n <solar-system-form\r\n systemConfigs={this.roofPolygonsSolarPanels}\r\n language={this.language}\r\n roofPolygons={this.roofPolygons}\r\n obstructionPolygons={this.obstructionPolygons}\r\n />\r\n </div>\r\n </div>\r\n );\r\n }\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 } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"move-icon\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class MoveIcon {\r\n @Prop()\r\n inline: boolean = false;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n class={`lucide lucide-move-icon lucide-move ${\r\n this.inline ? \"inline-block\" : \"\"\r\n }`}\r\n >\r\n <path d=\"M12 2v20\" />\r\n <path d=\"m15 19-3 3-3-3\" />\r\n <path d=\"m19 9 3 3-3 3\" />\r\n <path d=\"M2 12h20\" />\r\n <path d=\"m5 9-3 3 3 3\" />\r\n <path d=\"m9 5 3-3 3 3\" />\r\n </svg>\r\n );\r\n }\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 } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"octagon-minus-icon\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class OctagonMinusIcon {\r\n @Prop()\r\n inline: boolean = false;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n class={`lucide lucide-octagon-minus-icon lucide-octagon-minus ${\r\n this.inline ? \"inline-block\" : \"\"\r\n }`}\r\n >\r\n <path d=\"M2.586 16.726A2 2 0 0 1 2 15.312V8.688a2 2 0 0 1 .586-1.414l4.688-4.688A2 2 0 0 1 8.688 2h6.624a2 2 0 0 1 1.414.586l4.688 4.688A2 2 0 0 1 22 8.688v6.624a2 2 0 0 1-.586 1.414l-4.688 4.688a2 2 0 0 1-1.414.586H8.688a2 2 0 0 1-1.414-.586z\" />\r\n <path d=\"M8 12h8\" />\r\n </svg>\r\n );\r\n }\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 } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"search-icon\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class SearchIcon {\r\n @Prop()\r\n inline: boolean = false;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width=\"24\"\r\n height=\"24\"\r\n viewBox=\"0 0 24 24\"\r\n fill=\"none\"\r\n stroke=\"currentColor\"\r\n stroke-width=\"2\"\r\n stroke-linecap=\"round\"\r\n stroke-linejoin=\"round\"\r\n class={`lucide lucide-search-icon lucide-search ${\r\n this.inline ? \"inline-block\" : \"\"\r\n }`}\r\n >\r\n <path d=\"m21 21-4.34-4.34\" />\r\n <circle cx=\"11\" cy=\"11\" r=\"8\" />\r\n </svg>\r\n );\r\n }\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, Element, Env, h, Prop, State } from \"@stencil/core\";\r\nimport { Loader } from \"@googlemaps/js-api-loader\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n tag: \"solar-expert\",\r\n shadow: false,\r\n styleUrl: \"../../output.css\",\r\n})\r\nexport class SolarExpert {\r\n @Element()\r\n el!: HTMLElement;\r\n\r\n @Prop()\r\n apiKey: string = Env.GOOGLE_MAPS_API_KEY;\r\n @Prop()\r\n language: Language = \"en\";\r\n\r\n @State()\r\n latitude: number | null = 49.40004754661986;\r\n @State()\r\n longitude: number | null = 8.695138526494068;\r\n @State()\r\n isLoaded: boolean = false;\r\n @State()\r\n autocomplete: google.maps.places.Autocomplete | null = null;\r\n @State()\r\n place: google.maps.places.PlaceResult | null = null;\r\n\r\n private inputElement?: HTMLInputElement;\r\n\r\n componentWillLoad() {\r\n this.loadGoogleMapsScript();\r\n }\r\n\r\n private async loadGoogleMapsScript() {\r\n try {\r\n const loader = new Loader({\r\n apiKey: this.apiKey,\r\n libraries: [\"places\"],\r\n });\r\n\r\n const places = await loader.importLibrary(\"places\");\r\n this.isLoaded = true;\r\n this.initializeAutocomplete(places);\r\n } catch (error) {\r\n console.error(\"Error loading Google Maps: \", error);\r\n }\r\n }\r\n\r\n private initializeAutocomplete(\r\n places: google.maps.PlacesLibrary,\r\n ) {\r\n if (!this.inputElement || !this.isLoaded) return;\r\n this.autocomplete = new places.Autocomplete(this.inputElement);\r\n\r\n this.autocomplete.addListener(\"place_changed\", () => {\r\n const place = this.autocomplete?.getPlace();\r\n this.latitude = place?.geometry?.location?.lat() ?? 0;\r\n this.longitude = place?.geometry?.location?.lng() ?? 0;\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 w-full h-full p-3 max-w-2xl m-auto\">\r\n <div class=\"pb-3\">\r\n <div class=\"relative\">\r\n <div class=\"absolute left-3 top-1/2 transform -translate-y-1/2\">\r\n <search-icon />\r\n </div>\r\n <input\r\n ref={(el) => this.inputElement = el}\r\n type=\"text\"\r\n placeholder={t.solarExpert.searchPlaceholder}\r\n class=\"w-full pl-10 pr-4 py-2 border border-gray-300 rounded-4xl focus:outline-none focus:ring-2 focus:ring-blue-500 bg-white\"\r\n />\r\n </div>\r\n </div>\r\n <map-draw\r\n latitude={this.latitude}\r\n longitude={this.longitude}\r\n apiKey={this.apiKey}\r\n language={this.language}\r\n />\r\n </div>\r\n );\r\n }\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"],"mappings":"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","ignoreList":[]}