npm - blue-chestnut-solar-expert - Versions diffs - 0.0.24 → 0.0.25 - Mend

blue-chestnut-solar-expert 0.0.24 → 0.0.25

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 (43) hide show

package/dist/stencil-library/p-100ab140.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"names":["outputCss","EraserIcon","inline","size","render","h","key","xmlns","width","this","height","viewBox","fill","stroke","class","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","HEAT_PUMP_CONSUMPTION","CONSUMPTION_PROFILES","mostly_at_home","mostly_away","projectPointPerpendicularToLine","lastPoint","secondLastPoint","dx","dy","perpDx","perpDy","perpLength","sqrt","normalizedPerpDx","normalizedPerpDy","vectorToMouse","projectionLength","drawPolygon","polygonCtx","polygonCanvas","polygon","shiftKeyPressed","mousePoint","strokeColor","fillColor","highlightedEdge","highlightColor","beginPath","points","forEach","point","index","moveTo","lineTo","closed","length","pointA","pointB","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","markRoofEdgeTool","undoTool","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","settings","language","borderInset","mapSelector","accept","chooseOnMap","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","additionalComponents","heatPump","electricCar","battery","chargingTime","chargingTimeDay","chargingTimeNight","kilometersPerYear","annualPriceIncrease","costSavings25Years","mapDraw","instructions","show","hide","parts","obstruction","delete","move","noPolygonSelected","noAddressSelected","information","calculateSolarPanels","markRoofEdge","panels","pitch","undo","de","es","languageStrings","getLanguageStrings","lang","defaultLang","langStrings","mergedStrings","JSON","parse","stringify","deepMerge","target","source","Object","appendToMap","propName","value","items","get","set","includes","debounce","fn","ms","timeoutId","args","clearTimeout","setTimeout","isConnected","maybeElement","cleanupElements","keys","filter","stencilSubscription","getRenderingRef","elmsToUpdate","Map","dispose","clear","elm","elements","forceUpdate","reset","elms","unwrap","val","createObservableMap","defaultState","shouldUpdate","a","b","unwrappedState","states","entries","handlers","cb","oldValue","state","Proxy","_","ownKeys","Array","from","getOwnPropertyDescriptor","enumerable","configurable","has","on","eventName","callback","removeFromArray","onChange","unSet","newValue","unReset","use","subscriptions","unsubs","subscription","unsub","array","item","indexOf","createStore","radiusMeters","heatPumpM2Consumption","settingsVersion","isMobile","isIOS","MapDraw","apiKey","showInstructions","showSettings","loadingState","draggedPointIndex","hoveredPointIndex","altKeyPressed","currentTool","roofPolygons","roofPolygonsSolarPanels","obstructionPolygons","buildingInsights","canvasElement","getCurrentPolygon","componentWillLoad","getBuildingImages","getBuildingInsights","componentDidLoad","requestAnimationFrame","rect","getBoundingClientRect","drawMap","sizeCanvas","sameLocation","center","clearRect","fetchSolarData","alert","maxPanels","solarPotential","maxArrayPanelsCount","approximatedPanels","positionedPanels","__","rotation","sunniness","buildingStats","sunshineQuantiles","convertToCanvasCoordinates","event","siteX","clientX","left","siteY","clientY","top","right","bottom","handleMouseMove","currentPolygon","redraw","distances","distanceA","distanceB","edgeLength","dist","edge","closestEdge","sort","newHoveredPointIndex","findIndex","newHoveredPolygon","values","metersInPixels","drawPolygons","convertedSolarPanel","deletePolygon","handleKeyDown","HTMLInputElement","shiftKey","altKey","pop","pressedKey","tool","find","t","handleKeyUp","handleMouseDown","contains","atan2","handleAzimuthChange","pointIndex","newPolygon","uuidv4","firstPoint","closePolygon","handleMouseUp","bestMatch","azimuthDegrees","pitchDegrees","scrollToCanvas","assignedRoofStats","stats","handlePitchChange","parseFloat","handleToolSelect","el","querySelector","scrollIntoView","behavior","handleSettingsClick","handleSettingsClose","handleSettingsSave","detail","id","onClick","onToolSelect","undoCallback","style","aspectRatio","ref","selectEdgeTool","systemConfigs","onClose","onSave","MapSelector","isLoaded","autocomplete","marker","circle","inputElement","mapElement","loadGoogleMapsScript","loader","Loader","libraries","places","maps","Promise","all","importLibrary","initializeAutocomplete","initializeMap","error","console","Autocomplete","addListener","place","getPlace","geometry","location","setCenter","setZoom","mapTypeControl","streetViewControl","mapTypeId","mapId","tilt","e","updateMapLocation","google","Circle","strokeOpacity","strokeWeight","fillOpacity","handleRadiusChange","setRadius","handleAcceptPosition","log","placeholder","onInput","MoveIcon","OctagonMinusIcon","PolygonButtons","PolygonInformation","toFixed","onKeyDown","blur","SearchIcon","cx","cy","r","SettingsIcon","SettingsModal","tempSettings","close","handleClose","confirm","emit","handleSave","handleInputChange","x1","y1","x2","y2","selected","applyThemeGlobally","colorScheme","documentElement","primary","setProperty","primaryForeground","secondary","secondaryForeground","tertiary","tertiaryForeground","muted","mutedForeground","errorForeground","surface","surfaceHover","surfaceActive","textMuted","textSecondary","textPlaceholder","borderLight","success","info","hover","hoverDark","overlay","tooltip","SolarExpert","Env","GOOGLE_MAPS_API_KEY","showMapSelector","test","navigator","userAgent","window","innerWidth","scrollToMapDraw","applyTheme","colorSchemeChanged","solarSystemFormElement","mapDrawElement","handleChooseOnMap","Fragment","SOLAR_RADIATION","getSolarRadiation","discountFactor","DEFAULT_GENERAL_SIMULATION_CONFIG","simulationYears","generateElectricCarChargingHours","hours","simulateDay","dailyConsumption","batteryCharge","soldEnergy","energyUsageOfProduction","hour","energyDifference","simulate","generalConfig","general","householdConsumption","norm","additionalConsumption","m2","electricCarConsumption","electricCarNorm","electricCarChargingHours","chargingHours","dailyCarUsage","averageKilometersPerDay","consumptionkWhPer100km","batteryKWh","systemSize","solarSystem","panelType","summerProduction","solarRadiation","summerFactor","winterProduction","winterFactor","summerConsumptionWholeDay","averageConsumption","summerConsumptionFactor","summerConsumptionDaily","c","winterConsumptionWholeDay","winterConsumptionFactor","winterConsumptionDaily","summerDay","winterDay","savedCostsByYear","ownConsumption","energyPrice","purchase","savedCostsThisYear","increase","compensationPerDay","sell","byYearSavedCosts","SolarSystemForm","electricCarChargingTime","compensation25Years","savedCosts25Years","kmDrivenPerYear","updateSystemConfigs","recalculate","simulationConfig","validateForm","isValid","trim","emailRegex","handleRequestOffer","systemConfig","readOnly","parseInt","readonly","step","checked","htmlFor","disabled","ToolBox","undoToolStrings","toolStrings","UndoIcon"],"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","../../node_modules/@stencil/store/dist/index.js","src/store.ts","src/output.css?tag=map-draw","src/components/map-draw/map-draw.tsx","src/output.css?tag=map-selector","src/components/map-draw/map-selector.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=polygon-buttons","src/components/map-draw/polygon-buttons.tsx","src/output.css?tag=polygon-information","src/components/map-draw/polygon-information.tsx","src/output.css?tag=search-icon","src/components/icons/search.tsx","src/output.css?tag=settings-icon","src/components/icons/settings.tsx","src/output.css?tag=settings-modal","src/components/settings/settings.tsx","src/utils/theme.ts","src/output.css?tag=solar-expert","src/components/solar-expert/solar-expert.tsx","src/utils/simulation/solarCurves.ts","src/utils/simulation/types.ts","src/utils/simulation/simulation.ts","src/output.css?tag=solar-system-form","src/components/solar-system-form/solar-system-form.tsx","src/output.css?tag=tool-box","src/components/map-draw/tool-box.tsx","src/output.css?tag=undo-icon","src/components/icons/undo.tsx"],"sourcesContent":["/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-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 @Prop()\r\n size: number = 20;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width={this.size}\r\n height={this.size}\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.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-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 @Prop()\r\n size: number = 20;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width={this.size}\r\n height={this.size}\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.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-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 @Prop()\r\n size: number = 20;\r\n\r\n render() {\r\n if (this.name === \"search\") {\r\n return <search-icon inline={this.inline} size={this.size} />;\r\n }\r\n if (this.name === \"house\") {\r\n return <house-icon inline={this.inline} size={this.size} />;\r\n }\r\n if (this.name === \"move\") {\r\n return <move-icon inline={this.inline} size={this.size} />;\r\n }\r\n if (this.name === \"octagon-minus\") {\r\n return <octagon-minus-icon inline={this.inline} size={this.size} />;\r\n }\r\n if (this.name === \"eraser\") {\r\n return <eraser-icon inline={this.inline} size={this.size} />;\r\n }\r\n if (this.name === \"settings\") {\r\n return <settings-icon inline={this.inline} size={this.size} />;\r\n }\r\n if (this.name === \"undo\") {\r\n return <undo-icon inline={this.inline} size={this.size} />;\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.8;\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(0, 51, 204, 0.8)';\r\n ctx.fillRect(-width/2, -height/2, width, height);\r\n \r\n // Draw panel border\r\n ctx.strokeStyle = 'rgba(255, 255, 255, 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;\r\nconst DEFAULT_SUNNINESS = 600;\r\n\r\nconst HEAT_PUMP_CONSUMPTION = 0.05; // kWh per m² per day\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\nexport { OPEN_POLYGON_COLOR, CLOSED_POLYGON_COLOR, DOTTED_LINE_COLOR, ROW_SPACING, COLUMN_SPACING, BORDER_INSET, DEFAULT_SUNNINESS, CONSUMPTION_PROFILES, SOLAR_RADIATION, HEAT_PUMP_CONSUMPTION };\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 highlightColor: string;\r\n fillColor?: string;\r\n highlightedEdge?: { pointA: Point; pointB: Point } | null;\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, highlightedEdge, highlightColor\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 (highlightedEdge && polygon.closed) {\r\n polygonCtx.beginPath();\r\n polygonCtx.strokeStyle = highlightColor;\r\n polygonCtx.lineWidth = 2;\r\n polygonCtx.moveTo(highlightedEdge.pointA.x, highlightedEdge.pointA.y);\r\n polygonCtx.lineTo(highlightedEdge.pointB.x, highlightedEdge.pointB.y);\r\n polygonCtx.stroke();\r\n polygonCtx.strokeStyle = strokeColor;\r\n polygonCtx.lineWidth = 1;\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\" | \"markRoofEdge\" | \"undo\";\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 markRoofEdgeTool: Tool = {\r\n name: \"markRoofEdge\",\r\n ariaLabel: \"Mark Roof Edge\",\r\n icon: \"arrow-down-left-and-up-right-to-center\",\r\n cursor: \"pointer\",\r\n explanation: \"Mark the edge of the roof\",\r\n}\r\n\r\nexport const undoTool: Tool = {\r\n name: \"undo\",\r\n ariaLabel: \"Undo\",\r\n icon: \"undo\",\r\n cursor: \"default\",\r\n explanation: \"Undo the last action\",\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 highlightColor: 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 highlightColor: \"rgba(0, 89, 255, 1)\",\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\r\nexport interface ColorScheme {\r\n primary: string;\r\n primaryForeground: string;\r\n secondary: string;\r\n secondaryForeground: string;\r\n tertiary: string;\r\n tertiaryForeground: string;\r\n muted: string;\r\n mutedForeground: string;\r\n error: string;\r\n errorForeground: string;\r\n // Surface colors\r\n surface: string;\r\n surfaceHover: string;\r\n surfaceActive: string;\r\n // Text colors\r\n textMuted: string;\r\n textSecondary: string;\r\n textPlaceholder: string;\r\n // Border colors\r\n border: string;\r\n borderLight: string;\r\n // Status colors\r\n success: string;\r\n info: string;\r\n // Interactive colors\r\n hover: string;\r\n hoverDark: string;\r\n overlay: string;\r\n tooltip: string;\r\n}\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/**\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 settings: {\r\n language: \"Language\",\r\n rowSpacing: \"Row Spacing\",\r\n columnSpacing: \"Column Spacing\",\r\n borderInset: \"Border Inset\",\r\n },\r\n mapSelector: {\r\n explanation: \"Select your house on the map and adjust the radius of the circle to fully encompase your roof.\",\r\n radius: \"Radius (meters)\",\r\n accept: \"Accept\",\r\n chooseOnMap: \"Choose on Map\",\r\n },\r\n solarExpert: {\r\n searchPlaceholder: \"Search for your address\"\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 additionalComponents: {\r\n title: \"Additional Components\",\r\n heatPump: \"Heat Pump\",\r\n electricCar: \"Electric Car\",\r\n battery: \"Battery\",\r\n chargingTime: \"Charging Time\",\r\n chargingTimeDay: \"Day (06:00 - 18:00)\",\r\n chargingTimeNight: \"Night (18:00 - 06:00)\",\r\n kilometersPerYear: \"Kilometers per Year\",\r\n },\r\n annualPriceIncrease: \"Annual Price Increase (%)\",\r\n costSavings25Years: \"25-Year Savings\",\r\n },\r\n mapDraw: {\r\n instructions: {\r\n show: \"Show Instructions\",\r\n hide: \"Hide Instructions\",\r\n parts: {\r\n roof: \"After you have searched and selected your address. Highlight the part of your roof that you want to add solar panels to. Mark each surface with a polygon with the roof tool\",\r\n obstruction: \". If you have skylights or other obstructions where you don't want to add solar panels, mark those as well with the obstruction tool\",\r\n delete: \". You can delete polygons with the delete tool\",\r\n move: \". If you want to change the corners of a polygon, select the move tool\",\r\n end: \", select the polygon you want to change and drag and drop the corners.\",\r\n }\r\n },\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 markRoofEdge: \"Mark lower roof edge\",\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 undo: {\r\n name: \"Undo\",\r\n explanation: \"Undo the last action\",\r\n ariaLabel: \"Undo\",\r\n }\r\n },\r\n }\r\n}","import { LanguageStrings } from \"../../types/lang\";\r\n\r\nexport const de: LanguageStrings = {\r\n settings: {\r\n language: \"Sprache\",\r\n rowSpacing: \"Zeilenabstand\",\r\n columnSpacing: \"Spaltenabstand\",\r\n borderInset: \"Randabstand\",\r\n },\r\n mapSelector: {\r\n explanation: \"Wählen Sie Ihre Adresse auf der Karte und passen Sie den Radius des Kreises an, um Ihr Dach vollständig zu erfassen.\",\r\n radius: \"Radius (Meter)\",\r\n accept: \"Akzeptieren\",\r\n chooseOnMap: \"Auf der Karte auswählen\",\r\n },\r\n solarExpert: {\r\n searchPlaceholder: \"Ihre 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: \"Anlagengröße (kWp)\",\r\n electricityPrice: \"Strompreis (€/kWh)\",\r\n compensationRate: \"Einspeisevergütung (€/kWh)\",\r\n autonomy: \"Autarkie\",\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 Deutschland.\",\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 additionalComponents: {\r\n title: \"Zusätzliches\",\r\n heatPump: \"Wärmepumpe\",\r\n electricCar: \"Elektroauto\",\r\n battery: \"Batterie\",\r\n chargingTime: \"Zeitpunkt der Ladung\",\r\n chargingTimeDay: \"Tag (06:00 - 18:00)\",\r\n chargingTimeNight: \"Nacht (18:00 - 06:00)\",\r\n kilometersPerYear: \"Kilometer pro Jahr\",\r\n },\r\n annualPriceIncrease: \"Jährliche Preissteigerung (%)\t\",\r\n costSavings25Years: \"25-Jährige Einsparungen\",\r\n },\r\n mapDraw: {\r\n instructions: {\r\n show: \"Anleitung anzeigen\",\r\n hide: \"Anleitung ausblenden\",\r\n parts: {\r\n roof: \"Nachdem Sie Ihre Adresse gesucht und ausgewählt haben. Markieren Sie die Teile Ihres Daches, auf denen Sie Solarpanelleisten hinzufügen möchten. Markieren Sie jede Oberfläche mit einem Polygon mit dem Dachwerkzeug\",\r\n obstruction: \". Wenn Sie Dachfenster oder andere Hindernisse haben, auf denen Sie keine Solarpanele hinzufügen können, markieren Sie diese mit dem Hinderniswerkzeug\",\r\n delete: \". Sie können Polygone mit dem Löschwerkzeug löschen\",\r\n move: \". Wenn Sie die Ecken eines Polygons ändern möchten, wählen Sie das Verschiebewerkzeug\",\r\n end: \", wählen Sie das Polygon, das Sie ändern möchten, und verschieben Sie die Ecken.\",\r\n }\r\n },\r\n markRoofEdge: \"untere Dachkante markieren\",\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 undo: {\r\n name: \"Rückgängig\",\r\n explanation: \"Sie die letzte Aktion rückgängig\",\r\n ariaLabel: \"Rückgängig\",\r\n }\r\n },\r\n }\r\n}","import { LanguageStrings } from \"../../types/lang\";\r\n\r\nexport const es: LanguageStrings = {\r\n settings: {\r\n language: \"Idioma\",\r\n rowSpacing: \"Espaciado de filas\",\r\n columnSpacing: \"Espaciado de columnas\",\r\n borderInset: \"Espaciado de bordes\",\r\n },\r\n mapSelector: {\r\n explanation: \"Selecciona tu casa en el mapa y ajusta el radio del círculo para cubrir completamente tu tejado.\",\r\n radius: \"Radio (metros)\",\r\n accept: \"Aceptar\",\r\n chooseOnMap: \"Seleccionar en el mapa\",\r\n },\r\n solarExpert: {\r\n searchPlaceholder: \"Buscar tu dirección\"\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 additionalComponents: {\r\n title: \"Componentes adicionales\",\r\n heatPump: \"Caldera\",\r\n electricCar: \"Coche eléctrico\",\r\n battery: \"Batería\",\r\n chargingTime: \"Hora de carga\",\r\n chargingTimeDay: \"Día (06:00 - 18:00)\",\r\n chargingTimeNight: \"Noche (18:00 - 06:00)\",\r\n kilometersPerYear: \"Kilómetros por año\",\r\n },\r\n annualPriceIncrease: \"Aumento anual del precio (%)\",\r\n costSavings25Years: \"Ahorro en 25 años\",\r\n },\r\n mapDraw: {\r\n instructions: {\r\n show: \"Mostrar instrucciones\",\r\n hide: \"Ocultar instrucciones\",\r\n parts: {\r\n roof: \"Después de buscar y seleccionar su dirección, resalte la parte del tejado donde desea añadir paneles solares. Marque cada superficie con un polígono con la herramienta de tejado\",\r\n obstruction: \". Si tiene claraboyas u otras obstrucciones donde no desea añadir paneles solares, márquelas también con la herramienta de obstrucción\",\r\n delete: \". Puede eliminar polígonos con la herramienta de eliminación\",\r\n move: \". Si desea cambiar las esquinas de un polígono, seleccione la herramienta de movimiento\",\r\n end: \", seleccione el polígono que desea modificar y arrastre y suelte los bordes.\",\r\n }\r\n },\r\n markRoofEdge: \"Marcar borde inferior del tejado\",\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 undo: {\r\n name: \"Deshacer\",\r\n explanation: \"Deshaga la última acción\",\r\n ariaLabel: \"Deshacer\",\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","import { getRenderingRef, forceUpdate } from '@stencil/core';\n\nconst appendToMap = (map, propName, value) => {\n const items = map.get(propName);\n if (!items) {\n map.set(propName, [value]);\n }\n else if (!items.includes(value)) {\n items.push(value);\n }\n};\nconst debounce = (fn, ms) => {\n let timeoutId;\n return (...args) => {\n if (timeoutId) {\n clearTimeout(timeoutId);\n }\n timeoutId = setTimeout(() => {\n timeoutId = 0;\n fn(...args);\n }, ms);\n };\n};\n\n/**\n * Check if a possible element isConnected.\n * The property might not be there, so we check for it.\n *\n * We want it to return true if isConnected is not a property,\n * otherwise we would remove these elements and would not update.\n *\n * Better leak in Edge than to be useless.\n */\nconst isConnected = (maybeElement) => !('isConnected' in maybeElement) || maybeElement.isConnected;\nconst cleanupElements = debounce((map) => {\n for (let key of map.keys()) {\n map.set(key, map.get(key).filter(isConnected));\n }\n}, 2_000);\nconst stencilSubscription = () => {\n if (typeof getRenderingRef !== 'function') {\n // If we are not in a stencil project, we do nothing.\n // This function is not really exported by @stencil/core.\n return {};\n }\n const elmsToUpdate = new Map();\n return {\n dispose: () => elmsToUpdate.clear(),\n get: (propName) => {\n const elm = getRenderingRef();\n if (elm) {\n appendToMap(elmsToUpdate, propName, elm);\n }\n },\n set: (propName) => {\n const elements = elmsToUpdate.get(propName);\n if (elements) {\n elmsToUpdate.set(propName, elements.filter(forceUpdate));\n }\n cleanupElements(elmsToUpdate);\n },\n reset: () => {\n elmsToUpdate.forEach((elms) => elms.forEach(forceUpdate));\n cleanupElements(elmsToUpdate);\n },\n };\n};\n\nconst unwrap = (val) => (typeof val === 'function' ? val() : val);\nconst createObservableMap = (defaultState, shouldUpdate = (a, b) => a !== b) => {\n const unwrappedState = unwrap(defaultState);\n let states = new Map(Object.entries(unwrappedState ?? {}));\n const handlers = {\n dispose: [],\n get: [],\n set: [],\n reset: [],\n };\n const reset = () => {\n // When resetting the state, the default state may be a function - unwrap it to invoke it.\n // otherwise, the state won't be properly reset\n states = new Map(Object.entries(unwrap(defaultState) ?? {}));\n handlers.reset.forEach((cb) => cb());\n };\n const dispose = () => {\n // Call first dispose as resetting the state would\n // cause less updates ;)\n handlers.dispose.forEach((cb) => cb());\n reset();\n };\n const get = (propName) => {\n handlers.get.forEach((cb) => cb(propName));\n return states.get(propName);\n };\n const set = (propName, value) => {\n const oldValue = states.get(propName);\n if (shouldUpdate(value, oldValue, propName)) {\n states.set(propName, value);\n handlers.set.forEach((cb) => cb(propName, value, oldValue));\n }\n };\n const state = (typeof Proxy === 'undefined'\n ? {}\n : new Proxy(unwrappedState, {\n get(_, propName) {\n return get(propName);\n },\n ownKeys(_) {\n return Array.from(states.keys());\n },\n getOwnPropertyDescriptor() {\n return {\n enumerable: true,\n configurable: true,\n };\n },\n has(_, propName) {\n return states.has(propName);\n },\n set(_, propName, value) {\n set(propName, value);\n return true;\n },\n }));\n const on = (eventName, callback) => {\n handlers[eventName].push(callback);\n return () => {\n removeFromArray(handlers[eventName], callback);\n };\n };\n const onChange = (propName, cb) => {\n const unSet = on('set', (key, newValue) => {\n if (key === propName) {\n cb(newValue);\n }\n });\n // We need to unwrap the defaultState because it might be a function.\n // Otherwise we might not be sending the right reset value.\n const unReset = on('reset', () => cb(unwrap(defaultState)[propName]));\n return () => {\n unSet();\n unReset();\n };\n };\n const use = (...subscriptions) => {\n const unsubs = subscriptions.reduce((unsubs, subscription) => {\n if (subscription.set) {\n unsubs.push(on('set', subscription.set));\n }\n if (subscription.get) {\n unsubs.push(on('get', subscription.get));\n }\n if (subscription.reset) {\n unsubs.push(on('reset', subscription.reset));\n }\n if (subscription.dispose) {\n unsubs.push(on('dispose', subscription.dispose));\n }\n return unsubs;\n }, []);\n return () => unsubs.forEach((unsub) => unsub());\n };\n const forceUpdate = (key) => {\n const oldValue = states.get(key);\n handlers.set.forEach((cb) => cb(key, oldValue, oldValue));\n };\n return {\n state,\n get,\n set,\n on,\n onChange,\n use,\n dispose,\n reset,\n forceUpdate,\n };\n};\nconst removeFromArray = (array, item) => {\n const index = array.indexOf(item);\n if (index >= 0) {\n array[index] = array[array.length - 1];\n array.length--;\n }\n};\n\nconst createStore = (defaultState, shouldUpdate) => {\n const map = createObservableMap(defaultState, shouldUpdate);\n map.use(stencilSubscription());\n return map;\n};\n\nexport { createObservableMap, createStore };\n","import { createStore } from \"@stencil/store\";\r\nimport { Language } from \"./components\";\r\n\r\nexport interface Settings {\r\n language: Language;\r\n rowSpacing: number;\r\n columnSpacing: number;\r\n borderInset: number;\r\n heatPumpM2Consumption: number;\r\n}\r\n\r\nexport interface State {\r\n latitude: number | null;\r\n longitude: number | null;\r\n radiusMeters: number;\r\n settings: Settings;\r\n settingsVersion: number;\r\n isMobile: boolean;\r\n isIOS: boolean;\r\n}\r\n\r\nconst {state, onChange} = createStore<State>({\r\n latitude: null,\r\n longitude: null,\r\n radiusMeters: 15,\r\n settings: {\r\n language: \"en\",\r\n rowSpacing: 1,\r\n columnSpacing: 1,\r\n borderInset: 0.1,\r\n heatPumpM2Consumption: 85,\r\n },\r\n settingsVersion: 1,\r\n isMobile: false,\r\n isIOS: false,\r\n});\r\n\r\nonChange(\"latitude\", (value) => {\r\n state.latitude = value;\r\n});\r\n\r\nonChange(\"longitude\", (value) => {\r\n state.longitude = value;\r\n});\r\n\r\nonChange(\"radiusMeters\", (value) => {\r\n state.radiusMeters = value;\r\n});\r\n\r\nonChange(\"settings\", (value) => {\r\n state.settings = value;\r\n});\r\n\r\nonChange(\"settingsVersion\", (value) => {\r\n state.settingsVersion = value;\r\n});\r\n\r\nonChange(\"isMobile\", (value) => {\r\n state.isMobile = value;\r\n});\r\n\r\nexport {state, onChange};\r\n","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-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 {\r\n deleteTool,\r\n markRoofEdgeTool,\r\n moveTool,\r\n obstructionTool,\r\n roofTool,\r\n Tool,\r\n tools,\r\n} 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 { calculatePolygonArea, getPixelInMeters } 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 { getLanguageStrings } from \"../../utils/lang/general\";\r\nimport { onChange, Settings, state } from \"../../store\";\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 apiKey: string = \"\";\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 showSettings: boolean = false;\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 isMobile: boolean = false;\r\n @State()\r\n highlightedEdge: { pointA: Point; pointB: Point } | null = null;\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 componentWillLoad() {\r\n onChange(\"latitude\", () => {\r\n this.getBuildingImages();\r\n this.getBuildingInsights();\r\n });\r\n onChange(\"longitude\", () => {\r\n this.getBuildingImages();\r\n this.getBuildingInsights();\r\n });\r\n }\r\n\r\n componentDidLoad() {\r\n if (state.latitude && state.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 private sizeCanvas(width: number, height: number) {\r\n if (this.canvasElement) {\r\n this.canvasElement.width = width;\r\n this.canvasElement.height = height;\r\n }\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 async getBuildingInsights() {\r\n if (!state.latitude || !state.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 === state.latitude &&\r\n this.buildingInsights.center.longitude === state.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 state.latitude,\r\n state.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 // If on mobile, automatically calculate panels using Google API data\r\n if (state.isMobile && this.buildingInsights) {\r\n const maxPanels =\r\n this.buildingInsights.solarPotential.maxArrayPanelsCount;\r\n const approximatedPanels = Math.floor(maxPanels * 3 / 4); // Use two thirds of max panels\r\n\r\n const positionedPanels = Array(approximatedPanels).fill(null)\r\n .map((_, __) => ({\r\n panel: this.solarPanel,\r\n pixelPosition: {\r\n x: -1,\r\n y: -1,\r\n },\r\n horizontal: true,\r\n rotation: 0,\r\n }));\r\n\r\n this.roofPolygonsSolarPanels = {\r\n ...this.roofPolygonsSolarPanels,\r\n [\"mobile-panels\"]: {\r\n positionedPanels,\r\n sunniness:\r\n this.buildingInsights.solarPotential.buildingStats\r\n .sunshineQuantiles[5] ?? DEFAULT_SUNNINESS,\r\n },\r\n };\r\n }\r\n }\r\n\r\n async getBuildingImages() {\r\n if (!state.latitude || !state.longitude) {\r\n return;\r\n }\r\n if (this.buildingInsights) {\r\n const sameLocation =\r\n this.buildingInsights.center.latitude === state.latitude &&\r\n this.buildingInsights.center.longitude === state.longitude;\r\n if (sameLocation) {\r\n return;\r\n }\r\n }\r\n this.rgbTiff = await getBuildingImages(\r\n state.latitude,\r\n state.longitude,\r\n this.apiKey,\r\n state.radiusMeters,\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 this.sizeCanvas(this.rgbTiff.width, this.rgbTiff.height);\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 (state.isMobile) return; // Prevent interactions on mobile\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 let redraw = false;\r\n\r\n if (this.currentTool.name === \"markRoofEdge\") {\r\n let distances = [];\r\n for (let i = 0; i < currentPolygon?.points.length; i++) {\r\n const pointA = currentPolygon?.points[i];\r\n const pointB = currentPolygon\r\n ?.points[(i + 1) % currentPolygon?.points.length];\r\n const distanceA = Math.sqrt(\r\n Math.pow(x - pointA.x, 2) + Math.pow(y - pointA.y, 2),\r\n );\r\n const distanceB = Math.sqrt(\r\n Math.pow(x - pointB.x, 2) + Math.pow(y - pointB.y, 2),\r\n );\r\n const edgeLength = Math.sqrt(\r\n Math.pow(pointA.x - pointB.x, 2) +\r\n Math.pow(pointA.y - pointB.y, 2),\r\n );\r\n distances.push({\r\n dist: distanceA + distanceB - edgeLength,\r\n edge: { pointA, pointB },\r\n });\r\n }\r\n const closestEdge = distances.sort((a, b) => a.dist - b.dist)[0];\r\n if (closestEdge && (closestEdge.dist < 10)) {\r\n this.highlightedEdge = closestEdge.edge;\r\n redraw = true;\r\n } else if (this.highlightedEdge) {\r\n this.highlightedEdge = null;\r\n redraw = true;\r\n }\r\n }\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 this.hoveredPolygon ||\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 redraw = true;\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 // Recalculate area if this is a roof polygon\r\n if (currentPolygon.type === \"roof\" && currentPolygon.closed) {\r\n const metersInPixels = 1 / this.pixelInMeters;\r\n const area = calculatePolygonArea(currentPolygon.points) /\r\n (metersInPixels * metersInPixels);\r\n currentPolygon.details.area = area;\r\n }\r\n redraw = true;\r\n }\r\n\r\n if (this.shiftKeyPressed) {\r\n redraw = true;\r\n }\r\n\r\n if (redraw) {\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 highlightColor: this.config.highlightColor,\r\n highlightedEdge: this.highlightedEdge,\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 highlightColor: this.config.highlightColor,\r\n });\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 private undo() {\r\n const currentPolygon = this.getCurrentPolygon();\r\n if (!currentPolygon) {\r\n return;\r\n }\r\n if (currentPolygon.closed) {\r\n currentPolygon.closed = false;\r\n if (currentPolygon.type === \"roof\") {\r\n delete this.roofPolygonsSolarPanels[currentPolygon._id];\r\n this.currentTool = roofTool;\r\n this.highlightedEdge = null;\r\n } else if (currentPolygon.type === \"obstruction\") {\r\n this.currentTool = obstructionTool;\r\n }\r\n } else {\r\n currentPolygon.points.pop();\r\n }\r\n this.drawPolygons();\r\n }\r\n\r\n @Listen(\"mousedown\", { target: \"document\" })\r\n handleMouseDown(event: MouseEvent) {\r\n if (this.currentTool.name === \"undo\") {\r\n return;\r\n }\r\n if (state.isMobile) return; // Prevent interactions on mobile\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 === \"markRoofEdge\") {\r\n if (!this.highlightedEdge) {\r\n return;\r\n }\r\n const x = this.highlightedEdge.pointA.x -\r\n this.highlightedEdge.pointB.x;\r\n const y = this.highlightedEdge.pointA.y -\r\n this.highlightedEdge.pointB.y;\r\n const azimuth = Math.atan2(-x, y) * (180 / Math.PI);\r\n this.calculateSolarPanels();\r\n this.handleAzimuthChange({\r\n target: {\r\n value: azimuth,\r\n },\r\n } as unknown as Event);\r\n return;\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 const currentPolygon = this.getCurrentPolygon();\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 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 if (\r\n !this.selectedPolygon || currentPolygon?.closed ||\r\n this.currentTool.name !== this.selectedPolygon?.type\r\n ) {\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 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 this.scrollToCanvas();\r\n }\r\n\r\n this.drawPolygons();\r\n this.currentTool = moveTool;\r\n }\r\n\r\n private calculateSolarPanels({ redraw = true }: { redraw?: boolean } = {}) {\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 if (redraw) {\r\n this.drawPolygons();\r\n }\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 const currentPolygon = this.getCurrentPolygon();\r\n if (\r\n currentPolygon && !currentPolygon.closed &&\r\n currentPolygon.points.length > 0\r\n ) {\r\n alert(\"Please close the polygon before selecting a tool\");\r\n // TODO translate\r\n return;\r\n }\r\n this.currentTool = tool;\r\n }\r\n\r\n private scrollToCanvas() {\r\n const canvasElement = this.el.querySelector(\"#map-draw-canvas\");\r\n if (canvasElement) {\r\n canvasElement.scrollIntoView({ behavior: \"smooth\" });\r\n }\r\n }\r\n\r\n private handleSettingsClick = () => {\r\n this.showSettings = true;\r\n };\r\n\r\n private handleSettingsClose = () => {\r\n this.showSettings = false;\r\n };\r\n\r\n private handleSettingsSave = (event: CustomEvent<Settings>) => {\r\n state.settings = event.detail;\r\n state.settingsVersion++;\r\n };\r\n\r\n render() {\r\n const t = getLanguageStrings(state.settings.language);\r\n const currentPolygon = this.getCurrentPolygon();\r\n return (\r\n <div\r\n class=\"flex flex-col justify-center items-center w-full h-full gap-4 bg-primary\"\r\n id=\"map-draw\"\r\n >\r\n {this.showInstructions && !state.isMobile && (\r\n <div class=\"w-full rounded-4xl p-4 bg-muted text-muted-foreground\">\r\n {t.mapDraw.instructions.parts.roof}{\" \"}\r\n <button\r\n class=\"inline-flex items-center justify-center p-1 rounded-full hover:bg-surface-hover transition-colors\"\r\n onClick={() => this.handleToolSelect(roofTool)}\r\n >\r\n <icon-selector name=\"house\" inline={true} />\r\n </button>{\" \"}\r\n {t.mapDraw.instructions.parts.obstruction}{\" \"}\r\n <button\r\n class=\"inline-flex items-center justify-center p-1 rounded-full hover:bg-surface-hover transition-colors\"\r\n onClick={() =>\r\n this.handleToolSelect(obstructionTool)}\r\n >\r\n <icon-selector name=\"octagon-minus\" inline={true} />\r\n </button>{\" \"}\r\n {t.mapDraw.instructions.parts.delete}{\" \"}\r\n <button\r\n class=\"inline-flex items-center justify-center p-1 rounded-full hover:bg-surface-hover transition-colors\"\r\n onClick={() => this.handleToolSelect(deleteTool)}\r\n >\r\n <icon-selector name=\"eraser\" inline={true} />\r\n </button>{\" \"}\r\n {t.mapDraw.instructions.parts.move}{\" \"}\r\n <button\r\n class=\"inline-flex items-center justify-center p-1 rounded-full hover:bg-surface-hover transition-colors\"\r\n onClick={() => this.handleToolSelect(moveTool)}\r\n >\r\n <icon-selector name=\"move\" inline={true} />\r\n </button>{\" \"}\r\n {t.mapDraw.instructions.parts.end}\r\n </div>\r\n )}\r\n <div class=\"w-full flex flex-row justify-between items-center\">\r\n {!state.isMobile && (this.showInstructions\r\n ? (\r\n <button\r\n class=\"px-4 py-2 rounded-4xl hover:bg-surface-hover transition-colors duration-200 bg-muted p-4 text-muted-foreground\"\r\n onClick={() => this.showInstructions = false}\r\n >\r\n {t.mapDraw.instructions.hide}\r\n </button>\r\n )\r\n : (\r\n <button\r\n class=\"px-4 py-2 rounded-4xl hover:bg-surface-hover transition-colors duration-200 bg-muted p-4 text-muted-foreground\"\r\n onClick={() => this.showInstructions = true}\r\n >\r\n {t.mapDraw.instructions.show}\r\n </button>\r\n ))}\r\n <button\r\n class=\"flex items-center gap-2 bg-muted p-2 rounded-4xl hover:bg-surface-hover text-muted-foreground\"\r\n onClick={this.handleSettingsClick}\r\n >\r\n <settings-icon />\r\n </button>\r\n </div>\r\n <div class=\"w-full\">\r\n {!state.isMobile && (\r\n <tool-box\r\n currentTool={this.currentTool}\r\n onToolSelect={(tool) => this.handleToolSelect(tool)}\r\n undoCallback={() => this.undo()}\r\n />\r\n )}\r\n </div>\r\n {this.loadingState === \"empty\" && (\r\n <div class=\"w-full\">\r\n <p class=\"text-muted text-center flex items-center justify-center rounded-4xl p-4 w-full bg-text-secondary\">\r\n {t.mapDraw.noAddressSelected}\r\n </p>\r\n </div>\r\n )}\r\n {(state.latitude && state.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-secondary\">\r\n </div>\r\n </div>\r\n )}\r\n <div class=\"flex items-start justify-center h-full w-full bg-primary rounded-4xl\">\r\n <div\r\n class=\"relative h-full flex items-center justify-center w-full rounded-4xl bg-secondary\"\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 id=\"map-draw-canvas\"\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 {currentPolygon?.closed && (\r\n <div class=\"w-full\">\r\n <polygon-buttons\r\n currentTool={this.currentTool.name}\r\n calculateSolarPanels={() =>\r\n this.calculateSolarPanels()}\r\n selectEdgeTool={() =>\r\n this.handleToolSelect(markRoofEdgeTool)}\r\n />\r\n </div>\r\n )}\r\n {!state.isMobile && (\r\n <div class=\"w-full\">\r\n <polygon-information\r\n currentPolygon={currentPolygon}\r\n positionedPanels={currentPolygon\r\n ? this\r\n .roofPolygonsSolarPanels[currentPolygon._id]\r\n ?.positionedPanels\r\n : undefined}\r\n handleAzimuthChange={(event) =>\r\n this.handleAzimuthChange(event)}\r\n handlePitchChange={(event) =>\r\n this.handlePitchChange(event)}\r\n calculateSolarPanels={() =>\r\n this.calculateSolarPanels()}\r\n />\r\n </div>\r\n )}\r\n <div class=\"w-full\">\r\n <solar-system-form\r\n systemConfigs={this.roofPolygonsSolarPanels}\r\n roofPolygons={this.roofPolygons}\r\n obstructionPolygons={this.obstructionPolygons}\r\n />\r\n </div>\r\n {this.showSettings && (\r\n <settings-modal\r\n settings={state.settings}\r\n onClose={this.handleSettingsClose}\r\n onSave={this.handleSettingsSave}\r\n />\r\n )}\r\n </div>\r\n );\r\n }\r\n}\r\n","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, Element, h, Prop, State } from \"@stencil/core\";\r\nimport { Loader } from \"@googlemaps/js-api-loader\";\r\nimport { state } from \"../../store\";\r\nimport { Language } from \"../../types/lang\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n tag: \"map-selector\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class MapSelector {\r\n @Element()\r\n el!: HTMLElement;\r\n\r\n @Prop()\r\n apiKey: string = \"\";\r\n @Prop()\r\n language: Language = \"en\";\r\n\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 map: google.maps.Map | null = null;\r\n @State()\r\n marker: google.maps.marker.AdvancedMarkerElement | null = null;\r\n @State()\r\n circle: google.maps.Circle | null = null;\r\n @State()\r\n radius: number = 20;\r\n @State()\r\n latitude: number | null = null;\r\n @State()\r\n longitude: number | null = null;\r\n\r\n private inputElement?: HTMLInputElement;\r\n private mapElement?: HTMLDivElement;\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\", \"maps\", \"marker\"],\r\n });\r\n\r\n const [places, maps, _] = await Promise.all([\r\n loader.importLibrary(\"places\"),\r\n loader.importLibrary(\"maps\"),\r\n loader.importLibrary(\"marker\"),\r\n ]);\r\n\r\n this.isLoaded = true;\r\n this.initializeAutocomplete(places);\r\n this.initializeMap(maps);\r\n } catch (error) {\r\n console.error(\"Error loading Google Maps: \", error);\r\n }\r\n }\r\n\r\n private initializeAutocomplete(places: google.maps.PlacesLibrary) {\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 if (place?.geometry?.location) {\r\n const lat = place.geometry.location.lat();\r\n const lng = place.geometry.location.lng();\r\n\r\n this.latitude = lat;\r\n this.longitude = lng;\r\n\r\n this.map?.setCenter({ lat, lng });\r\n this.map?.setZoom(40);\r\n }\r\n });\r\n }\r\n\r\n private initializeMap(\r\n maps: google.maps.MapsLibrary,\r\n ) {\r\n if (!this.mapElement || !this.isLoaded) return;\r\n\r\n this.map = new maps.Map(this.mapElement, {\r\n center: {\r\n lat: state.latitude || 49.398531832926025,\r\n lng: state.longitude || 8.671214102081551,\r\n },\r\n zoom: 15,\r\n mapTypeControl: false,\r\n streetViewControl: false,\r\n mapTypeId: \"satellite\",\r\n mapId: \"map\",\r\n tilt: 0,\r\n });\r\n // this.updateMapLocation(state.latitude, state.longitude);\r\n\r\n // Add click listener to map\r\n this.map.addListener(\"click\", (e: google.maps.MapMouseEvent) => {\r\n if (e.latLng) {\r\n const lat = e.latLng.lat();\r\n const lng = e.latLng.lng();\r\n\r\n this.latitude = lat;\r\n this.longitude = lng;\r\n\r\n this.updateMapLocation(lat, lng);\r\n }\r\n });\r\n\r\n // Initialize marker and circle if we have coordinates\r\n if (state.latitude && state.longitude) {\r\n this.updateMapLocation(state.latitude, state.longitude);\r\n }\r\n }\r\n\r\n private updateMapLocation(lat: number, lng: number) {\r\n if (!this.map) return;\r\n\r\n // Update or create circle\r\n if (this.circle) {\r\n this.circle.setCenter({ lat, lng });\r\n } else {\r\n const circle = new google.maps.Circle({\r\n strokeColor: \"#ffffff\",\r\n strokeOpacity: 0.8,\r\n strokeWeight: 2,\r\n fillColor: \"rgba(255, 255, 255, 0.8)\",\r\n fillOpacity: 0.35,\r\n map: this.map,\r\n center: { lat, lng },\r\n radius: this.radius,\r\n });\r\n this.circle = circle;\r\n }\r\n }\r\n\r\n private handleRadiusChange(e: Event) {\r\n const value = parseFloat((e.target as HTMLInputElement).value);\r\n this.radius = value;\r\n if (this.circle) {\r\n this.circle.setRadius(value);\r\n }\r\n }\r\n\r\n private handleAcceptPosition() {\r\n console.log(\r\n \"Accepting position \",\r\n this.latitude,\r\n this.longitude,\r\n this.radius,\r\n );\r\n if (this.latitude !== null && this.longitude !== null) {\r\n state.latitude = this.latitude;\r\n state.longitude = this.longitude;\r\n state.radiusMeters = this.radius;\r\n }\r\n }\r\n\r\n render() {\r\n const t = getLanguageStrings(this.language);\r\n return (\r\n <div class=\"map-selector flex flex-col gap-4 pb-4\">\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-border rounded-4xl focus:ring-secondary bg-muted\"\r\n />\r\n </div>\r\n <div class=\"w-full rounded-4xl p-4 bg-overlay\">\r\n {t.mapSelector.explanation}\r\n </div>\r\n <div class=\"flex items-center gap-4\">\r\n <label class=\"text-sm font-medium text-text-muted\">\r\n {t.mapSelector.radius}\r\n </label>\r\n <input\r\n type=\"range\"\r\n min=\"5\"\r\n max=\"100\"\r\n value={this.radius}\r\n onInput={(e) => this.handleRadiusChange(e)}\r\n class=\"input-slider 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-muted\"\r\n />\r\n <span class=\"text-sm text-text-muted\">{this.radius}m</span>\r\n </div>\r\n\r\n <div\r\n ref={(el) => this.mapElement = el}\r\n class=\"w-full h-[400px] rounded-4xl border border-border\"\r\n />\r\n\r\n <button\r\n onClick={() => this.handleAcceptPosition()}\r\n class=\"w-full py-2 px-4 bg-secondary text-muted rounded-4xl hover:bg-hover-dark transition-colors\"\r\n >\r\n {t.mapSelector.accept}\r\n </button>\r\n </div>\r\n );\r\n }\r\n}\r\n","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-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 @Prop()\r\n size: number = 20;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width={this.size}\r\n height={this.size}\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.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-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 @Prop()\r\n size: number = 20;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width={this.size}\r\n height={this.size}\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.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, h, Prop } from \"@stencil/core\";\r\nimport { state } from \"../../store\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\n\r\n@Component({\r\n tag: \"polygon-buttons\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class PolygonButtons {\r\n @Prop()\r\n calculateSolarPanels: () => void;\r\n @Prop()\r\n selectEdgeTool: () => void;\r\n @Prop()\r\n currentTool: string;\r\n\r\n render() {\r\n const t = getLanguageStrings(state.settings.language);\r\n\r\n return (\r\n <div class=\"flex w-full gap-2 justify-end\">\r\n <button\r\n class={`px-4 py-2 rounded-4xl hover:bg-overlay text-secondary transition-colors duration-200 text-xs ${\r\n this.currentTool === \"markRoofEdge\"\r\n ? \"bg-surface-active\"\r\n : \"bg-muted\"\r\n }`}\r\n // style={edgeSelectedStyle}\r\n onClick={() => this.selectEdgeTool()}\r\n >\r\n {t.mapDraw.markRoofEdge}\r\n </button>\r\n <button\r\n class=\"px-4 py-2 rounded-4xl hover:bg-overlay text-secondary transition-colors duration-200 text-xs bg-muted\"\r\n onClick={() => this.calculateSolarPanels()}\r\n >\r\n {t.mapDraw.calculateSolarPanels}\r\n </button>\r\n </div>\r\n );\r\n }\r\n}\r\n","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, h, Prop } from \"@stencil/core\";\r\nimport { Polygon, SolarPanelSystemPart } from \"../../components\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\nimport { state } from \"../../store\";\r\nimport { azimuthToCardinal } from \"../../utils/utils\";\r\n\r\n@Component({\r\n tag: \"polygon-information\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class PolygonInformation {\r\n @Prop()\r\n currentPolygon: Polygon;\r\n @Prop()\r\n positionedPanels: SolarPanelSystemPart[] | undefined;\r\n @Prop()\r\n handleAzimuthChange: (event: Event) => void;\r\n @Prop()\r\n handlePitchChange: (event: Event) => void;\r\n @Prop()\r\n calculateSolarPanels: () => void;\r\n\r\n render() {\r\n const t = getLanguageStrings(state.settings.language);\r\n\r\n return (\r\n <div class=\"flex gap-4 flex-row justify-center items-center w-full\">\r\n <div class=\"w-full bg-primary rounded-4xl p-4 text-secondary\">\r\n <h3 class=\"text-lg font-semibold mb-4 text-center\">\r\n {t.mapDraw.information}\r\n </h3>\r\n {this.currentPolygon?.details\r\n ? (\r\n <div class=\"space-y-4\">\r\n <div>\r\n <div class=\"grid grid-cols-2 gap-2\">\r\n <div>\r\n <h4 class=\"text-sm font-medium text-text-muted\">\r\n {t.mapDraw.area}\r\n </h4>\r\n <p class=\"text-lg\">\r\n {this.currentPolygon.details\r\n ?.area\r\n .toFixed(2)} m²\r\n </p>\r\n </div>\r\n <div>\r\n <div>\r\n <h4 class=\"text-sm font-medium text-text-muted\">\r\n {t.mapDraw.panels}\r\n </h4>\r\n <p class=\"text-lg\">\r\n {this.positionedPanels\r\n ?.length ?? 0}\r\n </p>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n <div>\r\n <h4 class=\"text-sm font-medium text-text-muted\">\r\n {t.mapDraw.azimuth}\r\n </h4>\r\n <div class=\"flex gap-2 flex-row justify-start bg-muted 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={this.currentPolygon\r\n .details\r\n ?.azimuth}\r\n />\r\n ({azimuthToCardinal(\r\n this.currentPolygon.details\r\n ?.azimuth,\r\n )})\r\n </div>\r\n {!state.isIOS && (\r\n <input\r\n type=\"range\"\r\n min=\"0\"\r\n max=\"360\"\r\n class=\"input-slider 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-muted\"\r\n value={this.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 this.currentPolygon.details\r\n .azimuth = azimuth;\r\n if (\r\n this.currentPolygon\r\n .type ===\r\n \"roof\" &&\r\n this.positionedPanels\r\n ) {\r\n this.calculateSolarPanels();\r\n }\r\n }}\r\n />\r\n )}\r\n </div>\r\n <div>\r\n <h4 class=\"text-sm font-medium text-text-muted pl-2\">\r\n {t.mapDraw.pitch}\r\n </h4>\r\n <div class=\"flex gap-2 flex-row justify-start bg-muted 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={this.currentPolygon\r\n .details\r\n ?.pitch}\r\n />\r\n °\r\n </div>\r\n {!state.isIOS && (\r\n <input\r\n type=\"range\"\r\n min=\"0\"\r\n max=\"90\"\r\n class=\"input-slider 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-muted\"\r\n value={this.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 this.currentPolygon.details\r\n .pitch = pitch;\r\n if (\r\n this.currentPolygon\r\n .type ===\r\n \"roof\" &&\r\n this.positionedPanels\r\n ) {\r\n this.calculateSolarPanels();\r\n }\r\n }}\r\n />\r\n )}\r\n </div>\r\n </div>\r\n )\r\n : (\r\n <p class=\"text-text-secondary text-center\">\r\n {t.mapDraw.noPolygonSelected}\r\n </p>\r\n )}\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-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 @Prop()\r\n size: number = 20;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width={this.size}\r\n height={this.size}\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.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, h, Prop } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"settings-icon\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class SettingsIcon {\r\n @Prop()\r\n inline: boolean = false;\r\n @Prop()\r\n size: number = 20;\r\n\r\n render() {\r\n return (\r\n <svg\r\n xmlns=\"http://www.w3.org/2000/svg\"\r\n width={this.size}\r\n height={this.size}\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-settings-icon lucide-settings ${\r\n this.inline ? \"inline-block\" : \"\"\r\n }`}\r\n >\r\n <path d=\"M12.22 2h-.44a2 2 0 0 0-2 2v.18a2 2 0 0 1-1 1.73l-.43.25a2 2 0 0 1-2 0l-.15-.08a2 2 0 0 0-2.73.73l-.22.38a2 2 0 0 0 .73 2.73l.15.1a2 2 0 0 1 1 1.72v.51a2 2 0 0 1-1 1.74l-.15.09a2 2 0 0 0-.73 2.73l.22.38a2 2 0 0 0 2.73.73l.15-.08a2 2 0 0 1 2 0l.43.25a2 2 0 0 1 1 1.73V20a2 2 0 0 0 2 2h.44a2 2 0 0 0 2-2v-.18a2 2 0 0 1 1-1.73l.43-.25a2 2 0 0 1 2 0l.15.08a2 2 0 0 0 2.73-.73l.22-.39a2 2 0 0 0-.73-2.73l-.15-.08a2 2 0 0 1-1-1.74v-.5a2 2 0 0 1 1-1.74l.15-.09a2 2 0 0 0 .73-2.73l-.22-.38a2 2 0 0 0-2.73-.73l-.15.08a2 2 0 0 1-2 0l-.43-.25a2 2 0 0 1-1-1.73V4a2 2 0 0 0-2-2z\" />\r\n <circle cx=\"12\" cy=\"12\" r=\"3\" />\r\n </svg>\r\n );\r\n }\r\n}\r\n","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, Event, EventEmitter, h, Prop, State } from \"@stencil/core\";\r\nimport { Settings, state } from \"../../store\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\nimport { Language } from \"../../types/lang\";\r\n\r\n@Component({\r\n tag: \"settings-modal\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class SettingsModal {\r\n @Prop()\r\n settings: Settings;\r\n\r\n @State()\r\n private tempSettings: Settings;\r\n\r\n @Event()\r\n close: EventEmitter<void>;\r\n\r\n @Event()\r\n save: EventEmitter<Settings>;\r\n\r\n componentWillLoad() {\r\n this.tempSettings = { ...this.settings };\r\n }\r\n\r\n private handleClose = () => {\r\n if (\r\n JSON.stringify(this.tempSettings) !== JSON.stringify(this.settings)\r\n ) {\r\n if (\r\n confirm(\r\n \"Are you sure you want to close without saving your changes?\",\r\n )\r\n ) {\r\n this.close.emit();\r\n }\r\n } else {\r\n this.close.emit();\r\n }\r\n };\r\n\r\n private handleSave = () => {\r\n this.save.emit(this.tempSettings);\r\n this.close.emit();\r\n };\r\n\r\n private handleInputChange = (\r\n key: keyof Settings,\r\n value: number | Language,\r\n ) => {\r\n this.tempSettings = {\r\n ...this.tempSettings,\r\n [key]: value,\r\n };\r\n };\r\n\r\n render() {\r\n const t = getLanguageStrings(state.settings.language);\r\n return (\r\n <div class=\"fixed inset-0 bg-black bg-opacity-50 flex items-center justify-center z-50\">\r\n <div class=\"bg-primary rounded-4xl p-6 w-full max-w-md\">\r\n <div class=\"flex justify-between items-center mb-6\">\r\n <h2 class=\"text-xl font-semibold\">Settings</h2>\r\n <button\r\n class=\"p-2 hover:bg-hover rounded-full transition-colors\"\r\n onClick={this.handleClose}\r\n >\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 >\r\n <line x1=\"18\" y1=\"6\" x2=\"6\" y2=\"18\" />\r\n <line x1=\"6\" y1=\"6\" x2=\"18\" y2=\"18\" />\r\n </svg>\r\n </button>\r\n </div>\r\n\r\n <div class=\"space-y-4\">\r\n <div>\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.settings.language}\r\n </label>\r\n <select\r\n class=\"w-full bg-muted rounded-4xl p-2\"\r\n onInput={(e) =>\r\n this.handleInputChange(\r\n \"language\",\r\n (e.target as HTMLSelectElement)\r\n .value as Language,\r\n )}\r\n >\r\n <option\r\n value=\"en\"\r\n selected={this.tempSettings.language ===\r\n \"en\"}\r\n >\r\n English\r\n </option>\r\n <option\r\n value=\"es\"\r\n selected={this.tempSettings.language ===\r\n \"es\"}\r\n >\r\n Español\r\n </option>\r\n <option\r\n value=\"de\"\r\n selected={this.tempSettings.language ===\r\n \"de\"}\r\n >\r\n Deutsch\r\n </option>\r\n </select>\r\n </div>\r\n\r\n <div>\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.settings.rowSpacing}\r\n </label>\r\n <input\r\n type=\"number\"\r\n class=\"w-full bg-muted rounded-4xl p-2\"\r\n value={this.tempSettings.rowSpacing}\r\n onInput={(e) =>\r\n this.handleInputChange(\r\n \"rowSpacing\",\r\n parseFloat(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n ),\r\n )}\r\n />\r\n </div>\r\n\r\n <div>\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.settings.columnSpacing}\r\n </label>\r\n <input\r\n type=\"number\"\r\n class=\"w-full bg-muted rounded-4xl p-2\"\r\n value={this.tempSettings.columnSpacing}\r\n onInput={(e) =>\r\n this.handleInputChange(\r\n \"columnSpacing\",\r\n parseFloat(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n ),\r\n )}\r\n />\r\n </div>\r\n\r\n <div>\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.settings.borderInset}\r\n </label>\r\n <input\r\n type=\"number\"\r\n class=\"w-full bg-muted rounded-4xl p-2\"\r\n value={this.tempSettings.borderInset}\r\n onInput={(e) =>\r\n this.handleInputChange(\r\n \"borderInset\",\r\n parseFloat(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n ),\r\n )}\r\n />\r\n </div>\r\n </div>\r\n\r\n <div class=\"flex justify-end gap-4 mt-6\">\r\n <button\r\n class=\"px-4 py-2 bg-surface rounded-4xl hover:bg-surface-hover transition-colors\"\r\n onClick={this.handleClose}\r\n >\r\n Cancel\r\n </button>\r\n <button\r\n class=\"px-4 py-2 bg-secondary text-muted rounded-4xl hover:bg-text-secondary transition-colors\"\r\n onClick={this.handleSave}\r\n >\r\n Save Changes\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n );\r\n }\r\n}\r\n","import { ColorScheme } from \"../config\";\r\n\r\n/**\r\n * Applies a color scheme theme globally to the document root.\r\n * Since all components use global CSS (shadow: false), this will automatically \r\n * update the theme for all components.\r\n * \r\n * @param colorScheme - The color scheme object containing theme colors\r\n */\r\nexport function applyThemeGlobally(colorScheme: Partial<ColorScheme>): void {\r\n const documentElement = document.documentElement;\r\n \r\n // Set CSS custom properties on the document root\r\n if (colorScheme.primary) {\r\n documentElement.style.setProperty('--color-primary', colorScheme.primary);\r\n }\r\n if (colorScheme.primaryForeground) {\r\n documentElement.style.setProperty('--color-primary-foreground', colorScheme.primaryForeground);\r\n }\r\n if (colorScheme.secondary) {\r\n documentElement.style.setProperty('--color-secondary', colorScheme.secondary);\r\n }\r\n if (colorScheme.secondaryForeground) {\r\n documentElement.style.setProperty('--color-secondary-foreground', colorScheme.secondaryForeground);\r\n }\r\n if (colorScheme.tertiary) {\r\n documentElement.style.setProperty('--color-tertiary', colorScheme.tertiary);\r\n }\r\n if (colorScheme.tertiaryForeground) {\r\n documentElement.style.setProperty('--color-tertiary-foreground', colorScheme.tertiaryForeground);\r\n }\r\n if (colorScheme.muted) {\r\n documentElement.style.setProperty('--color-muted', colorScheme.muted);\r\n }\r\n if (colorScheme.mutedForeground) { \r\n documentElement.style.setProperty('--color-muted-foreground', colorScheme.mutedForeground);\r\n }\r\n if (colorScheme.error) {\r\n documentElement.style.setProperty('--color-error', colorScheme.error);\r\n }\r\n if (colorScheme.errorForeground) {\r\n documentElement.style.setProperty('--color-error-foreground', colorScheme.errorForeground);\r\n }\r\n \r\n // Surface colors\r\n if (colorScheme.surface) {\r\n documentElement.style.setProperty('--color-surface', colorScheme.surface);\r\n }\r\n if (colorScheme.surfaceHover) {\r\n documentElement.style.setProperty('--color-surface-hover', colorScheme.surfaceHover);\r\n }\r\n if (colorScheme.surfaceActive) {\r\n documentElement.style.setProperty('--color-surface-active', colorScheme.surfaceActive);\r\n }\r\n \r\n // Text colors\r\n if (colorScheme.textMuted) {\r\n documentElement.style.setProperty('--color-text-muted', colorScheme.textMuted);\r\n }\r\n if (colorScheme.textSecondary) {\r\n documentElement.style.setProperty('--color-text-secondary', colorScheme.textSecondary);\r\n }\r\n if (colorScheme.textPlaceholder) {\r\n documentElement.style.setProperty('--color-text-placeholder', colorScheme.textPlaceholder);\r\n }\r\n \r\n // Border colors\r\n if (colorScheme.border) {\r\n documentElement.style.setProperty('--color-border', colorScheme.border);\r\n }\r\n if (colorScheme.borderLight) {\r\n documentElement.style.setProperty('--color-border-light', colorScheme.borderLight);\r\n }\r\n \r\n // Status colors\r\n if (colorScheme.success) {\r\n documentElement.style.setProperty('--color-success', colorScheme.success);\r\n }\r\n if (colorScheme.info) {\r\n documentElement.style.setProperty('--color-info', colorScheme.info);\r\n }\r\n \r\n // Interactive colors\r\n if (colorScheme.hover) {\r\n documentElement.style.setProperty('--color-hover', colorScheme.hover);\r\n }\r\n if (colorScheme.hoverDark) {\r\n documentElement.style.setProperty('--color-hover-dark', colorScheme.hoverDark);\r\n }\r\n if (colorScheme.overlay) {\r\n documentElement.style.setProperty('--color-overlay', colorScheme.overlay);\r\n }\r\n if (colorScheme.tooltip) {\r\n documentElement.style.setProperty('--color-tooltip', colorScheme.tooltip);\r\n }\r\n}","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, Element, Env, h, Prop, State, Watch } 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\nimport { onChange, state } from \"../../store\";\r\nimport { ColorScheme } from \"../../config\";\r\nimport { applyThemeGlobally } from \"../../utils/theme\";\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 @Prop()\r\n colorScheme: Partial<ColorScheme> | null = null;\r\n // {\r\n // primary: \"hsl(0 0% 100%)\",\r\n // secondary: \"hsl(0 0% 100%)\",\r\n // tertiary: \"hsl(0 0% 100%)\",\r\n // muted: \"hsl(0 0% 100%)\",\r\n // error: \"hsl(0 0% 100%)\",\r\n // // secondary: \"hsl(180 100% 25%)\",\r\n // // tertiary: \"hsl(24 100% 18%)\",\r\n // // muted: \"hsl(0 0% 85%)\",\r\n // // error: \"hsl(240 75% 29%)\",\r\n // primaryForeground: \"hsl(0 0% 100%)\",\r\n // secondaryForeground: \"hsl(0 0% 100%)\",\r\n // tertiaryForeground: \"hsl(0 0% 100%)\",\r\n // mutedForeground: \"hsl(0 0% 100%)\",\r\n // errorForeground: \"hsl(0 0% 100%)\",\r\n // surface: \"hsl(0 0% 100%)\",\r\n // surfaceHover: \"hsl(0 0% 100%)\",\r\n // surfaceActive: \"hsl(0 0% 100%)\",\r\n // // Text colors\r\n // textMuted: \"hsl(0 0% 100%)\",\r\n // textSecondary: \"hsl(0 0% 100%)\",\r\n // textPlaceholder: \"hsl(0 0% 100%)\",\r\n // // Border colors\r\n // border: \"hsl(0 0% 100%)\",\r\n // borderLight: \"hsl(0 0% 100%)\",\r\n // // Status colors\r\n // success: \"hsl(0 0% 100%)\",\r\n // info: \"hsl(0 0% 100%)\",\r\n // // Interactive colors\r\n // hover: \"hsl(0 0% 100%)\",\r\n // hoverDark: \"hsl(0 0% 100%)\",\r\n // overlay: \"hsl(0 0% 100%)\",\r\n // tooltip: \"hsl(0 0% 100%)\",\r\n // };\r\n\r\n @State()\r\n latitude: number | null = 40.581614;\r\n @State()\r\n longitude: number | null = -4.128423;\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 @State()\r\n showMapSelector: boolean = false;\r\n\r\n private inputElement?: HTMLInputElement;\r\n\r\n componentWillLoad() {\r\n state.isMobile =\r\n /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i\r\n .test(navigator.userAgent) || window.innerWidth < 768;\r\n this.loadGoogleMapsScript();\r\n onChange(\"latitude\", () => {\r\n if (this.showMapSelector) {\r\n this.showMapSelector = false;\r\n this.scrollToMapDraw();\r\n }\r\n });\r\n state.settings.language = this.language;\r\n state.isIOS = /iPhone|iPad|iPod/.test(navigator.userAgent);\r\n\r\n this.applyTheme();\r\n }\r\n\r\n @Watch(\"colorScheme\")\r\n colorSchemeChanged() {\r\n this.applyTheme();\r\n }\r\n\r\n private applyTheme() {\r\n if (this.colorScheme) {\r\n applyThemeGlobally(this.colorScheme);\r\n }\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\", \"maps\", \"marker\"],\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 state.latitude = this.latitude;\r\n state.longitude = this.longitude;\r\n\r\n this.scrollToMapDraw();\r\n });\r\n }\r\n\r\n private scrollToMapDraw() {\r\n if (state.isMobile) {\r\n const solarSystemFormElement = this.el.querySelector(\r\n \"solar-system-form\",\r\n );\r\n if (solarSystemFormElement) {\r\n solarSystemFormElement.scrollIntoView({ behavior: \"smooth\" });\r\n }\r\n } else {\r\n const mapDrawElement = this.el.querySelector(\"map-draw\");\r\n if (mapDrawElement) {\r\n mapDrawElement.scrollIntoView({ behavior: \"smooth\" });\r\n }\r\n }\r\n }\r\n\r\n private handleChooseOnMap() {\r\n this.showMapSelector = true;\r\n }\r\n\r\n render() {\r\n const t = getLanguageStrings(this.language);\r\n return (\r\n <div\r\n class=\"flex flex-col w-full h-full p-3 m-auto\"\r\n id=\"solar-calculator\"\r\n >\r\n {this.showMapSelector\r\n ? (\r\n <map-selector\r\n api-key={this.apiKey}\r\n language={this.language}\r\n />\r\n )\r\n : (\r\n <>\r\n <div class=\"pb-3 flex flex-row gap-4 items-stretch w-full bg-primary\">\r\n <div class=\"relative flex-3\">\r\n <div class=\"absolute left-3 top-1/2 transform -translate-y-1/2 text-muted-foreground\">\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\r\n .searchPlaceholder}\r\n class=\"w-full pl-10 pr-4 py-2 border border-border rounded-4xl focus:ring-secondary bg-muted text-muted-foreground h-full\"\r\n />\r\n </div>\r\n <button\r\n onClick={() => this.handleChooseOnMap()}\r\n class=\"flex-1 pl-4 pr-4 py-2 border border-border bg-muted rounded-4xl focus:ring-secondary hover:bg-secondary hover:text-muted\"\r\n >\r\n {t.mapSelector.chooseOnMap}\r\n </button>\r\n </div>\r\n <map-draw\r\n apiKey={this.apiKey}\r\n />\r\n </>\r\n )}\r\n </div>\r\n );\r\n }\r\n}\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 0.9, // 06:00 - 11:00 - 12\r\n 1,\r\n 0.95,\r\n 0.9,\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\n\r\nexport { SOLAR_RADIATION };\r\n\r\nexport function getSolarRadiation(discountFactor: number) {\r\n return SOLAR_RADIATION.map(value => value * discountFactor);\r\n}","import { SolarPanelType } from \"../solar\";\r\n\r\nexport interface SimulationResult {\r\n autonomy: number;\r\n byYearSavedCosts: number[];\r\n compensationPerDay: number;\r\n}\r\n\r\nexport interface ElectricityPrice {\r\n purchase: number;\r\n sell: number;\r\n increase: number;\r\n}\r\n\r\nexport interface ElectricCarConfig {\r\n batteryKWh: number;\r\n // true if the car is charged at home, false if it is charged at work\r\n chargingHours: boolean[];\r\n averageKilometersPerDay: number;\r\n consumptionkWhPer100km: number;\r\n}\r\n\r\nexport interface HeatPumpConfig {\r\n m2: number;\r\n}\r\n\r\nexport interface SolarRadiation {\r\n winterFactor: number;\r\n summerFactor: number;\r\n}\r\n\r\nexport interface SolarSystem {\r\n numberOfPanels: number;\r\n panelType: SolarPanelType;\r\n pitch: number;\r\n}\r\n\r\nexport interface HouseholdConsumption {\r\n consumptionProfile: \"mostly_at_home\" | \"mostly_away\";\r\n winterConsumptionFactor: number;\r\n summerConsumptionFactor: number;\r\n averageConsumption: number;\r\n}\r\n\r\nexport interface GeneralSimulationConfig {\r\n simulationYears: number;\r\n}\r\n\r\nexport const DEFAULT_GENERAL_SIMULATION_CONFIG: GeneralSimulationConfig = {\r\n simulationYears: 25,\r\n}\r\n\r\nexport interface SimulationConfig {\r\n householdConsumption: HouseholdConsumption;\r\n electricityPrice: ElectricityPrice;\r\n solarSystem: SolarSystem;\r\n batteryKWh: number;\r\n electricCar?: ElectricCarConfig;\r\n heatPump?: HeatPumpConfig;\r\n solarRadiation: SolarRadiation;\r\n general?: GeneralSimulationConfig;\r\n}","import { CONSUMPTION_PROFILES, HEAT_PUMP_CONSUMPTION } from \"../../constants\";\r\nimport { getSolarRadiation } from \"./solarCurves\";\r\nimport { SimulationResult, SimulationConfig, DEFAULT_GENERAL_SIMULATION_CONFIG } from \"./types\";\r\n\r\nexport function generateElectricCarChargingHours(start: number, end: number): boolean[] {\r\n let hours = new Array(24).fill(false);\r\n if (start < end) {\r\n for (let i = start; i <= end; i++) {\r\n hours[i] = true;\r\n }\r\n } else {\r\n for (let i = start; i <= 24; i++) {\r\n hours[i] = true;\r\n }\r\n for (let i = 0; i <= end; i++) { \r\n hours[i] = true;\r\n }\r\n }\r\n return hours;\r\n}\r\n\r\nexport function simulateDay( production: number[], consumption: number[], dailyConsumption: number, battery: number): {\r\n autonomy: number;\r\n soldEnergy: number;\r\n energyUsageOfProduction: number;\r\n} {\r\n\r\n let batteryCharge = 0;\r\n let soldEnergy = 0;\r\n let energyUsageOfProduction = 0;\r\n for (let hour = 0; hour < production.length; hour++) {\r\n const energyDifference = production[hour] - consumption[hour];\r\n\r\n if (energyDifference > 0) {\r\n energyUsageOfProduction += consumption[hour];\r\n if (batteryCharge < battery) {\r\n batteryCharge = Math.min(batteryCharge + energyDifference, battery);\r\n } else {\r\n soldEnergy += energyDifference;\r\n }\r\n } else {\r\n if (batteryCharge > 0) {\r\n if (batteryCharge >= -energyDifference) {\r\n batteryCharge += energyDifference;\r\n energyUsageOfProduction += consumption[hour];\r\n } else {\r\n energyUsageOfProduction += production[hour] + batteryCharge;\r\n soldEnergy -= energyDifference + batteryCharge;\r\n batteryCharge = 0;\r\n }\r\n } else {\r\n energyUsageOfProduction += production[hour];\r\n }\r\n }\r\n }\r\n if (batteryCharge > 0) {\r\n soldEnergy += batteryCharge;\r\n }\r\n\r\n const autonomy = energyUsageOfProduction / dailyConsumption;\r\n return {\r\n autonomy: autonomy > 1 ? 1 : autonomy,\r\n soldEnergy,\r\n energyUsageOfProduction,\r\n };\r\n}\r\n\r\n\r\nexport function simulate(config: SimulationConfig): SimulationResult {\r\n const generalConfig = {\r\n ...DEFAULT_GENERAL_SIMULATION_CONFIG,\r\n ...config.general\r\n };\r\n\r\n const consumption = CONSUMPTION_PROFILES[config.householdConsumption.consumptionProfile];\r\n const norm = consumption.reduce((acc, curr) => acc + curr, 0);\r\n\r\n const additionalConsumption = config.heatPump?.m2 * HEAT_PUMP_CONSUMPTION || 0;\r\n\r\n let electricCarConsumption = 0;\r\n let electricCarNorm = 1;\r\n let electricCarChargingHours = consumption.map(_ => false);\r\n if (config.electricCar) {\r\n electricCarChargingHours = config.electricCar.chargingHours;\r\n const dailyCarUsage = config.electricCar.averageKilometersPerDay / 100 * config.electricCar.consumptionkWhPer100km;\r\n electricCarConsumption = Math.min(dailyCarUsage, config.electricCar.batteryKWh);\r\n electricCarNorm = config.electricCar.chargingHours.reduce((acc, curr) => acc + (curr ? 1 : 0), 0);\r\n if (electricCarNorm === 0) {\r\n electricCarNorm = 1;\r\n }\r\n }\r\n\r\n const systemSize = config.solarSystem.numberOfPanels * config.solarSystem.panelType.kWattPeak;\r\n const summerProduction = getSolarRadiation(config.solarRadiation.summerFactor * systemSize);\r\n const winterProduction = getSolarRadiation(config.solarRadiation.winterFactor * systemSize);\r\n\r\n const summerConsumptionWholeDay = config.householdConsumption.averageConsumption * config.householdConsumption.summerConsumptionFactor + additionalConsumption * config.householdConsumption.summerConsumptionFactor;\r\n const summerConsumptionDaily = consumption.map((c, i) => c / norm * summerConsumptionWholeDay + electricCarConsumption/electricCarNorm * (electricCarChargingHours[i] ? 1 : 0));\r\n const winterConsumptionWholeDay = config.householdConsumption.averageConsumption * config.householdConsumption.winterConsumptionFactor + additionalConsumption * config.householdConsumption.winterConsumptionFactor;\r\n const winterConsumptionDaily = consumption.map((c, i) => c / norm * winterConsumptionWholeDay + electricCarConsumption/electricCarNorm * (electricCarChargingHours[i] ? 1 : 0));\r\n\r\n const summerDay = simulateDay(summerProduction, summerConsumptionDaily, summerConsumptionWholeDay + electricCarConsumption, config.batteryKWh);\r\n const winterDay = simulateDay(winterProduction, winterConsumptionDaily, winterConsumptionWholeDay + electricCarConsumption, config.batteryKWh);\r\n\r\n let savedCosts = 0;\r\n let savedCostsByYear = [];\r\n const soldEnergy = (summerDay.soldEnergy + winterDay.soldEnergy) / 2;\r\n const ownConsumption = (summerDay.energyUsageOfProduction + winterDay.energyUsageOfProduction) / 2;\r\n\r\n let energyPrice = config.electricityPrice.purchase;\r\n for (let i = 0; i < generalConfig.simulationYears; i++) {\r\n const savedCostsThisYear = ownConsumption * energyPrice * 365;\r\n savedCosts += savedCostsThisYear;\r\n savedCostsByYear.push(savedCostsThisYear);\r\n\r\n energyPrice = (1 + config.electricityPrice.increase) * energyPrice;\r\n }\r\n\r\n return {\r\n autonomy: (summerDay.autonomy + winterDay.autonomy) / 2,\r\n compensationPerDay: soldEnergy * config.electricityPrice.sell,\r\n byYearSavedCosts: savedCostsByYear,\r\n } as SimulationResult;\r\n}","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, h, Prop, State, Watch } from \"@stencil/core\";\r\nimport { DEFAULT_SOLAR_PANEL_TYPE } from \"../../config\";\r\nimport { SolarPanelSystemPart } from \"../../utils/geometry/fitting\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\nimport { Polygon } from \"../../types/shapes\";\r\nimport { state } from \"../../store\";\r\nimport { SimulationConfig } from \"../../utils/simulation/types\";\r\nimport {\r\n generateElectricCarChargingHours,\r\n simulate,\r\n} from \"../../utils/simulation/simulation\";\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 roofPolygons: { [id: string]: Polygon } = {};\r\n @Prop()\r\n obstructionPolygons: { [id: string]: Polygon } = {};\r\n\r\n @State()\r\n householdConsumption: number = 4500;\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 annualPriceIncrease: number = 2;\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 electricCarChargingTime: \"day\" | \"night\" = \"day\";\r\n @State()\r\n heatPump: number = 0;\r\n @State()\r\n battery: number = 0;\r\n\r\n @State()\r\n compensation25Years: number = 0;\r\n @State()\r\n savedCosts25Years: number = 0;\r\n @State()\r\n maxPanels: number = 5;\r\n @State()\r\n kmDrivenPerYear: number = 10000;\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 this.maxPanels = 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 this.maxPanels = 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 }\r\n\r\n private recalculate() {\r\n const simulationConfig: SimulationConfig = {\r\n general: {\r\n simulationYears: 25,\r\n },\r\n householdConsumption: {\r\n consumptionProfile: this.consumptionProfile,\r\n winterConsumptionFactor: 1.2,\r\n summerConsumptionFactor: 0.8,\r\n averageConsumption: this.householdConsumption / 365,\r\n },\r\n electricityPrice: {\r\n purchase: this.electricityPrice,\r\n sell: this.compensationRate,\r\n increase: this.annualPriceIncrease / 100,\r\n },\r\n solarSystem: {\r\n numberOfPanels: this.numberOfPanels,\r\n panelType: DEFAULT_SOLAR_PANEL_TYPE,\r\n pitch: 30,\r\n },\r\n batteryKWh: this.battery,\r\n solarRadiation: {\r\n winterFactor: 0.2,\r\n summerFactor: 0.6,\r\n },\r\n heatPump: {\r\n m2: this.heatPump,\r\n },\r\n electricCar: this.electricCar\r\n ? {\r\n averageKilometersPerDay: this.kmDrivenPerYear / 365,\r\n consumptionkWhPer100km: 17,\r\n batteryKWh: 20,\r\n chargingHours: this.electricCarChargingTime === \"day\"\r\n ? generateElectricCarChargingHours(6, 18)\r\n : generateElectricCarChargingHours(18, 6),\r\n }\r\n : undefined,\r\n };\r\n\r\n const result = simulate(simulationConfig);\r\n\r\n this.compensation25Years = result.compensationPerDay * 365 * 25;\r\n this.savedCosts25Years = result.byYearSavedCosts.reduce(\r\n (acc, curr) => acc + curr,\r\n 0,\r\n );\r\n this.costSavings = result.compensationPerDay * 365;\r\n this.autonomy = result.autonomy * 100;\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(state.settings.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 private isIOS(): boolean {\r\n return state.isIOS;\r\n }\r\n\r\n render() {\r\n const t = getLanguageStrings(state.settings.language);\r\n return (\r\n <div\r\n 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 id=\"solar-system-form\"\r\n >\r\n <h1 class=\"text-2xl font-bold text-secondary mb-4 w-full\">\r\n {t.solarSystemForm.title}\r\n </h1>\r\n\r\n <div class=\"w-full bg-primary 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-secondary\">\r\n {t.solarSystemForm.systemInformation}\r\n </h2>\r\n <div class=\"grid grid-rows-3 gap-0\">\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.solarSystemForm.numberOfPanels}\r\n </label>\r\n <label class=\"block text-sm font-medium text-text-muted 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 {!this.isIOS()\r\n ? (\r\n <input\r\n type=\"number\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground\"\r\n value={this.numberOfPanels}\r\n readOnly\r\n />\r\n )\r\n : (\r\n <input\r\n type=\"number\"\r\n min=\"1\"\r\n max={this.maxPanels}\r\n class=\"flex-1 px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground\"\r\n value={this.numberOfPanels}\r\n onInput={(e) => {\r\n const value = parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n if (\r\n value >= 1 &&\r\n value <=\r\n this.maxPanels\r\n ) {\r\n this.numberOfPanels = value;\r\n this.recalculate();\r\n }\r\n }}\r\n />\r\n )}\r\n <input\r\n type=\"number\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground\"\r\n value={this.panelPeakPower}\r\n readonly\r\n />\r\n </div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <div class=\"w-full pt-2\">\r\n {!this.isIOS() &&\r\n (\r\n <input\r\n type=\"range\"\r\n min=\"1\"\r\n max={this.maxPanels}\r\n step=\"1\"\r\n class=\"input-slider 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-muted\"\r\n value={this.numberOfPanels}\r\n onInput={(e) => {\r\n this.numberOfPanels =\r\n parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n }}\r\n />\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n <div class=\"bg-muted rounded-4xl p-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-text-muted\">\r\n {t.solarSystemForm.totalSystemPeakPower}\r\n </span>\r\n <span class=\"text-xl font-bold text-secondary\">\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-secondary\">\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-text-muted\">\r\n {t.solarSystemForm.annualConsumption}\r\n </label>\r\n <label class=\"block text-sm font-medium text-text-muted\">\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-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground\"\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 }}\r\n />\r\n <select\r\n class=\"w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground\"\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 }}\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-secondary\">\r\n {t.solarSystemForm.additionalComponents.title}\r\n </h2>\r\n <div class=\"flex flex-col gap-4\">\r\n {/* Heat Pump Section */}\r\n <div class=\"flex flex-col bg-muted rounded-4xl p-4 gap-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <div class=\"flex items-center gap-2\">\r\n <input\r\n type=\"checkbox\"\r\n id=\"heatPump\"\r\n class=\"w-4 h-4 accent-tertiary border-gray-300 rounded-full focus:ring-tertiary focus:ring-offset-0 focus:ring-2\"\r\n checked={this.heatPump > 0}\r\n onChange={(e) => {\r\n this.heatPump =\r\n (e.target as HTMLInputElement)\r\n .checked\r\n ? 100\r\n : 0;\r\n this.recalculate();\r\n }}\r\n />\r\n <label\r\n htmlFor=\"heatPump\"\r\n class=\"text-text-muted\"\r\n >\r\n {t.solarSystemForm\r\n .additionalComponents\r\n .heatPump}\r\n </label>\r\n </div>\r\n {(this.heatPump > 0 && !this.isIOS()) && (\r\n <span class=\"text-text-muted\">\r\n {this.heatPump} m²\r\n </span>\r\n )}\r\n </div>\r\n {this.heatPump > 0 && (\r\n <div class=\"flex flex-col gap-2\">\r\n {this.isIOS()\r\n ? (\r\n <div class=\"flex items-center gap-2\">\r\n <input\r\n type=\"number\"\r\n min=\"10\"\r\n max=\"300\"\r\n step=\"10\"\r\n class=\"flex-1 px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted\"\r\n value={this.heatPump}\r\n onInput={(e) => {\r\n const value =\r\n parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n if (\r\n value >= 10 &&\r\n value <= 300\r\n ) {\r\n this.heatPump =\r\n value;\r\n this.recalculate();\r\n }\r\n }}\r\n />\r\n <span class=\"text-sm text-text-muted\">\r\n m²\r\n </span>\r\n </div>\r\n )\r\n : (\r\n <input\r\n type=\"range\"\r\n min=\"10\"\r\n max=\"300\"\r\n step=\"10\"\r\n class=\"input-slider 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-muted\"\r\n value={this.heatPump}\r\n onInput={(e) => {\r\n this.heatPump =\r\n parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n }}\r\n />\r\n )}\r\n </div>\r\n )}\r\n </div>\r\n\r\n {/* Electric Car Section */}\r\n <div class=\"flex flex-col bg-muted rounded-4xl p-4 gap-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <div class=\"flex items-center gap-2\">\r\n <input\r\n type=\"checkbox\"\r\n id=\"electricCar\"\r\n class=\"w-4 h-4 accent-tertiary border-gray-300 rounded focus:ring-tertiary focus:ring-offset-0 focus:ring-2\"\r\n checked={this.electricCar}\r\n onChange={(e) => {\r\n this.electricCar =\r\n (e.target as HTMLInputElement)\r\n .checked;\r\n this.recalculate();\r\n }}\r\n />\r\n <label\r\n htmlFor=\"electricCar\"\r\n class=\"text-text-muted\"\r\n >\r\n {t.solarSystemForm\r\n .additionalComponents\r\n .electricCar}\r\n </label>\r\n </div>\r\n </div>\r\n {this.electricCar && (\r\n <div class=\"flex flex-col gap-2\">\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <label class=\"text-sm text-text-muted\">\r\n {t.solarSystemForm\r\n .additionalComponents\r\n .chargingTime}\r\n </label>\r\n <label class=\"text-sm text-text-muted\">\r\n {t.solarSystemForm\r\n .additionalComponents\r\n .kilometersPerYear}\r\n </label>\r\n </div>\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <select\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted\"\r\n onChange={(e) => {\r\n this.electricCarChargingTime =\r\n (e.target as HTMLSelectElement)\r\n .value as\r\n | \"day\"\r\n | \"night\";\r\n this.recalculate();\r\n }}\r\n >\r\n <option\r\n value=\"day\"\r\n selected={this\r\n .electricCarChargingTime ===\r\n \"day\"}\r\n >\r\n {t.solarSystemForm\r\n .additionalComponents\r\n .chargingTimeDay}\r\n </option>\r\n <option\r\n value=\"night\"\r\n selected={this\r\n .electricCarChargingTime ===\r\n \"night\"}\r\n >\r\n {t.solarSystemForm\r\n .additionalComponents\r\n .chargingTimeNight}\r\n </option>\r\n </select>\r\n <input\r\n type=\"number\"\r\n min=\"1000\"\r\n max=\"50000\"\r\n step=\"1000\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted\"\r\n value={this.kmDrivenPerYear}\r\n onInput={(e) => {\r\n this.kmDrivenPerYear =\r\n parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n }}\r\n />\r\n </div>\r\n </div>\r\n )}\r\n </div>\r\n\r\n {/* Battery Section */}\r\n <div class=\"flex flex-col bg-muted rounded-4xl p-4 gap-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <label class=\"text-text-muted\">\r\n {t.solarSystemForm.additionalComponents\r\n .battery}\r\n </label>\r\n {!this.isIOS() && (\r\n <span class=\"text-text-muted\">\r\n {this.battery} kWh\r\n </span>\r\n )}\r\n </div>\r\n <div class=\"flex flex-col gap-2\">\r\n {this.isIOS()\r\n ? (\r\n <div class=\"flex items-center gap-2\">\r\n <input\r\n type=\"number\"\r\n min=\"0\"\r\n max=\"20\"\r\n step=\"1\"\r\n class=\"flex-1 px-4 py-2 rounded-4xl border border-gray-300 focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted\"\r\n value={this.battery}\r\n onInput={(e) => {\r\n const value = parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n if (\r\n value >= 0 &&\r\n value <= 20\r\n ) {\r\n this.battery =\r\n value;\r\n this.recalculate();\r\n }\r\n }}\r\n placeholder=\"Battery capacity\"\r\n />\r\n <span class=\"text-sm text-text-muted\">\r\n kWh\r\n </span>\r\n </div>\r\n )\r\n : (\r\n <input\r\n type=\"range\"\r\n min=\"0\"\r\n max=\"20\"\r\n step=\"1\"\r\n class=\"input-slider 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-muted\"\r\n value={this.battery}\r\n onInput={(e) => {\r\n this.battery = parseInt(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\r\n }}\r\n />\r\n )}\r\n </div>\r\n </div>\r\n </div>\r\n </div>\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-secondary\">\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-3 gap-4\">\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.solarSystemForm.electricityPrice}\r\n </label>\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.solarSystemForm.compensationRate}\r\n </label>\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.solarSystemForm.annualPriceIncrease}\r\n </label>\r\n </div>\r\n <div class=\"grid grid-cols-3 gap-4 text-primary-foreground\">\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-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted\"\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 }}\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-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted\"\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 }}\r\n />\r\n <input\r\n type=\"number\"\r\n step=\"0.1\"\r\n class=\"w-full px-4 py-2 rounded-4xl border border-border focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted\"\r\n value={this.annualPriceIncrease.toFixed(1)}\r\n onInput={(e) => {\r\n this.annualPriceIncrease = parseFloat(\r\n (e.target as HTMLInputElement)\r\n .value,\r\n );\r\n this.recalculate();\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 p-4 border border-border rounded-4xl\">\r\n <h2 class=\"text-lg font-semibold text-secondary\">\r\n {t.solarSystemForm.resultsTitle}\r\n </h2>\r\n <div class=\"bg-muted rounded-4xl p-4\">\r\n <div class=\"flex items-center justify-between\">\r\n <span class=\"text-text-muted\">\r\n {t.solarSystemForm.autonomy}\r\n </span>\r\n <span class=\"text-xl font-bold text-secondary\">\r\n {this.autonomy > 100\r\n ? \"100\"\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-text-muted\">\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-muted 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-success\">\r\n {this.costSavings.toFixed(2)}€/{t\r\n .solarSystemForm.year}\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-text-muted\">\r\n Einspeisevergütung 25 Jahre\r\n </span>\r\n </div>\r\n <span class=\"text-xl font-bold text-success\">\r\n {this.compensation25Years.toFixed(2)}€\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-text-muted\">\r\n Geldwerter Vorteil 25 Jahre\r\n </span>\r\n </div>\r\n <span class=\"text-xl font-bold text-success\">\r\n {this.savedCosts25Years.toFixed(2)}€\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\">\r\n <h2 class=\"text-lg font-semibold text-secondary\">\r\n {t.solarSystemForm.requestOffer}\r\n </h2>\r\n <div class=\"grid gap-4\">\r\n <div class=\"grid grid-cols-2 gap-4\">\r\n <label class=\"block text-sm font-medium text-text-muted mb-1\">\r\n {t.solarSystemForm.name}\r\n </label>\r\n <label class=\"block text-sm font-medium text-text-muted 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 <div>\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-error\"\r\n : \"border-border\"\r\n } focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground`}\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-error text-sm mt-1\">\r\n {this.nameError}\r\n </p>\r\n )}\r\n </div>\r\n <div>\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-error\"\r\n : \"border-border\"\r\n } focus:ring-2 focus:ring-tertiary focus:border-transparent bg-muted text-muted-foreground`}\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-error text-sm mt-1\">\r\n {this.emailError}\r\n </p>\r\n )}\r\n </div>\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-secondary rounded-4xl hover:bg-tertiary transition-colors duration-200 text-muted\"\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","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, h, Prop } from \"@stencil/core\";\r\nimport { Tool } from \"../../utils/render/tools\";\r\nimport { getLanguageStrings } from \"../../utils/lang/general\";\r\nimport { state } from \"../../store\";\r\nimport { tools, undoTool } from \"../../utils/render/tools\";\r\n\r\n@Component({\r\n tag: \"tool-box\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class ToolBox {\r\n @Prop()\r\n currentTool: Tool;\r\n @Prop()\r\n undoCallback: () => void;\r\n @Prop()\r\n onToolSelect: (tool: Tool) => void;\r\n\r\n render() {\r\n const t = getLanguageStrings(state.settings.language);\r\n const undoToolStrings = t.mapDraw.tools[undoTool.name];\r\n\r\n return (\r\n <div class=\"flex lg:gap-4 rounded-4xl bg-primary p-4 flex-wrap justify-center w-full text-xs\">\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 ${\r\n this.currentTool.name === tool.name\r\n ? \"bg-secondary hover:bg-secondary/80 text-secondary-foreground\"\r\n : \"bg-primary hover:bg-muted text-primary-foreground\"\r\n }`}\r\n aria-label={toolStrings.ariaLabel}\r\n title={toolStrings.explanation}\r\n onClick={() => this.onToolSelect(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 <button\r\n class={`px-4 py-2 rounded-4xl transition-colors duration-200 bg-primary hover:bg-muted text-primary-foreground`}\r\n aria-label={undoToolStrings.ariaLabel}\r\n title={undoToolStrings.explanation}\r\n onClick={() => this.undoCallback()}\r\n >\r\n <div class=\"flex items-center gap-1 flex-col\">\r\n <undo-icon />\r\n <span>{undoToolStrings.name}</span>\r\n </div>\r\n </button>\r\n </div>\r\n );\r\n }\r\n}\r\n","/*! tailwindcss v4.1.8 | 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-gray-300: oklch(87.2% 0.01 258.338);\n --color-gray-400: oklch(70.7% 0.022 261.325);\n --color-gray-800: oklch(27.8% 0.033 256.848);\n --color-black: #000;\n --spacing: 0.25rem;\n --container-md: 28rem;\n --text-xs: 0.75rem;\n --text-xs--line-height: calc(1 / 0.75);\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 --font-weight-medium: 500;\n --font-weight-semibold: 600;\n --font-weight-bold: 700;\n --radius-lg: 0.5rem;\n --radius-4xl: 2rem;\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 --color-primary: hsl(41 51% 90%);\n --color-primary-foreground: hsl(0 0% 0%);\n --color-secondary: hsl(28 100% 8%);\n --color-secondary-foreground: hsl(0 0% 100%);\n --color-tertiary: hsl(28 100% 29%);\n --color-tertiary-foreground: hsl(0 0% 100%);\n --color-muted: hsl(0 0% 100%);\n --color-muted-foreground: hsl(0 0% 0%);\n --color-error: hsl(0 100% 50%);\n --color-error-foreground: hsl(0 0% 100%);\n --color-surface: hsl(0 0% 88%);\n --color-surface-hover: hsl(0 0% 82%);\n --color-surface-active: hsl(0 0% 64%);\n --color-text-muted: hsl(0 0% 45%);\n --color-text-secondary: hsl(0 0% 55%);\n --color-text-placeholder: hsl(0 0% 73%);\n --color-border: hsl(0 0% 82%);\n --color-border-light: hsl(0 0% 93%);\n --color-success: hsl(142 76% 36%);\n --color-info: hsl(221 83% 53%);\n --color-hover: hsl(0 0% 88%);\n --color-hover-dark: hsl(28 100% 8%);\n --color-overlay: rgba(0, 0, 0, 0.24);\n --color-tooltip: hsl(0 0% 13%);\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 .fixed {\n position: fixed;\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\\/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\\/2 {\n left: calc(1/2 * 100%);\n }\n .left-3 {\n left: calc(var(--spacing) * 3);\n }\n .z-20 {\n z-index: 20;\n }\n .z-50 {\n z-index: 50;\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 .mt-6 {\n margin-top: calc(var(--spacing) * 6);\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 .mb-6 {\n margin-bottom: calc(var(--spacing) * 6);\n }\n .block {\n display: block;\n }\n .flex {\n display: flex;\n }\n .grid {\n display: grid;\n }\n .inline {\n display: inline;\n }\n .inline-block {\n display: inline-block;\n }\n .inline-flex {\n display: inline-flex;\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-\\[400px\\] {\n height: 400px;\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-64 {\n width: calc(var(--spacing) * 64);\n }\n .w-full {\n width: 100%;\n }\n .max-w-md {\n max-width: var(--container-md);\n }\n .flex-1 {\n flex: 1;\n }\n .flex-3 {\n flex: 3;\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\\/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 .appearance-none {\n appearance: none;\n }\n .grid-cols-2 {\n grid-template-columns: repeat(2, minmax(0, 1fr));\n }\n .grid-cols-3 {\n grid-template-columns: repeat(3, minmax(0, 1fr));\n }\n .grid-rows-2 {\n grid-template-rows: repeat(2, minmax(0, 1fr));\n }\n .grid-rows-3 {\n grid-template-rows: repeat(3, 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 .items-center {\n align-items: center;\n }\n .items-start {\n align-items: flex-start;\n }\n .items-stretch {\n align-items: stretch;\n }\n .justify-between {\n justify-content: space-between;\n }\n .justify-center {\n justify-content: center;\n }\n .justify-end {\n justify-content: flex-end;\n }\n .justify-start {\n justify-content: flex-start;\n }\n .gap-0 {\n gap: calc(var(--spacing) * 0);\n }\n .gap-1 {\n gap: calc(var(--spacing) * 1);\n }\n .gap-2 {\n gap: calc(var(--spacing) * 2);\n }\n .gap-4 {\n gap: calc(var(--spacing) * 4);\n }\n .space-y-4 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 4) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 4) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .space-y-6 {\n :where(& > :not(:last-child)) {\n --tw-space-y-reverse: 0;\n margin-block-start: calc(calc(var(--spacing) * 6) * var(--tw-space-y-reverse));\n margin-block-end: calc(calc(var(--spacing) * 6) * calc(1 - var(--tw-space-y-reverse)));\n }\n }\n .rounded {\n border-radius: 0.25rem;\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-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-border {\n border-color: var(--color-border);\n }\n .border-error {\n border-color: var(--color-error);\n }\n .border-gray-300 {\n border-color: var(--color-gray-300);\n }\n .border-secondary {\n border-color: var(--color-secondary);\n }\n .bg-black {\n background-color: var(--color-black);\n }\n .bg-gray-800 {\n background-color: var(--color-gray-800);\n }\n .bg-muted {\n background-color: var(--color-muted);\n }\n .bg-overlay {\n background-color: var(--color-overlay);\n }\n .bg-primary {\n background-color: var(--color-primary);\n }\n .bg-secondary {\n background-color: var(--color-secondary);\n }\n .bg-surface {\n background-color: var(--color-surface);\n }\n .bg-surface-active {\n background-color: var(--color-surface-active);\n }\n .bg-text-secondary {\n background-color: var(--color-text-secondary);\n }\n .bg-transparent {\n background-color: transparent;\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-2 {\n padding-top: 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 .pb-4 {\n padding-bottom: calc(var(--spacing) * 4);\n }\n .pl-2 {\n padding-left: calc(var(--spacing) * 2);\n }\n .pl-4 {\n padding-left: calc(var(--spacing) * 4);\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 .text-xs {\n font-size: var(--text-xs);\n line-height: var(--tw-leading, var(--text-xs--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-error {\n color: var(--color-error);\n }\n .text-gray-400 {\n color: var(--color-gray-400);\n }\n .text-muted {\n color: var(--color-muted);\n }\n .text-muted-foreground {\n color: var(--color-muted-foreground);\n }\n .text-primary-foreground {\n color: var(--color-primary-foreground);\n }\n .text-secondary {\n color: var(--color-secondary);\n }\n .text-secondary-foreground {\n color: var(--color-secondary-foreground);\n }\n .text-success {\n color: var(--color-success);\n }\n .text-text-muted {\n color: var(--color-text-muted);\n }\n .text-text-placeholder {\n color: var(--color-text-placeholder);\n }\n .text-text-secondary {\n color: var(--color-text-secondary);\n }\n .accent-tertiary {\n accent-color: var(--color-tertiary);\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 .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-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover);\n }\n }\n }\n .hover\\:bg-hover-dark {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-hover-dark);\n }\n }\n }\n .hover\\:bg-muted {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-muted);\n }\n }\n }\n .hover\\:bg-overlay {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-overlay);\n }\n }\n }\n .hover\\:bg-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-secondary);\n }\n }\n }\n .hover\\:bg-secondary\\/80 {\n &:hover {\n @media (hover: hover) {\n background-color: color-mix(in srgb, hsl(28 100% 8%) 80%, transparent);\n @supports (color: color-mix(in lab, red, red)) {\n background-color: color-mix(in oklab, var(--color-secondary) 80%, transparent);\n }\n }\n }\n }\n .hover\\:bg-surface-hover {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-surface-hover);\n }\n }\n }\n .hover\\:bg-tertiary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-tertiary);\n }\n }\n }\n .hover\\:bg-text-secondary {\n &:hover {\n @media (hover: hover) {\n background-color: var(--color-text-secondary);\n }\n }\n }\n .hover\\:text-muted {\n &:hover {\n @media (hover: hover) {\n color: var(--color-muted);\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-info {\n &:focus {\n --tw-ring-color: var(--color-info);\n }\n }\n .focus\\:ring-secondary {\n &:focus {\n --tw-ring-color: var(--color-secondary);\n }\n }\n .focus\\:ring-tertiary {\n &:focus {\n --tw-ring-color: var(--color-tertiary);\n }\n }\n .focus\\:ring-offset-0 {\n &:focus {\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-shadow: var(--tw-ring-inset,) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\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 .\\[\\&\\:\\:-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-thumb\\]\\:h-\\[10px\\] {\n &::-webkit-slider-thumb {\n height: 10px;\n }\n }\n .\\[\\&\\:\\:-webkit-slider-thumb\\]\\:w-\\[10px\\] {\n &::-webkit-slider-thumb {\n width: 10px;\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-muted {\n &::-webkit-slider-thumb {\n background-color: var(--color-muted);\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-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-duration: initial;\n }\n }\n}\n","import { Component, h, Prop } from \"@stencil/core\";\r\n\r\n@Component({\r\n tag: \"undo-icon\",\r\n styleUrl: \"../../output.css\",\r\n shadow: false,\r\n})\r\nexport class UndoIcon {\r\n @Prop()\r\n inline: boolean = false;\r\n @Prop()\r\n size: number = 20;\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-undo2-icon lucide-undo-2\"\r\n >\r\n <path d=\"M9 14 4 9l5-5\" />\r\n <path d=\"M4 9h10.5a5.5 5.5 0 0 1 5.5 5.5a5.5 5.5 0 0 1-5.5 5.5H11\" />\r\n </svg>\r\n );\r\n }\r\n}\r\n"],"mappings":"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","ignoreList":[]}