@lukso/transaction-view-core 0.7.8 → 0.7.9-dev.4059436

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.
@@ -1,2449 +0,0 @@
1
- "use strict";
2
- var __create = Object.create;
3
- var __defProp = Object.defineProperty;
4
- var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
- var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
- var __hasOwnProp = Object.prototype.hasOwnProperty;
8
- var __export = (target, all) => {
9
- for (var name in all)
10
- __defProp(target, name, { get: all[name], enumerable: true });
11
- };
12
- var __copyProps = (to, from, except, desc) => {
13
- if (from && typeof from === "object" || typeof from === "function") {
14
- for (let key of __getOwnPropNames(from))
15
- if (!__hasOwnProp.call(to, key) && key !== except)
16
- __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
17
- }
18
- return to;
19
- };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
- var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
- var __decorateClass = (decorators, target, key, kind) => {
30
- var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc(target, key) : target;
31
- for (var i = decorators.length - 1, decorator; i >= 0; i--)
32
- if (decorator = decorators[i])
33
- result = (kind ? decorator(target, key, result) : decorator(result)) || result;
34
- if (kind && result) __defProp(target, key, result);
35
- return result;
36
- };
37
-
38
- // src/shared/index.ts
39
- var shared_exports = {};
40
- __export(shared_exports, {
41
- AddressDisplay: () => AddressDisplay,
42
- AddressView: () => AddressView,
43
- CustomOption: () => CustomOption,
44
- CustomSelect: () => CustomSelect,
45
- FunctionNameView: () => FunctionNameView,
46
- GasProviderView: () => GasProviderView,
47
- IconView: () => IconView,
48
- ImageLoaderController: () => ImageLoaderController,
49
- MultiSignalController: () => MultiSignalController,
50
- NotificationView: () => NotificationView,
51
- ProgressView: () => ProgressView,
52
- ScrollToBottomButton: () => ScrollToBottomButton,
53
- SignalController: () => SignalController,
54
- TransactionSignalController: () => TransactionSignalController,
55
- TransactionViewController: () => TransactionViewController,
56
- UrlView: () => UrlView,
57
- ValueView: () => ValueView,
58
- safeCustomElement: () => import_utils13.safeCustomElement,
59
- useImageLoader: () => useImageLoader3,
60
- useSignal: () => useSignal,
61
- useSignals: () => useSignals,
62
- useTransactionSignal: () => useTransactionSignal,
63
- useTransactionView: () => useTransactionView
64
- });
65
- module.exports = __toCommonJS(shared_exports);
66
- var import_utils13 = require("@lukso/core/utils");
67
-
68
- // src/shared/address-display.ts
69
- var import_task = require("@lit/task");
70
- var import_utils = require("@lukso/core/utils");
71
- var import_transaction_view_headless = require("@lukso/transaction-view-headless");
72
- var import_lit = require("lit");
73
- var import_decorators = require("lit/decorators.js");
74
- var AddressDisplay = class extends import_lit.LitElement {
75
- constructor() {
76
- super(...arguments);
77
- this.size = "small";
78
- this.showCopyButton = false;
79
- this.nameOnly = false;
80
- this.maxWidth = 200;
81
- // Composables
82
- this.imageLoader = (0, import_transaction_view_headless.useImageLoader)();
83
- this.addressResolver = (0, import_transaction_view_headless.useAddressResolver)();
84
- this.isLoadingImage = false;
85
- // Task for loading profile image
86
- this.imageTask = new import_task.Task(this, {
87
- task: async ([resolved]) => {
88
- if (!resolved) return null;
89
- this.isLoadingImage = true;
90
- try {
91
- const image = await this.imageLoader.loadProfileImage(resolved, {
92
- width: this.getSizePixels(),
93
- height: this.getSizePixels(),
94
- dpr: window.devicePixelRatio || 1
95
- });
96
- return image || this.imageLoader.getFallbackImage(resolved);
97
- } catch (error) {
98
- console.warn("Failed to load address image:", error);
99
- return this.imageLoader.getFallbackImage(resolved || {});
100
- } finally {
101
- this.isLoadingImage = false;
102
- }
103
- },
104
- args: () => [this.resolved]
105
- });
106
- }
107
- /**
108
- * Get the effective address value (supports both `value` and legacy `address` props)
109
- */
110
- get effectiveAddress() {
111
- return this.value || this.address || "";
112
- }
113
- /**
114
- * Get pixel size for the current size setting
115
- */
116
- getSizePixels() {
117
- switch (this.size) {
118
- case "x-small":
119
- return 16;
120
- case "small":
121
- return 24;
122
- case "medium":
123
- return 32;
124
- case "large":
125
- return 48;
126
- default:
127
- return 24;
128
- }
129
- }
130
- /**
131
- * Get display name for the address
132
- */
133
- getDisplayName() {
134
- if (!this.resolved) return "Anonymous";
135
- const computedName = this.addressResolver.formatDisplayName(this.resolved);
136
- return computedName || "Anonymous";
137
- }
138
- /**
139
- * Check if this is a contract address (shows square icon)
140
- */
141
- get isContract() {
142
- return this.resolved ? this.imageLoader.isContractAddress(this.resolved) : false;
143
- }
144
- /**
145
- * Get prefix for the address display
146
- */
147
- get addressPrefix() {
148
- return this.resolved ? this.addressResolver.getAddressPrefix(this.resolved) : "@";
149
- }
150
- /**
151
- * Check if should show name colors
152
- */
153
- get shouldShowNameColor() {
154
- return this.resolved ? this.addressResolver.shouldShowNameColor(this.resolved) : true;
155
- }
156
- /**
157
- * Handle copy button click
158
- */
159
- handleCopy() {
160
- if (navigator.clipboard) {
161
- navigator.clipboard.writeText(this.effectiveAddress);
162
- this.dispatchEvent(
163
- new CustomEvent("address-copied", {
164
- detail: { address: this.effectiveAddress },
165
- bubbles: true
166
- })
167
- );
168
- }
169
- }
170
- /**
171
- * Handle address click
172
- */
173
- handleAddressClick() {
174
- this.dispatchEvent(
175
- new CustomEvent("address-click", {
176
- detail: {
177
- address: this.effectiveAddress,
178
- resolved: this.resolved
179
- },
180
- bubbles: true
181
- })
182
- );
183
- }
184
- render() {
185
- const imageResult = this.imageTask.value;
186
- return import_lit.html`
187
- <div class="address-container">
188
- ${this.label ? import_lit.html`<div class="label">${this.label}</div>` : ""}
189
-
190
- <div class="address-display" @click=${this.handleAddressClick}>
191
- <!-- Identity prefix (if present) -->
192
- ${this.resolved?.__identity ? import_lit.html`
193
- <span class="identity">
194
- ${this.resolved.__identity}
195
- <lukso-username
196
- address=${this.resolved.identity}
197
- size=${this.size}
198
- max-width="200"
199
- has-name-color="false"
200
- has-address-color="false"
201
- ></lukso-username>
202
- of
203
- </span>
204
- ` : ""}
205
-
206
- <!-- Profile image and name -->
207
- <lukso-profile
208
- size=${this.size}
209
- profile-address=${this.effectiveAddress}
210
- profile-url=${imageResult?.src || ""}
211
- has-identicon
212
- ?is-square=${this.isContract}
213
- ></lukso-profile>
214
-
215
- <!-- Address/Name display -->
216
- ${this.nameOnly ? import_lit.html`
217
- <lukso-username
218
- name=${this.getDisplayName()}
219
- size=${this.size}
220
- max-width=${this.maxWidth}
221
- prefix=${this.addressPrefix}
222
- ?has-name-color=${this.shouldShowNameColor}
223
- has-address-color="false"
224
- ></lukso-username>
225
- ` : import_lit.html`
226
- <lukso-username
227
- name=${this.getDisplayName()}
228
- address=${!this.isContract ? this.effectiveAddress : void 0}
229
- size=${this.size}
230
- max-width=${this.maxWidth}
231
- prefix=${this.addressPrefix}
232
- ?has-name-color=${this.shouldShowNameColor}
233
- ?has-address-color=${this.shouldShowNameColor}
234
- ></lukso-username>
235
- `}
236
-
237
-
238
- <!-- Copy button -->
239
- ${this.showCopyButton ? import_lit.html`
240
- <button
241
- class="copy-button"
242
- @click=${this.handleCopy}
243
- title="Copy address"
244
- >
245
- 📋
246
- </button>
247
- ` : ""}
248
- </div>
249
- </div>
250
- `;
251
- }
252
- };
253
- AddressDisplay.styles = import_lit.css`
254
- :host {
255
- display: inline-block;
256
- }
257
-
258
- .address-container {
259
- display: flex;
260
- flex-direction: column;
261
- gap: 4px;
262
- }
263
-
264
- .label {
265
- font-size: 12px;
266
- color: var(--neutral-60, #666);
267
- font-weight: 500;
268
- }
269
-
270
- .address-display {
271
- display: inline-flex;
272
- align-items: center;
273
- gap: 8px;
274
- cursor: pointer;
275
- padding: 4px;
276
- border-radius: 4px;
277
- transition: background-color 0.2s;
278
- min-width: 200px;
279
- }
280
-
281
- .address-display:hover {
282
- background-color: var(--neutral-95, #f5f5f5);
283
- }
284
-
285
- .identity {
286
- font-size: 12px;
287
- color: var(--neutral-60, #666);
288
- margin-right: 4px;
289
- }
290
-
291
- .copy-button {
292
- background: none;
293
- border: 1px solid var(--neutral-80, #ccc);
294
- border-radius: 4px;
295
- padding: 2px 4px;
296
- cursor: pointer;
297
- font-size: 12px;
298
- opacity: 0;
299
- transition: opacity 0.2s;
300
- }
301
-
302
- .copy-button:hover {
303
- background-color: var(--neutral-90, #eee);
304
- }
305
-
306
- .address-display:hover .copy-button {
307
- opacity: 1;
308
- }
309
-
310
-
311
- /* Ensure LUKSO web components are properly styled */
312
- lukso-profile,
313
- lukso-username {
314
- display: inline-flex;
315
- align-items: center;
316
- }
317
- `;
318
- __decorateClass([
319
- (0, import_decorators.property)()
320
- ], AddressDisplay.prototype, "value", 2);
321
- __decorateClass([
322
- (0, import_decorators.property)()
323
- ], AddressDisplay.prototype, "address", 2);
324
- __decorateClass([
325
- (0, import_decorators.property)({ type: Object })
326
- ], AddressDisplay.prototype, "resolved", 2);
327
- __decorateClass([
328
- (0, import_decorators.property)()
329
- ], AddressDisplay.prototype, "size", 2);
330
- __decorateClass([
331
- (0, import_decorators.property)()
332
- ], AddressDisplay.prototype, "label", 2);
333
- __decorateClass([
334
- (0, import_decorators.property)({ type: Boolean, attribute: "show-copy-button" })
335
- ], AddressDisplay.prototype, "showCopyButton", 2);
336
- __decorateClass([
337
- (0, import_decorators.property)({ type: Boolean, attribute: "name-only" })
338
- ], AddressDisplay.prototype, "nameOnly", 2);
339
- __decorateClass([
340
- (0, import_decorators.property)({ type: Number, attribute: "max-width" })
341
- ], AddressDisplay.prototype, "maxWidth", 2);
342
- AddressDisplay = __decorateClass([
343
- (0, import_utils.safeCustomElement)("address-display")
344
- ], AddressDisplay);
345
-
346
- // src/shared/address-view.ts
347
- var import_task2 = require("@lit/task");
348
- var import_utils2 = require("@lukso/core/utils");
349
- var import_transaction_view_headless2 = require("@lukso/transaction-view-headless");
350
- var import_ethereum_blockies_base64 = __toESM(require("ethereum-blockies-base64"), 1);
351
- var import_lit3 = require("lit");
352
- var import_decorators2 = require("lit/decorators.js");
353
-
354
- // src/shared/load-web-components.ts
355
- var originalDefine = typeof customElements !== "undefined" ? customElements.define.bind(customElements) : null;
356
- if (typeof customElements !== "undefined" && originalDefine) {
357
- customElements.define = (name, constructor, options) => {
358
- if (!customElements.get(name)) {
359
- originalDefine(name, constructor, options);
360
- }
361
- };
362
- }
363
- if (originalDefine && typeof customElements !== "undefined") {
364
- customElements.define = originalDefine;
365
- }
366
-
367
- // src/styles/styles.css?__raw__
368
- var styles_default = '/**\n * @file Main styles\n *\n * This file contain general styles that should be applied to host page.\n */\n:root {\n --neutral-10: #121b21;\n --neutral-15: #1b2832;\n --neutral-20: #243542;\n --neutral-25: #2d4253;\n --neutral-30: #365063;\n --neutral-35: #3e5d74;\n --neutral-40: #476a85;\n --neutral-45: #507795;\n --neutral-50: #5985a6;\n --neutral-55: #6a91af;\n --neutral-60: #7a9db8;\n --neutral-65: #8ba9c1;\n --neutral-70: #9cb6c9;\n --neutral-75: #acc2d2;\n --neutral-80: #bdcedb;\n --neutral-85: #cddae4;\n --neutral-90: #dee7ed;\n --neutral-95: #eef3f6;\n --neutral-97: #f5f8fa;\n --neutral-98: #f8fafb;\n --neutral-100: #ffffff;\n --honey-72: #fad275;\n --honey-75: #fbd784;\n --honey-82: #fce2a6;\n --honey-85: #fce7b5;\n --honey-92: #fef2d8;\n --coral-65: #f37c58;\n --coral-74: #f69e83;\n --coral-75: #f7a288;\n --coral-84: #fac3b3;\n --coral-85: #fac7b7;\n --coral-94: #fde9e2;\n --warm-77: #ffbb8a;\n --warm-87: #ffd8bd;\n --warm-97: #fff6f0;\n --sea-salt-57: #7fa4a4;\n --sea-salt-67: #9db9b9;\n --sea-salt-88: #dbe6e6;\n --cloud-43: #447c97;\n --cloud-75: #a7c7d7;\n --cloud-88: #d5e4ec;\n --ocean-38: #3c6286;\n --ocean-75: #a7c0d7;\n --ocean-88: #d5e1ec;\n --sky-64: #68a5de;\n --sky-75: #96c1e8;\n --sky-85: #c0daf1;\n --lukso-50: #aa5578;\n --lukso-60: #bb7793;\n --lukso-70: #cc99ae;\n --lukso-80: #ddbbc9;\n --lukso-90: #eedde4;\n --yellow-25: #804d00;\n --yellow-55: #ffa31a;\n --yellow-65: #ffb84d;\n --yellow-75: #ffcc80;\n --yellow-85: #ffe0b3;\n --yellow-95: #fff5e5;\n --green-45: #31b452;\n --green-54: #47cd68;\n --green-63: #6bd686;\n --green-75: #9be4ad;\n --green-85: #c3efce;\n --green-95: #ebfaef;\n --blue-40: #0452c8;\n --blue-50: #0567fa;\n --blue-60: #3785fb;\n --blue-75: #82b3fc;\n --blue-85: #b4d1fd;\n --blue-95: #e6f0fe;\n --red-55: #e23636;\n --red-65: #e96363;\n --red-75: #ef8f8f;\n --red-85: #f5bcbc;\n --red-95: #fce9e9;\n --purple-15: #1d202f;\n --purple-18: #232739;\n --purple-31: #3c4262;\n --purple-41: #4f5882;\n --purple-51: #646ea0;\n --purple-58: #7a83ae;\n --purple-63: #8a92b7;\n --purple-82: #c6cadc;\n --purple-94: #ecedf3;\n --pink-90: #f8dad3;\n --pink-91: #f9ddd7;\n --pink-92: #f9e1dc;\n --pink-93: #fae5e0;\n --pink-94: #fbe9e5;\n --pink-95: #fcece9;\n --pink-96: #fcf0ed;\n --pink-97: #fdf4f2;\n --measure-50: #e8178a;\n --measure-70: #f174b9;\n --measure-80: #f6a2d0;\n --measure-97: #fef1f8;\n --grey-10: #1a1a1a;\n --grey-15: #262626;\n --grey-20: #333333;\n --grey-25: #404040;\n --grey-30: #4d4d4d;\n --grey-35: #595959;\n --grey-40: #666666;\n --grey-45: #737373;\n --grey-50: #808080;\n --grey-55: #8c8c8c;\n --grey-60: #999999;\n --grey-65: #a6a6a6;\n --grey-70: #b3b3b3;\n --grey-75: #bfbfbf;\n --grey-80: #cccccc;\n --gradient-1-start: #D39B9D;\n --gradient-1-end: #9071D1;\n --gradient-2-start: #F8DAD3;\n --gradient-2-end: #CC99AE;\n --gradient-3-start: #393e56;\n --gradient-3-end: #646ea0;\n}\n/**\n * @file Fonts\n *\n * This file contains all fonts used in designs.\n */\n@font-face {\n font-family: Inter;\n src: url("/assets/fonts/Inter-Regular.woff2") format("woff2");\n font-weight: normal;\n font-style: normal;\n font-display: swap;\n}\n@font-face {\n font-family: Inter;\n src: url("/assets/fonts/Inter-ExtraBold.woff2") format("woff2");\n font-weight: 800;\n font-style: normal;\n font-display: swap;\n}\n@font-face {\n font-family: Inter;\n src: url("/assets/fonts/Inter-Bold.woff2") format("woff2");\n font-weight: bold;\n font-style: normal;\n font-display: swap;\n}\n@font-face {\n font-family: Inter;\n src: url("/assets/fonts/Inter-SemiBold.woff2") format("woff2");\n font-weight: 600;\n font-style: normal;\n font-display: swap;\n}\n@font-face {\n font-family: Inter;\n src: url("/assets/fonts/Inter-Medium.woff2") format("woff2");\n font-weight: 500;\n font-style: normal;\n font-display: swap;\n}\n@font-face {\n font-family: Inter;\n src: url("/assets/fonts/Inter-Thin.woff2") format("woff2");\n font-weight: 100;\n font-style: normal;\n font-display: swap;\n}\n@font-face {\n font-family: "PT Mono";\n src: url("/assets/fonts/PT-Mono-Regular.woff2") format("woff2");\n font-weight: normal;\n font-style: normal;\n}\n@font-face {\n font-family: "PT Mono";\n src: url("/assets/fonts/PT-Mono-Bold.woff2") format("woff2");\n font-weight: bold;\n font-style: normal;\n}\n/**\n * @file Typography\n *\n * This file contains all typography classes used in designs.\n * They should be used instead of individual font attributes.\n *\n * You can use them same as the normal Tailwind classes, e.g.: class="heading-inter-26-semi-bold"\n */\n/**\n * @file Variables\n *\n * This file contains all CSS variables used in designs.\n */\n/**\n * Tailwind v4 shadow system variables\n * Web components use Tailwind v4 internally, which requires these CSS variables\n * to be initialized for box-shadow to render correctly in Tailwind v3 consumers.\n */\n*,\n::after,\n::before,\n::backdrop,\n::file-selector-button {\n --tw-border-style: solid;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-inset-shadow: 0 0 #0000;\n --tw-inset-shadow-colored: 0 0 #0000;\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-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-offset-shadow: 0 0 #0000;\n}\n.tippy-box[data-animation=fade][data-state=hidden] {\n opacity: 0;\n}\n.tippy-arrow::before {\n content: "";\n position: absolute;\n border-color: transparent;\n border-style: solid;\n}\n.tippy-box[data-placement^=top] > .tippy-arrow::before {\n border-top-color: initial;\n transform-origin: center top;\n}\n.tippy-box[data-placement^=bottom] > .tippy-arrow::before {\n border-bottom-color: initial;\n transform-origin: center bottom;\n}\n.tippy-box[data-placement^=left] > .tippy-arrow::before {\n border-left-color: initial;\n transform-origin: center left;\n}\n.tippy-box[data-placement^=right] > .tippy-arrow::before {\n border-right-color: initial;\n transform-origin: center right;\n}\n.tippy-box[data-inertia][data-state=visible] {\n transition-timing-function: cubic-bezier(0.54, 1.5, 0.38, 1.11);\n}\n.tippy-arrow {\n width: 16px;\n height: 16px;\n}\n.tippy-size-medium {\n border-radius: 4px;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 10px;\n font-weight: 600;\n font-style: normal;\n line-height: 12px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-size-medium[data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-size-medium[data-placement^=top] > .tippy-arrow::before {\n bottom: -6px;\n left: 2px;\n border-width: 6px 6px 0;\n}\n.tippy-size-medium[data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-size-medium[data-placement^=bottom] > .tippy-arrow::before {\n top: -6px;\n left: 2px;\n border-width: 0 6px 6px;\n}\n.tippy-size-medium[data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-size-medium[data-placement^=left] > .tippy-arrow::before {\n border-width: 6px 0 6px 6px;\n right: -6px;\n top: 2px;\n}\n.tippy-size-medium[data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-size-medium[data-placement^=right] > .tippy-arrow::before {\n left: -6px;\n top: 2px;\n border-width: 6px 6px 6px 0;\n}\n.tippy-size-large {\n border-radius: 8px;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 400;\n font-style: normal;\n line-height: 20px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-size-large[data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-size-large[data-placement^=top] > .tippy-arrow::before {\n bottom: -8px;\n left: 0;\n border-width: 8px 8px 0;\n}\n.tippy-size-large[data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-size-large[data-placement^=bottom] > .tippy-arrow::before {\n top: -8px;\n left: 0;\n border-width: 0 8px 8px;\n}\n.tippy-size-large[data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-size-large[data-placement^=left] > .tippy-arrow::before {\n border-width: 8px 0 8px 8px;\n right: -8px;\n}\n.tippy-size-large[data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-size-large[data-placement^=right] > .tippy-arrow::before {\n left: -8px;\n border-width: 8px 8px 8px 0;\n}\n.tippy-variant-dark {\n --tw-bg-opacity: 1;\n background-color: rgb(54 80 99 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-variant-dark[data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-dark[data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-dark[data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-dark[data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-dark > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(54 80 99 / var(--tw-bg-opacity, 1));\n}\n.tippy-variant-dark > .tippy-svg-arrow {\n fill: #365063;\n}\n.tippy-variant-light {\n --tw-bg-opacity: 1;\n background-color: rgb(245 248 250 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(36 53 66 / var(--tw-text-opacity, 1));\n}\n.tippy-variant-light[data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-light[data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-light[data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-light[data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-light > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(245 248 250 / var(--tw-bg-opacity, 1));\n}\n.tippy-variant-light > .tippy-svg-arrow {\n fill: #f5f8fa;\n}\n.tippy-variant-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(36 53 66 / var(--tw-text-opacity, 1));\n}\n.tippy-variant-white[data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-white[data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-white[data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-white[data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-white > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.tippy-variant-white > .tippy-svg-arrow {\n fill: #ffffff;\n}\n.tippy-variant-success {\n --tw-bg-opacity: 1;\n background-color: rgb(71 205 104 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-variant-success[data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-success[data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-success[data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-success[data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-success > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(71 205 104 / var(--tw-bg-opacity, 1));\n}\n.tippy-variant-success > .tippy-svg-arrow {\n fill: #47cd68;\n}\n.tippy-variant-danger {\n --tw-bg-opacity: 1;\n background-color: rgb(233 99 99 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-variant-danger[data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-danger[data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-danger[data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-danger[data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-variant-danger > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(233 99 99 / var(--tw-bg-opacity, 1));\n}\n.tippy-variant-danger > .tippy-svg-arrow {\n fill: #e96363;\n}\n.tippy-box[data-theme~=dark-medium] {\n border-radius: 4px;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 10px;\n font-weight: 600;\n font-style: normal;\n line-height: 12px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=top] > .tippy-arrow::before {\n bottom: -6px;\n left: 2px;\n border-width: 6px 6px 0;\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=bottom] > .tippy-arrow::before {\n top: -6px;\n left: 2px;\n border-width: 0 6px 6px;\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=left] > .tippy-arrow::before {\n border-width: 6px 0 6px 6px;\n right: -6px;\n top: 2px;\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=right] > .tippy-arrow::before {\n left: -6px;\n top: 2px;\n border-width: 6px 6px 6px 0;\n}\n.tippy-box[data-theme~=dark-medium] {\n --tw-bg-opacity: 1;\n background-color: rgb(54 80 99 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=dark-medium][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=dark-medium] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(54 80 99 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=dark-medium] > .tippy-svg-arrow {\n fill: #365063;\n}\n.tippy-box[data-theme~=dark-large] {\n border-radius: 8px;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 400;\n font-style: normal;\n line-height: 20px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=dark-large][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=dark-large][data-placement^=top] > .tippy-arrow::before {\n bottom: -8px;\n left: 0;\n border-width: 8px 8px 0;\n}\n.tippy-box[data-theme~=dark-large][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=dark-large][data-placement^=bottom] > .tippy-arrow::before {\n top: -8px;\n left: 0;\n border-width: 0 8px 8px;\n}\n.tippy-box[data-theme~=dark-large][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=dark-large][data-placement^=left] > .tippy-arrow::before {\n border-width: 8px 0 8px 8px;\n right: -8px;\n}\n.tippy-box[data-theme~=dark-large][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=dark-large][data-placement^=right] > .tippy-arrow::before {\n left: -8px;\n border-width: 8px 8px 8px 0;\n}\n.tippy-box[data-theme~=dark-large] {\n --tw-bg-opacity: 1;\n background-color: rgb(54 80 99 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=dark-large][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=dark-large][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=dark-large][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=dark-large][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(54 80 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=dark-large] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(54 80 99 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=dark-large] > .tippy-svg-arrow {\n fill: #365063;\n}\n.tippy-box[data-theme~=light-medium] {\n border-radius: 4px;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 10px;\n font-weight: 600;\n font-style: normal;\n line-height: 12px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=light-medium][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=light-medium][data-placement^=top] > .tippy-arrow::before {\n bottom: -6px;\n left: 2px;\n border-width: 6px 6px 0;\n}\n.tippy-box[data-theme~=light-medium][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=light-medium][data-placement^=bottom] > .tippy-arrow::before {\n top: -6px;\n left: 2px;\n border-width: 0 6px 6px;\n}\n.tippy-box[data-theme~=light-medium][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=light-medium][data-placement^=left] > .tippy-arrow::before {\n border-width: 6px 0 6px 6px;\n right: -6px;\n top: 2px;\n}\n.tippy-box[data-theme~=light-medium][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=light-medium][data-placement^=right] > .tippy-arrow::before {\n left: -6px;\n top: 2px;\n border-width: 6px 6px 6px 0;\n}\n.tippy-box[data-theme~=light-medium] {\n --tw-bg-opacity: 1;\n background-color: rgb(245 248 250 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(36 53 66 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=light-medium][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=light-medium][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=light-medium][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=light-medium][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=light-medium] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(245 248 250 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=light-medium] > .tippy-svg-arrow {\n fill: #f5f8fa;\n}\n.tippy-box[data-theme~=light-large] {\n border-radius: 8px;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 400;\n font-style: normal;\n line-height: 20px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=light-large][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=light-large][data-placement^=top] > .tippy-arrow::before {\n bottom: -8px;\n left: 0;\n border-width: 8px 8px 0;\n}\n.tippy-box[data-theme~=light-large][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=light-large][data-placement^=bottom] > .tippy-arrow::before {\n top: -8px;\n left: 0;\n border-width: 0 8px 8px;\n}\n.tippy-box[data-theme~=light-large][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=light-large][data-placement^=left] > .tippy-arrow::before {\n border-width: 8px 0 8px 8px;\n right: -8px;\n}\n.tippy-box[data-theme~=light-large][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=light-large][data-placement^=right] > .tippy-arrow::before {\n left: -8px;\n border-width: 8px 8px 8px 0;\n}\n.tippy-box[data-theme~=light-large] {\n --tw-bg-opacity: 1;\n background-color: rgb(245 248 250 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(36 53 66 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=light-large][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=light-large][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=light-large][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=light-large][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(245 248 250 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=light-large] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(245 248 250 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=light-large] > .tippy-svg-arrow {\n fill: #f5f8fa;\n}\n.tippy-box[data-theme~=white-medium] {\n border-radius: 4px;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 10px;\n font-weight: 600;\n font-style: normal;\n line-height: 12px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=white-medium][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=white-medium][data-placement^=top] > .tippy-arrow::before {\n bottom: -6px;\n left: 2px;\n border-width: 6px 6px 0;\n}\n.tippy-box[data-theme~=white-medium][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=white-medium][data-placement^=bottom] > .tippy-arrow::before {\n top: -6px;\n left: 2px;\n border-width: 0 6px 6px;\n}\n.tippy-box[data-theme~=white-medium][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=white-medium][data-placement^=left] > .tippy-arrow::before {\n border-width: 6px 0 6px 6px;\n right: -6px;\n top: 2px;\n}\n.tippy-box[data-theme~=white-medium][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=white-medium][data-placement^=right] > .tippy-arrow::before {\n left: -6px;\n top: 2px;\n border-width: 6px 6px 6px 0;\n}\n.tippy-box[data-theme~=white-medium] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(36 53 66 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=white-medium][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=white-medium][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=white-medium][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=white-medium][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=white-medium] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=white-medium] > .tippy-svg-arrow {\n fill: #ffffff;\n}\n.tippy-box[data-theme~=white-large] {\n border-radius: 8px;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 400;\n font-style: normal;\n line-height: 20px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=white-large][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=white-large][data-placement^=top] > .tippy-arrow::before {\n bottom: -8px;\n left: 0;\n border-width: 8px 8px 0;\n}\n.tippy-box[data-theme~=white-large][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=white-large][data-placement^=bottom] > .tippy-arrow::before {\n top: -8px;\n left: 0;\n border-width: 0 8px 8px;\n}\n.tippy-box[data-theme~=white-large][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=white-large][data-placement^=left] > .tippy-arrow::before {\n border-width: 8px 0 8px 8px;\n right: -8px;\n}\n.tippy-box[data-theme~=white-large][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=white-large][data-placement^=right] > .tippy-arrow::before {\n left: -8px;\n border-width: 8px 8px 8px 0;\n}\n.tippy-box[data-theme~=white-large] {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(36 53 66 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=white-large][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=white-large][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=white-large][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=white-large][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(255 255 255 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=white-large] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=white-large] > .tippy-svg-arrow {\n fill: #ffffff;\n}\n.tippy-box[data-theme~=success-medium] {\n border-radius: 4px;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 10px;\n font-weight: 600;\n font-style: normal;\n line-height: 12px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=success-medium][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=success-medium][data-placement^=top] > .tippy-arrow::before {\n bottom: -6px;\n left: 2px;\n border-width: 6px 6px 0;\n}\n.tippy-box[data-theme~=success-medium][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=success-medium][data-placement^=bottom] > .tippy-arrow::before {\n top: -6px;\n left: 2px;\n border-width: 0 6px 6px;\n}\n.tippy-box[data-theme~=success-medium][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=success-medium][data-placement^=left] > .tippy-arrow::before {\n border-width: 6px 0 6px 6px;\n right: -6px;\n top: 2px;\n}\n.tippy-box[data-theme~=success-medium][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=success-medium][data-placement^=right] > .tippy-arrow::before {\n left: -6px;\n top: 2px;\n border-width: 6px 6px 6px 0;\n}\n.tippy-box[data-theme~=success-medium] {\n --tw-bg-opacity: 1;\n background-color: rgb(71 205 104 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=success-medium][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=success-medium][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=success-medium][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=success-medium][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=success-medium] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(71 205 104 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=success-medium] > .tippy-svg-arrow {\n fill: #47cd68;\n}\n.tippy-box[data-theme~=success-large] {\n border-radius: 8px;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 400;\n font-style: normal;\n line-height: 20px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=success-large][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=success-large][data-placement^=top] > .tippy-arrow::before {\n bottom: -8px;\n left: 0;\n border-width: 8px 8px 0;\n}\n.tippy-box[data-theme~=success-large][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=success-large][data-placement^=bottom] > .tippy-arrow::before {\n top: -8px;\n left: 0;\n border-width: 0 8px 8px;\n}\n.tippy-box[data-theme~=success-large][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=success-large][data-placement^=left] > .tippy-arrow::before {\n border-width: 8px 0 8px 8px;\n right: -8px;\n}\n.tippy-box[data-theme~=success-large][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=success-large][data-placement^=right] > .tippy-arrow::before {\n left: -8px;\n border-width: 8px 8px 8px 0;\n}\n.tippy-box[data-theme~=success-large] {\n --tw-bg-opacity: 1;\n background-color: rgb(71 205 104 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=success-large][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=success-large][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=success-large][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=success-large][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(71 205 104 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=success-large] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(71 205 104 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=success-large] > .tippy-svg-arrow {\n fill: #47cd68;\n}\n.tippy-box[data-theme~=danger-medium] {\n border-radius: 4px;\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 10px;\n font-weight: 600;\n font-style: normal;\n line-height: 12px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=top] > .tippy-arrow::before {\n bottom: -6px;\n left: 2px;\n border-width: 6px 6px 0;\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=bottom] > .tippy-arrow::before {\n top: -6px;\n left: 2px;\n border-width: 0 6px 6px;\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=left] > .tippy-arrow::before {\n border-width: 6px 0 6px 6px;\n right: -6px;\n top: 2px;\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=right] > .tippy-arrow::before {\n left: -6px;\n top: 2px;\n border-width: 6px 6px 6px 0;\n}\n.tippy-box[data-theme~=danger-medium] {\n --tw-bg-opacity: 1;\n background-color: rgb(233 99 99 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=danger-medium][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=danger-medium] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(233 99 99 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=danger-medium] > .tippy-svg-arrow {\n fill: #e96363;\n}\n.tippy-box[data-theme~=danger-large] {\n border-radius: 8px;\n padding-left: 0.75rem;\n padding-right: 0.75rem;\n padding-top: 0.5rem;\n padding-bottom: 0.5rem;\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 400;\n font-style: normal;\n line-height: 20px;\n --tw-shadow: 0px 27px 12px 0px rgba(63, 93, 116, 0.00), 0px 18px 7px 0px rgba(63, 93, 116, 0.02), 0px 10px 6px 0px rgba(63, 93, 116, 0.08), 0px 4px 4px 0px rgba(63, 93, 116, 0.13), 0px 1px 2px 0px rgba(63, 93, 116, 0.15), 0px 0px 14px 0px rgba(63, 93, 116, 0.16);\n --tw-shadow-colored: 0px 27px 12px 0px var(--tw-shadow-color), 0px 18px 7px 0px var(--tw-shadow-color), 0px 10px 6px 0px var(--tw-shadow-color), 0px 4px 4px 0px var(--tw-shadow-color), 0px 1px 2px 0px var(--tw-shadow-color), 0px 0px 14px 0px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.tippy-box[data-theme~=danger-large][data-placement^=top] > .tippy-arrow {\n bottom: 0;\n}\n.tippy-box[data-theme~=danger-large][data-placement^=top] > .tippy-arrow::before {\n bottom: -8px;\n left: 0;\n border-width: 8px 8px 0;\n}\n.tippy-box[data-theme~=danger-large][data-placement^=bottom] > .tippy-arrow {\n top: 0;\n}\n.tippy-box[data-theme~=danger-large][data-placement^=bottom] > .tippy-arrow::before {\n top: -8px;\n left: 0;\n border-width: 0 8px 8px;\n}\n.tippy-box[data-theme~=danger-large][data-placement^=left] > .tippy-arrow {\n right: 0;\n}\n.tippy-box[data-theme~=danger-large][data-placement^=left] > .tippy-arrow::before {\n border-width: 8px 0 8px 8px;\n right: -8px;\n}\n.tippy-box[data-theme~=danger-large][data-placement^=right] > .tippy-arrow {\n left: 0;\n}\n.tippy-box[data-theme~=danger-large][data-placement^=right] > .tippy-arrow::before {\n left: -8px;\n border-width: 8px 8px 8px 0;\n}\n.tippy-box[data-theme~=danger-large] {\n --tw-bg-opacity: 1;\n background-color: rgb(233 99 99 / var(--tw-bg-opacity, 1));\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.tippy-box[data-theme~=danger-large][data-placement^=top] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-top-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=danger-large][data-placement^=bottom] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-bottom-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=danger-large][data-placement^=left] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-left-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=danger-large][data-placement^=right] .tippy-arrow::before {\n --tw-border-opacity: 1;\n border-right-color: rgb(233 99 99 / var(--tw-border-opacity, 1));\n}\n.tippy-box[data-theme~=danger-large] > .tippy-backdrop {\n --tw-bg-opacity: 1;\n background-color: rgb(233 99 99 / var(--tw-bg-opacity, 1));\n}\n.tippy-box[data-theme~=danger-large] > .tippy-svg-arrow {\n fill: #e96363;\n}\n*, ::before, ::after {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\n::backdrop {\n --tw-border-spacing-x: 0;\n --tw-border-spacing-y: 0;\n --tw-translate-x: 0;\n --tw-translate-y: 0;\n --tw-rotate: 0;\n --tw-skew-x: 0;\n --tw-skew-y: 0;\n --tw-scale-x: 1;\n --tw-scale-y: 1;\n --tw-pan-x: ;\n --tw-pan-y: ;\n --tw-pinch-zoom: ;\n --tw-scroll-snap-strictness: proximity;\n --tw-gradient-from-position: ;\n --tw-gradient-via-position: ;\n --tw-gradient-to-position: ;\n --tw-ordinal: ;\n --tw-slashed-zero: ;\n --tw-numeric-figure: ;\n --tw-numeric-spacing: ;\n --tw-numeric-fraction: ;\n --tw-ring-inset: ;\n --tw-ring-offset-width: 0px;\n --tw-ring-offset-color: #fff;\n --tw-ring-color: rgb(59 130 246 / 0.5);\n --tw-ring-offset-shadow: 0 0 #0000;\n --tw-ring-shadow: 0 0 #0000;\n --tw-shadow: 0 0 #0000;\n --tw-shadow-colored: 0 0 #0000;\n --tw-blur: ;\n --tw-brightness: ;\n --tw-contrast: ;\n --tw-grayscale: ;\n --tw-hue-rotate: ;\n --tw-invert: ;\n --tw-saturate: ;\n --tw-sepia: ;\n --tw-drop-shadow: ;\n --tw-backdrop-blur: ;\n --tw-backdrop-brightness: ;\n --tw-backdrop-contrast: ;\n --tw-backdrop-grayscale: ;\n --tw-backdrop-hue-rotate: ;\n --tw-backdrop-invert: ;\n --tw-backdrop-opacity: ;\n --tw-backdrop-saturate: ;\n --tw-backdrop-sepia: ;\n --tw-contain-size: ;\n --tw-contain-layout: ;\n --tw-contain-paint: ;\n --tw-contain-style: ;\n}\n/*! tailwindcss v3.4.19 | MIT License | https://tailwindcss.com\n */\n/*\n1. Prevent padding and border from affecting element width. (https://github.com/mozdevs/cssremedy/issues/4)\n2. Allow adding a border to an element by just adding a border-width. (https://github.com/tailwindcss/tailwindcss/pull/116)\n*/\n*,\n::before,\n::after {\n box-sizing: border-box; /* 1 */\n border-width: 0; /* 2 */\n border-style: solid; /* 2 */\n border-color: #e5e7eb; /* 2 */\n}\n::before,\n::after {\n --tw-content: \'\';\n}\n/*\n1. Use a consistent sensible line-height in all browsers.\n2. Prevent adjustments of font size after orientation changes in iOS.\n3. Use a more readable tab size.\n4. Use the user\'s configured `sans` font-family by default.\n5. Use the user\'s configured `sans` font-feature-settings by default.\n6. Use the user\'s configured `sans` font-variation-settings by default.\n7. Disable tap highlights on iOS\n*/\nhtml,\n:host {\n line-height: 1.5; /* 1 */\n -webkit-text-size-adjust: 100%; /* 2 */\n -moz-tab-size: 4; /* 3 */\n -o-tab-size: 4;\n tab-size: 4; /* 3 */\n font-family: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; /* 4 */\n font-feature-settings: normal; /* 5 */\n font-variation-settings: normal; /* 6 */\n -webkit-tap-highlight-color: transparent; /* 7 */\n}\n/*\n1. Remove the margin in all browsers.\n2. Inherit line-height from `html` so users can set them as a class directly on the `html` element.\n*/\nbody {\n margin: 0; /* 1 */\n line-height: inherit; /* 2 */\n}\n/*\n1. Add the correct height in Firefox.\n2. Correct the inheritance of border color in Firefox. (https://bugzilla.mozilla.org/show_bug.cgi?id=190655)\n3. Ensure horizontal rules are visible by default.\n*/\nhr {\n height: 0; /* 1 */\n color: inherit; /* 2 */\n border-top-width: 1px; /* 3 */\n}\n/*\nAdd the correct text decoration in Chrome, Edge, and Safari.\n*/\nabbr:where([title]) {\n -webkit-text-decoration: underline dotted;\n text-decoration: underline dotted;\n}\n/*\nRemove the default font size and weight for headings.\n*/\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n font-size: inherit;\n font-weight: inherit;\n}\n/*\nReset links to optimize for opt-in styling instead of opt-out.\n*/\na {\n color: inherit;\n text-decoration: inherit;\n}\n/*\nAdd the correct font weight in Edge and Safari.\n*/\nb,\nstrong {\n font-weight: bolder;\n}\n/*\n1. Use the user\'s configured `mono` font-family by default.\n2. Use the user\'s configured `mono` font-feature-settings by default.\n3. Use the user\'s configured `mono` font-variation-settings by default.\n4. Correct the odd `em` font sizing in all browsers.\n*/\ncode,\nkbd,\nsamp,\npre {\n font-family: "PT Mono", sans-serif; /* 1 */\n font-feature-settings: normal; /* 2 */\n font-variation-settings: normal; /* 3 */\n font-size: 1em; /* 4 */\n}\n/*\nAdd the correct font size in all browsers.\n*/\nsmall {\n font-size: 80%;\n}\n/*\nPrevent `sub` and `sup` elements from affecting the line height in all browsers.\n*/\nsub,\nsup {\n font-size: 75%;\n line-height: 0;\n position: relative;\n vertical-align: baseline;\n}\nsub {\n bottom: -0.25em;\n}\nsup {\n top: -0.5em;\n}\n/*\n1. Remove text indentation from table contents in Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=999088, https://bugs.webkit.org/show_bug.cgi?id=201297)\n2. Correct table border color inheritance in all Chrome and Safari. (https://bugs.chromium.org/p/chromium/issues/detail?id=935729, https://bugs.webkit.org/show_bug.cgi?id=195016)\n3. Remove gaps between table borders by default.\n*/\ntable {\n text-indent: 0; /* 1 */\n border-color: inherit; /* 2 */\n border-collapse: collapse; /* 3 */\n}\n/*\n1. Change the font styles in all browsers.\n2. Remove the margin in Firefox and Safari.\n3. Remove default padding in all browsers.\n*/\nbutton,\ninput,\noptgroup,\nselect,\ntextarea {\n font-family: inherit; /* 1 */\n font-feature-settings: inherit; /* 1 */\n font-variation-settings: inherit; /* 1 */\n font-size: 100%; /* 1 */\n font-weight: inherit; /* 1 */\n line-height: inherit; /* 1 */\n letter-spacing: inherit; /* 1 */\n color: inherit; /* 1 */\n margin: 0; /* 2 */\n padding: 0; /* 3 */\n}\n/*\nRemove the inheritance of text transform in Edge and Firefox.\n*/\nbutton,\nselect {\n text-transform: none;\n}\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Remove default button styles.\n*/\nbutton,\ninput:where([type=\'button\']),\ninput:where([type=\'reset\']),\ninput:where([type=\'submit\']) {\n -webkit-appearance: button; /* 1 */\n background-color: transparent; /* 2 */\n background-image: none; /* 2 */\n}\n/*\nUse the modern Firefox focus style for all focusable elements.\n*/\n:-moz-focusring {\n outline: auto;\n}\n/*\nRemove the additional `:invalid` styles in Firefox. (https://github.com/mozilla/gecko-dev/blob/2f9eacd9d3d995c937b4251a5557d95d494c9be1/layout/style/res/forms.css#L728-L737)\n*/\n:-moz-ui-invalid {\n box-shadow: none;\n}\n/*\nAdd the correct vertical alignment in Chrome and Firefox.\n*/\nprogress {\n vertical-align: baseline;\n}\n/*\nCorrect the cursor style of increment and decrement buttons in Safari.\n*/\n::-webkit-inner-spin-button,\n::-webkit-outer-spin-button {\n height: auto;\n}\n/*\n1. Correct the odd appearance in Chrome and Safari.\n2. Correct the outline style in Safari.\n*/\n[type=\'search\'] {\n -webkit-appearance: textfield; /* 1 */\n outline-offset: -2px; /* 2 */\n}\n/*\nRemove the inner padding in Chrome and Safari on macOS.\n*/\n::-webkit-search-decoration {\n -webkit-appearance: none;\n}\n/*\n1. Correct the inability to style clickable types in iOS and Safari.\n2. Change font properties to `inherit` in Safari.\n*/\n::-webkit-file-upload-button {\n -webkit-appearance: button; /* 1 */\n font: inherit; /* 2 */\n}\n/*\nAdd the correct display in Chrome and Safari.\n*/\nsummary {\n display: list-item;\n}\n/*\nRemoves the default spacing and border for appropriate elements.\n*/\nblockquote,\ndl,\ndd,\nh1,\nh2,\nh3,\nh4,\nh5,\nh6,\nhr,\nfigure,\np,\npre {\n margin: 0;\n}\nfieldset {\n margin: 0;\n padding: 0;\n}\nlegend {\n padding: 0;\n}\nol,\nul,\nmenu {\n list-style: none;\n margin: 0;\n padding: 0;\n}\n/*\nReset default styling for dialogs.\n*/\ndialog {\n padding: 0;\n}\n/*\nPrevent resizing textareas horizontally by default.\n*/\ntextarea {\n resize: vertical;\n}\n/*\n1. Reset the default placeholder opacity in Firefox. (https://github.com/tailwindlabs/tailwindcss/issues/3300)\n2. Set the default placeholder color to the user\'s configured gray 400 color.\n*/\ninput::-moz-placeholder, textarea::-moz-placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\ninput::placeholder,\ntextarea::placeholder {\n opacity: 1; /* 1 */\n color: #9ca3af; /* 2 */\n}\n/*\nSet the default cursor for buttons.\n*/\nbutton,\n[role="button"] {\n cursor: pointer;\n}\n/*\nMake sure disabled buttons don\'t get the pointer cursor.\n*/\n:disabled {\n cursor: default;\n}\n/*\n1. Make replaced elements `display: block` by default. (https://github.com/mozdevs/cssremedy/issues/14)\n2. Add `vertical-align: middle` to align replaced elements more sensibly by default. (https://github.com/jensimmons/cssremedy/issues/14#issuecomment-634934210)\n This can trigger a poorly considered lint error in some tools but is included by design.\n*/\nimg,\nsvg,\nvideo,\ncanvas,\naudio,\niframe,\nembed,\nobject {\n display: block; /* 1 */\n vertical-align: middle; /* 2 */\n}\n/*\nConstrain images and videos to the parent width and preserve their intrinsic aspect ratio. (https://github.com/mozdevs/cssremedy/issues/14)\n*/\nimg,\nvideo {\n max-width: 100%;\n height: auto;\n}\n/* Make elements with the HTML hidden attribute stay hidden by default */\n[hidden]:where(:not([hidden="until-found"])) {\n display: none;\n}\n.heading-inter-21-semi-bold {\n font-family: Inter, sans-serif;\n font-size: 21px;\n font-weight: 600;\n font-style: normal;\n line-height: 26px;\n}\n.heading-inter-17-semi-bold {\n font-family: Inter, sans-serif;\n font-size: 17px;\n font-weight: 600;\n font-style: normal;\n line-height: 22px;\n}\n.heading-inter-14-bold {\n font-family: Inter, sans-serif;\n font-size: 14px;\n font-weight: 700;\n font-style: normal;\n line-height: 17px;\n}\n.paragraph-inter-20-regular {\n font-family: Inter, sans-serif;\n font-size: 20px;\n font-weight: 400;\n font-style: normal;\n line-height: 32px;\n}\n.paragraph-inter-16-regular {\n font-family: Inter, sans-serif;\n font-size: 16px;\n font-weight: 400;\n font-style: normal;\n line-height: 24px;\n}\n.paragraph-inter-14-regular {\n font-family: Inter, sans-serif;\n font-size: 14px;\n font-weight: 400;\n font-style: normal;\n line-height: 22px;\n}\n.paragraph-inter-14-semi-bold {\n font-family: Inter, sans-serif;\n font-size: 14px;\n font-weight: 600;\n font-style: normal;\n line-height: 22px;\n}\n.paragraph-inter-12-regular {\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 400;\n font-style: normal;\n line-height: 20px;\n}\n.paragraph-inter-12-medium {\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 500;\n font-style: normal;\n line-height: 20px;\n}\n.paragraph-inter-12-semi-bold {\n font-family: Inter, sans-serif;\n font-size: 12px;\n font-weight: 600;\n font-style: normal;\n line-height: 20px;\n}\n.paragraph-ptmono-24-bold {\n font-family: "PT Mono", sans-serif;\n font-size: 24px;\n font-weight: 700;\n font-style: normal;\n line-height: 26px;\n}\n.paragraph-ptmono-16-bold {\n font-family: "PT Mono", sans-serif;\n font-size: 16px;\n font-weight: 700;\n font-style: normal;\n line-height: 22px;\n}\n.paragraph-ptmono-14-bold {\n font-family: "PT Mono", sans-serif;\n font-size: 14px;\n font-weight: 700;\n font-style: normal;\n line-height: 20px;\n}\n.paragraph-ptmono-12-bold {\n font-family: "PT Mono", sans-serif;\n font-size: 12px;\n font-weight: 700;\n font-style: normal;\n line-height: 14px;\n}\n.container {\n width: 100%;\n}\n@media (min-width: 640px) {\n .container {\n max-width: 640px;\n }\n}\n@media (min-width: 768px) {\n .container {\n max-width: 768px;\n }\n}\n@media (min-width: 1024px) {\n .container {\n max-width: 1024px;\n }\n}\n@media (min-width: 1280px) {\n .container {\n max-width: 1280px;\n }\n}\n@media (min-width: 1536px) {\n .container {\n max-width: 1536px;\n }\n}\n.prose {\n color: var(--tw-prose-body);\n max-width: 65ch;\n}\n.prose :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.25em;\n margin-bottom: 1.25em;\n}\n.prose :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-lead);\n font-size: 1.25em;\n line-height: 1.6;\n margin-top: 1.2em;\n margin-bottom: 1.2em;\n}\n.prose :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-links);\n text-decoration: underline;\n font-weight: 500;\n}\n.prose :where(strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-bold);\n font-weight: 600;\n}\n.prose :where(a strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n}\n.prose :where(blockquote strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n}\n.prose :where(thead th strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n}\n.prose :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: decimal;\n margin-top: 1.25em;\n margin-bottom: 1.25em;\n padding-inline-start: 1.625em;\n}\n.prose :where(ol[type="A"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: upper-alpha;\n}\n.prose :where(ol[type="a"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: lower-alpha;\n}\n.prose :where(ol[type="A" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: upper-alpha;\n}\n.prose :where(ol[type="a" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: lower-alpha;\n}\n.prose :where(ol[type="I"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: upper-roman;\n}\n.prose :where(ol[type="i"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: lower-roman;\n}\n.prose :where(ol[type="I" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: upper-roman;\n}\n.prose :where(ol[type="i" s]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: lower-roman;\n}\n.prose :where(ol[type="1"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: decimal;\n}\n.prose :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n list-style-type: disc;\n margin-top: 1.25em;\n margin-bottom: 1.25em;\n padding-inline-start: 1.625em;\n}\n.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {\n font-weight: 400;\n color: var(--tw-prose-counters);\n}\n.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *))::marker {\n color: var(--tw-prose-bullets);\n}\n.prose :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-headings);\n font-weight: 600;\n margin-top: 1.25em;\n}\n.prose :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n border-color: var(--tw-prose-hr);\n border-top-width: 1px;\n margin-top: 3em;\n margin-bottom: 3em;\n}\n.prose :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-weight: 500;\n font-style: italic;\n color: var(--tw-prose-quotes);\n border-inline-start-width: 0.25rem;\n border-inline-start-color: var(--tw-prose-quote-borders);\n quotes: "\\201C""\\201D""\\2018""\\2019";\n margin-top: 1.6em;\n margin-bottom: 1.6em;\n padding-inline-start: 1em;\n}\n.prose :where(blockquote p:first-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {\n content: open-quote;\n}\n.prose :where(blockquote p:last-of-type):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {\n content: close-quote;\n}\n.prose :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-headings);\n font-weight: 800;\n font-size: 2.25em;\n margin-top: 0;\n margin-bottom: 0.8888889em;\n line-height: 1.1111111;\n}\n.prose :where(h1 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-weight: 900;\n color: inherit;\n}\n.prose :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-headings);\n font-weight: 700;\n font-size: 1.5em;\n margin-top: 2em;\n margin-bottom: 1em;\n line-height: 1.3333333;\n}\n.prose :where(h2 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-weight: 800;\n color: inherit;\n}\n.prose :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-headings);\n font-weight: 600;\n font-size: 1.25em;\n margin-top: 1.6em;\n margin-bottom: 0.6em;\n line-height: 1.6;\n}\n.prose :where(h3 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-weight: 700;\n color: inherit;\n}\n.prose :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-headings);\n font-weight: 600;\n margin-top: 1.5em;\n margin-bottom: 0.5em;\n line-height: 1.5;\n}\n.prose :where(h4 strong):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-weight: 700;\n color: inherit;\n}\n.prose :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n display: block;\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-weight: 500;\n font-family: inherit;\n color: var(--tw-prose-kbd);\n box-shadow: 0 0 0 1px var(--tw-prose-kbd-shadows), 0 3px 0 var(--tw-prose-kbd-shadows);\n font-size: 0.875em;\n border-radius: 0.3125rem;\n padding-top: 0.1875em;\n padding-inline-end: 0.375em;\n padding-bottom: 0.1875em;\n padding-inline-start: 0.375em;\n}\n.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-code);\n font-weight: 600;\n font-size: 0.875em;\n}\n.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {\n content: "`";\n}\n.prose :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {\n content: "`";\n}\n.prose :where(a code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n}\n.prose :where(h1 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n}\n.prose :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n font-size: 0.875em;\n}\n.prose :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n font-size: 0.9em;\n}\n.prose :where(h4 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n}\n.prose :where(blockquote code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n}\n.prose :where(thead th code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: inherit;\n}\n.prose :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-pre-code);\n background-color: var(--tw-prose-pre-bg);\n overflow-x: auto;\n font-weight: 400;\n font-size: 0.875em;\n line-height: 1.7142857;\n margin-top: 1.7142857em;\n margin-bottom: 1.7142857em;\n border-radius: 0.375rem;\n padding-top: 0.8571429em;\n padding-inline-end: 1.1428571em;\n padding-bottom: 0.8571429em;\n padding-inline-start: 1.1428571em;\n}\n.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n background-color: transparent;\n border-width: 0;\n border-radius: 0;\n padding: 0;\n font-weight: inherit;\n color: inherit;\n font-size: inherit;\n font-family: inherit;\n line-height: inherit;\n}\n.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::before {\n content: none;\n}\n.prose :where(pre code):not(:where([class~="not-prose"],[class~="not-prose"] *))::after {\n content: none;\n}\n.prose :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n width: 100%;\n table-layout: auto;\n margin-top: 2em;\n margin-bottom: 2em;\n font-size: 0.875em;\n line-height: 1.7142857;\n}\n.prose :where(thead):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n border-bottom-width: 1px;\n border-bottom-color: var(--tw-prose-th-borders);\n}\n.prose :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-headings);\n font-weight: 600;\n vertical-align: bottom;\n padding-inline-end: 0.5714286em;\n padding-bottom: 0.5714286em;\n padding-inline-start: 0.5714286em;\n}\n.prose :where(tbody tr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n border-bottom-width: 1px;\n border-bottom-color: var(--tw-prose-td-borders);\n}\n.prose :where(tbody tr:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n border-bottom-width: 0;\n}\n.prose :where(tbody td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n vertical-align: baseline;\n}\n.prose :where(tfoot):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n border-top-width: 1px;\n border-top-color: var(--tw-prose-th-borders);\n}\n.prose :where(tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n vertical-align: top;\n}\n.prose :where(th, td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n text-align: start;\n}\n.prose :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-captions);\n font-size: 0.875em;\n line-height: 1.4285714;\n margin-top: 0.8571429em;\n}\n.prose {\n --tw-prose-body: oklch(37.3% 0.034 259.733);\n --tw-prose-headings: oklch(21% 0.034 264.665);\n --tw-prose-lead: oklch(44.6% 0.03 256.802);\n --tw-prose-links: oklch(21% 0.034 264.665);\n --tw-prose-bold: oklch(21% 0.034 264.665);\n --tw-prose-counters: oklch(55.1% 0.027 264.364);\n --tw-prose-bullets: oklch(87.2% 0.01 258.338);\n --tw-prose-hr: oklch(92.8% 0.006 264.531);\n --tw-prose-quotes: oklch(21% 0.034 264.665);\n --tw-prose-quote-borders: oklch(92.8% 0.006 264.531);\n --tw-prose-captions: oklch(55.1% 0.027 264.364);\n --tw-prose-kbd: oklch(21% 0.034 264.665);\n --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent);\n --tw-prose-code: oklch(21% 0.034 264.665);\n --tw-prose-pre-code: oklch(92.8% 0.006 264.531);\n --tw-prose-pre-bg: oklch(27.8% 0.033 256.848);\n --tw-prose-th-borders: oklch(87.2% 0.01 258.338);\n --tw-prose-td-borders: oklch(92.8% 0.006 264.531);\n --tw-prose-invert-body: oklch(87.2% 0.01 258.338);\n --tw-prose-invert-headings: #fff;\n --tw-prose-invert-lead: oklch(70.7% 0.022 261.325);\n --tw-prose-invert-links: #fff;\n --tw-prose-invert-bold: #fff;\n --tw-prose-invert-counters: oklch(70.7% 0.022 261.325);\n --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802);\n --tw-prose-invert-hr: oklch(37.3% 0.034 259.733);\n --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542);\n --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733);\n --tw-prose-invert-captions: oklch(70.7% 0.022 261.325);\n --tw-prose-invert-kbd: #fff;\n --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);\n --tw-prose-invert-code: #fff;\n --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338);\n --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802);\n --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733);\n font-size: 1rem;\n line-height: 1.75;\n}\n.prose :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n}\n.prose :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.375em;\n}\n.prose :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.375em;\n}\n.prose :where(.prose > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.75em;\n margin-bottom: 0.75em;\n}\n.prose :where(.prose > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.25em;\n}\n.prose :where(.prose > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.25em;\n}\n.prose :where(.prose > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.25em;\n}\n.prose :where(.prose > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.25em;\n}\n.prose :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.75em;\n margin-bottom: 0.75em;\n}\n.prose :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.25em;\n margin-bottom: 1.25em;\n}\n.prose :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n padding-inline-start: 1.625em;\n}\n.prose :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-top: 0.5714286em;\n padding-inline-end: 0.5714286em;\n padding-bottom: 0.5714286em;\n padding-inline-start: 0.5714286em;\n}\n.prose :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose :where(.prose > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose :where(.prose > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 0;\n}\n.prose-sm {\n font-size: 0.875rem;\n line-height: 1.6;\n}\n.prose-sm :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n line-height: 1.5;\n}\n.prose-sm :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.2857143em;\n line-height: 1.5555556;\n margin-top: 0.8888889em;\n margin-bottom: 0.8888889em;\n}\n.prose-sm :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.1111111em;\n padding-left: 1em;\n border-left-width: 0.25rem;\n font-style: italic;\n color: inherit;\n}\n.prose-sm :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 2.1428571em;\n margin-top: 0.75em;\n margin-bottom: 0.5em;\n line-height: 1.2;\n}\n.prose-sm :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.4285714em;\n margin-top: 0.65em;\n margin-bottom: 0.45em;\n line-height: 1.25;\n}\n.prose-sm :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.2857143em;\n margin-top: 0.6em;\n margin-bottom: 0.4em;\n line-height: 1.3;\n}\n.prose-sm :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.35em;\n line-height: 1.35;\n}\n.prose-sm :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7142857em;\n margin-bottom: 1.7142857em;\n}\n.prose-sm :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7142857em;\n margin-bottom: 1.7142857em;\n}\n.prose-sm :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-sm :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7142857em;\n margin-bottom: 1.7142857em;\n}\n.prose-sm :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8571429em;\n border-radius: 0.3125rem;\n padding-top: 0.1428571em;\n padding-inline-end: 0.3571429em;\n padding-bottom: 0.1428571em;\n padding-inline-start: 0.3571429em;\n}\n.prose-sm :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8571429em;\n}\n.prose-sm :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.9em;\n}\n.prose-sm :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8888889em;\n}\n.prose-sm :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8571429em;\n line-height: 1.45;\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n border-radius: 0.25rem;\n padding-top: 0.6666667em;\n padding-inline-end: 1em;\n padding-bottom: 0.6666667em;\n padding-inline-start: 1em;\n box-sizing: border-box;\n max-width: 100%;\n overflow-x: auto;\n white-space: pre-wrap;\n overflow-wrap: break-word;\n}\n.prose-sm :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.5714286em;\n padding-left: 1.25em;\n}\n.prose-sm :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.5714286em;\n padding-left: 1.25em;\n}\n.prose-sm :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.25em;\n margin-bottom: 0.25em;\n}\n.prose-sm :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.4285714em;\n}\n.prose-sm :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.4285714em;\n}\n.prose-sm :where(.prose-sm > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5714286em;\n margin-bottom: 0.5714286em;\n}\n.prose-sm :where(.prose-sm > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.1428571em;\n}\n.prose-sm :where(.prose-sm > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.1428571em;\n}\n.prose-sm :where(.prose-sm > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.1428571em;\n}\n.prose-sm :where(.prose-sm > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.1428571em;\n}\n.prose-sm :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.25em;\n margin-bottom: 0.25em;\n}\n.prose-sm :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.1428571em;\n margin-bottom: 1.1428571em;\n}\n.prose-sm :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.1428571em;\n}\n.prose-sm :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.2857143em;\n padding-inline-start: 1.5714286em;\n}\n.prose-sm :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-sm :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-sm :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-sm :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-sm :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-sm :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8571429em;\n line-height: 1.5;\n}\n.prose-sm :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 1em;\n padding-bottom: 0.6666667em;\n padding-inline-start: 1em;\n}\n.prose-sm :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-sm :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-sm :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-top: 0.6666667em;\n padding-inline-end: 1em;\n padding-bottom: 0.6666667em;\n padding-inline-start: 1em;\n}\n.prose-sm :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-sm :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-sm :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7142857em;\n margin-bottom: 1.7142857em;\n}\n.prose-sm :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-sm :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8571429em;\n line-height: 1.3333333;\n margin-top: 0.6666667em;\n}\n.prose-sm :where(.prose-sm > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-sm :where(.prose-sm > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 0;\n}\n.prose-sm {\n max-width: none;\n}\n.prose-sm :where(h5):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.45em;\n margin-bottom: 0.3em;\n line-height: 1.4;\n}\n.prose-sm :where(h6):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.4em;\n margin-bottom: 0.25em;\n line-height: 1.45;\n}\n.prose-sm :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-links);\n text-decoration: underline;\n font-weight: 500;\n}\n.prose-sm :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)):hover {\n color: var(--tw-prose-links-hover, var(--tw-prose-links));\n text-decoration: none;\n}\n.prose-base {\n font-size: 1rem;\n line-height: 1.6;\n}\n.prose-base :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n line-height: 1.5;\n}\n.prose-base :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.25em;\n line-height: 1.6;\n margin-top: 1.2em;\n margin-bottom: 1.2em;\n}\n.prose-base :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1em;\n padding-left: 1em;\n border-left-width: 0.25rem;\n font-style: italic;\n color: inherit;\n}\n.prose-base :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 2.25em;\n margin-top: 0.75em;\n margin-bottom: 0.5em;\n line-height: 1.2;\n}\n.prose-base :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.5em;\n margin-top: 0.65em;\n margin-bottom: 0.45em;\n line-height: 1.25;\n}\n.prose-base :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.25em;\n margin-top: 0.6em;\n margin-bottom: 0.4em;\n line-height: 1.3;\n}\n.prose-base :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.35em;\n line-height: 1.35;\n}\n.prose-base :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-base :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-base :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-base :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-base :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.875em;\n border-radius: 0.3125rem;\n padding-top: 0.1875em;\n padding-inline-end: 0.375em;\n padding-bottom: 0.1875em;\n padding-inline-start: 0.375em;\n}\n.prose-base :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.875em;\n}\n.prose-base :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.875em;\n}\n.prose-base :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.9em;\n}\n.prose-base :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.875em;\n line-height: 1.45;\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n border-radius: 0.375rem;\n padding-top: 0.8571429em;\n padding-inline-end: 1.1428571em;\n padding-bottom: 0.8571429em;\n padding-inline-start: 1.1428571em;\n box-sizing: border-box;\n max-width: 100%;\n overflow-x: auto;\n white-space: pre-wrap;\n overflow-wrap: break-word;\n}\n.prose-base :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.625em;\n padding-left: 1.25em;\n}\n.prose-base :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.625em;\n padding-left: 1.25em;\n}\n.prose-base :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.25em;\n margin-bottom: 0.25em;\n}\n.prose-base :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.375em;\n}\n.prose-base :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.375em;\n}\n.prose-base :where(.prose-base > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.75em;\n margin-bottom: 0.75em;\n}\n.prose-base :where(.prose-base > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.25em;\n}\n.prose-base :where(.prose-base > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.25em;\n}\n.prose-base :where(.prose-base > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.25em;\n}\n.prose-base :where(.prose-base > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.25em;\n}\n.prose-base :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.25em;\n margin-bottom: 0.25em;\n}\n.prose-base :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.25em;\n margin-bottom: 1.25em;\n}\n.prose-base :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.25em;\n}\n.prose-base :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n padding-inline-start: 1.625em;\n}\n.prose-base :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-base :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-base :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-base :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-base :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-base :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.875em;\n line-height: 1.7142857;\n}\n.prose-base :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0.5714286em;\n padding-bottom: 0.5714286em;\n padding-inline-start: 0.5714286em;\n}\n.prose-base :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-base :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-base :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-top: 0.5714286em;\n padding-inline-end: 0.5714286em;\n padding-bottom: 0.5714286em;\n padding-inline-start: 0.5714286em;\n}\n.prose-base :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-base :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-base :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-base :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-base :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.875em;\n line-height: 1.4285714;\n margin-top: 0.8571429em;\n}\n.prose-base :where(.prose-base > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-base :where(.prose-base > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 0;\n}\n.prose-base {\n max-width: none;\n}\n.prose-base :where(h5):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.45em;\n margin-bottom: 0.3em;\n line-height: 1.4;\n}\n.prose-base :where(h6):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.4em;\n margin-bottom: 0.25em;\n line-height: 1.45;\n}\n.prose-base :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-links);\n text-decoration: underline;\n font-weight: 500;\n}\n.prose-base :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)):hover {\n color: var(--tw-prose-links-hover, var(--tw-prose-links));\n text-decoration: none;\n}\n.prose-lg {\n font-size: 1.125rem;\n line-height: 1.6;\n}\n.prose-lg :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n line-height: 1.5;\n}\n.prose-lg :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.2222222em;\n line-height: 1.4545455;\n margin-top: 1.0909091em;\n margin-bottom: 1.0909091em;\n}\n.prose-lg :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1em;\n padding-left: 1em;\n border-left-width: 0.25rem;\n font-style: italic;\n color: inherit;\n}\n.prose-lg :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 2.6666667em;\n margin-top: 0.75em;\n margin-bottom: 0.5em;\n line-height: 1.2;\n}\n.prose-lg :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.6666667em;\n margin-top: 0.65em;\n margin-bottom: 0.45em;\n line-height: 1.25;\n}\n.prose-lg :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.3333333em;\n margin-top: 0.6em;\n margin-bottom: 0.4em;\n line-height: 1.3;\n}\n.prose-lg :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.35em;\n line-height: 1.35;\n}\n.prose-lg :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7777778em;\n margin-bottom: 1.7777778em;\n}\n.prose-lg :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7777778em;\n margin-bottom: 1.7777778em;\n}\n.prose-lg :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-lg :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7777778em;\n margin-bottom: 1.7777778em;\n}\n.prose-lg :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8888889em;\n border-radius: 0.3125rem;\n padding-top: 0.2222222em;\n padding-inline-end: 0.4444444em;\n padding-bottom: 0.2222222em;\n padding-inline-start: 0.4444444em;\n}\n.prose-lg :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8888889em;\n}\n.prose-lg :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8666667em;\n}\n.prose-lg :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.875em;\n}\n.prose-lg :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8888889em;\n line-height: 1.45;\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n border-radius: 0.375rem;\n padding-top: 1em;\n padding-inline-end: 1.5em;\n padding-bottom: 1em;\n padding-inline-start: 1.5em;\n box-sizing: border-box;\n max-width: 100%;\n overflow-x: auto;\n white-space: pre-wrap;\n overflow-wrap: break-word;\n}\n.prose-lg :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.5555556em;\n padding-left: 1.25em;\n}\n.prose-lg :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.5555556em;\n padding-left: 1.25em;\n}\n.prose-lg :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.25em;\n margin-bottom: 0.25em;\n}\n.prose-lg :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.4444444em;\n}\n.prose-lg :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.4444444em;\n}\n.prose-lg :where(.prose-lg > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.8888889em;\n margin-bottom: 0.8888889em;\n}\n.prose-lg :where(.prose-lg > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n}\n.prose-lg :where(.prose-lg > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.3333333em;\n}\n.prose-lg :where(.prose-lg > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n}\n.prose-lg :where(.prose-lg > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.3333333em;\n}\n.prose-lg :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.25em;\n margin-bottom: 0.25em;\n}\n.prose-lg :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n margin-bottom: 1.3333333em;\n}\n.prose-lg :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n}\n.prose-lg :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.6666667em;\n padding-inline-start: 1.5555556em;\n}\n.prose-lg :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-lg :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-lg :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-lg :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-lg :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-lg :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8888889em;\n line-height: 1.5;\n}\n.prose-lg :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0.75em;\n padding-bottom: 0.75em;\n padding-inline-start: 0.75em;\n}\n.prose-lg :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-lg :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-lg :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-top: 0.75em;\n padding-inline-end: 0.75em;\n padding-bottom: 0.75em;\n padding-inline-start: 0.75em;\n}\n.prose-lg :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-lg :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-lg :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7777778em;\n margin-bottom: 1.7777778em;\n}\n.prose-lg :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-lg :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8888889em;\n line-height: 1.5;\n margin-top: 1em;\n}\n.prose-lg :where(.prose-lg > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-lg :where(.prose-lg > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 0;\n}\n.prose-lg {\n max-width: none;\n}\n.prose-lg :where(h5):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.45em;\n margin-bottom: 0.3em;\n line-height: 1.4;\n}\n.prose-lg :where(h6):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.4em;\n margin-bottom: 0.25em;\n line-height: 1.45;\n}\n.prose-lg :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-links);\n text-decoration: underline;\n font-weight: 500;\n}\n.prose-lg :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)):hover {\n color: var(--tw-prose-links-hover, var(--tw-prose-links));\n text-decoration: none;\n}\n.prose-xl {\n font-size: 1.25rem;\n line-height: 1.6;\n}\n.prose-xl :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n line-height: 1.5;\n}\n.prose-xl :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.2em;\n line-height: 1.5;\n margin-top: 1em;\n margin-bottom: 1em;\n}\n.prose-xl :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.0666667em;\n padding-left: 1em;\n border-left-width: 0.25rem;\n font-style: italic;\n color: inherit;\n}\n.prose-xl :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 2.8em;\n margin-top: 0.75em;\n margin-bottom: 0.5em;\n line-height: 1.2;\n}\n.prose-xl :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.8em;\n margin-top: 0.65em;\n margin-bottom: 0.45em;\n line-height: 1.25;\n}\n.prose-xl :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.5em;\n margin-top: 0.6em;\n margin-bottom: 0.4em;\n line-height: 1.3;\n}\n.prose-xl :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.35em;\n line-height: 1.35;\n}\n.prose-xl :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-xl :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-xl :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-xl :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-xl :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.9em;\n border-radius: 0.3125rem;\n padding-top: 0.25em;\n padding-inline-end: 0.4em;\n padding-bottom: 0.25em;\n padding-inline-start: 0.4em;\n}\n.prose-xl :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.9em;\n}\n.prose-xl :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8611111em;\n}\n.prose-xl :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.9em;\n}\n.prose-xl :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.9em;\n line-height: 1.45;\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n border-radius: 0.5rem;\n padding-top: 1.1111111em;\n padding-inline-end: 1.3333333em;\n padding-bottom: 1.1111111em;\n padding-inline-start: 1.3333333em;\n box-sizing: border-box;\n max-width: 100%;\n overflow-x: auto;\n white-space: pre-wrap;\n overflow-wrap: break-word;\n}\n.prose-xl :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.6em;\n padding-left: 1.25em;\n}\n.prose-xl :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n padding-inline-start: 1.6em;\n padding-left: 1.25em;\n}\n.prose-xl :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.25em;\n margin-bottom: 0.25em;\n}\n.prose-xl :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.4em;\n}\n.prose-xl :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.4em;\n}\n.prose-xl :where(.prose-xl > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.8em;\n margin-bottom: 0.8em;\n}\n.prose-xl :where(.prose-xl > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.2em;\n}\n.prose-xl :where(.prose-xl > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.2em;\n}\n.prose-xl :where(.prose-xl > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.2em;\n}\n.prose-xl :where(.prose-xl > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.2em;\n}\n.prose-xl :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.25em;\n margin-bottom: 0.25em;\n}\n.prose-xl :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.2em;\n margin-bottom: 1.2em;\n}\n.prose-xl :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.2em;\n}\n.prose-xl :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.6em;\n padding-inline-start: 1.6em;\n}\n.prose-xl :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-xl :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-xl :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-xl :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-xl :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-xl :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.9em;\n line-height: 1.5555556;\n}\n.prose-xl :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0.6666667em;\n padding-bottom: 0.8888889em;\n padding-inline-start: 0.6666667em;\n}\n.prose-xl :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-xl :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-xl :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-top: 0.8888889em;\n padding-inline-end: 0.6666667em;\n padding-bottom: 0.8888889em;\n padding-inline-start: 0.6666667em;\n}\n.prose-xl :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-xl :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-xl :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-xl :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-xl :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.9em;\n line-height: 1.5555556;\n margin-top: 1em;\n}\n.prose-xl :where(.prose-xl > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-xl :where(.prose-xl > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 0;\n}\n.prose-xl {\n max-width: none;\n}\n.prose-xl :where(h5):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.45em;\n margin-bottom: 0.3em;\n line-height: 1.4;\n}\n.prose-xl :where(h6):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.4em;\n margin-bottom: 0.25em;\n line-height: 1.45;\n}\n.prose-xl :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n color: var(--tw-prose-links);\n text-decoration: underline;\n font-weight: 500;\n}\n.prose-xl :where(a):not(:where([class~="not-prose"],[class~="not-prose"] *)):hover {\n color: var(--tw-prose-links-hover, var(--tw-prose-links));\n text-decoration: none;\n}\n.prose-2xl {\n font-size: 1.5rem;\n line-height: 1.6666667;\n}\n.prose-2xl :where(p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n margin-bottom: 1.3333333em;\n}\n.prose-2xl :where([class~="lead"]):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.25em;\n line-height: 1.4666667;\n margin-top: 1.0666667em;\n margin-bottom: 1.0666667em;\n}\n.prose-2xl :where(blockquote):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.7777778em;\n margin-bottom: 1.7777778em;\n padding-inline-start: 1.1111111em;\n}\n.prose-2xl :where(h1):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 2.6666667em;\n margin-top: 0;\n margin-bottom: 0.875em;\n line-height: 1;\n}\n.prose-2xl :where(h2):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 2em;\n margin-top: 1.5em;\n margin-bottom: 0.8333333em;\n line-height: 1.0833333;\n}\n.prose-2xl :where(h3):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 1.5em;\n margin-top: 1.5555556em;\n margin-bottom: 0.6666667em;\n line-height: 1.2222222;\n}\n.prose-2xl :where(h4):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.6666667em;\n margin-bottom: 0.6666667em;\n line-height: 1.5;\n}\n.prose-2xl :where(img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-2xl :where(picture):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-2xl :where(picture > img):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-2xl :where(video):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-2xl :where(kbd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8333333em;\n border-radius: 0.375rem;\n padding-top: 0.25em;\n padding-inline-end: 0.3333333em;\n padding-bottom: 0.25em;\n padding-inline-start: 0.3333333em;\n}\n.prose-2xl :where(code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8333333em;\n}\n.prose-2xl :where(h2 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.875em;\n}\n.prose-2xl :where(h3 code):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8888889em;\n}\n.prose-2xl :where(pre):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8333333em;\n line-height: 1.8;\n margin-top: 2em;\n margin-bottom: 2em;\n border-radius: 0.5rem;\n padding-top: 1.2em;\n padding-inline-end: 1.6em;\n padding-bottom: 1.2em;\n padding-inline-start: 1.6em;\n}\n.prose-2xl :where(ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n margin-bottom: 1.3333333em;\n padding-inline-start: 1.5833333em;\n}\n.prose-2xl :where(ul):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n margin-bottom: 1.3333333em;\n padding-inline-start: 1.5833333em;\n}\n.prose-2xl :where(li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n margin-bottom: 0.5em;\n}\n.prose-2xl :where(ol > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.4166667em;\n}\n.prose-2xl :where(ul > li):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0.4166667em;\n}\n.prose-2xl :where(.prose-2xl > ul > li p):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.8333333em;\n margin-bottom: 0.8333333em;\n}\n.prose-2xl :where(.prose-2xl > ul > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n}\n.prose-2xl :where(.prose-2xl > ul > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.3333333em;\n}\n.prose-2xl :where(.prose-2xl > ol > li > p:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n}\n.prose-2xl :where(.prose-2xl > ol > li > p:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 1.3333333em;\n}\n.prose-2xl :where(ul ul, ul ol, ol ul, ol ol):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.6666667em;\n margin-bottom: 0.6666667em;\n}\n.prose-2xl :where(dl):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n margin-bottom: 1.3333333em;\n}\n.prose-2xl :where(dt):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 1.3333333em;\n}\n.prose-2xl :where(dd):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0.5em;\n padding-inline-start: 1.5833333em;\n}\n.prose-2xl :where(hr):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 3em;\n margin-bottom: 3em;\n}\n.prose-2xl :where(hr + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-2xl :where(h2 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-2xl :where(h3 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-2xl :where(h4 + *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-2xl :where(table):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8333333em;\n line-height: 1.4;\n}\n.prose-2xl :where(thead th):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0.6em;\n padding-bottom: 0.8em;\n padding-inline-start: 0.6em;\n}\n.prose-2xl :where(thead th:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-2xl :where(thead th:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-2xl :where(tbody td, tfoot td):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-top: 0.8em;\n padding-inline-end: 0.6em;\n padding-bottom: 0.8em;\n padding-inline-start: 0.6em;\n}\n.prose-2xl :where(tbody td:first-child, tfoot td:first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-start: 0;\n}\n.prose-2xl :where(tbody td:last-child, tfoot td:last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n padding-inline-end: 0;\n}\n.prose-2xl :where(figure):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 2em;\n margin-bottom: 2em;\n}\n.prose-2xl :where(figure > *):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n margin-bottom: 0;\n}\n.prose-2xl :where(figcaption):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n font-size: 0.8333333em;\n line-height: 1.6;\n margin-top: 1em;\n}\n.prose-2xl :where(.prose-2xl > :first-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-top: 0;\n}\n.prose-2xl :where(.prose-2xl > :last-child):not(:where([class~="not-prose"],[class~="not-prose"] *)) {\n margin-bottom: 0;\n}\n.prose-slate {\n --tw-prose-body: oklch(37.2% 0.044 257.287);\n --tw-prose-headings: oklch(20.8% 0.042 265.755);\n --tw-prose-lead: oklch(44.6% 0.043 257.281);\n --tw-prose-links: oklch(20.8% 0.042 265.755);\n --tw-prose-bold: oklch(20.8% 0.042 265.755);\n --tw-prose-counters: oklch(55.4% 0.046 257.417);\n --tw-prose-bullets: oklch(86.9% 0.022 252.894);\n --tw-prose-hr: oklch(92.9% 0.013 255.508);\n --tw-prose-quotes: oklch(20.8% 0.042 265.755);\n --tw-prose-quote-borders: oklch(92.9% 0.013 255.508);\n --tw-prose-captions: oklch(55.4% 0.046 257.417);\n --tw-prose-kbd: oklch(20.8% 0.042 265.755);\n --tw-prose-kbd-shadows: color-mix(in oklab, oklch(20.8% 0.042 265.755) 10%, transparent);\n --tw-prose-code: oklch(20.8% 0.042 265.755);\n --tw-prose-pre-code: oklch(92.9% 0.013 255.508);\n --tw-prose-pre-bg: oklch(27.9% 0.041 260.031);\n --tw-prose-th-borders: oklch(86.9% 0.022 252.894);\n --tw-prose-td-borders: oklch(92.9% 0.013 255.508);\n --tw-prose-invert-body: oklch(86.9% 0.022 252.894);\n --tw-prose-invert-headings: #fff;\n --tw-prose-invert-lead: oklch(70.4% 0.04 256.788);\n --tw-prose-invert-links: #fff;\n --tw-prose-invert-bold: #fff;\n --tw-prose-invert-counters: oklch(70.4% 0.04 256.788);\n --tw-prose-invert-bullets: oklch(44.6% 0.043 257.281);\n --tw-prose-invert-hr: oklch(37.2% 0.044 257.287);\n --tw-prose-invert-quotes: oklch(96.8% 0.007 247.896);\n --tw-prose-invert-quote-borders: oklch(37.2% 0.044 257.287);\n --tw-prose-invert-captions: oklch(70.4% 0.04 256.788);\n --tw-prose-invert-kbd: #fff;\n --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);\n --tw-prose-invert-code: #fff;\n --tw-prose-invert-pre-code: oklch(86.9% 0.022 252.894);\n --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n --tw-prose-invert-th-borders: oklch(44.6% 0.043 257.281);\n --tw-prose-invert-td-borders: oklch(37.2% 0.044 257.287);\n}\n.prose-gray {\n --tw-prose-body: oklch(37.3% 0.034 259.733);\n --tw-prose-headings: oklch(21% 0.034 264.665);\n --tw-prose-lead: oklch(44.6% 0.03 256.802);\n --tw-prose-links: oklch(21% 0.034 264.665);\n --tw-prose-bold: oklch(21% 0.034 264.665);\n --tw-prose-counters: oklch(55.1% 0.027 264.364);\n --tw-prose-bullets: oklch(87.2% 0.01 258.338);\n --tw-prose-hr: oklch(92.8% 0.006 264.531);\n --tw-prose-quotes: oklch(21% 0.034 264.665);\n --tw-prose-quote-borders: oklch(92.8% 0.006 264.531);\n --tw-prose-captions: oklch(55.1% 0.027 264.364);\n --tw-prose-kbd: oklch(21% 0.034 264.665);\n --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.034 264.665) 10%, transparent);\n --tw-prose-code: oklch(21% 0.034 264.665);\n --tw-prose-pre-code: oklch(92.8% 0.006 264.531);\n --tw-prose-pre-bg: oklch(27.8% 0.033 256.848);\n --tw-prose-th-borders: oklch(87.2% 0.01 258.338);\n --tw-prose-td-borders: oklch(92.8% 0.006 264.531);\n --tw-prose-invert-body: oklch(87.2% 0.01 258.338);\n --tw-prose-invert-headings: #fff;\n --tw-prose-invert-lead: oklch(70.7% 0.022 261.325);\n --tw-prose-invert-links: #fff;\n --tw-prose-invert-bold: #fff;\n --tw-prose-invert-counters: oklch(70.7% 0.022 261.325);\n --tw-prose-invert-bullets: oklch(44.6% 0.03 256.802);\n --tw-prose-invert-hr: oklch(37.3% 0.034 259.733);\n --tw-prose-invert-quotes: oklch(96.7% 0.003 264.542);\n --tw-prose-invert-quote-borders: oklch(37.3% 0.034 259.733);\n --tw-prose-invert-captions: oklch(70.7% 0.022 261.325);\n --tw-prose-invert-kbd: #fff;\n --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);\n --tw-prose-invert-code: #fff;\n --tw-prose-invert-pre-code: oklch(87.2% 0.01 258.338);\n --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n --tw-prose-invert-th-borders: oklch(44.6% 0.03 256.802);\n --tw-prose-invert-td-borders: oklch(37.3% 0.034 259.733);\n}\n.prose-zinc {\n --tw-prose-body: oklch(37% 0.013 285.805);\n --tw-prose-headings: oklch(21% 0.006 285.885);\n --tw-prose-lead: oklch(44.2% 0.017 285.786);\n --tw-prose-links: oklch(21% 0.006 285.885);\n --tw-prose-bold: oklch(21% 0.006 285.885);\n --tw-prose-counters: oklch(55.2% 0.016 285.938);\n --tw-prose-bullets: oklch(87.1% 0.006 286.286);\n --tw-prose-hr: oklch(92% 0.004 286.32);\n --tw-prose-quotes: oklch(21% 0.006 285.885);\n --tw-prose-quote-borders: oklch(92% 0.004 286.32);\n --tw-prose-captions: oklch(55.2% 0.016 285.938);\n --tw-prose-kbd: oklch(21% 0.006 285.885);\n --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21% 0.006 285.885) 10%, transparent);\n --tw-prose-code: oklch(21% 0.006 285.885);\n --tw-prose-pre-code: oklch(92% 0.004 286.32);\n --tw-prose-pre-bg: oklch(27.4% 0.006 286.033);\n --tw-prose-th-borders: oklch(87.1% 0.006 286.286);\n --tw-prose-td-borders: oklch(92% 0.004 286.32);\n --tw-prose-invert-body: oklch(87.1% 0.006 286.286);\n --tw-prose-invert-headings: #fff;\n --tw-prose-invert-lead: oklch(70.5% 0.015 286.067);\n --tw-prose-invert-links: #fff;\n --tw-prose-invert-bold: #fff;\n --tw-prose-invert-counters: oklch(70.5% 0.015 286.067);\n --tw-prose-invert-bullets: oklch(44.2% 0.017 285.786);\n --tw-prose-invert-hr: oklch(37% 0.013 285.805);\n --tw-prose-invert-quotes: oklch(96.7% 0.001 286.375);\n --tw-prose-invert-quote-borders: oklch(37% 0.013 285.805);\n --tw-prose-invert-captions: oklch(70.5% 0.015 286.067);\n --tw-prose-invert-kbd: #fff;\n --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);\n --tw-prose-invert-code: #fff;\n --tw-prose-invert-pre-code: oklch(87.1% 0.006 286.286);\n --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n --tw-prose-invert-th-borders: oklch(44.2% 0.017 285.786);\n --tw-prose-invert-td-borders: oklch(37% 0.013 285.805);\n}\n.prose-neutral {\n --tw-prose-body: oklch(37.1% 0 0);\n --tw-prose-headings: oklch(20.5% 0 0);\n --tw-prose-lead: oklch(43.9% 0 0);\n --tw-prose-links: oklch(20.5% 0 0);\n --tw-prose-bold: oklch(20.5% 0 0);\n --tw-prose-counters: oklch(55.6% 0 0);\n --tw-prose-bullets: oklch(87% 0 0);\n --tw-prose-hr: oklch(92.2% 0 0);\n --tw-prose-quotes: oklch(20.5% 0 0);\n --tw-prose-quote-borders: oklch(92.2% 0 0);\n --tw-prose-captions: oklch(55.6% 0 0);\n --tw-prose-kbd: oklch(20.5% 0 0);\n --tw-prose-kbd-shadows: color-mix(in oklab, oklch(20.5% 0 0) 10%, transparent);\n --tw-prose-code: oklch(20.5% 0 0);\n --tw-prose-pre-code: oklch(92.2% 0 0);\n --tw-prose-pre-bg: oklch(26.9% 0 0);\n --tw-prose-th-borders: oklch(87% 0 0);\n --tw-prose-td-borders: oklch(92.2% 0 0);\n --tw-prose-invert-body: oklch(87% 0 0);\n --tw-prose-invert-headings: #fff;\n --tw-prose-invert-lead: oklch(70.8% 0 0);\n --tw-prose-invert-links: #fff;\n --tw-prose-invert-bold: #fff;\n --tw-prose-invert-counters: oklch(70.8% 0 0);\n --tw-prose-invert-bullets: oklch(43.9% 0 0);\n --tw-prose-invert-hr: oklch(37.1% 0 0);\n --tw-prose-invert-quotes: oklch(97% 0 0);\n --tw-prose-invert-quote-borders: oklch(37.1% 0 0);\n --tw-prose-invert-captions: oklch(70.8% 0 0);\n --tw-prose-invert-kbd: #fff;\n --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);\n --tw-prose-invert-code: #fff;\n --tw-prose-invert-pre-code: oklch(87% 0 0);\n --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n --tw-prose-invert-th-borders: oklch(43.9% 0 0);\n --tw-prose-invert-td-borders: oklch(37.1% 0 0);\n}\n.prose-stone {\n --tw-prose-body: oklch(37.4% 0.01 67.558);\n --tw-prose-headings: oklch(21.6% 0.006 56.043);\n --tw-prose-lead: oklch(44.4% 0.011 73.639);\n --tw-prose-links: oklch(21.6% 0.006 56.043);\n --tw-prose-bold: oklch(21.6% 0.006 56.043);\n --tw-prose-counters: oklch(55.3% 0.013 58.071);\n --tw-prose-bullets: oklch(86.9% 0.005 56.366);\n --tw-prose-hr: oklch(92.3% 0.003 48.717);\n --tw-prose-quotes: oklch(21.6% 0.006 56.043);\n --tw-prose-quote-borders: oklch(92.3% 0.003 48.717);\n --tw-prose-captions: oklch(55.3% 0.013 58.071);\n --tw-prose-kbd: oklch(21.6% 0.006 56.043);\n --tw-prose-kbd-shadows: color-mix(in oklab, oklch(21.6% 0.006 56.043) 10%, transparent);\n --tw-prose-code: oklch(21.6% 0.006 56.043);\n --tw-prose-pre-code: oklch(92.3% 0.003 48.717);\n --tw-prose-pre-bg: oklch(26.8% 0.007 34.298);\n --tw-prose-th-borders: oklch(86.9% 0.005 56.366);\n --tw-prose-td-borders: oklch(92.3% 0.003 48.717);\n --tw-prose-invert-body: oklch(86.9% 0.005 56.366);\n --tw-prose-invert-headings: #fff;\n --tw-prose-invert-lead: oklch(70.9% 0.01 56.259);\n --tw-prose-invert-links: #fff;\n --tw-prose-invert-bold: #fff;\n --tw-prose-invert-counters: oklch(70.9% 0.01 56.259);\n --tw-prose-invert-bullets: oklch(44.4% 0.011 73.639);\n --tw-prose-invert-hr: oklch(37.4% 0.01 67.558);\n --tw-prose-invert-quotes: oklch(97% 0.001 106.424);\n --tw-prose-invert-quote-borders: oklch(37.4% 0.01 67.558);\n --tw-prose-invert-captions: oklch(70.9% 0.01 56.259);\n --tw-prose-invert-kbd: #fff;\n --tw-prose-invert-kbd-shadows: rgb(255 255 255 / 10%);\n --tw-prose-invert-code: #fff;\n --tw-prose-invert-pre-code: oklch(86.9% 0.005 56.366);\n --tw-prose-invert-pre-bg: rgb(0 0 0 / 50%);\n --tw-prose-invert-th-borders: oklch(44.4% 0.011 73.639);\n --tw-prose-invert-td-borders: oklch(37.4% 0.01 67.558);\n}\n.prose-red {\n --tw-prose-links: oklch(57.7% 0.245 27.325);\n --tw-prose-invert-links: oklch(63.7% 0.237 25.331);\n}\n.prose-orange {\n --tw-prose-links: oklch(64.6% 0.222 41.116);\n --tw-prose-invert-links: oklch(70.5% 0.213 47.604);\n}\n.prose-amber {\n --tw-prose-links: oklch(66.6% 0.179 58.318);\n --tw-prose-invert-links: oklch(76.9% 0.188 70.08);\n}\n.prose-yellow {\n --tw-prose-links: oklch(68.1% 0.162 75.834);\n --tw-prose-invert-links: oklch(79.5% 0.184 86.047);\n}\n.prose-lime {\n --tw-prose-links: oklch(64.8% 0.2 131.684);\n --tw-prose-invert-links: oklch(76.8% 0.233 130.85);\n}\n.prose-green {\n --tw-prose-links: oklch(62.7% 0.194 149.214);\n --tw-prose-invert-links: oklch(72.3% 0.219 149.579);\n}\n.prose-emerald {\n --tw-prose-links: oklch(59.6% 0.145 163.225);\n --tw-prose-invert-links: oklch(69.6% 0.17 162.48);\n}\n.prose-teal {\n --tw-prose-links: oklch(60% 0.118 184.704);\n --tw-prose-invert-links: oklch(70.4% 0.14 182.503);\n}\n.prose-cyan {\n --tw-prose-links: oklch(60.9% 0.126 221.723);\n --tw-prose-invert-links: oklch(71.5% 0.143 215.221);\n}\n.prose-sky {\n --tw-prose-links: oklch(58.8% 0.158 241.966);\n --tw-prose-invert-links: oklch(68.5% 0.169 237.323);\n}\n.prose-blue {\n --tw-prose-links: oklch(54.6% 0.245 262.881);\n --tw-prose-invert-links: oklch(62.3% 0.214 259.815);\n}\n.prose-indigo {\n --tw-prose-links: oklch(51.1% 0.262 276.966);\n --tw-prose-invert-links: oklch(58.5% 0.233 277.117);\n}\n.prose-violet {\n --tw-prose-links: oklch(54.1% 0.281 293.009);\n --tw-prose-invert-links: oklch(60.6% 0.25 292.717);\n}\n.prose-purple {\n --tw-prose-links: oklch(55.8% 0.288 302.321);\n --tw-prose-invert-links: oklch(62.7% 0.265 303.9);\n}\n.prose-fuchsia {\n --tw-prose-links: oklch(59.1% 0.293 322.896);\n --tw-prose-invert-links: oklch(66.7% 0.295 322.15);\n}\n.prose-pink {\n --tw-prose-links: oklch(59.2% 0.249 0.584);\n --tw-prose-invert-links: oklch(65.6% 0.241 354.308);\n}\n.prose-rose {\n --tw-prose-links: oklch(58.6% 0.253 17.585);\n --tw-prose-invert-links: oklch(64.5% 0.246 16.439);\n}\n.prose-invert {\n --tw-prose-body: var(--tw-prose-invert-body);\n --tw-prose-headings: var(--tw-prose-invert-headings);\n --tw-prose-lead: var(--tw-prose-invert-lead);\n --tw-prose-links: var(--tw-prose-invert-links);\n --tw-prose-bold: var(--tw-prose-invert-bold);\n --tw-prose-counters: var(--tw-prose-invert-counters);\n --tw-prose-bullets: var(--tw-prose-invert-bullets);\n --tw-prose-hr: var(--tw-prose-invert-hr);\n --tw-prose-quotes: var(--tw-prose-invert-quotes);\n --tw-prose-quote-borders: var(--tw-prose-invert-quote-borders);\n --tw-prose-captions: var(--tw-prose-invert-captions);\n --tw-prose-kbd: var(--tw-prose-invert-kbd);\n --tw-prose-kbd-shadows: var(--tw-prose-invert-kbd-shadows);\n --tw-prose-code: var(--tw-prose-invert-code);\n --tw-prose-pre-code: var(--tw-prose-invert-pre-code);\n --tw-prose-pre-bg: var(--tw-prose-invert-pre-bg);\n --tw-prose-th-borders: var(--tw-prose-invert-th-borders);\n --tw-prose-td-borders: var(--tw-prose-invert-td-borders);\n}\n.prose-inherit {\n --tw-prose-body: inherit;\n --tw-prose-headings: inherit;\n --tw-prose-lead: inherit;\n --tw-prose-links: inherit;\n --tw-prose-bold: inherit;\n --tw-prose-counters: inherit;\n --tw-prose-bullets: inherit;\n}\n.visible {\n visibility: visible;\n}\n.static {\n position: static;\n}\n.fixed {\n position: fixed;\n}\n.absolute {\n position: absolute;\n}\n.relative {\n position: relative;\n}\n.bottom-0 {\n bottom: 0px;\n}\n.left-0 {\n left: 0px;\n}\n.left-3 {\n left: 0.75rem;\n}\n.right-4 {\n right: 1rem;\n}\n.top-0 {\n top: 0px;\n}\n.top-3 {\n top: 0.75rem;\n}\n.top-\\[calc\\(100\\%\\+8px\\)\\] {\n top: calc(100% + 8px);\n}\n.-z-10 {\n z-index: -10;\n}\n.z-10 {\n z-index: 10;\n}\n.z-\\[1000\\] {\n z-index: 1000;\n}\n.z-\\[99\\] {\n z-index: 99;\n}\n.col-\\[1\\] {\n grid-column: 1;\n}\n.row-\\[1\\] {\n grid-row: 1;\n}\n.m-5 {\n margin: 1.25rem;\n}\n.my-3 {\n margin-top: 0.75rem;\n margin-bottom: 0.75rem;\n}\n.my-4 {\n margin-top: 1rem;\n margin-bottom: 1rem;\n}\n.mb-1 {\n margin-bottom: 0.25rem;\n}\n.mb-2 {\n margin-bottom: 0.5rem;\n}\n.mb-4 {\n margin-bottom: 1rem;\n}\n.mb-6 {\n margin-bottom: 1.5rem;\n}\n.ml-1 {\n margin-left: 0.25rem;\n}\n.ml-2 {\n margin-left: 0.5rem;\n}\n.mt-1 {\n margin-top: 0.25rem;\n}\n.mt-2 {\n margin-top: 0.5rem;\n}\n.mt-4 {\n margin-top: 1rem;\n}\n.mt-6 {\n margin-top: 1.5rem;\n}\n.box-border {\n box-sizing: border-box;\n}\n.block {\n display: block;\n}\n.inline-block {\n display: inline-block;\n}\n.inline {\n display: inline;\n}\n.flex {\n display: flex;\n}\n.inline-flex {\n display: inline-flex;\n}\n.grid {\n display: grid;\n}\n.contents {\n display: contents;\n}\n.hidden {\n display: none;\n}\n.h-10 {\n height: 2.5rem;\n}\n.h-12 {\n height: 3rem;\n}\n.h-14 {\n height: 3.5rem;\n}\n.h-6 {\n height: 1.5rem;\n}\n.h-7 {\n height: 1.75rem;\n}\n.h-8 {\n height: 2rem;\n}\n.h-\\[29px\\] {\n height: 29px;\n}\n.h-full {\n height: 100%;\n}\n.h-px {\n height: 1px;\n}\n.min-h-20 {\n min-height: 5rem;\n}\n.w-10 {\n width: 2.5rem;\n}\n.w-6 {\n width: 1.5rem;\n}\n.w-\\[140px\\] {\n width: 140px;\n}\n.w-\\[48\\%\\] {\n width: 48%;\n}\n.w-\\[51\\%\\] {\n width: 51%;\n}\n.w-full {\n width: 100%;\n}\n.min-w-0 {\n min-width: 0px;\n}\n.min-w-20 {\n min-width: 5rem;\n}\n.min-w-\\[280px\\] {\n min-width: 280px;\n}\n.min-w-\\[320px\\] {\n min-width: 320px;\n}\n.min-w-\\[360px\\] {\n min-width: 360px;\n}\n.max-w-\\[60px\\] {\n max-width: 60px;\n}\n.max-w-none {\n max-width: none;\n}\n.flex-1 {\n flex: 1 1 0%;\n}\n.flex-none {\n flex: none;\n}\n.flex-shrink {\n flex-shrink: 1;\n}\n.flex-shrink-0 {\n flex-shrink: 0;\n}\n.shrink-0 {\n flex-shrink: 0;\n}\n.rotate-180 {\n --tw-rotate: 180deg;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.transform {\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n@keyframes bounce {\n 0%, 100% {\n transform: translateY(-25%);\n animation-timing-function: cubic-bezier(0.8,0,1,1);\n }\n 50% {\n transform: none;\n animation-timing-function: cubic-bezier(0,0,0.2,1);\n }\n}\n.animate-bounce {\n animation: bounce 1s infinite;\n}\n@keyframes spin {\n to {\n transform: rotate(360deg);\n }\n}\n.animate-spin {\n animation: spin 1s linear infinite;\n}\n.cursor-not-allowed {\n cursor: not-allowed;\n}\n.cursor-pointer {\n cursor: pointer;\n}\n.select-none {\n -webkit-user-select: none;\n -moz-user-select: none;\n user-select: none;\n}\n.grid-cols-\\[24px_1fr\\] {\n grid-template-columns: 24px 1fr;\n}\n.grid-cols-\\[40px\\2c 1fr\\2c 20px\\] {\n grid-template-columns: 40px 1fr 20px;\n}\n.grid-cols-\\[repeat\\(auto-fill\\2c minmax\\(\\$\\{this\\.getImageMinSizePx\\(\\)\\}px\\2c 300px\\)\\)\\] {\n grid-template-columns: repeat(auto-fill,minmax(${this.getImageMinSizePx()}px,300px));\n}\n.flex-row {\n flex-direction: row;\n}\n.flex-col {\n flex-direction: column;\n}\n.flex-wrap {\n flex-wrap: wrap;\n}\n.items-start {\n align-items: flex-start;\n}\n.items-center {\n align-items: center;\n}\n.justify-start {\n justify-content: flex-start;\n}\n.justify-end {\n justify-content: flex-end;\n}\n.justify-center {\n justify-content: center;\n}\n.justify-between {\n justify-content: space-between;\n}\n.gap-1 {\n gap: 0.25rem;\n}\n.gap-1\\.5 {\n gap: 0.375rem;\n}\n.gap-2 {\n gap: 0.5rem;\n}\n.gap-3 {\n gap: 0.75rem;\n}\n.gap-4 {\n gap: 1rem;\n}\n.gap-x-2 {\n -moz-column-gap: 0.5rem;\n column-gap: 0.5rem;\n}\n.self-center {\n align-self: center;\n}\n.overflow-hidden {\n overflow: hidden;\n}\n.overflow-visible {\n overflow: visible;\n}\n.text-ellipsis {\n text-overflow: ellipsis;\n}\n.whitespace-nowrap {\n white-space: nowrap;\n}\n.text-wrap {\n text-wrap: wrap;\n}\n.break-words {\n overflow-wrap: break-word;\n}\n.break-all {\n word-break: break-all;\n}\n.rounded {\n border-radius: 0.25rem;\n}\n.rounded-full {\n border-radius: 9999px;\n}\n.rounded-lg {\n border-radius: 0.5rem;\n}\n.rounded-md {\n border-radius: 0.375rem;\n}\n.rounded-xl {\n border-radius: 0.75rem;\n}\n.rounded-t-\\[120px\\] {\n border-top-left-radius: 120px;\n border-top-right-radius: 120px;\n}\n.border {\n border-width: 1px;\n}\n.border-0 {\n border-width: 0px;\n}\n.border-t {\n border-top-width: 1px;\n}\n.border-\\[var\\(--neutral-90\\)\\] {\n border-color: var(--neutral-90);\n}\n.border-neutral-20 {\n --tw-border-opacity: 1;\n border-color: rgb(36 53 66 / var(--tw-border-opacity, 1));\n}\n.border-neutral-90 {\n --tw-border-opacity: 1;\n border-color: rgb(222 231 237 / var(--tw-border-opacity, 1));\n}\n.border-red-200 {\n --tw-border-opacity: 1;\n border-color: rgb(254 202 202 / var(--tw-border-opacity, 1));\n}\n.bg-\\[var\\(--neutral-100\\)\\] {\n background-color: var(--neutral-100);\n}\n.bg-\\[var\\(--neutral-90\\)\\] {\n background-color: var(--neutral-90);\n}\n.bg-blue-85 {\n --tw-bg-opacity: 1;\n background-color: rgb(180 209 253 / var(--tw-bg-opacity, 1));\n}\n.bg-green-85 {\n --tw-bg-opacity: 1;\n background-color: rgb(195 239 206 / var(--tw-bg-opacity, 1));\n}\n.bg-neutral-10 {\n --tw-bg-opacity: 1;\n background-color: rgb(18 27 33 / var(--tw-bg-opacity, 1));\n}\n.bg-neutral-100 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-neutral-90 {\n --tw-bg-opacity: 1;\n background-color: rgb(222 231 237 / var(--tw-bg-opacity, 1));\n}\n.bg-neutral-95 {\n --tw-bg-opacity: 1;\n background-color: rgb(238 243 246 / var(--tw-bg-opacity, 1));\n}\n.bg-neutral-98 {\n --tw-bg-opacity: 1;\n background-color: rgb(248 250 251 / var(--tw-bg-opacity, 1));\n}\n.bg-red-50 {\n --tw-bg-opacity: 1;\n background-color: rgb(254 242 242 / var(--tw-bg-opacity, 1));\n}\n.bg-red-85 {\n --tw-bg-opacity: 1;\n background-color: rgb(245 188 188 / var(--tw-bg-opacity, 1));\n}\n.bg-transparent {\n background-color: transparent;\n}\n.bg-white {\n --tw-bg-opacity: 1;\n background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));\n}\n.bg-yellow-85 {\n --tw-bg-opacity: 1;\n background-color: rgb(255 224 179 / var(--tw-bg-opacity, 1));\n}\n.bg-\\[radial-gradient\\(ellipse_75px_52px_at_bottom_center\\2c rgba\\(255\\2c 255\\2c 255\\2c 0\\.78\\)_0\\%\\2c rgba\\(255\\2c 255\\2c 255\\2c 0\\)_112\\.5\\%\\)\\] {\n background-image: radial-gradient(ellipse 75px 52px at bottom center,rgba(255,255,255,0.78) 0%,rgba(255,255,255,0) 112.5%);\n}\n.object-cover {\n -o-object-fit: cover;\n object-fit: cover;\n}\n.p-0 {\n padding: 0px;\n}\n.p-0\\.5 {\n padding: 0.125rem;\n}\n.p-1 {\n padding: 0.25rem;\n}\n.p-2 {\n padding: 0.5rem;\n}\n.p-2\\.5 {\n padding: 0.625rem;\n}\n.p-3 {\n padding: 0.75rem;\n}\n.p-4 {\n padding: 1rem;\n}\n.px-1 {\n padding-left: 0.25rem;\n padding-right: 0.25rem;\n}\n.px-2 {\n padding-left: 0.5rem;\n padding-right: 0.5rem;\n}\n.px-2\\.5 {\n padding-left: 0.625rem;\n padding-right: 0.625rem;\n}\n.px-4 {\n padding-left: 1rem;\n padding-right: 1rem;\n}\n.px-5 {\n padding-left: 1.25rem;\n padding-right: 1.25rem;\n}\n.py-0\\.5 {\n padding-top: 0.125rem;\n padding-bottom: 0.125rem;\n}\n.py-1 {\n padding-top: 0.25rem;\n padding-bottom: 0.25rem;\n}\n.py-1\\.5 {\n padding-top: 0.375rem;\n padding-bottom: 0.375rem;\n}\n.py-10 {\n padding-top: 2.5rem;\n padding-bottom: 2.5rem;\n}\n.py-3 {\n padding-top: 0.75rem;\n padding-bottom: 0.75rem;\n}\n.pt-2 {\n padding-top: 0.5rem;\n}\n.pt-4 {\n padding-top: 1rem;\n}\n.text-center {\n text-align: center;\n}\n.align-middle {\n vertical-align: middle;\n}\n.font-mono {\n font-family: "PT Mono", sans-serif;\n}\n.text-12 {\n font-size: 12px;\n}\n.text-14 {\n font-size: 14px;\n}\n.text-16 {\n font-size: 16px;\n}\n.text-32 {\n font-size: 32px;\n}\n.text-48 {\n font-size: 48px;\n}\n.text-\\[10px\\] {\n font-size: 10px;\n}\n.text-\\[12px\\] {\n font-size: 12px;\n}\n.text-\\[13px\\] {\n font-size: 13px;\n}\n.text-\\[14px\\] {\n font-size: 14px;\n}\n.text-\\[16px\\] {\n font-size: 16px;\n}\n.text-\\[17px\\] {\n font-size: 17px;\n}\n.text-\\[18px\\] {\n font-size: 18px;\n}\n.text-\\[24px\\] {\n font-size: 24px;\n}\n.font-500 {\n font-weight: 500;\n}\n.font-600 {\n font-weight: 600;\n}\n.font-bold {\n font-weight: 700;\n}\n.font-medium {\n font-weight: 500;\n}\n.font-normal {\n font-weight: 400;\n}\n.font-semibold {\n font-weight: 600;\n}\n.uppercase {\n text-transform: uppercase;\n}\n.italic {\n font-style: italic;\n}\n.leading-none {\n line-height: 1;\n}\n.leading-normal {\n line-height: 1.5;\n}\n.leading-snug {\n line-height: 1.375;\n}\n.leading-tight {\n line-height: 1.25;\n}\n.text-\\[var\\(--neutral-40\\)\\] {\n color: var(--neutral-40);\n}\n.text-green-600 {\n --tw-text-opacity: 1;\n color: rgb(22 163 74 / var(--tw-text-opacity, 1));\n}\n.text-neutral-10 {\n --tw-text-opacity: 1;\n color: rgb(18 27 33 / var(--tw-text-opacity, 1));\n}\n.text-neutral-100 {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.text-neutral-20 {\n --tw-text-opacity: 1;\n color: rgb(36 53 66 / var(--tw-text-opacity, 1));\n}\n.text-neutral-60 {\n --tw-text-opacity: 1;\n color: rgb(122 157 184 / var(--tw-text-opacity, 1));\n}\n.text-neutral-70 {\n --tw-text-opacity: 1;\n color: rgb(156 182 201 / var(--tw-text-opacity, 1));\n}\n.text-neutral-80 {\n --tw-text-opacity: 1;\n color: rgb(189 206 219 / var(--tw-text-opacity, 1));\n}\n.text-red-600 {\n --tw-text-opacity: 1;\n color: rgb(220 38 38 / var(--tw-text-opacity, 1));\n}\n.text-white {\n --tw-text-opacity: 1;\n color: rgb(255 255 255 / var(--tw-text-opacity, 1));\n}\n.underline {\n text-decoration-line: underline;\n}\n.opacity-0 {\n opacity: 0;\n}\n.opacity-100 {\n opacity: 1;\n}\n.mix-blend-difference {\n mix-blend-mode: difference;\n}\n.shadow {\n --tw-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);\n --tw-shadow-colored: 0 1px 3px 0 var(--tw-shadow-color), 0 1px 2px -1px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.shadow-\\[0_0_16px_rgba\\(189\\2c 206\\2c 219\\2c 0\\.4\\)\\] {\n --tw-shadow: 0 0 16px rgba(189,206,219,0.4);\n --tw-shadow-colored: 0 0 16px var(--tw-shadow-color);\n box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);\n}\n.ring-1 {\n --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);\n --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);\n box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);\n}\n.ring-neutral-90 {\n --tw-ring-opacity: 1;\n --tw-ring-color: rgb(222 231 237 / var(--tw-ring-opacity, 1));\n}\n.filter {\n filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);\n}\n.transition {\n transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-all {\n transition-property: all;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-opacity {\n transition-property: opacity;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.transition-transform {\n transition-property: transform;\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n transition-duration: 150ms;\n}\n.duration-200 {\n transition-duration: 200ms;\n}\n.duration-700 {\n transition-duration: 700ms;\n}\n.ease-in-out {\n transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);\n}\nstrong {\n font-weight: 600;\n}\n.hover\\:scale-105:hover {\n --tw-scale-x: 1.05;\n --tw-scale-y: 1.05;\n transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));\n}\n.hover\\:bg-neutral-90:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(222 231 237 / var(--tw-bg-opacity, 1));\n}\n.hover\\:bg-neutral-95:hover {\n --tw-bg-opacity: 1;\n background-color: rgb(238 243 246 / var(--tw-bg-opacity, 1));\n}\n';
369
-
370
- // src/styles/index.ts
371
- var import_lit2 = require("lit");
372
- var style = import_lit2.css`
373
- ${(0, import_lit2.unsafeCSS)(styles_default)}
374
-
375
- :host([is-inline]) {
376
- display: inline-flex;
377
- align-items: center;
378
- }
379
-
380
- :host([is-full-width]) {
381
- width: 100%;
382
- flex: 1;
383
- display: flex;
384
- }
385
-
386
- `;
387
- var CoreLitElement = class extends import_lit2.LitElement {
388
- static {
389
- this.styles = [style];
390
- }
391
- };
392
-
393
- // src/shared/address-view.ts
394
- var AddressView = class extends CoreLitElement {
395
- constructor() {
396
- super(...arguments);
397
- this.size = "small";
398
- this.nameOnly = false;
399
- this.addressOnly = false;
400
- this.isCardView = false;
401
- this.showCopyButton = false;
402
- this.maxWidth = 200;
403
- this.showIdenticon = true;
404
- this.isLoadingAddress = false;
405
- // Composables
406
- this.addressResolver = (0, import_transaction_view_headless2.useAddressResolver)();
407
- // Task for resolving address data
408
- this.addressTask = new import_task2.Task(this, {
409
- task: async ([address]) => {
410
- if (!address) return null;
411
- this.isLoadingAddress = true;
412
- try {
413
- const resolved = await this.addressResolver.resolveAddress(address);
414
- this.requestUpdate();
415
- return resolved;
416
- } catch (_error) {
417
- return null;
418
- } finally {
419
- this.isLoadingAddress = false;
420
- }
421
- },
422
- args: () => [this.address]
423
- });
424
- }
425
- /**
426
- * Get the display address (first segment only for compound addresses)
427
- * e.g., "0x123...-0x456..." becomes "0x123..."
428
- */
429
- get displayAddress() {
430
- return this.address.split("-")[0];
431
- }
432
- /**
433
- * Get display name for the address
434
- */
435
- getDisplayName() {
436
- const resolved = this.addressTask.value;
437
- if (!resolved) {
438
- return this.isLoadingAddress ? "Loading..." : "Anonymous";
439
- }
440
- const computedName = this.addressResolver.formatDisplayName(resolved);
441
- return this.label || computedName || "Anonymous";
442
- }
443
- /**
444
- * Get prefix for the address display
445
- */
446
- get addressPrefix() {
447
- const resolved = this.addressTask.value;
448
- return resolved?.hasProfile ? "@" : "";
449
- }
450
- /**
451
- * Check if should show name colors
452
- */
453
- get shouldShowNameColor() {
454
- const resolved = this.addressTask.value;
455
- return resolved ? this.addressResolver.shouldShowNameColor(resolved) : true;
456
- }
457
- /**
458
- * Handle address click
459
- */
460
- handleClick() {
461
- this.dispatchEvent(
462
- new CustomEvent("address-click", {
463
- detail: {
464
- address: this.address,
465
- resolved: this.addressTask.value
466
- },
467
- bubbles: true
468
- })
469
- );
470
- }
471
- /** Generate identicon when address changes */
472
- willUpdate(changed) {
473
- if (changed.has("address") && this.address) {
474
- try {
475
- this.identicon = (0, import_ethereum_blockies_base64.default)(this.displayAddress.toLowerCase());
476
- } catch {
477
- this.identicon = void 0;
478
- }
479
- }
480
- }
481
- /** Copy the display address to clipboard (card view) */
482
- handleCopy(event) {
483
- if (event) event.stopPropagation();
484
- if (navigator.clipboard) {
485
- navigator.clipboard.writeText(this.displayAddress);
486
- this.dispatchEvent(
487
- new CustomEvent("address-copied", {
488
- detail: { address: this.displayAddress },
489
- bubbles: true
490
- })
491
- );
492
- }
493
- }
494
- /** ========== RENDER HELPERS (Use Cases) ========== */
495
- /** Pixel size mapping for identicon based on component size */
496
- getIdenticonSizePx() {
497
- switch (this.size) {
498
- case "x-small":
499
- return 10;
500
- case "small":
501
- return 12;
502
- case "medium":
503
- return 14;
504
- case "large":
505
- return 16;
506
- default:
507
- return 14;
508
- }
509
- }
510
- /**
511
- * Render only the name (and optionally the address hash when allowed for profiles)
512
- */
513
- renderNameOnly(displayName) {
514
- return import_lit3.html`
515
- <!-- Name Only Use Case -->
516
- <lukso-username
517
- class="inline-block align-middle"
518
- name=${displayName}
519
- address=${this.address}
520
- size=${this.size}
521
- max-width=${this.maxWidth}
522
- prefix=${this.addressPrefix}
523
- address-color=${this.addressColor}
524
- name-color=${this.nameColor}
525
- ></lukso-username>
526
- `;
527
- }
528
- /**
529
- * Render only the raw address (no name)
530
- */
531
- renderAddressOnly() {
532
- return import_lit3.html`
533
- <!-- Address Only Use Case -->
534
- <lukso-username
535
- class="inline-block align-middle"
536
- address=${this.displayAddress}
537
- size=${this.size}
538
- max-width=${this.maxWidth}
539
- has-name-color="false"
540
- ?has-address-color=${this.shouldShowNameColor}
541
- ></lukso-username>
542
- `;
543
- }
544
- /**
545
- * Render both name and (conditionally) the address hash (profiles show hash, contracts may hide it)
546
- */
547
- renderNameAndAddress(displayName) {
548
- return import_lit3.html`
549
- <!-- Name + Address Use Case -->
550
- <lukso-username
551
- class="inline-block align-middle"
552
- name=${displayName}
553
- address=${this.address}
554
- size=${this.size}
555
- max-width=${this.maxWidth}
556
- prefix=${this.addressPrefix}
557
- address-color=${this.addressColor}
558
- name-color=${this.nameColor}
559
- ></lukso-username>
560
- `;
561
- }
562
- renderIdenticon() {
563
- if (!this.showIdenticon || !this.identicon) return "";
564
- const size = this.getIdenticonSizePx();
565
- return import_lit3.html`
566
- <div class="inline-flex items-center justify-center align-middle">
567
- <img
568
- class="inline-block rounded-full ring-1 ring-neutral-90 shrink-0"
569
- src=${this.identicon}
570
- alt="identicon"
571
- style="width:${size}px;height:${size}px;image-rendering:pixelated;"
572
- />
573
- </div>
574
- `;
575
- }
576
- /** Map size to a typography class for the label */
577
- getLabelClass() {
578
- switch (this.size) {
579
- case "x-small":
580
- return "paragraph-inter-12-semi-bold";
581
- case "small":
582
- return "heading-inter-14-bold";
583
- case "medium":
584
- return "heading-inter-17-semi-bold";
585
- case "large":
586
- return "heading-inter-21-semi-bold";
587
- default:
588
- return "heading-inter-17-semi-bold";
589
- }
590
- }
591
- renderDisplayName() {
592
- const displayName = this.getDisplayName();
593
- return this.label ? import_lit3.html`<div class="inline-flex items-center gap-2 font-semibold text-neutral-20 ${this.getLabelClass()}">${this.label}</div>` : import_lit3.html`<lukso-username
594
- class="inline-block align-middle"
595
- name=${displayName}
596
- size=${this.size}
597
- ?has-name-color=${this.shouldShowNameColor}
598
- ></lukso-username>`;
599
- }
600
- /**
601
- * Decide which of the three core inline variants to render
602
- */
603
- renderInlineVariant(displayName) {
604
- if (this.nameOnly) return this.renderNameOnly(displayName);
605
- if (this.addressOnly) return this.renderAddressOnly();
606
- return this.renderNameAndAddress(displayName);
607
- }
608
- render() {
609
- const displayName = this.getDisplayName();
610
- if (this.isCardView) {
611
- return import_lit3.html`
612
- <div class="block border border-neutral-90 rounded-xl py-3 px-4 bg-neutral-100 min-w-[280px]" @click=${this.handleClick}>
613
- <div class="flex items-center justify-between mb-2">
614
- <div class="inline-flex items-center font-normal gap-1">
615
- ${this.renderIdenticon()}
616
- ${this.renderDisplayName()}
617
- </div>
618
- ${this.showCopyButton ? import_lit3.html`<button
619
- class="bg-neutral-100 border-0 rounded-lg w-6 h-6 flex items-center justify-center cursor-pointer text-neutral-20 hover:bg-neutral-95"
620
- @click=${(e) => this.handleCopy(e)}
621
- title="Copy address"
622
- >
623
- <lukso-icon name="copy" size="small"></lukso-icon>
624
- </button>` : import_lit3.html``}
625
- </div>
626
- <div class="font-semibold text-neutral-20 break-all flex items-center gap-2">
627
-
628
- <lukso-username
629
- address=${this.displayAddress}
630
- size=${this.size}
631
- max-width=${this.maxWidth}
632
- has-name-color="false"
633
- slice-by="24"
634
- ?has-address-color=${this.shouldShowNameColor}
635
- ></lukso-username>
636
- </div>
637
- </div>
638
- `;
639
- }
640
- return import_lit3.html`
641
- <div class="inline-flex items-center cursor-pointer gap-1" @click=${this.handleClick}>
642
- ${this.renderIdenticon()}
643
- <!-- Inline Variants -->
644
- ${this.renderInlineVariant(displayName)}
645
- </div>
646
- `;
647
- }
648
- };
649
- __decorateClass([
650
- (0, import_decorators2.property)()
651
- ], AddressView.prototype, "address", 2);
652
- __decorateClass([
653
- (0, import_decorators2.property)()
654
- ], AddressView.prototype, "size", 2);
655
- __decorateClass([
656
- (0, import_decorators2.property)({ type: Boolean, attribute: "name-only" })
657
- ], AddressView.prototype, "nameOnly", 2);
658
- __decorateClass([
659
- (0, import_decorators2.property)({ type: Boolean, attribute: "address-only" })
660
- ], AddressView.prototype, "addressOnly", 2);
661
- __decorateClass([
662
- (0, import_decorators2.property)({ type: Boolean, attribute: "is-card-view" })
663
- ], AddressView.prototype, "isCardView", 2);
664
- __decorateClass([
665
- (0, import_decorators2.property)()
666
- ], AddressView.prototype, "label", 2);
667
- __decorateClass([
668
- (0, import_decorators2.property)({ type: Boolean, attribute: "show-copy-button" })
669
- ], AddressView.prototype, "showCopyButton", 2);
670
- __decorateClass([
671
- (0, import_decorators2.property)({ type: Number, attribute: "max-width" })
672
- ], AddressView.prototype, "maxWidth", 2);
673
- __decorateClass([
674
- (0, import_decorators2.property)({ type: Boolean, attribute: "show-identicon" })
675
- ], AddressView.prototype, "showIdenticon", 2);
676
- __decorateClass([
677
- (0, import_decorators2.property)({ type: String, attribute: "address-color" })
678
- ], AddressView.prototype, "addressColor", 2);
679
- __decorateClass([
680
- (0, import_decorators2.property)({ type: String, attribute: "name-color" })
681
- ], AddressView.prototype, "nameColor", 2);
682
- __decorateClass([
683
- (0, import_decorators2.state)()
684
- ], AddressView.prototype, "isLoadingAddress", 2);
685
- __decorateClass([
686
- (0, import_decorators2.state)()
687
- ], AddressView.prototype, "identicon", 2);
688
- AddressView = __decorateClass([
689
- (0, import_utils2.safeCustomElement)("address-view")
690
- ], AddressView);
691
-
692
- // src/shared/custom-select.ts
693
- var import_utils3 = require("@lukso/core/utils");
694
- var import_lit4 = require("lit");
695
- var import_decorators3 = require("lit/decorators.js");
696
- var import_ethereum_blockies_base642 = __toESM(require("ethereum-blockies-base64"), 1);
697
- var CustomOption = class extends CoreLitElement {
698
- constructor() {
699
- super(...arguments);
700
- this.selected = false;
701
- this.disabled = false;
702
- this.hoverable = true;
703
- }
704
- render() {
705
- const base = "flex flex-row flex-1 items-center px-2 py-1 gap-2 h-7 rounded-md border-0 cursor-pointer text-[14px] text-neutral-20 w-full justify-between";
706
- const hover = this.hoverable ? " hover:bg-neutral-95" : "";
707
- const selected = this.selected ? " bg-neutral-90 rounded" : "";
708
- const disabled = this.disabled ? " text-neutral-60 cursor-not-allowed" : "";
709
- return import_lit4.html`<button class="${base}${hover}${selected}${disabled}" ?disabled=${this.disabled}><slot></slot></button>`;
710
- }
711
- };
712
- __decorateClass([
713
- (0, import_decorators3.property)({ type: Boolean, reflect: true })
714
- ], CustomOption.prototype, "selected", 2);
715
- __decorateClass([
716
- (0, import_decorators3.property)({ type: Boolean, reflect: true })
717
- ], CustomOption.prototype, "disabled", 2);
718
- __decorateClass([
719
- (0, import_decorators3.property)({ type: Boolean, reflect: true })
720
- ], CustomOption.prototype, "hoverable", 2);
721
- CustomOption = __decorateClass([
722
- (0, import_utils3.safeCustomElement)("custom-option")
723
- ], CustomOption);
724
- var CustomSelect = class extends CoreLitElement {
725
- constructor() {
726
- super(...arguments);
727
- this.open = false;
728
- this.options = [];
729
- this.size = "small";
730
- this.onOutsideClick = (e) => {
731
- if (!this.open) return;
732
- const path = e.composedPath();
733
- if (!path.includes(this)) this.close();
734
- };
735
- }
736
- toggleOpen() {
737
- this.open = !this.open;
738
- }
739
- close() {
740
- this.open = false;
741
- }
742
- onOptionClick(opt) {
743
- if (opt.disabled) return;
744
- this.value = opt.value;
745
- this.dispatchEvent(new Event("change", { bubbles: true }));
746
- this.close();
747
- }
748
- onKeyDown(e) {
749
- if (e.key === "Escape") this.close();
750
- }
751
- connectedCallback() {
752
- super.connectedCallback();
753
- window.addEventListener("click", this.onOutsideClick, { capture: true });
754
- }
755
- disconnectedCallback() {
756
- window.removeEventListener("click", this.onOutsideClick, { capture: true });
757
- super.disconnectedCallback();
758
- }
759
- updated() {
760
- const selectedOption = this.getSelectedOption();
761
- if (selectedOption) {
762
- this.value = selectedOption.value;
763
- }
764
- }
765
- getSelectedOption() {
766
- return this.options.find((o) => o.value === this.value);
767
- }
768
- getIdenticonSizePx() {
769
- switch (this.size) {
770
- case "x-small":
771
- return 10;
772
- case "small":
773
- return 12;
774
- case "medium":
775
- return 14;
776
- case "large":
777
- return 16;
778
- default:
779
- return 14;
780
- }
781
- }
782
- renderIdenticon(address) {
783
- const size = this.getIdenticonSizePx();
784
- const identicon = (0, import_ethereum_blockies_base642.default)(address.toLowerCase());
785
- return import_lit4.html`
786
- <div class="inline-flex items-center p-1 justify-center rounded-lg bg-neutral-100 border border-neutral-90 overflow-hidden flex-none">
787
- <img
788
- class="block"
789
- src=${identicon}
790
- alt="identicon"
791
- style="width:${size}px;height:${size}px;"
792
- />
793
- </div>
794
- `;
795
- }
796
- renderOptionLabel(option) {
797
- return option.value.startsWith("0x") ? import_lit4.html`<div class="inline-flex items-center gap-2 px-2.5 py-1.5 text-neutral-20 leading-tight font-semibold">${this.renderIdenticon(
798
- option.value
799
- )} <span class="whitespace-nowrap overflow-hidden text-ellipsis text-[14px]">${option.label}</span></div>` : import_lit4.html`<url-view url=${option.value} label=${option.label} size="x-small"></url-view>`;
800
- }
801
- render() {
802
- const selectedOption = this.getSelectedOption();
803
- return import_lit4.html`
804
- <div class="relative w-full min-w-[360px]" @keydown=${this.onKeyDown}>
805
- <button class="box-border flex flex-row flex-1 w-full items-center h-[29px] bg-white border border-neutral-90 rounded-lg text-neutral-20 cursor-pointer justify-between" @click=${this.toggleOpen} aria-haspopup="listbox" aria-expanded=${this.open}>
806
- <custom-option is-full-width .hoverable=${false}>
807
- <div class="flex flex-row flex-1 items-center justify-between">
808
- <span>${selectedOption ? this.renderOptionLabel(selectedOption) : "Select option"}</span>
809
- <lukso-icon class="transition-transform ${this.open ? "rotate-180" : ""}" name="arrow-down-sm" size="small" color="neutral-20" aria-hidden="true">
810
- </lukso-icon>
811
- </div>
812
- </custom-option>
813
- </button>
814
-
815
- ${this.open && this.options.length > 0 ? import_lit4.html`<div class="absolute left-0 top-[calc(100%+8px)] w-full bg-white border border-neutral-90 shadow-[0_0_16px_rgba(189,206,219,0.4)] rounded-xl p-2.5 flex flex-col gap-1 z-[1000] overflow-hidden box-border" role="listbox">
816
- ${this.options.map(
817
- (opt) => import_lit4.html`<custom-option .selected=${opt.value === this.value} .disabled=${opt.disabled} @click=${() => this.onOptionClick(opt)}>
818
- ${this.renderOptionLabel(opt)}
819
- </custom-option>`
820
- )}
821
- </div>` : ""}
822
- </div>
823
- `;
824
- }
825
- };
826
- __decorateClass([
827
- (0, import_decorators3.property)()
828
- ], CustomSelect.prototype, "value", 2);
829
- __decorateClass([
830
- (0, import_decorators3.property)({ type: Boolean })
831
- ], CustomSelect.prototype, "open", 2);
832
- __decorateClass([
833
- (0, import_decorators3.property)({ type: Array })
834
- ], CustomSelect.prototype, "options", 2);
835
- __decorateClass([
836
- (0, import_decorators3.property)({ type: String })
837
- ], CustomSelect.prototype, "size", 2);
838
- CustomSelect = __decorateClass([
839
- (0, import_utils3.safeCustomElement)("custom-select")
840
- ], CustomSelect);
841
-
842
- // src/shared/function-name-view.ts
843
- var import_utils4 = require("@lukso/core/utils");
844
- var import_lit5 = require("lit");
845
- var import_decorators4 = require("lit/decorators.js");
846
- var FunctionNameView = class extends CoreLitElement {
847
- constructor() {
848
- super(...arguments);
849
- this.label = "";
850
- this.icon = "user";
851
- this.size = "small";
852
- }
853
- getPadding() {
854
- switch (this.size) {
855
- case "x-small":
856
- return "2px 8px";
857
- case "small":
858
- return "4px 10px";
859
- case "medium":
860
- return "6px 12px";
861
- case "large":
862
- return "8px 14px";
863
- default:
864
- return "4px 10px";
865
- }
866
- }
867
- getFontSize() {
868
- switch (this.size) {
869
- case "x-small":
870
- return "12px";
871
- case "small":
872
- return "14px";
873
- case "medium":
874
- return "16px";
875
- case "large":
876
- return "18px";
877
- default:
878
- return "14px";
879
- }
880
- }
881
- getIconSize() {
882
- return this.size;
883
- }
884
- getHeight() {
885
- switch (this.size) {
886
- case "x-small":
887
- return "h-6";
888
- case "small":
889
- return "h-8";
890
- case "medium":
891
- return "h-10";
892
- case "large":
893
- return "h-12";
894
- default:
895
- return "h-8";
896
- }
897
- }
898
- render() {
899
- return import_lit5.html`
900
- <div class="inline-flex ${this.getHeight()} items-center gap-2 bg-neutral-90 text-neutral-20 rounded-xl leading-none font-semibold" style="padding:${this.getPadding()}; font-size:${this.getFontSize()};">
901
- <lukso-icon name=${this.icon} size=${this.getIconSize()} color=${this.color || ""}></lukso-icon>
902
- <span class="whitespace-nowrap"><slot>${this.label}</slot></span>
903
- </div>
904
- `;
905
- }
906
- };
907
- __decorateClass([
908
- (0, import_decorators4.property)()
909
- ], FunctionNameView.prototype, "label", 2);
910
- __decorateClass([
911
- (0, import_decorators4.property)()
912
- ], FunctionNameView.prototype, "icon", 2);
913
- __decorateClass([
914
- (0, import_decorators4.property)()
915
- ], FunctionNameView.prototype, "size", 2);
916
- __decorateClass([
917
- (0, import_decorators4.property)({ attribute: "color" })
918
- ], FunctionNameView.prototype, "color", 2);
919
- FunctionNameView = __decorateClass([
920
- (0, import_utils4.safeCustomElement)("function-name-view")
921
- ], FunctionNameView);
922
-
923
- // src/shared/gas-provider-view.ts
924
- var import_utils5 = require("@lukso/core/utils");
925
- var import_lit6 = require("lit");
926
- var import_decorators5 = require("lit/decorators.js");
927
- var GasProviderView = class extends CoreLitElement {
928
- constructor() {
929
- super(...arguments);
930
- this.allRelayers = [];
931
- this.balance = 0;
932
- this.symbol = "LYX";
933
- this.decimals = 18;
934
- this.transactionFee = 0;
935
- this.relayerAvailable = 0;
936
- this.relayerUsed = 0;
937
- this.relayerToBeUsed = 0;
938
- this.relayerResetDate = "N/A";
939
- }
940
- formatToken(amount) {
941
- return (amount / 10 ** this.decimals).toLocaleString(void 0, {
942
- maximumFractionDigits: 6
943
- });
944
- }
945
- onSelectChanged(e) {
946
- const value = e.target.value;
947
- if (!value) return;
948
- if (this.controllerAddress && value === this.controllerAddress) {
949
- const next = {
950
- type: "controller",
951
- id: this.controllerAddress
952
- };
953
- if (!this.selectedGasProvider || this.selectedGasProvider.id !== next.id || this.selectedGasProvider.type !== next.type) {
954
- this.selectedGasProvider = next;
955
- this.dispatchEvent(
956
- new CustomEvent("on-gas-provider-change", {
957
- detail: next,
958
- bubbles: true
959
- })
960
- );
961
- }
962
- return;
963
- }
964
- const match = this.allRelayers.find(
965
- (r) => r.website === value || r.apiUrl === value
966
- );
967
- if (match) {
968
- const next = { type: "relayer", id: match.id };
969
- if (!this.selectedGasProvider || this.selectedGasProvider.id !== next.id || this.selectedGasProvider.type !== next.type) {
970
- this.selectedGasProvider = next;
971
- this.dispatchEvent(
972
- new CustomEvent("on-gas-provider-change", {
973
- detail: next,
974
- bubbles: true
975
- })
976
- );
977
- }
978
- return;
979
- }
980
- }
981
- renderProgress(totalAvailable, used, toBeUsed, symbol, hasError) {
982
- const usedPercent = totalAvailable ? used / totalAvailable * 100 : 0;
983
- const toBeUsedPercent = totalAvailable ? toBeUsed / totalAvailable * 100 : 0;
984
- const barOverHalf = usedPercent > 50;
985
- return import_lit6.html`<progress-view
986
- class=${hasError ? "error" : ""}
987
- .data=${[
988
- {
989
- value: usedPercent,
990
- color: "var(--green-54)",
991
- title: `${usedPercent}%`
992
- },
993
- {
994
- value: toBeUsedPercent,
995
- color: "var(--neutral-60)",
996
- title: `${toBeUsedPercent}%`
997
- }
998
- ]}
999
- label-position=${barOverHalf ? "left" : "right"}
1000
- .label=${`${toBeUsed} / ${String(totalAvailable)} ${symbol}`}
1001
- >
1002
- </progress-view>`;
1003
- }
1004
- renderControllerProgress() {
1005
- return this.renderProgress(
1006
- this.balance,
1007
- 0,
1008
- this.transactionFee,
1009
- this.symbol,
1010
- this.transactionFee > this.balance
1011
- );
1012
- }
1013
- renderRelayerProgress() {
1014
- return this.renderProgress(
1015
- this.relayerAvailable,
1016
- this.relayerUsed,
1017
- this.relayerToBeUsed,
1018
- "M GAS",
1019
- this.relayerToBeUsed > this.relayerAvailable
1020
- );
1021
- }
1022
- displayRelayerResetDate() {
1023
- const date = new Date(this.relayerResetDate);
1024
- return Number.isNaN(date.getTime()) ? "N/A" : date.toLocaleDateString();
1025
- }
1026
- render() {
1027
- const formatted = this.formatToken(this.balance);
1028
- const relayerOptions = this.allRelayers.map((r) => ({
1029
- value: r.website || r.apiUrl || `relayer:${r.id}`,
1030
- label: r.name,
1031
- disabled: false
1032
- }));
1033
- const controllerOption = this.controllerAddress ? [
1034
- {
1035
- value: this.controllerAddress,
1036
- label: this.controllerName ? `${this.controllerName} (${formatted} ${this.symbol})` : `UP Browser Extension (${formatted} ${this.symbol})`,
1037
- disabled: false
1038
- }
1039
- ] : [];
1040
- const options = [...relayerOptions, ...controllerOption];
1041
- const selectedValue = this.selectedGasProvider ? this.selectedGasProvider.type === "controller" ? this.controllerAddress : (() => {
1042
- const r = this.allRelayers.find(
1043
- (x) => x.id === this.selectedGasProvider?.id
1044
- );
1045
- return r?.website || r?.apiUrl || `relayer:${this.selectedGasProvider?.id}`;
1046
- })() : void 0;
1047
- return import_lit6.html`
1048
- <div class="w-full">
1049
- <custom-select .value=${selectedValue} .options=${options} @change=${this.onSelectChanged}></custom-select>
1050
- ${this.selectedGasProvider ? import_lit6.html`<div class="mt-2">
1051
- ${this.selectedGasProvider?.type === "controller" ? this.renderControllerProgress() : this.renderRelayerProgress()}
1052
- ${this.selectedGasProvider?.type === "relayer" ? import_lit6.html`<span class="text-[12px] text-neutral-60 mt-2 block">
1053
- Your total of ${this.relayerAvailable}M resets on ${this.displayRelayerResetDate()}.
1054
- </span>` : import_lit6.html``}
1055
- </div>` : import_lit6.html``}
1056
-
1057
- </div>
1058
- `;
1059
- }
1060
- };
1061
- __decorateClass([
1062
- (0, import_decorators5.property)({ type: Array, reflect: true })
1063
- ], GasProviderView.prototype, "allRelayers", 2);
1064
- __decorateClass([
1065
- (0, import_decorators5.property)({ type: Number, reflect: true })
1066
- ], GasProviderView.prototype, "balance", 2);
1067
- __decorateClass([
1068
- (0, import_decorators5.property)({ type: Object, attribute: "selected-gas-provider", reflect: true })
1069
- ], GasProviderView.prototype, "selectedGasProvider", 2);
1070
- __decorateClass([
1071
- (0, import_decorators5.property)({ attribute: "controller-address", reflect: true })
1072
- ], GasProviderView.prototype, "controllerAddress", 2);
1073
- __decorateClass([
1074
- (0, import_decorators5.property)({ attribute: "controller-name", reflect: true })
1075
- ], GasProviderView.prototype, "controllerName", 2);
1076
- __decorateClass([
1077
- (0, import_decorators5.property)({ attribute: "symbol", reflect: true })
1078
- ], GasProviderView.prototype, "symbol", 2);
1079
- __decorateClass([
1080
- (0, import_decorators5.property)({ type: Number, reflect: true })
1081
- ], GasProviderView.prototype, "decimals", 2);
1082
- __decorateClass([
1083
- (0, import_decorators5.property)({ type: Number, attribute: "transaction-fee", reflect: true })
1084
- ], GasProviderView.prototype, "transactionFee", 2);
1085
- __decorateClass([
1086
- (0, import_decorators5.property)({ type: Number, attribute: "relayer-available", reflect: true })
1087
- ], GasProviderView.prototype, "relayerAvailable", 2);
1088
- __decorateClass([
1089
- (0, import_decorators5.property)({ type: Number, attribute: "relayer-used", reflect: true })
1090
- ], GasProviderView.prototype, "relayerUsed", 2);
1091
- __decorateClass([
1092
- (0, import_decorators5.property)({ type: Number, attribute: "relayer-to-be-used", reflect: true })
1093
- ], GasProviderView.prototype, "relayerToBeUsed", 2);
1094
- __decorateClass([
1095
- (0, import_decorators5.property)({ attribute: "relayer-reset-date", reflect: true })
1096
- ], GasProviderView.prototype, "relayerResetDate", 2);
1097
- GasProviderView = __decorateClass([
1098
- (0, import_utils5.safeCustomElement)("gas-provider-view")
1099
- ], GasProviderView);
1100
-
1101
- // src/shared/icon-view.ts
1102
- var import_task3 = require("@lit/task");
1103
- var import_utils6 = require("@lukso/core/utils");
1104
- var import_transaction_view_headless3 = require("@lukso/transaction-view-headless");
1105
- var import_lit7 = require("lit");
1106
- var import_decorators6 = require("lit/decorators.js");
1107
- var IconView = class extends CoreLitElement {
1108
- constructor() {
1109
- super(...arguments);
1110
- this.size = "small";
1111
- this.showName = true;
1112
- this.namePosition = "below";
1113
- this.maxWidth = 200;
1114
- this.showIconIdenticon = true;
1115
- this.showLabelIdenticon = false;
1116
- this.forceUnresolved = false;
1117
- // Composables
1118
- this.imageLoader = (0, import_transaction_view_headless3.useImageLoader)();
1119
- this.addressResolver = (0, import_transaction_view_headless3.useAddressResolver)();
1120
- this.isLoadingAddress = false;
1121
- this.isLoadingImage = false;
1122
- // Task for resolving address data
1123
- this.addressTask = new import_task3.Task(this, {
1124
- task: async ([address]) => {
1125
- if (!address) return null;
1126
- this.isLoadingAddress = true;
1127
- try {
1128
- const resolved = await this.addressResolver.resolveAddress(address);
1129
- this.requestUpdate();
1130
- return resolved;
1131
- } catch (error) {
1132
- console.warn("\u274C IconView: Failed to resolve address:", error);
1133
- return null;
1134
- } finally {
1135
- this.isLoadingAddress = false;
1136
- }
1137
- },
1138
- args: () => [this.address]
1139
- });
1140
- // Task for loading profile image
1141
- this.imageTask = new import_task3.Task(this, {
1142
- task: async ([resolved]) => {
1143
- if (!resolved) return null;
1144
- this.isLoadingImage = true;
1145
- try {
1146
- let image = null;
1147
- if (this.imageHint && resolved[this.imageHint]) {
1148
- const imageArray = resolved[this.imageHint];
1149
- if (Array.isArray(imageArray) && imageArray.length > 0) {
1150
- image = await this.imageLoader.loadImage(imageArray, {
1151
- width: this.getSizePixels(),
1152
- height: this.getSizePixels(),
1153
- dpr: window.devicePixelRatio || 1,
1154
- index: this.imageIndex
1155
- });
1156
- }
1157
- } else {
1158
- image = await this.imageLoader.loadProfileImage(resolved, {
1159
- width: this.getSizePixels(),
1160
- height: this.getSizePixels(),
1161
- dpr: window.devicePixelRatio || 1,
1162
- index: this.imageIndex
1163
- });
1164
- }
1165
- return image || this.imageLoader.getFallbackImage(resolved);
1166
- } catch (error) {
1167
- console.warn("Failed to load address image:", error);
1168
- return this.imageLoader.getFallbackImage(resolved || {});
1169
- } finally {
1170
- this.isLoadingImage = false;
1171
- }
1172
- },
1173
- args: () => [this.addressTask.value]
1174
- });
1175
- }
1176
- /**
1177
- * Get pixel size for the current size setting
1178
- */
1179
- getSizePixels() {
1180
- switch (this.size) {
1181
- case "x-small":
1182
- return 16;
1183
- case "small":
1184
- return 24;
1185
- case "medium":
1186
- return 32;
1187
- case "large":
1188
- return 48;
1189
- case "2x-large":
1190
- return 124;
1191
- default:
1192
- return 24;
1193
- }
1194
- }
1195
- /**
1196
- * Check if this is a contract address (shows square icon)
1197
- */
1198
- get isContract() {
1199
- const resolved = this.addressTask.value;
1200
- return resolved ? this.imageLoader.isContractAddress(resolved) : false;
1201
- }
1202
- /**
1203
- * Handle icon click
1204
- */
1205
- handleClick() {
1206
- this.dispatchEvent(
1207
- new CustomEvent("address-click", {
1208
- detail: {
1209
- address: this.address,
1210
- resolved: this.addressTask.value
1211
- },
1212
- bubbles: true
1213
- })
1214
- );
1215
- }
1216
- render() {
1217
- const imageResult = this.imageTask.value;
1218
- const containerClass = this.namePosition === "beside" ? "row" : "column";
1219
- return import_lit7.html`
1220
- <div class="${containerClass === "row" ? "flex items-start gap-1" : "flex flex-col items-center gap-1"}">
1221
- ${this.label ? import_lit7.html`<div class="text-[12px] text-neutral-60 font-medium">${this.label}</div>` : ""}
1222
-
1223
- <div class="${this.namePosition === "beside" ? "inline-flex flex-row items-center gap-2" : "inline-flex flex-col items-center gap-1.5"}">
1224
- <lukso-profile
1225
- size=${this.size}
1226
- profile-address=${this.address}
1227
- profile-url=${imageResult?.src || ""}
1228
- ?has-identicon=${this.showIconIdenticon}
1229
- ?is-square=${this.isContract}
1230
- class="inline-flex items-center cursor-pointer transition-transform duration-200 hover:scale-105"
1231
- @click=${this.handleClick}
1232
- ></lukso-profile>
1233
-
1234
- ${this.showName ? import_lit7.html`
1235
- <address-view
1236
- class="leading-none"
1237
- address=${this.address}
1238
- .showIdenticon=${this.showLabelIdenticon}
1239
- size=${this.size}
1240
- max-width=${this.maxWidth}
1241
- ></address-view>
1242
- ` : ""}
1243
- </div>
1244
- </div>
1245
- `;
1246
- }
1247
- };
1248
- __decorateClass([
1249
- (0, import_decorators6.property)()
1250
- ], IconView.prototype, "address", 2);
1251
- __decorateClass([
1252
- (0, import_decorators6.property)({ type: Object })
1253
- ], IconView.prototype, "resolved", 2);
1254
- __decorateClass([
1255
- (0, import_decorators6.property)()
1256
- ], IconView.prototype, "size", 2);
1257
- __decorateClass([
1258
- (0, import_decorators6.property)()
1259
- ], IconView.prototype, "label", 2);
1260
- __decorateClass([
1261
- (0, import_decorators6.property)({ type: Boolean, attribute: "show-name" })
1262
- ], IconView.prototype, "showName", 2);
1263
- __decorateClass([
1264
- (0, import_decorators6.property)({ attribute: "name-position" })
1265
- ], IconView.prototype, "namePosition", 2);
1266
- __decorateClass([
1267
- (0, import_decorators6.property)({ type: Number, attribute: "max-width" })
1268
- ], IconView.prototype, "maxWidth", 2);
1269
- __decorateClass([
1270
- (0, import_decorators6.property)({ type: Boolean, attribute: "show-icon-identicon" })
1271
- ], IconView.prototype, "showIconIdenticon", 2);
1272
- __decorateClass([
1273
- (0, import_decorators6.property)({ type: Boolean, attribute: "show-label-identicon" })
1274
- ], IconView.prototype, "showLabelIdenticon", 2);
1275
- __decorateClass([
1276
- (0, import_decorators6.property)({ type: Boolean, attribute: "force-unresolved" })
1277
- ], IconView.prototype, "forceUnresolved", 2);
1278
- __decorateClass([
1279
- (0, import_decorators6.property)({ type: String, attribute: "image-hint" })
1280
- ], IconView.prototype, "imageHint", 2);
1281
- __decorateClass([
1282
- (0, import_decorators6.property)({ type: Number, attribute: "image-index" })
1283
- ], IconView.prototype, "imageIndex", 2);
1284
- IconView = __decorateClass([
1285
- (0, import_utils6.safeCustomElement)("icon-view")
1286
- ], IconView);
1287
-
1288
- // src/shared/image-loader-controller.ts
1289
- var import_transaction_view_headless4 = require("@lukso/transaction-view-headless");
1290
- var ImageLoaderController = class {
1291
- constructor(host) {
1292
- this.headlessLoader = (0, import_transaction_view_headless4.useImageLoader)();
1293
- // Internal state
1294
- this._state = {
1295
- result: null,
1296
- loading: false,
1297
- error: null
1298
- };
1299
- this.host = host;
1300
- host.addController(this);
1301
- }
1302
- hostConnected() {
1303
- }
1304
- hostDisconnected() {
1305
- }
1306
- get state() {
1307
- return this._state;
1308
- }
1309
- get isLoading() {
1310
- return this._state.loading;
1311
- }
1312
- get error() {
1313
- return this._state.error;
1314
- }
1315
- get result() {
1316
- return this._state.result;
1317
- }
1318
- /**
1319
- * Load image from data array
1320
- */
1321
- async loadImage(imageData, options = {}) {
1322
- this.updateState({ loading: true, error: null });
1323
- try {
1324
- const result = await this.headlessLoader.loadImage(imageData, options);
1325
- this.updateState({ result, loading: false });
1326
- return result;
1327
- } catch (err) {
1328
- const error = err instanceof Error ? err.message : "Failed to load image";
1329
- this.updateState({ loading: false, error });
1330
- return null;
1331
- }
1332
- }
1333
- /**
1334
- * Load profile image from address data
1335
- */
1336
- async loadProfileImage(addressData, options = {}) {
1337
- this.updateState({ loading: true, error: null });
1338
- try {
1339
- const result = await this.headlessLoader.loadProfileImage(addressData, options) || this.headlessLoader.getFallbackImage(addressData);
1340
- this.updateState({ result, loading: false });
1341
- return result;
1342
- } catch (err) {
1343
- const error = err instanceof Error ? err.message : "Failed to load profile image";
1344
- const fallback = this.headlessLoader.getFallbackImage(addressData);
1345
- this.updateState({ result: fallback, loading: false, error });
1346
- return fallback;
1347
- }
1348
- }
1349
- /**
1350
- * Load image from address signal (reactive)
1351
- */
1352
- loadFromSignal(addressSignal, options = {}) {
1353
- const addressData = addressSignal.value?.data;
1354
- if (!addressData) {
1355
- const fallback = this.headlessLoader.getFallbackImage({});
1356
- this.updateState({ result: fallback, loading: false, error: null });
1357
- return;
1358
- }
1359
- this.loadProfileImage(addressData, options);
1360
- }
1361
- /**
1362
- * Get fallback image synchronously
1363
- */
1364
- getFallbackImage(addressData) {
1365
- return this.headlessLoader.getFallbackImage(addressData);
1366
- }
1367
- /**
1368
- * Check if address is a contract
1369
- */
1370
- isContractAddress(addressData) {
1371
- return this.headlessLoader.isContractAddress(addressData);
1372
- }
1373
- /**
1374
- * Clear current state
1375
- */
1376
- clear() {
1377
- this.updateState({ result: null, loading: false, error: null });
1378
- }
1379
- updateState(updates) {
1380
- this._state = { ...this._state, ...updates };
1381
- this.host.requestUpdate();
1382
- }
1383
- };
1384
- function useImageLoader3(host) {
1385
- return new ImageLoaderController(host);
1386
- }
1387
-
1388
- // src/shared/notification-view.ts
1389
- var import_utils7 = require("@lukso/core/utils");
1390
- var import_lit8 = require("lit");
1391
- var import_decorators7 = require("lit/decorators.js");
1392
- var NotificationView = class extends CoreLitElement {
1393
- constructor() {
1394
- super(...arguments);
1395
- this.variant = "info";
1396
- this.message = "";
1397
- this.title = "";
1398
- this.acknowledgeable = false;
1399
- this.acknowledgeText = "I understand and want to continue";
1400
- this.acknowledged = false;
1401
- this.checked = false;
1402
- }
1403
- handleAcknowledgeChange(e) {
1404
- e.stopPropagation();
1405
- const target = e.target;
1406
- const checked = !!(target?.checked ?? e.detail?.checked ?? false);
1407
- if (checked !== this.checked) {
1408
- this.checked = checked;
1409
- }
1410
- if (this.checked) {
1411
- this.acknowledged = true;
1412
- this.dispatchEvent(
1413
- new CustomEvent("notification-acknowledged", {
1414
- detail: {
1415
- variant: this.variant,
1416
- message: this.message,
1417
- title: this.title,
1418
- checked: this.checked
1419
- },
1420
- bubbles: true
1421
- })
1422
- );
1423
- }
1424
- }
1425
- render() {
1426
- if (this.acknowledged) return import_lit8.html``;
1427
- return import_lit8.html`
1428
- <div class="grid grid-cols-[24px_1fr] items-start gap-3 p-3 rounded-xl text-neutral-10 leading-snug ${this.getVariantBackgroundClass()}">
1429
- <div class="flex items-center justify-center text-[16px] text-neutral-20 self-center" aria-hidden="true">
1430
- <lukso-icon name="${this.renderIcon()}" size="small" color="${this.getVariantColor()}"></lukso-icon>
1431
- </div>
1432
- <div class="text-[14px] flex flex-col gap-1.5">
1433
- ${this.title ? import_lit8.html`<div class="font-semibold text-neutral-20 paragraph-inter-14-semi-bold">${this.title}</div>` : ""}
1434
- <div class="text-neutral-20"><slot>${this.message}</slot></div>
1435
- ${this.acknowledgeable ? import_lit8.html`
1436
- <div class="inline-flex items-center gap-2 mt-1 text-[12px] text-neutral-20 select-none cursor-pointer paragraph-inter-12-medium">
1437
- <lukso-checkbox
1438
- size="x-small"
1439
- ?checked=${this.checked}
1440
- @change=${this.handleAcknowledgeChange}
1441
- ><span class="paragraph-inter-14-semi-bold">${this.acknowledgeText}</span></lukso-checkbox>
1442
- </div>
1443
- ` : ""}
1444
- </div>
1445
- </div>
1446
- `;
1447
- }
1448
- renderIcon() {
1449
- switch (this.variant) {
1450
- case "success":
1451
- return "bulb-outline";
1452
- case "warning":
1453
- return "warning-round";
1454
- case "error":
1455
- return "warning-triangle";
1456
- default:
1457
- return "bulb-outline";
1458
- }
1459
- }
1460
- getVariantColor() {
1461
- switch (this.variant) {
1462
- case "success":
1463
- return "green-45";
1464
- case "warning":
1465
- return "yellow-55";
1466
- case "error":
1467
- return "red-55";
1468
- default:
1469
- return "blue-50";
1470
- }
1471
- }
1472
- getVariantBackgroundClass() {
1473
- switch (this.variant) {
1474
- case "success":
1475
- return "bg-green-85";
1476
- case "warning":
1477
- return "bg-yellow-85";
1478
- case "error":
1479
- return "bg-red-85";
1480
- default:
1481
- return "bg-blue-85";
1482
- }
1483
- }
1484
- };
1485
- __decorateClass([
1486
- (0, import_decorators7.property)()
1487
- ], NotificationView.prototype, "variant", 2);
1488
- __decorateClass([
1489
- (0, import_decorators7.property)()
1490
- ], NotificationView.prototype, "message", 2);
1491
- __decorateClass([
1492
- (0, import_decorators7.property)()
1493
- ], NotificationView.prototype, "title", 2);
1494
- __decorateClass([
1495
- (0, import_decorators7.property)({ type: Boolean, attribute: "acknowledgeable" })
1496
- ], NotificationView.prototype, "acknowledgeable", 2);
1497
- __decorateClass([
1498
- (0, import_decorators7.property)({ attribute: "acknowledge-text" })
1499
- ], NotificationView.prototype, "acknowledgeText", 2);
1500
- __decorateClass([
1501
- (0, import_decorators7.state)()
1502
- ], NotificationView.prototype, "acknowledged", 2);
1503
- __decorateClass([
1504
- (0, import_decorators7.property)({ type: Boolean, reflect: true })
1505
- ], NotificationView.prototype, "checked", 2);
1506
- NotificationView = __decorateClass([
1507
- (0, import_utils7.safeCustomElement)("notification-view")
1508
- ], NotificationView);
1509
-
1510
- // src/shared/progress-view.ts
1511
- var import_utils8 = require("@lukso/core/utils");
1512
- var import_lit9 = require("lit");
1513
- var import_decorators8 = require("lit/decorators.js");
1514
- var ProgressView = class extends CoreLitElement {
1515
- constructor() {
1516
- super(...arguments);
1517
- this.data = [];
1518
- this.labelPosition = "right";
1519
- }
1520
- renderGasProviderLabel() {
1521
- return import_lit9.html`
1522
- ${this.label ? import_lit9.html`
1523
- <span class="progress-label-value">${this.label}</span>
1524
- ${this.unit ? import_lit9.html`<span class="progress-label-unit" data-testid="unit">${this.unit}</span>` : ""}
1525
- ` : import_lit9.html`
1526
- <slot></slot>
1527
- ${this.unit ? import_lit9.html`<span class="progress-label-unit" data-testid="unit">${this.unit}</span>` : ""}
1528
- `}
1529
- `;
1530
- }
1531
- render() {
1532
- const isError = (this.className || "").split(/\s+/).includes("error");
1533
- return import_lit9.html`
1534
- <div class="relative grid w-full ${this.className || ""}">
1535
- <div class="flex bg-neutral-95 h-6 rounded-lg relative col-[1] row-[1] overflow-hidden" style=${isError ? "background-color: var(--red-65);" : ""} role="progressbar">
1536
- ${this.data.map((seg, index) => {
1537
- const width = `${Math.max(0, Math.min(100, Number(seg.value || 0)))}%`;
1538
- const backgroundColor = seg.color || "var(--neutral-90)";
1539
- const title = seg.title || "";
1540
- return import_lit9.html`<div
1541
- class="h-full flex items-center justify-center text-[10px] font-semibold"
1542
- style=${`width:${width};background-color:${backgroundColor};`}
1543
- data-testid=${`value-${index}`}
1544
- >${title}</div>`;
1545
- })}
1546
- </div>
1547
- <div class=${`flex items-center absolute h-6 rounded-lg overflow-visible w-full col-[1] row-[1] top-0 left-0 ${this.labelPosition === "left" ? "justify-start" : "justify-end"}`} data-testid="progress-labels">
1548
- <div class="text-[13px] font-semibold text-white mix-blend-difference h-inherit flex items-center p-0 right-4 absolute" data-testid="label">
1549
- ${this.renderGasProviderLabel()}
1550
- </div>
1551
- </div>
1552
- </div>
1553
- `;
1554
- }
1555
- };
1556
- __decorateClass([
1557
- (0, import_decorators8.property)({ type: Array })
1558
- ], ProgressView.prototype, "data", 2);
1559
- __decorateClass([
1560
- (0, import_decorators8.property)()
1561
- ], ProgressView.prototype, "label", 2);
1562
- __decorateClass([
1563
- (0, import_decorators8.property)()
1564
- ], ProgressView.prototype, "unit", 2);
1565
- __decorateClass([
1566
- (0, import_decorators8.property)()
1567
- ], ProgressView.prototype, "address", 2);
1568
- __decorateClass([
1569
- (0, import_decorators8.property)({ attribute: "label-position" })
1570
- ], ProgressView.prototype, "labelPosition", 2);
1571
- ProgressView = __decorateClass([
1572
- (0, import_utils8.safeCustomElement)("progress-view")
1573
- ], ProgressView);
1574
-
1575
- // src/shared/scroll-to-bottom-button.ts
1576
- var import_utils9 = require("@lukso/core/utils");
1577
- var import_lit10 = require("lit");
1578
- var import_decorators9 = require("lit/decorators.js");
1579
- var ScrollToBottomButton = class extends CoreLitElement {
1580
- constructor() {
1581
- super(...arguments);
1582
- this.show = false;
1583
- this.color = "neutral-20";
1584
- this.iconSize = "medium";
1585
- this.iconName = "arrow-down-lg";
1586
- }
1587
- handleClick() {
1588
- this.dispatchEvent(new CustomEvent("scroll-to-bottom", { bubbles: true }));
1589
- }
1590
- render() {
1591
- return import_lit10.html`
1592
- <div class="h-14 w-[140px] self-center rounded-t-[120px] bg-[radial-gradient(ellipse_75px_52px_at_bottom_center,rgba(255,255,255,0.78)_0%,rgba(255,255,255,0)_112.5%)] flex justify-center items-center transition-opacity duration-700 ease-in-out ${this.show ? "opacity-100 z-10" : "opacity-0 -z-10"}">
1593
- <div class="flex justify-center items-center w-10 h-10 rounded-full border border-neutral-90 shadow-[0_0_16px_rgba(189,206,219,0.4)] bg-neutral-100 cursor-pointer animate-bounce" @click=${this.handleClick}>
1594
- <lukso-icon
1595
- name=${this.iconName}
1596
- size=${this.iconSize}
1597
- color=${this.color}
1598
- ></lukso-icon>
1599
- </div>
1600
- </div>
1601
- `;
1602
- }
1603
- };
1604
- __decorateClass([
1605
- (0, import_decorators9.property)({ type: Boolean, attribute: "show" })
1606
- ], ScrollToBottomButton.prototype, "show", 2);
1607
- __decorateClass([
1608
- (0, import_decorators9.property)()
1609
- ], ScrollToBottomButton.prototype, "color", 2);
1610
- __decorateClass([
1611
- (0, import_decorators9.property)({ attribute: "icon-size" })
1612
- ], ScrollToBottomButton.prototype, "iconSize", 2);
1613
- __decorateClass([
1614
- (0, import_decorators9.property)({ attribute: "icon-name" })
1615
- ], ScrollToBottomButton.prototype, "iconName", 2);
1616
- ScrollToBottomButton = __decorateClass([
1617
- (0, import_utils9.safeCustomElement)("scroll-to-bottom-button")
1618
- ], ScrollToBottomButton);
1619
-
1620
- // src/shared/signal-controller.ts
1621
- var SignalController = class _SignalController {
1622
- constructor(host, signal) {
1623
- this.host = host;
1624
- this.signal = signal;
1625
- host.addController(this);
1626
- }
1627
- hostConnected() {
1628
- let lastValue = this.signal.value;
1629
- const check = () => {
1630
- const currentValue = this.signal.value;
1631
- if (currentValue !== lastValue) {
1632
- lastValue = currentValue;
1633
- this.host.requestUpdate();
1634
- }
1635
- };
1636
- const interval = setInterval(check, 50);
1637
- this.unsubscribe = () => clearInterval(interval);
1638
- }
1639
- hostDisconnected() {
1640
- if (this.unsubscribe) {
1641
- this.unsubscribe();
1642
- this.unsubscribe = void 0;
1643
- }
1644
- }
1645
- get value() {
1646
- return this.signal.value;
1647
- }
1648
- /**
1649
- * Create a new SignalController for a different signal
1650
- */
1651
- static create(host, signal) {
1652
- return new _SignalController(host, signal);
1653
- }
1654
- };
1655
- var MultiSignalController = class {
1656
- constructor(host, signals) {
1657
- this.unsubscribes = [];
1658
- this.host = host;
1659
- this.signals = signals;
1660
- host.addController(this);
1661
- }
1662
- hostConnected() {
1663
- this.signals.forEach((signal, index) => {
1664
- let lastValue = signal.value;
1665
- const check = () => {
1666
- const currentValue = signal.value;
1667
- if (currentValue !== lastValue) {
1668
- lastValue = currentValue;
1669
- this.host.requestUpdate();
1670
- }
1671
- };
1672
- const interval = setInterval(check, 50);
1673
- this.unsubscribes[index] = () => clearInterval(interval);
1674
- });
1675
- }
1676
- hostDisconnected() {
1677
- this.unsubscribes.forEach((unsubscribe) => {
1678
- unsubscribe();
1679
- });
1680
- this.unsubscribes = [];
1681
- }
1682
- getValue(index) {
1683
- return this.signals[index]?.value;
1684
- }
1685
- getValues() {
1686
- return this.signals.map((signal) => signal.value);
1687
- }
1688
- };
1689
- function useSignal(host, signal) {
1690
- return new SignalController(host, signal);
1691
- }
1692
- function useSignals(host, signals) {
1693
- return new MultiSignalController(host, signals);
1694
- }
1695
-
1696
- // src/shared/transaction-view-controller.ts
1697
- var import_transaction_view_headless5 = require("@lukso/transaction-view-headless");
1698
- var TransactionViewController = class {
1699
- constructor(host, transaction, options) {
1700
- this.transaction = transaction;
1701
- this.options = options;
1702
- this.headlessInstance = null;
1703
- // Internal state
1704
- this._state = {
1705
- matches: [],
1706
- bestMatch: null,
1707
- component: null,
1708
- loading: false,
1709
- error: null,
1710
- isResolvingAddresses: false,
1711
- resolvedAddresses: {}
1712
- };
1713
- this.host = host;
1714
- host.addController(this);
1715
- this.initialize();
1716
- }
1717
- hostConnected() {
1718
- this.setupSync();
1719
- }
1720
- hostDisconnected() {
1721
- if (this.syncInterval) {
1722
- clearInterval(this.syncInterval);
1723
- this.syncInterval = void 0;
1724
- }
1725
- }
1726
- get state() {
1727
- return this._state;
1728
- }
1729
- get matches() {
1730
- return this._state.matches;
1731
- }
1732
- get bestMatch() {
1733
- return this._state.bestMatch;
1734
- }
1735
- get component() {
1736
- return this._state.component;
1737
- }
1738
- get isLoading() {
1739
- return this._state.loading;
1740
- }
1741
- get error() {
1742
- return this._state.error;
1743
- }
1744
- get isResolvingAddresses() {
1745
- return this._state.isResolvingAddresses;
1746
- }
1747
- get resolvedAddresses() {
1748
- return this._state.resolvedAddresses;
1749
- }
1750
- /**
1751
- * Load a specific match
1752
- */
1753
- async loadMatch(match) {
1754
- if (!this.headlessInstance) {
1755
- throw new Error("Transaction view not initialized");
1756
- }
1757
- try {
1758
- const result = await this.headlessInstance.loadMatch(match);
1759
- this.syncState();
1760
- return result;
1761
- } catch (err) {
1762
- this.syncState();
1763
- throw err;
1764
- }
1765
- }
1766
- /**
1767
- * Load the best match
1768
- */
1769
- async loadBestMatch() {
1770
- if (!this.headlessInstance) {
1771
- throw new Error("Transaction view not initialized");
1772
- }
1773
- try {
1774
- const result = await this.headlessInstance.loadBestMatch();
1775
- this.syncState();
1776
- return result;
1777
- } catch (err) {
1778
- this.syncState();
1779
- throw err;
1780
- }
1781
- }
1782
- /**
1783
- * Refresh matches
1784
- */
1785
- refreshMatches() {
1786
- if (!this.headlessInstance) {
1787
- console.warn("Transaction view not initialized, cannot refresh matches");
1788
- return;
1789
- }
1790
- this.headlessInstance.refreshMatches();
1791
- this.syncState();
1792
- }
1793
- /**
1794
- * Resolve addresses
1795
- */
1796
- async resolveAddresses() {
1797
- if (!this.headlessInstance) {
1798
- throw new Error("Transaction view not initialized");
1799
- }
1800
- try {
1801
- await this.headlessInstance.resolveAddresses();
1802
- this.syncState();
1803
- } catch (err) {
1804
- this.syncState();
1805
- throw err;
1806
- }
1807
- }
1808
- /**
1809
- * Update transaction and options
1810
- */
1811
- update(transaction, options) {
1812
- this.transaction = transaction;
1813
- this.options = options;
1814
- this.initialize();
1815
- }
1816
- /**
1817
- * Get the best matching view without loading
1818
- */
1819
- static findBestMatch(transaction, framework = "lit") {
1820
- return (0, import_transaction_view_headless5.findBestTransactionView)(transaction, framework);
1821
- }
1822
- /**
1823
- * Get all matching views without loading
1824
- */
1825
- static findAllMatches(transaction, framework = "lit") {
1826
- return (0, import_transaction_view_headless5.findAllTransactionViews)(transaction, framework);
1827
- }
1828
- initialize() {
1829
- try {
1830
- this.headlessInstance = (0, import_transaction_view_headless5.useTransactionView)(
1831
- this.transaction,
1832
- this.options
1833
- );
1834
- this.syncState();
1835
- } catch (err) {
1836
- this.updateState({
1837
- error: err instanceof Error ? err : new Error("Failed to initialize transaction view")
1838
- });
1839
- console.error("Failed to initialize transaction view:", err);
1840
- }
1841
- }
1842
- setupSync() {
1843
- this.syncState();
1844
- this.syncInterval = setInterval(() => {
1845
- this.syncState();
1846
- }, 100);
1847
- }
1848
- syncState() {
1849
- if (!this.headlessInstance) return;
1850
- this.updateState({
1851
- matches: this.headlessInstance.matches,
1852
- bestMatch: this.headlessInstance.bestMatch,
1853
- component: this.headlessInstance.component,
1854
- loading: this.headlessInstance.isLoading,
1855
- error: this.headlessInstance.error,
1856
- isResolvingAddresses: this.headlessInstance.isResolvingAddresses,
1857
- resolvedAddresses: this.headlessInstance.resolvedAddresses
1858
- });
1859
- }
1860
- updateState(updates) {
1861
- this._state = { ...this._state, ...updates };
1862
- this.host.requestUpdate();
1863
- }
1864
- };
1865
- function useTransactionView(host, transaction, options) {
1866
- return new TransactionViewController(host, transaction, options);
1867
- }
1868
- var TransactionSignalController = class {
1869
- constructor(host, signal) {
1870
- this._data = null;
1871
- this._loading = false;
1872
- this._error = null;
1873
- this.host = host;
1874
- this.signal = signal;
1875
- host.addController(this);
1876
- }
1877
- hostConnected() {
1878
- this.setupSignalSync();
1879
- }
1880
- hostDisconnected() {
1881
- if (this.unsubscribe) {
1882
- this.unsubscribe();
1883
- this.unsubscribe = void 0;
1884
- }
1885
- }
1886
- get data() {
1887
- return this._data;
1888
- }
1889
- get loading() {
1890
- return this._loading;
1891
- }
1892
- get error() {
1893
- return this._error;
1894
- }
1895
- get isReady() {
1896
- return !this._loading && this._data !== null && !this._error;
1897
- }
1898
- setupSignalSync() {
1899
- const sync = () => {
1900
- const signalValue = this.signal.value;
1901
- const newData = signalValue?.data || null;
1902
- const newLoading = signalValue?.loading || false;
1903
- const newError = signalValue?.error || null;
1904
- if (newData !== this._data || newLoading !== this._loading || newError !== this._error) {
1905
- this._data = newData;
1906
- this._loading = newLoading;
1907
- this._error = newError;
1908
- this.host.requestUpdate();
1909
- }
1910
- };
1911
- sync();
1912
- const interval = setInterval(sync, 50);
1913
- this.unsubscribe = () => clearInterval(interval);
1914
- }
1915
- };
1916
- function useTransactionSignal(host, signal) {
1917
- return new TransactionSignalController(host, signal);
1918
- }
1919
-
1920
- // src/shared/url-view.ts
1921
- var import_utils10 = require("@lukso/core/utils");
1922
- var import_lit11 = require("lit");
1923
- var import_decorators10 = require("lit/decorators.js");
1924
- var UrlView = class extends CoreLitElement {
1925
- constructor() {
1926
- super(...arguments);
1927
- this.size = "small";
1928
- this.showLogo = true;
1929
- this.maxWidth = 240;
1930
- this.displayName = "";
1931
- this.faviconCandidates = [];
1932
- this.faviconIndex = 0;
1933
- }
1934
- willUpdate(changed) {
1935
- if (changed.has("url") || changed.has("label") || changed.has("logoUrl")) {
1936
- this.computeMeta();
1937
- }
1938
- }
1939
- computeMeta() {
1940
- try {
1941
- const u = new URL(this.url);
1942
- const origin = u.origin;
1943
- this.faviconCandidates = [];
1944
- if (this.logoUrl) this.faviconCandidates.push(this.logoUrl);
1945
- this.faviconCandidates.push(
1946
- `${origin}/favicon.ico`,
1947
- `${origin}/favicon.png`
1948
- );
1949
- this.faviconIndex = 0;
1950
- this.favicon = this.faviconCandidates[this.faviconIndex];
1951
- const hostname = u.hostname.replace(/^www\./, "");
1952
- const hostnamePretty = hostname.split(".").filter(Boolean).slice(-2).join(" ").replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase());
1953
- if (this.label?.trim()) {
1954
- this.displayName = this.label.trim();
1955
- } else {
1956
- this.displayName = hostnamePretty || this.url;
1957
- }
1958
- } catch {
1959
- this.favicon = void 0;
1960
- this.displayName = this.label?.trim() ? this.label : this.url;
1961
- }
1962
- }
1963
- handleImageError() {
1964
- this.faviconIndex += 1;
1965
- if (this.faviconIndex < this.faviconCandidates.length) {
1966
- this.favicon = this.faviconCandidates[this.faviconIndex];
1967
- } else {
1968
- this.favicon = void 0;
1969
- }
1970
- }
1971
- getSizePixels() {
1972
- switch (this.size) {
1973
- case "x-small":
1974
- return 14;
1975
- case "small":
1976
- return 16;
1977
- case "medium":
1978
- return 20;
1979
- case "large":
1980
- return 24;
1981
- default:
1982
- return 16;
1983
- }
1984
- }
1985
- render() {
1986
- const sizePx = this.getSizePixels();
1987
- return import_lit11.html`
1988
- <div class="inline-flex flex-col gap-1">
1989
- <div class="inline-flex items-center gap-2 px-2.5 py-1.5 text-neutral-20 leading-tight font-semibold">
1990
- ${this.showLogo ? import_lit11.html`
1991
- <div class="inline-flex items-center p-1 justify-center rounded-lg bg-neutral-100 border border-neutral-90 overflow-hidden flex-none">
1992
- ${this.favicon ? import_lit11.html`<img
1993
- src=${this.favicon}
1994
- style="width:${sizePx}px;height:${sizePx}px;"
1995
- alt="favicon"
1996
- @error=${this.handleImageError}
1997
- />` : import_lit11.html`<lukso-icon name="globe" size=${this.size} color="blue-85"></lukso-icon>`}
1998
- </div>
1999
- ` : ""}
2000
- <span class="whitespace-nowrap overflow-hidden text-ellipsis leading-tight" style=${`max-width:${this.maxWidth}px;font-size: ${sizePx}px;`}>${this.displayName}</span>
2001
- </div>
2002
- </div>
2003
- `;
2004
- }
2005
- };
2006
- __decorateClass([
2007
- (0, import_decorators10.property)()
2008
- ], UrlView.prototype, "url", 2);
2009
- __decorateClass([
2010
- (0, import_decorators10.property)()
2011
- ], UrlView.prototype, "size", 2);
2012
- __decorateClass([
2013
- (0, import_decorators10.property)()
2014
- ], UrlView.prototype, "label", 2);
2015
- __decorateClass([
2016
- (0, import_decorators10.property)({ type: Boolean, attribute: "show-logo" })
2017
- ], UrlView.prototype, "showLogo", 2);
2018
- __decorateClass([
2019
- (0, import_decorators10.property)({ attribute: "logo-url" })
2020
- ], UrlView.prototype, "logoUrl", 2);
2021
- __decorateClass([
2022
- (0, import_decorators10.property)({ type: Number, attribute: "max-width" })
2023
- ], UrlView.prototype, "maxWidth", 2);
2024
- __decorateClass([
2025
- (0, import_decorators10.state)()
2026
- ], UrlView.prototype, "favicon", 2);
2027
- __decorateClass([
2028
- (0, import_decorators10.state)()
2029
- ], UrlView.prototype, "displayName", 2);
2030
- UrlView = __decorateClass([
2031
- (0, import_utils10.safeCustomElement)("url-view")
2032
- ], UrlView);
2033
-
2034
- // src/shared/value-view.ts
2035
- var import_task4 = require("@lit/task");
2036
- var import_utils11 = require("@lukso/core/utils");
2037
- var import_transaction_view_headless6 = require("@lukso/transaction-view-headless");
2038
- var import_lit12 = require("lit");
2039
- var import_decorators11 = require("lit/decorators.js");
2040
- var import_when = require("lit/directives/when.js");
2041
-
2042
- // src/utils.ts
2043
- function formatUnits(value, decimals = 18) {
2044
- const divisor = 10n ** BigInt(decimals);
2045
- const quotient = value / divisor;
2046
- const remainder = value % divisor;
2047
- if (remainder === 0n) {
2048
- return quotient.toString();
2049
- }
2050
- const remainderStr = remainder.toString().padStart(decimals, "0");
2051
- const trimmed = remainderStr.replace(/0+$/, "");
2052
- return `${quotient}.${trimmed}`;
2053
- }
2054
-
2055
- // src/shared/value-view.ts
2056
- var ValueView = class extends CoreLitElement {
2057
- constructor() {
2058
- super(...arguments);
2059
- this.type = "auto";
2060
- this.currencySymbol = "LYX";
2061
- this.decimals = 18;
2062
- this.size = "medium";
2063
- this.showCopyButton = false;
2064
- this.isCardView = false;
2065
- this._hasSlotContent = false;
2066
- // Task for resolving address metadata
2067
- this.addressTask = new import_task4.Task(this, {
2068
- task: async ([address]) => {
2069
- if (!address) return null;
2070
- try {
2071
- return this.addressResolver.resolveAddress(address);
2072
- } catch (error) {
2073
- console.warn("ValueView: Failed to resolve address metadata:", error);
2074
- return null;
2075
- }
2076
- },
2077
- args: () => [this.address]
2078
- });
2079
- }
2080
- _onSlotChange(e) {
2081
- const slot = e.target;
2082
- const assigned = slot?.assignedNodes({ flatten: true }) ?? [];
2083
- this._hasSlotContent = assigned.length > 0;
2084
- }
2085
- firstUpdated() {
2086
- const slot = this.renderRoot.querySelector("slot");
2087
- if (slot) {
2088
- const assigned = slot.assignedNodes({ flatten: true });
2089
- this._hasSlotContent = assigned.length > 0;
2090
- }
2091
- }
2092
- // Address resolution utilities (lazy initialization)
2093
- get addressResolver() {
2094
- try {
2095
- return (0, import_transaction_view_headless6.useAddressResolver)();
2096
- } catch (error) {
2097
- console.warn("ValueView: Address resolver not available:", error);
2098
- return {
2099
- resolveAddress: async () => null
2100
- };
2101
- }
2102
- }
2103
- /**
2104
- * Get the effective type for the value
2105
- */
2106
- getEffectiveType() {
2107
- if (this.type !== "auto") return this.type;
2108
- const value = this.value;
2109
- if (value === null || value === void 0) return "null";
2110
- if (typeof value === "string") return "string";
2111
- if (typeof value === "number") return "number";
2112
- if (typeof value === "boolean") return "boolean";
2113
- if (typeof value === "bigint") {
2114
- if (this.keyName === "value") return "currency";
2115
- return "bigint";
2116
- }
2117
- return "string";
2118
- }
2119
- /**
2120
- * Get CSS class for the value type
2121
- */
2122
- getValueClass() {
2123
- const effectiveType = this.getEffectiveType();
2124
- switch (effectiveType) {
2125
- case "string":
2126
- return "text-success-60";
2127
- case "number":
2128
- return "text-info-60";
2129
- case "boolean":
2130
- return "text-error-60";
2131
- case "currency":
2132
- return "text-warning-60 font-medium";
2133
- case "bigint":
2134
- return "text-secondary-60";
2135
- case "address":
2136
- return "text-info-60 font-mono";
2137
- case "null":
2138
- return "text-neutral-70 italic";
2139
- default:
2140
- return "text-neutral-10";
2141
- }
2142
- }
2143
- /**
2144
- * Format the value for display
2145
- */
2146
- getFormattedValue() {
2147
- const value = this.value;
2148
- const effectiveType = this.getEffectiveType();
2149
- if (value === null) return "null";
2150
- if (value === void 0) return "undefined";
2151
- switch (effectiveType) {
2152
- case "currency": {
2153
- const { numeric, symbol } = this.getCurrencyParts();
2154
- return `${numeric} ${symbol}`;
2155
- }
2156
- case "bigint":
2157
- if (typeof value === "bigint") {
2158
- return `${value.toString()}n`;
2159
- }
2160
- return `${String(value)}n`;
2161
- case "boolean":
2162
- return value ? "true" : "false";
2163
- case "number":
2164
- if (typeof value === "number") {
2165
- return value.toLocaleString();
2166
- }
2167
- return String(value);
2168
- case "string":
2169
- return String(value);
2170
- case "null":
2171
- return "null";
2172
- default:
2173
- return String(value);
2174
- }
2175
- }
2176
- /**
2177
- * Compute currency display parts: numeric portion and symbol
2178
- */
2179
- getCurrencyParts() {
2180
- const value = this.value;
2181
- const resolvedData = this.addressTask.value;
2182
- const effectiveDecimals = resolvedData?.lsp4TokenSymbol ? resolvedData.baseAsset?.decimals ?? resolvedData.decimals ?? this.decimals : this.decimals;
2183
- const effectiveSymbol = resolvedData?.lsp4TokenSymbol || resolvedData?.baseAsset?.lsp4TokenSymbol || this.currencySymbol;
2184
- let numeric = String(value ?? "");
2185
- try {
2186
- if (typeof value === "bigint") {
2187
- numeric = formatUnits(value, effectiveDecimals);
2188
- } else if (typeof value === "string" && !Number.isNaN(Number(value))) {
2189
- const bigintValue = BigInt(value);
2190
- numeric = formatUnits(bigintValue, effectiveDecimals);
2191
- }
2192
- } catch {
2193
- numeric = String(value ?? "");
2194
- }
2195
- return { numeric, symbol: effectiveSymbol };
2196
- }
2197
- /** Typography class for numeric value based on size */
2198
- getNumericClass() {
2199
- switch (this.size) {
2200
- case "x-small":
2201
- return "paragraph-ptmono-12-bold";
2202
- case "small":
2203
- return "paragraph-ptmono-14-bold";
2204
- case "medium":
2205
- return "paragraph-ptmono-16-bold";
2206
- case "large":
2207
- return "paragraph-ptmono-24-bold";
2208
- default:
2209
- return "paragraph-ptmono-16-bold";
2210
- }
2211
- }
2212
- /** Typography class for currency symbol based on size */
2213
- getCurrencyClass() {
2214
- switch (this.size) {
2215
- case "x-small":
2216
- return "paragraph-inter-12-regular";
2217
- case "small":
2218
- return "paragraph-inter-14-regular";
2219
- case "medium":
2220
- return "paragraph-inter-16-regular";
2221
- case "large":
2222
- return "paragraph-inter-20-regular";
2223
- default:
2224
- return "paragraph-inter-16-regular";
2225
- }
2226
- }
2227
- /**
2228
- * Get size-appropriate font size
2229
- */
2230
- getContainerTextClass() {
2231
- switch (this.size) {
2232
- case "x-small":
2233
- return "text-[12px]";
2234
- case "small":
2235
- return "text-[14px]";
2236
- case "medium":
2237
- return "text-[16px]";
2238
- case "large":
2239
- return "text-[18px]";
2240
- default:
2241
- return "text-[16px]";
2242
- }
2243
- }
2244
- /**
2245
- * Handle copy to clipboard
2246
- */
2247
- async handleCopy(e) {
2248
- if (e) e.stopPropagation();
2249
- const textToCopy = String(this.value);
2250
- try {
2251
- await navigator.clipboard.writeText(textToCopy);
2252
- this.dispatchEvent(
2253
- new CustomEvent("value-copied", {
2254
- detail: { value: textToCopy },
2255
- bubbles: true
2256
- })
2257
- );
2258
- } catch (error) {
2259
- console.error("Failed to copy value:", error);
2260
- }
2261
- }
2262
- /**
2263
- * Handle value click
2264
- */
2265
- handleClick() {
2266
- this.dispatchEvent(
2267
- new CustomEvent("value-click", {
2268
- detail: {
2269
- value: this.value,
2270
- formattedValue: this.getFormattedValue(),
2271
- type: this.getEffectiveType()
2272
- },
2273
- bubbles: true
2274
- })
2275
- );
2276
- }
2277
- render() {
2278
- const formattedValue = this.getFormattedValue();
2279
- const valueClass = this.getValueClass();
2280
- if (this.isCardView) {
2281
- const effectiveType = this.getEffectiveType();
2282
- let headerText = this.label || "";
2283
- let contentTemplate = import_lit12.html`
2284
- <span class="inline-block text-wrap min-w-0 text-center">${formattedValue}</span>
2285
- `;
2286
- if (effectiveType === "currency") {
2287
- const { numeric, symbol } = this.getCurrencyParts();
2288
- if (this.label) {
2289
- headerText = this.label;
2290
- contentTemplate = import_lit12.html`
2291
- <span class="inline-block overflow-hidden text-ellipsis whitespace-nowrap min-w-0 ${this.getNumericClass()}">${numeric}</span>
2292
- <span class="inline-block ${this.getCurrencyClass()}"> ${symbol}</span>
2293
- `;
2294
- } else {
2295
- headerText = symbol;
2296
- contentTemplate = import_lit12.html`
2297
- <span class="inline-block overflow-hidden text-ellipsis whitespace-nowrap min-w-0 ${this.getNumericClass()}">${numeric}</span>
2298
- `;
2299
- }
2300
- }
2301
- return import_lit12.html`
2302
- <div
2303
- class="block border border-neutral-90 rounded-xl bg-white py-3 px-4 min-w-[320px] ${this.containerClassNames || ""}"
2304
- @click=${this.handleClick}
2305
- style="${this.maxWidth ? `max-width: ${this.maxWidth}px` : ""}"
2306
- >
2307
- <div class="flex items-center justify-between mb-2">
2308
- ${headerText ? import_lit12.html`<div class="${this.getLabelClass()} text-neutral-20 overflow-hidden text-ellipsis whitespace-nowrap">${headerText}</div>` : import_lit12.html``}
2309
- ${this.showCopyButton ? import_lit12.html`
2310
- <button
2311
- class="bg-white rounded-lg w-6 h-6 flex items-center justify-center cursor-pointer text-neutral-20 hover:bg-neutral-95"
2312
- @click=${(e) => this.handleCopy(e)}
2313
- title="Copy value"
2314
- aria-label="Copy"
2315
- >
2316
- <lukso-icon name="copy" size="small"></lukso-icon>
2317
- </button>
2318
- ` : import_lit12.html``}
2319
- </div>
2320
- ${(0, import_when.when)(
2321
- !this._hasSlotContent,
2322
- () => import_lit12.html`
2323
- <div class="font-semibold text-neutral-10 break-words flex items-center gap-2 text-wrap ${this.getUseMonospace() ? "font-mono" : ""}">
2324
- ${contentTemplate}
2325
- </div>
2326
- `
2327
- )}
2328
- <slot @slotchange=${this._onSlotChange}></slot>
2329
- </div>
2330
- `;
2331
- }
2332
- return import_lit12.html`
2333
- <div
2334
- class="inline-flex items-center gap-1.5 cursor-pointer transition-all duration-200 rounded px-1 py-0.5 hover:bg-neutral-95 min-w-[320px] ${this.getContainerTextClass()} ${this.containerClassNames || ""}"
2335
- @click=${this.handleClick}
2336
- style="${this.maxWidth ? `max-width: ${this.maxWidth}px` : ""}"
2337
- >
2338
- <span class="inline-block overflow-hidden text-ellipsis whitespace-nowrap min-w-0 ${valueClass}">
2339
- ${formattedValue}
2340
- </span>
2341
- ${this.showCopyButton ? import_lit12.html`
2342
- <button
2343
- class="inline-flex items-center justify-center bg-transparent border-0 cursor-pointer text-neutral-70 p-0.5 rounded transition-all duration-200 hover:text-primary-50 hover:bg-neutral-90 flex-shrink-0"
2344
- @click=${(e) => this.handleCopy(e)}
2345
- title="Copy value"
2346
- aria-label="Copy value to clipboard"
2347
- >
2348
- <lukso-icon name="copy" size="small"></lukso-icon>
2349
- </button>
2350
- ` : ""}
2351
- </div>
2352
- `;
2353
- }
2354
- /** Whether to use monospace font for the value content */
2355
- getUseMonospace() {
2356
- const t = this.getEffectiveType();
2357
- if (t === "address" || t === "bigint" || this.value?.toString().startsWith("0x"))
2358
- return true;
2359
- if (t === "string") {
2360
- const s = String(this.value ?? "");
2361
- return /^0x[0-9a-fA-F]+$/.test(s) || s.length > 32;
2362
- }
2363
- return false;
2364
- }
2365
- /** Map size to a typography class for the label */
2366
- getLabelClass() {
2367
- switch (this.size) {
2368
- case "x-small":
2369
- return "paragraph-inter-12-semi-bold";
2370
- case "small":
2371
- return "heading-inter-14-bold";
2372
- case "medium":
2373
- return "heading-inter-17-semi-bold";
2374
- case "large":
2375
- return "heading-inter-21-semi-bold";
2376
- default:
2377
- return "heading-inter-17-semi-bold";
2378
- }
2379
- }
2380
- };
2381
- __decorateClass([
2382
- (0, import_decorators11.property)()
2383
- ], ValueView.prototype, "value", 2);
2384
- __decorateClass([
2385
- (0, import_decorators11.property)({ attribute: "key-name" })
2386
- ], ValueView.prototype, "keyName", 2);
2387
- __decorateClass([
2388
- (0, import_decorators11.property)({ type: String, attribute: "container-class-names" })
2389
- ], ValueView.prototype, "containerClassNames", 2);
2390
- __decorateClass([
2391
- (0, import_decorators11.property)()
2392
- ], ValueView.prototype, "type", 2);
2393
- __decorateClass([
2394
- (0, import_decorators11.property)({ attribute: "currency-symbol" })
2395
- ], ValueView.prototype, "currencySymbol", 2);
2396
- __decorateClass([
2397
- (0, import_decorators11.property)({ type: Number })
2398
- ], ValueView.prototype, "decimals", 2);
2399
- __decorateClass([
2400
- (0, import_decorators11.property)()
2401
- ], ValueView.prototype, "size", 2);
2402
- __decorateClass([
2403
- (0, import_decorators11.property)({ type: Boolean, attribute: "show-copy-button" })
2404
- ], ValueView.prototype, "showCopyButton", 2);
2405
- __decorateClass([
2406
- (0, import_decorators11.property)({ type: Boolean, attribute: "is-card-view" })
2407
- ], ValueView.prototype, "isCardView", 2);
2408
- __decorateClass([
2409
- (0, import_decorators11.property)()
2410
- ], ValueView.prototype, "label", 2);
2411
- __decorateClass([
2412
- (0, import_decorators11.property)({ type: Number, attribute: "max-width" })
2413
- ], ValueView.prototype, "maxWidth", 2);
2414
- __decorateClass([
2415
- (0, import_decorators11.property)()
2416
- ], ValueView.prototype, "address", 2);
2417
- __decorateClass([
2418
- (0, import_decorators11.state)()
2419
- ], ValueView.prototype, "_hasSlotContent", 2);
2420
- ValueView = __decorateClass([
2421
- (0, import_utils11.safeCustomElement)("value-view")
2422
- ], ValueView);
2423
- // Annotate the CommonJS export names for ESM import in node:
2424
- 0 && (module.exports = {
2425
- AddressDisplay,
2426
- AddressView,
2427
- CustomOption,
2428
- CustomSelect,
2429
- FunctionNameView,
2430
- GasProviderView,
2431
- IconView,
2432
- ImageLoaderController,
2433
- MultiSignalController,
2434
- NotificationView,
2435
- ProgressView,
2436
- ScrollToBottomButton,
2437
- SignalController,
2438
- TransactionSignalController,
2439
- TransactionViewController,
2440
- UrlView,
2441
- ValueView,
2442
- safeCustomElement,
2443
- useImageLoader,
2444
- useSignal,
2445
- useSignals,
2446
- useTransactionSignal,
2447
- useTransactionView
2448
- });
2449
- //# sourceMappingURL=index.cjs.map