@ethlete/query-devtools 1.0.0-next.0 → 1.0.0-next.1

package/fesm2022/ethlete-query-devtools.mjs

@@ -1,8 +1,8 @@
 import * as i0 from '@angular/core';
 import { signal, ViewEncapsulation, Component, input, output, computed, viewChild, effect, numberAttribute, linkedSignal, InjectionToken, inject, untracked, ElementRef, NgZone, DestroyRef, booleanAttribute } from '@angular/core';
-import { copyToClipboard, injectStyleManager, injectErrorTheme, ProvideColorDirective, clamp, injectRenderer, injectFileDownload, injectViewportSize, injectBreakpointObserver, createObjectUrlHandle, DragHandleDirective, ResizeHandlesComponent } from '@ethlete/core';
-import { queryDevtoolsAbout, hasQueryDevtoolsOverridesAtPath, detectPaginationShape, isDateShapedLeaf, generateQueryDevtoolsStringPreset, generateQueryDevtoolsNumberPreset, collectLeafPaths, armAllQueryDevtoolsMocks, clearQueryDevtoolsArmedMocks, clearQueryDevtoolsFaults, queryDevtoolsResponseHistory, queryDevtoolsMocks, queryDevtoolsArmedMocks, queryDevtoolsSettings, setQueryDevtoolsOverridesScope, setQueryDevtoolsArmedMocksScope, setQueryDevtoolsFaultsScope, setQueryDevtoolsSettings, QUERY_DEVTOOLS_TOKEN_TTL_LIMIT, setQueryDevtoolsTokenTtl, clearQueryDevtoolsTokenTtl, createQueryDevtoolsOverrides, applyQueryDevtoolsOverrides, queryDevtoolsSchemaNames, queryDevtoolsSchemaRoutes, queryDevtoolsSchemaState, measureQueryDevtoolsPayload, seedQueryDevtoolsSchemaBody, loadQueryDevtoolsSchema, queryDevtoolsMockId, saveQueryDevtoolsMock, armQueryDevtoolsMock, deleteQueryDevtoolsMock, collectQueryDevtoolsSchemaComponents, seedQueryDevtoolsSchemaRoute, QUERY_DEVTOOLS_FAULT_STATUSES, setQueryDevtoolsFault, serializeQueryDevtoolsOverrideTransfer, parseQueryDevtoolsOverrideTransfer, armQueryDevtoolsOverrideTransfer, countUnresolvedQueryDevtoolsOverrides, clearQueryDevtoolsTombstones, readQueryDevtoolsStore, queryDevtoolsEntries, queryDevtoolsTokenTtls, queryDevtoolsFaults, EMPTY_QUERY_DEVTOOLS_FAULT, isQueryDevtoolsFaultArmed, queryDevtoolsFaultsRestored, queryDevtoolsArmedMocksRestored, restoredQueryDevtoolsOverrides, queryDevtoolsRestoredOverridesScope, clearRestoredQueryDevtoolsOverrides, clearQueryDevtoolsStore, writeQueryDevtoolsStore, registerEthleteVersion, queryDevtoolsOverridePersistence, setQueryDevtoolsOverridePersistence, clearQueryDevtoolsOverrideStore, clearQueryDevtoolsMockStore, createQueryErrorResponse, applyQueryDevtoolsTokenTtl, canOverrideQueryDevtoolsTokenTtl, sumQueryDevtoolsStats } from '@ethlete/query';
-import { tap, Subject, switchMap, timer, interval, animationFrames, NEVER, takeUntil, finalize as finalize$1, merge, map, fromEvent, filter, EMPTY, take } from 'rxjs';
+import { copyToClipboard, injectStyleManager, injectErrorTheme, ProvideColorDirective, clamp, injectRenderer, injectFileDownload, injectViewportSize, injectIsDocumentVisible, injectBreakpointObserver, randomId, createObjectUrlHandle, DragHandleDirective, ResizeHandlesComponent } from '@ethlete/core';
+import { queryDevtoolsAbout, hasQueryDevtoolsOverridesAtPath, detectPaginationShape, isDateShapedLeaf, generateQueryDevtoolsStringPreset, generateQueryDevtoolsNumberPreset, collectLeafPaths, armAllQueryDevtoolsMocks, clearQueryDevtoolsArmedMocks, clearQueryDevtoolsFaults, queryDevtoolsResponseHistory, queryDevtoolsMocks, queryDevtoolsArmedMocks, queryDevtoolsSettings, setQueryDevtoolsOverridesScope, setQueryDevtoolsArmedMocksScope, setQueryDevtoolsFaultsScope, setQueryDevtoolsSettings, QUERY_DEVTOOLS_TOKEN_TTL_LIMIT, setQueryDevtoolsTokenTtl, clearQueryDevtoolsTokenTtl, createQueryDevtoolsOverrides, applyQueryDevtoolsOverrides, queryDevtoolsSchemaNames, queryDevtoolsSchemaRoutes, queryDevtoolsSchemaState, measureQueryDevtoolsPayload, seedQueryDevtoolsSchemaBody, loadQueryDevtoolsSchema, queryDevtoolsMockId, saveQueryDevtoolsMock, armQueryDevtoolsMock, deleteQueryDevtoolsMock, collectQueryDevtoolsSchemaComponents, seedQueryDevtoolsSchemaRoute, QUERY_DEVTOOLS_FAULT_STATUSES, setQueryDevtoolsFault, serializeQueryDevtoolsOverrideTransfer, parseQueryDevtoolsOverrideTransfer, armQueryDevtoolsOverrideTransfer, countUnresolvedQueryDevtoolsOverrides, clearQueryDevtoolsTombstones, readQueryDevtoolsStore, createQueryKeyLockManager, queryDevtoolsEntries, queryDevtoolsTokenTtls, queryDevtoolsFaults, EMPTY_QUERY_DEVTOOLS_FAULT, isQueryDevtoolsFaultArmed, queryDevtoolsFaultsRestored, queryDevtoolsArmedMocksRestored, restoredQueryDevtoolsOverrides, queryDevtoolsRestoredOverridesScope, clearRestoredQueryDevtoolsOverrides, clearQueryDevtoolsStore, writeQueryDevtoolsStore, registerEthleteVersion, queryDevtoolsOverridePersistence, setQueryDevtoolsOverridePersistence, clearQueryDevtoolsOverrideStore, clearQueryDevtoolsMockStore, createQueryErrorResponse, applyQueryDevtoolsTokenTtl, canOverrideQueryDevtoolsTokenTtl, sumQueryDevtoolsStats } from '@ethlete/query';
+import { tap, Subject, switchMap, timer, interval, animationFrames, NEVER, takeUntil, finalize as finalize$1, EMPTY, startWith, merge, map, fromEvent, filter, take } from 'rxjs';
 import { takeUntilDestroyed, toSignal, toObservable } from '@angular/core/rxjs-interop';
 import { MenuDirective, MenuTriggerDirective, MenuSurfaceDirective, MenuComponent, MenuItemComponent, MenuSearchDirective, MenuItemShortcutComponent, MenuSeparatorComponent, COMPONENTS_VERSION, MenuRadioGroupComponent, MenuRadioItemComponent } from '@ethlete/components';
 import { HttpHeaders, HttpErrorResponse } from '@angular/common/http';
@@ -3003,9 +3003,88 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
             args: [{ selector: 'et-query-devtools-forms-tab', encapsulation: ViewEncapsulation.None, imports: [QueryDevtoolsDrawerComponent, QueryDevtoolsJsonComponent, QueryDevtoolsRouteComponent], template: "<div #panes class=\"et-query-devtools-split\">\n  <div class=\"et-query-devtools-scroll\">\n    @for (entry of host.formEntries(); track entry.id) {\n      @let form = host.asForm(entry);\n      @let expanded = host.selectedFormId() === entry.id;\n      <div class=\"et-query-devtools-card\">\n        <div class=\"et-query-devtools-card-head\">\n          <button\n            [attr.aria-expanded]=\"expanded\"\n            (click)=\"host.selectedFormId.set(expanded ? null : entry.id)\"\n            class=\"et-query-devtools-row-link\"\n            type=\"button\"\n          >\n            <span class=\"et-query-devtools-caret\">{{ expanded ? '\u25BE' : '\u25B8' }}</span>\n            <strong>{{ entry.meta.name || 'query form' }}</strong>\n          </button>\n          @if (form.activeFilterCount(); as count) {\n            <span class=\"et-query-devtools-chip\">{{ count }} active</span>\n          } @else {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">at defaults</span>\n          }\n          @if (form.isCommitPending()) {\n            <span class=\"et-query-devtools-chip et-query-devtools-chip--loading\">debouncing</span>\n          }\n          @if (!form.isObserving()) {\n            <span\n              class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n              title=\"observe() has not been called, so nothing syncs with the URL\"\n            >\n              not observing\n            </span>\n          }\n          <button\n            [disabled]=\"form.isAtDefaults()\"\n            (click)=\"form.resetAll()\"\n            class=\"et-query-devtools-btn\"\n            type=\"button\"\n          >\n            \u27F2 Reset all\n          </button>\n        </div>\n\n        @let driven = host.queriesDrivenByForm(entry);\n        <dl class=\"et-query-devtools-meta\">\n          <dt>Drives</dt>\n          <dd>\n            @if (driven.length) {\n              <div class=\"et-query-devtools-inner-queries\">\n                @for (link of driven; track link.id) {\n                  <button\n                    [class.et-query-devtools-inner-row--active]=\"host.formSelectedQueryId() === link.id\"\n                    [disabled]=\"!link.id\"\n                    (click)=\"host.formSelectedQueryId.set(link.id)\"\n                    class=\"et-query-devtools-inner-row\"\n                    type=\"button\"\n                  >\n                    <span [attr.data-status]=\"host.queryStatus(link.query)\" class=\"et-query-devtools-status\"></span>\n                    <span class=\"et-query-devtools-method\">{{ link.method }}</span>\n                    <span class=\"et-query-devtools-route\">\n                      <et-query-devtools-route [segments]=\"link.segments\" [fallback]=\"link.query.id() || 'query'\" />\n                    </span>\n                  </button>\n                }\n              </div>\n            } @else {\n              <span class=\"et-query-devtools-hint\">\n                No query has read this form's value yet. A query picks it up the first time its\n                <code>withArgs</code> reads <code>value()</code>.\n              </span>\n            }\n          </dd>\n        </dl>\n\n        @if (expanded) {\n          <table class=\"et-query-devtools-table\">\n            <thead>\n              <tr>\n                <th>Field</th>\n                <th>Value</th>\n                <th>Default</th>\n                <th>URL param</th>\n                <th>Rules</th>\n                <th></th>\n              </tr>\n            </thead>\n            <tbody>\n              @for (field of form.fields(); track field.key) {\n                <tr [attr.data-status]=\"field.isDefault ? null : 'success'\">\n                  <td class=\"et-query-devtools-mono\">{{ field.key }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    {{ host.inlineValue(field.value) }}\n                    <!-- The live value only differs while a debounce is pending, which is exactly\n                       when \"the input says X but the query asked for Y\" needs explaining. -->\n                    @if (field.liveValue !== field.value) {\n                      <span class=\"et-query-devtools-stat-sub\">typing {{ host.inlineValue(field.liveValue) }}</span>\n                    }\n                  </td>\n                  <td class=\"et-query-devtools-mono\">{{ host.inlineValue(field.defaultValue) }}</td>\n                  <td class=\"et-query-devtools-mono\">\n                    @if (field.queryParam === undefined) {\n                      <span class=\"et-query-devtools-hint\">\u2014</span>\n                    } @else {\n                      {{ field.paramKey }}={{ host.inlineValue(field.queryParam) }}\n                    }\n                  </td>\n                  <td>\n                    <div class=\"et-query-devtools-chips\">\n                      @if (field.debounceMs !== null) {\n                        <span class=\"et-query-devtools-chip et-query-devtools-chip--muted\">\n                          {{ field.debounceMs }}ms\n                        </span>\n                      }\n                      @if (field.isResetBy.length) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Reset to its default whenever one of these changes\"\n                        >\n                          reset by {{ field.isResetBy.join(', ') }}\n                        </span>\n                      }\n                      @if (!field.countsAsFilter) {\n                        <span\n                          class=\"et-query-devtools-chip et-query-devtools-chip--muted\"\n                          title=\"Not counted by activeFilterCount\"\n                        >\n                          not a filter\n                        </span>\n                      }\n                    </div>\n                  </td>\n                  <td>\n                    <button\n                      [disabled]=\"field.isDefault\"\n                      (click)=\"form.resetField(field.key)\"\n                      class=\"et-query-devtools-btn\"\n                      type=\"button\"\n                    >\n                      \u27F2\n                    </button>\n                  </td>\n                </tr>\n              }\n            </tbody>\n          </table>\n\n          <h4 class=\"et-query-devtools-section\">Committed value</h4>\n          <et-query-devtools-json [value]=\"form.value()\" />\n        }\n      </div>\n    } @empty {\n      <p class=\"et-query-devtools-empty\">\n        No query forms registered. A form created with <code>defineQueryForm()</code> registers itself.\n      </p>\n    }\n  </div>\n\n  <et-query-devtools-drawer\n    [sel]=\"host.formSelectedQuery()\"\n    [container]=\"panes\"\n    (dismiss)=\"host.formSelectedQueryId.set(null)\"\n  />\n</div>\n", styles: ["@layer components{.et-query-devtools-caret{display:inline-block;width:1.2rem;color:var(--_et-qdt-muted)}}\n"] }]
         }] });
 
+const KIND_LABELS = {
+    auth: 'Auth',
+    poll: 'Polling',
+    other: 'Other',
+};
+/**
+ * The Locks tab: the Web Locks held across this origin, which is the one view in the panel that shows
+ * something outside its own tab.
+ */
+class QueryDevtoolsLocksTabComponent {
+    constructor() {
+        this.host = injectQueryDevtoolsHost();
+    }
+    kindLabel(kind) {
+        return KIND_LABELS[kind];
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: QueryDevtoolsLocksTabComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: QueryDevtoolsLocksTabComponent, isStandalone: true, selector: "et-query-devtools-locks-tab", ngImport: i0, template: "<div class=\"et-query-devtools-scroll\">\n  <div class=\"et-query-devtools-toolbar\">\n    <p class=\"et-query-devtools-hint et-query-devtools-locks-hint\">\n      The\n      <a href=\"https://developer.mozilla.org/docs/Web/API/Web_Locks_API\" target=\"_blank\" rel=\"noreferrer\">Web Locks</a>\n      held across this whole origin - every other tab, worker and service worker included, which is the one thing in\n      this panel that is not about this tab alone. Read only: a tab cannot release another tab's lock. Polled once a\n      second while this tab is open and the page is visible.\n    </p>\n  </div>\n\n  @if (host.lockRows(); as rows) {\n    <table class=\"et-query-devtools-table\">\n      <thead>\n        <tr>\n          <th>Lock</th>\n          <th>Kind</th>\n          <th>Taking part</th>\n          <th>This tab</th>\n        </tr>\n      </thead>\n      <tbody>\n        @for (row of rows; track row.name) {\n          <tr>\n            <td [title]=\"row.name\">\n              <span class=\"et-query-devtools-lock-name\">\n                <span class=\"et-query-devtools-url\">{{ row.label }}</span>\n                @if (row.channel) {\n                  <span class=\"et-query-devtools-count\">{{ row.channel }}</span>\n                }\n              </span>\n            </td>\n            <td>{{ kindLabel(row.kind) }}</td>\n            <td>{{ row.tabs }}</td>\n            <td>\n              @let standing = host.lockStanding(row);\n              <span\n                [class.et-query-devtools-chip--success]=\"standing.tone === 'success'\"\n                [class.et-query-devtools-chip--muted]=\"standing.tone === 'muted'\"\n                [title]=\"standing.title\"\n                class=\"et-query-devtools-chip\"\n              >\n                {{ standing.label }}\n              </span>\n            </td>\n          </tr>\n        } @empty {\n          <tr>\n            <td class=\"et-query-devtools-empty\" colspan=\"4\">\n              Nothing holds a lock on this origin. Multi-tab auth sync and cache polling both take one - without either,\n              there is nothing to coordinate.\n            </td>\n          </tr>\n        }\n      </tbody>\n    </table>\n  } @else {\n    <p class=\"et-query-devtools-empty\">\n      This browser has no Web Locks API, so nothing is coordinated across tabs at all: every tab refreshes its own\n      tokens and polls its own cache keys.\n    </p>\n  }\n</div>\n", styles: ["@layer components{.et-query-devtools-locks-hint{max-inline-size:80ch}.et-query-devtools-lock-name{display:flex;align-items:center;gap:.8rem}}\n"], encapsulation: i0.ViewEncapsulation.None }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: QueryDevtoolsLocksTabComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'et-query-devtools-locks-tab', encapsulation: ViewEncapsulation.None, template: "<div class=\"et-query-devtools-scroll\">\n  <div class=\"et-query-devtools-toolbar\">\n    <p class=\"et-query-devtools-hint et-query-devtools-locks-hint\">\n      The\n      <a href=\"https://developer.mozilla.org/docs/Web/API/Web_Locks_API\" target=\"_blank\" rel=\"noreferrer\">Web Locks</a>\n      held across this whole origin - every other tab, worker and service worker included, which is the one thing in\n      this panel that is not about this tab alone. Read only: a tab cannot release another tab's lock. Polled once a\n      second while this tab is open and the page is visible.\n    </p>\n  </div>\n\n  @if (host.lockRows(); as rows) {\n    <table class=\"et-query-devtools-table\">\n      <thead>\n        <tr>\n          <th>Lock</th>\n          <th>Kind</th>\n          <th>Taking part</th>\n          <th>This tab</th>\n        </tr>\n      </thead>\n      <tbody>\n        @for (row of rows; track row.name) {\n          <tr>\n            <td [title]=\"row.name\">\n              <span class=\"et-query-devtools-lock-name\">\n                <span class=\"et-query-devtools-url\">{{ row.label }}</span>\n                @if (row.channel) {\n                  <span class=\"et-query-devtools-count\">{{ row.channel }}</span>\n                }\n              </span>\n            </td>\n            <td>{{ kindLabel(row.kind) }}</td>\n            <td>{{ row.tabs }}</td>\n            <td>\n              @let standing = host.lockStanding(row);\n              <span\n                [class.et-query-devtools-chip--success]=\"standing.tone === 'success'\"\n                [class.et-query-devtools-chip--muted]=\"standing.tone === 'muted'\"\n                [title]=\"standing.title\"\n                class=\"et-query-devtools-chip\"\n              >\n                {{ standing.label }}\n              </span>\n            </td>\n          </tr>\n        } @empty {\n          <tr>\n            <td class=\"et-query-devtools-empty\" colspan=\"4\">\n              Nothing holds a lock on this origin. Multi-tab auth sync and cache polling both take one - without either,\n              there is nothing to coordinate.\n            </td>\n          </tr>\n        }\n      </tbody>\n    </table>\n  } @else {\n    <p class=\"et-query-devtools-empty\">\n      This browser has no Web Locks API, so nothing is coordinated across tabs at all: every tab refreshes its own\n      tokens and polls its own cache keys.\n    </p>\n  }\n</div>\n", styles: ["@layer components{.et-query-devtools-locks-hint{max-inline-size:80ch}.et-query-devtools-lock-name{display:flex;align-items:center;gap:.8rem}}\n"] }]
+        }] });
+
+/**
+ * Namespace of the probe lock the panel holds while the Locks tab is open. `LockInfo` carries a
+ * `clientId` but there is no API for "my own", so a lock under a name only this tab can have produced is
+ * the only way to learn it - and without it every row would say _some tab_ rather than _this tab_.
+ */
+const DEVTOOLS_PROBE_NAMESPACE = 'ethlete-devtools';
+const devtoolsProbeLockKey = (id) => `probe:${id}`;
+const devtoolsProbeLockName = (id) => `${DEVTOOLS_PROBE_NAMESPACE}:${devtoolsProbeLockKey(id)}`;
+const PROBE_PREFIX = `${DEVTOOLS_PROBE_NAMESPACE}:probe:`;
+const AUTH_PREFIX = 'ethlete-auth:leader:';
+const POLL_PREFIX = 'et-query-poll:';
+const decode = (name) => {
+    if (name.startsWith(AUTH_PREFIX))
+        return { kind: 'auth', label: name.slice(AUTH_PREFIX.length), channel: null };
+    if (name.startsWith(POLL_PREFIX)) {
+        const rest = name.slice(POLL_PREFIX.length);
+        const separator = rest.indexOf(':');
+        return separator === -1
+            ? { kind: 'poll', label: rest, channel: null }
+            : { kind: 'poll', label: rest.slice(separator + 1), channel: rest.slice(0, separator) };
+    }
+    return { kind: 'other', label: name, channel: null };
+};
+const KIND_ORDER = { auth: 0, poll: 1, other: 2 };
+/** The `clientId` of the tab the panel is open in, read off the probe lock it holds under `probeName`. */
+const probeClientId = (snapshot, probeName) => snapshot.held?.find((info) => info.name === probeName)?.clientId ?? null;
+/**
+ * Folds an origin-wide `navigator.locks.query()` snapshot into one row per lock name, decoded to the
+ * feature that took it and marked with where this tab stands on it.
+ *
+ * Probe locks are dropped from the result - every open panel on the origin holds one, and they describe
+ * the inspector rather than the app it inspects.
+ */
+const summarizeLocks = (options) => {
+    const { snapshot, clientId } = options;
+    const held = (snapshot.held ?? []).filter((info) => !info.name?.startsWith(PROBE_PREFIX));
+    const pending = (snapshot.pending ?? []).filter((info) => !info.name?.startsWith(PROBE_PREFIX));
+    const names = [...new Set([...held, ...pending].map((info) => info.name ?? ''))];
+    const rows = names.map((name) => {
+        const holders = held.filter((info) => info.name === name);
+        const queue = pending.filter((info) => info.name === name);
+        const place = queue.findIndex((info) => info.clientId === clientId) + 1;
+        const isHolder = holders.some((info) => info.clientId === clientId);
+        const standing = clientId === null ? 'unknown' : isHolder ? 'holder' : place > 0 ? 'queued' : 'absent';
+        return {
+            name,
+            ...decode(name),
+            tabs: holders.length + queue.length,
+            standing,
+            queuePlace: standing === 'queued' ? place : null,
+        };
+    });
+    return rows.sort((a, b) => KIND_ORDER[a.kind] - KIND_ORDER[b.kind] || a.label.localeCompare(b.label));
+};
+
 // Generated from package.json by tools/scripts/generate-version.js - do not edit.
 /** The version of `@ethlete/query-devtools` this build was cut from. */
-const QUERY_DEVTOOLS_VERSION = '1.0.0-next.0';
+const QUERY_DEVTOOLS_VERSION = '1.0.0-next.1';
 
 /* eslint-disable @typescript-eslint/naming-convention -- the `__export_*` keys are Insomnia's file format */
 const WORKSPACE_ID = 'wrk_ethlete_query_devtools';
@@ -4124,6 +4203,7 @@ class QueryDevtoolsComponent {
         this.destroyRef = inject(DestroyRef);
         this.document = inject(DOCUMENT);
         this.viewport = injectViewportSize();
+        this.isDocumentVisible = injectIsDocumentVisible();
         /**
          * Opens the panel as soon as it is created, whatever the stored view state says. Set by
          * `<et-query-devtools-lazy>`, which downloads the panel on the click that was meant to open it.
@@ -4145,6 +4225,7 @@ class QueryDevtoolsComponent {
             { id: 'auth', label: 'Auth' },
             { id: 'ws', label: 'Sockets' },
             { id: 'cache', label: 'Cache' },
+            { id: 'locks', label: 'Locks' },
             { id: 'timeline', label: 'Timeline' },
             { id: 'events', label: 'Events' },
             { id: 'faults', label: 'Faults' },
@@ -4392,6 +4473,24 @@ class QueryDevtoolsComponent {
         this.copiedReset$ = new Subject();
         /** 1-second tick driving the cache freshness countdowns. */
         this.clock = toSignal(interval(1000), { initialValue: 0 });
+        /**
+         * The probe lock behind every Locks row's "this tab" answer, and the last snapshot read through it.
+         * Both only exist while the Locks tab is on screen - see the polling stream in the constructor.
+         */
+        this.probeLocks = createQueryKeyLockManager(DEVTOOLS_PROBE_NAMESPACE);
+        this.probeId = randomId();
+        this.probeHold = null;
+        this.lockSnapshot = signal(null, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "lockSnapshot" }] : /* istanbul ignore next */ []));
+        this.lockRows = computed(() => {
+            if (!this.probeLocks.isSupported)
+                return null;
+            const snapshot = this.lockSnapshot();
+            if (!snapshot)
+                return [];
+            return summarizeLocks({ snapshot, clientId: probeClientId(snapshot, devtoolsProbeLockName(this.probeId)) });
+        }, /* @ts-ignore */
+        ...(ngDevMode ? [{ debugName: "lockRows" }] : /* istanbul ignore next */ []));
         /** "Inspect" mode: hover the live UI to find the query that a component created. */
         this.inspectActive = signal(false, /* @ts-ignore */
         ...(ngDevMode ? [{ debugName: "inspectActive" }] : /* istanbul ignore next */ []));
@@ -4556,6 +4655,9 @@ class QueryDevtoolsComponent {
                 auth: { count: this.authEntries().length, errors: 0 },
                 ws: { count: this.wsEntries().length, errors: 0 },
                 cache: { count: this.cacheEntryCount(), errors: 0 },
+                // Not a count of locks: the tab only reads them while it is open, so a badge would have to poll
+                // the whole origin whenever the panel is - and the tab bar folds an uncounted tab behind "More".
+                locks: { count: 0, errors: 0 },
                 timeline: this.runTotals(),
                 events: {
                     count: events.length,
@@ -4710,6 +4812,12 @@ class QueryDevtoolsComponent {
             }));
         }), takeUntilDestroyed())
             .subscribe();
+        // Web Locks has no change event, so the Locks tab polls - but a `locks.query()` per second is not a
+        // `Date.now()` read, so it only runs while that tab is the one on screen and the page is visible.
+        // The probe lock is taken for the same window: it is what tells this tab's rows from another tab's.
+        toObservable(computed(() => this.probeLocks.isSupported && this.open() && this.activeTab() === 'locks' && this.isDocumentVisible()))
+            .pipe(tap((inspecting) => this.holdProbeLock(inspecting)), switchMap((inspecting) => (inspecting ? interval(1000).pipe(startWith(0)) : EMPTY)), switchMap(() => navigator.locks.query()), tap((snapshot) => this.lockSnapshot.set(snapshot)), takeUntilDestroyed())
+            .subscribe();
         // Merge every live repository's event stream into the rolling log, re-subscribing as the set of
         // repositories changes. Composed with RxJS (not a subscribe-in-effect) per the styleguide.
         toObservable(this.repositories)
@@ -5775,6 +5883,31 @@ class QueryDevtoolsComponent {
     authQueryKeys(auth) {
         return Object.keys(auth.queries ?? {});
     }
+    /** Where this tab stands on one lock, as a chip. @see lockRows */
+    lockStanding(row) {
+        switch (row.standing) {
+            case 'holder':
+                return { label: 'holds it', tone: 'success', title: 'This tab is the one doing the work this lock guards.' };
+            case 'queued':
+                return {
+                    label: `waiting · #${row.queuePlace}`,
+                    tone: 'muted',
+                    title: `Another tab holds this lock. This one is number ${row.queuePlace} in line and takes over as soon as the tabs ahead of it release it - by closing, crashing or navigating away.`,
+                };
+            case 'absent':
+                return {
+                    label: 'not taking part',
+                    tone: 'muted',
+                    title: 'Another tab holds this lock and this one never asked for it.',
+                };
+            case 'unknown':
+                return {
+                    label: 'unknown',
+                    tone: 'muted',
+                    title: 'The probe lock this tab identifies itself with has not been granted yet - the next poll should resolve it.',
+                };
+        }
+    }
     /**
      * Which tab refreshes this provider's tokens, as a chip: whether it is this one, how many tabs are
      * in the election, and - when there is no election - why every tab reads as the leader.
@@ -5922,6 +6055,22 @@ class QueryDevtoolsComponent {
     downloadTextFile(file) {
         this.download({ content: file.content, filename: file.name, type: file.type });
     }
+    /**
+     * Takes - or gives back - the lock whose name only this tab can have produced. Its `clientId` in the
+     * snapshot is what tells this tab's rows from another tab's: `LockInfo` carries no tab identity, and
+     * the platform offers no way to ask for one's own client id.
+     */
+    holdProbeLock(inspecting) {
+        if (inspecting) {
+            this.probeHold ??= this.probeLocks.hold(devtoolsProbeLockKey(this.probeId));
+            return;
+        }
+        this.probeHold?.release();
+        this.probeHold = null;
+        // A snapshot outlives the probe that made it readable, so keeping it would have every row claim it
+        // belongs to some other tab the next time the tab is opened.
+        this.lockSnapshot.set(null);
+    }
     /**
      * The two runs the diff compares, oldest first - normalised by run index, so picking a pair in either
      * order reads the same way round as the `#before → #after` header prints it.
@@ -6636,7 +6785,7 @@ class QueryDevtoolsComponent {
         this.eventLog.update((log) => [item, ...log].slice(0, queryDevtoolsSettings().maxEvents));
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: QueryDevtoolsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: QueryDevtoolsComponent, isStandalone: true, selector: "et-query-devtools", inputs: { startOpen: { classPropertyName: "startOpen", publicName: "startOpen", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-dock": "dock()" }, classAttribute: "et-query-devtools-host" }, providers: [{ provide: QUERY_DEVTOOLS_HOST, useExisting: QueryDevtoolsComponent }], viewQueries: [{ propertyName: "panelEl", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (open()) {\n  <section\n    #panel\n    [class.et-query-devtools-panel--resizing]=\"resizing()\"\n    [attr.data-dock]=\"poppedOut() ? 'popout' : dock()\"\n    [attr.data-pane-axis]=\"paneAxis()\"\n    [attr.data-parked]=\"floatParked() ? '' : null\"\n    [style.block-size.px]=\"panelBlockSize()\"\n    [style.inline-size.px]=\"panelInlineSize()\"\n    [style.inset-block-start.px]=\"panelInsetBlock()\"\n    [style.inset-inline-start.px]=\"panelInsetInline()\"\n    [style.--_et-qdt-list-width.px]=\"listWidth()\"\n    [style.--_et-qdt-drawer-width.px]=\"drawerWidth()\"\n    [style.--_et-qdt-list-height.px]=\"listHeight()\"\n    [style.--_et-qdt-drawer-height.px]=\"drawerHeight()\"\n    class=\"et-query-devtools-panel\"\n  >\n    <!-- A pop-out is sized by its window, so there is no edge to drag. A float is a window in the page:\n         a title bar to move it and every edge to resize it, on the same `@ethlete/core` primitives the\n         stream pip window uses. A dock has one edge, and it does both. -->\n    @if (floating()) {\n      <!-- Parked, the panel is a grab strip: the edge handles would eat most of the peek that is left\n           to click, and resizing something you cannot see is not a thing to offer. -->\n      <et-resize-handles\n        [edges]=\"FLOAT_RESIZE_EDGES\"\n        [disabled]=\"floatParked()\"\n        (resizeStarted)=\"startFloatResize()\"\n        (resizeMoved)=\"resizeFloat($event)\"\n        (resizeEnded)=\"endFloatResize()\"\n        (resizeCancelled)=\"endFloatResize()\"\n      />\n      <div\n        (dragMoved)=\"moveFloat($event)\"\n        (dragEnded)=\"endFloatMove()\"\n        (dragCancelled)=\"endFloatMove()\"\n        (dragTapped)=\"restoreFloat()\"\n        class=\"et-query-devtools-move\"\n        title=\"Drag to move \u2014 shove it off an edge to park it, click the strip to bring it back\"\n        aria-hidden=\"true\"\n        etDragHandle\n      ></div>\n    } @else if (!poppedOut()) {\n      <div\n        (pointerdown)=\"startResize($event)\"\n        class=\"et-query-devtools-resize\"\n        title=\"Drag to resize\"\n        aria-hidden=\"true\"\n      ></div>\n    }\n    <header class=\"et-query-devtools-header\">\n      <nav class=\"et-query-devtools-tabs\" role=\"tablist\">\n        @for (tab of visibleTabs(); track tab.id) {\n          @let badge = tabBadges()[tab.id];\n          <button\n            [class.et-query-devtools-tab--active]=\"activeTab() === tab.id\"\n            [attr.aria-selected]=\"activeTab() === tab.id\"\n            (click)=\"activeTab.set(tab.id)\"\n            class=\"et-query-devtools-tab\"\n            type=\"button\"\n            role=\"tab\"\n          >\n            {{ tab.label }}\n            @if (badge.count) {\n              <span class=\"et-query-devtools-tab-badge\">{{ badge.count }}</span>\n            }\n            @if (badge.errors) {\n              <span\n                class=\"et-query-devtools-tab-badge et-query-devtools-tab-badge--error\"\n                title=\"{{ badge.errors }} {{ badge.errorNoun ?? 'failing' }}\"\n              >\n                {{ badge.errors }}\n              </span>\n            }\n          </button>\n        }\n\n        @if (overflowTabs().length; as overflowCount) {\n          <div class=\"et-query-devtools-menu\" etMenu>\n            <button\n              [title]=\"overflowCount + ' tabs with nothing in them'\"\n              class=\"et-query-devtools-tab\"\n              type=\"button\"\n              etMenuTrigger\n            >\n              More\n              <span class=\"et-query-devtools-menu-caret\" aria-hidden=\"true\">\u25BE</span>\n            </button>\n\n            <ng-template etMenuSurface>\n              <et-menu>\n                @for (tab of overflowTabs(); track tab.id) {\n                  <button (activate)=\"activeTab.set(tab.id)\" et-menu-item type=\"button\">{{ tab.label }}</button>\n                }\n              </et-menu>\n            </ng-template>\n          </div>\n        }\n      </nav>\n\n      <div class=\"et-query-devtools-header-actions\">\n        <button\n          [class.et-query-devtools-inspect-btn--active]=\"inspectActive()\"\n          [attr.aria-pressed]=\"inspectActive()\"\n          (click)=\"toggleInspect()\"\n          class=\"et-query-devtools-btn et-query-devtools-inspect-btn\"\n          type=\"button\"\n          title=\"Inspect: hover the UI to find its query\"\n        >\n          <svg\n            class=\"et-query-devtools-inspect-icon\"\n            viewBox=\"0 0 16 16\"\n            width=\"14\"\n            height=\"14\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n            focusable=\"false\"\n          >\n            <circle class=\"et-query-devtools-inspect-icon-ring\" cx=\"8\" cy=\"8\" r=\"4.25\" />\n            <circle class=\"et-query-devtools-inspect-icon-dot\" cx=\"8\" cy=\"8\" r=\"1.15\" />\n            <path d=\"M8 0.9v2.1M8 13v2.1M0.9 8h2.1M13 8h2.1\" />\n          </svg>\n          {{ inspectActive() ? 'Inspecting' : 'Inspect' }}\n          @if (inspectActive()) {\n            <kbd class=\"et-query-devtools-kbd et-query-devtools-kbd--inverse\">Esc</kbd>\n          }\n        </button>\n        <button\n          (click)=\"downloadSession()\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n          title=\"Download every registered entry, the event log, the cache totals and anything armed as one JSON file - the attachment for a bug report\"\n        >\n          <span aria-hidden=\"true\">\u2913</span>\n          Session\n        </button>\n        <!-- A gear, not a tab: Settings holds nothing to count, so the badge/overflow logic would push it\n             behind More - and the one control that explains a panel behaving oddly may not be hidden. -->\n        <button\n          [class.et-query-devtools-btn--active]=\"activeTab() === 'settings'\"\n          [attr.aria-pressed]=\"activeTab() === 'settings'\"\n          (click)=\"toggleSettings()\"\n          class=\"et-query-devtools-btn et-query-devtools-icon-btn\"\n          type=\"button\"\n          title=\"Settings: where panel state is kept, and the limits it holds\"\n          aria-label=\"Settings\"\n        >\n          <span aria-hidden=\"true\">\u2699</span>\n        </button>\n        @if (!poppedOut()) {\n          @let layout = currentLayout();\n          <div class=\"et-query-devtools-menu\" etMenu placement=\"bottom-end\">\n            <button class=\"et-query-devtools-btn\" title=\"Where the panel sits\" type=\"button\" etMenuTrigger>\n              <span class=\"et-query-devtools-menu-glyph\" aria-hidden=\"true\">{{ layout.glyph }}</span>\n              {{ layout.label }}\n              <span class=\"et-query-devtools-menu-caret\" aria-hidden=\"true\">\u25BE</span>\n            </button>\n\n            <ng-template etMenuSurface>\n              <et-menu>\n                <et-menu-radio-group [value]=\"dock()\">\n                  @for (option of LAYOUTS; track option.id) {\n                    <!-- eslint-disable ethlete/prefer-static-boolean-properties -- closeOnActivate is tri-state (boolean | undefined); a transform would collapse its unset state -->\n                    <et-menu-radio-item\n                      [value]=\"option.id\"\n                      [title]=\"option.hint\"\n                      [closeOnActivate]=\"true\"\n                      (activate)=\"selectLayout(option.id)\"\n                    >\n                      <!-- eslint-enable ethlete/prefer-static-boolean-properties -->\n                      <span class=\"et-query-devtools-menu-item-glyph\" aria-hidden=\"true\">{{ option.glyph }}</span>\n                      {{ option.label }}\n                    </et-menu-radio-item>\n                  }\n                </et-menu-radio-group>\n              </et-menu>\n            </ng-template>\n          </div>\n        }\n        <span class=\"et-query-devtools-header-divider\" aria-hidden=\"true\"></span>\n        <button\n          (click)=\"toggleOpen()\"\n          class=\"et-query-devtools-btn et-query-devtools-btn--danger\"\n          type=\"button\"\n          title=\"{{ poppedOut() ? 'Bring the panel back into the app window' : 'Close devtools (' + shortcut + ')' }}\"\n        >\n          @if (poppedOut()) {\n            <span aria-hidden=\"true\">\u29C8</span>\n            Dock back\n          } @else {\n            <span aria-hidden=\"true\">\u2715</span>\n            Close\n            <kbd class=\"et-query-devtools-kbd\">{{ shortcut }}</kbd>\n          }\n        </button>\n      </div>\n    </header>\n\n    @if (popOutBlocked()) {\n      <div class=\"et-query-devtools-notice-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-text\">\n          The browser blocked the pop-up window. Allow pop-ups for this site, or float the panel over the page instead \u2014\n          a float needs no permission.\n        </span>\n        <button (click)=\"floatPanel()\" class=\"et-query-devtools-btn\" type=\"button\">Float instead</button>\n        <button (click)=\"popOutBlocked.set(false)\" class=\"et-query-devtools-btn\" type=\"button\">Dismiss</button>\n      </div>\n    }\n\n    @if (armedFaultClients(); as armed) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          <strong>Faults armed</strong> on\n          <span class=\"et-query-devtools-mono\">{{ armed.join(', ') }}</span>\n          \u2014 every failure and delay you see from\n          {{ armed.length === 1 ? 'this client' : 'these clients' }} is injected, not the API.\n          @if (faultsRestored()) {\n            They came back from your last page load \u2014 set <em>Armed faults</em> back to <em>none</em> in Settings to\n            stop that.\n          }\n        </span>\n        <button\n          [disabled]=\"activeTab() === 'faults'\"\n          (click)=\"activeTab.set('faults')\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n        >\n          Review\n        </button>\n        <button (click)=\"CLEAR_FAULTS()\" class=\"et-query-devtools-btn\" type=\"button\">Disarm all</button>\n      </div>\n    }\n\n    @if (armedMockRoutes(); as mocked) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          <strong>Mocks armed</strong> on\n          <span class=\"et-query-devtools-mono\">{{ mocked.join(', ') }}</span>\n          \u2014 {{ mocked.length === 1 ? 'that route is' : 'those routes are' }} answered by the panel, so nothing they show\n          reached the API.\n          @if (mocksRestored()) {\n            They came back from your last page load \u2014 set <em>Armed mocks</em> back to <em>none</em> in Settings to stop\n            that.\n          }\n        </span>\n        <button\n          [disabled]=\"activeTab() === 'mocks'\"\n          (click)=\"activeTab.set('mocks')\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n        >\n          Review\n        </button>\n        <button (click)=\"DISARM_MOCKS()\" class=\"et-query-devtools-btn\" type=\"button\">Disarm all</button>\n      </div>\n    }\n\n    @if (restoredOverrides(); as restored) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          @if (restored.ops) {\n            <strong>Overrides re-armed</strong> \u2014 {{ restored.ops }} {{ restored.ops === 1 ? 'edit' : 'edits' }} from\n            your last page load {{ restored.ops === 1 ? 'is' : 'are' }} back on {{ restored.queries }}\n            {{ restored.queries === 1 ? 'query' : 'queries' }}, so those responses are not what the API sent.\n            @if (restored.fromLocalStorage) {\n              They came back from <strong>localStorage</strong>, so they outlive closing this tab \u2014 clear them, or set\n              overrides back to <em>session</em> in Settings.\n            }\n          } @else {\n            <strong>Overrides could not be re-armed.</strong>\n          }\n          @if (restored.orphaned.length) {\n            <span class=\"et-query-devtools-armed-orphans\">\n              {{ restored.orphaned.length }} stored\n              {{ restored.orphaned.length === 1 ? 'override' : 'overrides' }} matched no query \u2014\n              <span class=\"et-query-devtools-mono\">{{ restored.orphaned.join(', ') }}</span>\n            </span>\n          }\n        </span>\n        @if (restored.firstId; as firstId) {\n          <button (click)=\"reviewRestoredOverrides(firstId)\" class=\"et-query-devtools-btn\" type=\"button\">Review</button>\n        }\n        <button (click)=\"DROP_RESTORED_OVERRIDES()\" class=\"et-query-devtools-btn\" type=\"button\">Drop all</button>\n      </div>\n    }\n\n    <div class=\"et-query-devtools-body\">\n      @switch (activeTab()) {\n        <!-- QUERIES -->\n        @case ('queries') {\n          <et-query-devtools-queries-tab />\n        }\n\n        <!-- STACKS -->\n        @case ('stacks') {\n          <et-query-devtools-stacks-tab />\n        }\n\n        <!-- SEQUENCES -->\n        @case ('sequences') {\n          <et-query-devtools-sequences-tab />\n        }\n\n        <!-- FORMS -->\n        @case ('forms') {\n          <et-query-devtools-forms-tab />\n        }\n\n        <!-- AUTH -->\n        @case ('auth') {\n          <et-query-devtools-auth-tab />\n        }\n\n        <!-- SOCKETS -->\n        @case ('ws') {\n          <et-query-devtools-sockets-tab />\n        }\n\n        <!-- CACHE -->\n        @case ('cache') {\n          <et-query-devtools-cache-tab />\n        }\n\n        <!-- TIMELINE -->\n        @case ('timeline') {\n          <et-query-devtools-timeline-tab />\n        }\n\n        <!-- EVENTS -->\n        @case ('events') {\n          <et-query-devtools-events-tab />\n        }\n\n        <!-- FAULTS -->\n        @case ('faults') {\n          <et-query-devtools-faults-tab />\n        }\n\n        <!-- MOCKS -->\n        @case ('mocks') {\n          <et-query-devtools-mocks-tab />\n        }\n\n        <!-- ABOUT -->\n        @case ('about') {\n          <et-query-devtools-about />\n        }\n\n        <!-- SETTINGS -->\n        @case ('settings') {\n          <et-query-devtools-settings />\n        }\n      }\n    </div>\n  </section>\n}\n\n@if (!open()) {\n  <et-query-devtools-toggle [tampered]=\"panelTampered()\" (openChange)=\"toggleOpen()\" />\n}\n\n@if (inspectActive() && inspectHover(); as hover) {\n  <div\n    [style.left.px]=\"hover.rect.left\"\n    [style.top.px]=\"hover.rect.top\"\n    [style.width.px]=\"hover.rect.width\"\n    [style.height.px]=\"hover.rect.height\"\n    class=\"et-query-devtools-inspect-box\"\n  >\n    <span class=\"et-query-devtools-inspect-tag\">{{ inspectLabel(hover.entries) }}</span>\n  </div>\n}\n\n@if (locatedRect(); as rect) {\n  <div\n    [style.left.px]=\"rect.left\"\n    [style.top.px]=\"rect.top\"\n    [style.width.px]=\"rect.width\"\n    [style.height.px]=\"rect.height\"\n    class=\"et-query-devtools-inspect-box\"\n  >\n    <span class=\"et-query-devtools-inspect-tag\">created here</span>\n  </div>\n}\n", styles: ["@layer components{.et-query-devtools-host{--_et-qdt-bg: var(--et-surface-background-solid, rgb(24 24 27));--_et-qdt-fg: var(--et-surface-color-solid, rgb(244 244 245));--_et-qdt-muted: var(--et-surface-color-muted-solid, rgb(161 161 170));--_et-qdt-subtle: var(--et-surface-color-subtle-solid, rgb(113 113 122));--_et-qdt-border: var(--et-surface-border-solid, rgb(255 255 255 / .12));--_et-qdt-interaction: var(--et-surface-interaction-solid, rgb(255 255 255));--_et-qdt-accent: var(--et-theme-color-primary-solid, rgb(96 165 250));--_et-qdt-hover: color-mix(in srgb, var(--_et-qdt-interaction) 10%, transparent);--_et-qdt-active: color-mix(in srgb, var(--_et-qdt-interaction) 18%, transparent);--_et-qdt-success: rgb(34 197 94);--_et-qdt-error: rgb(239 68 68);--_et-qdt-loading: rgb(234 179 8);--_et-qdt-title-bar: 2.4rem;--_et-qdt-radius: .5rem;--_et-qdt-control-h: 2.4rem;--_et-qdt-row-h: 3.6rem;position:fixed;inset-inline:0;inset-block-end:0;z-index:2147483000;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:1.2rem;line-height:1.4;pointer-events:none}.et-query-devtools-host>*{pointer-events:auto}@media(pointer:coarse){.et-query-devtools-host{--_et-qdt-control-h: 3.4rem;--_et-qdt-row-h: 4.4rem}}.et-query-devtools-panel{position:relative;display:flex;flex-direction:column;inline-size:100%;min-block-size:20rem;max-block-size:90vh;background:var(--_et-qdt-bg);color:var(--_et-qdt-fg);border-block-start:1px solid var(--_et-qdt-border);box-shadow:0 -.4rem 2rem #00000059}.et-query-devtools-host:where([data-dock=right]){inset-block:0;inset-inline-start:auto}.et-query-devtools-panel:where([data-dock=right]){inline-size:auto;block-size:100%;max-block-size:none;max-inline-size:90vw;border-block-start:0;border-inline-start:1px solid var(--_et-qdt-border);box-shadow:-.4rem 0 2rem #00000059}.et-query-devtools-host:where([data-dock=float]){inset:0}.et-query-devtools-panel:where([data-dock=float]){--_et-qdt-frame: .8rem;--et-resize-handles-edge-size: var(--_et-qdt-frame);--et-resize-handles-touch-edge-size: var(--_et-qdt-frame);--et-resize-handles-corner-size: 1.6rem;--et-resize-handles-touch-corner-size: 1.6rem;--et-resize-handles-edge-inset: 1.6rem;--et-resize-handles-side-top: var(--_et-qdt-title-bar);--et-resize-handles-side-bottom: 1.6rem;--et-resize-handles-z-index: 3;position:absolute;inline-size:auto;min-block-size:0;max-block-size:none;padding-block-start:var(--_et-qdt-title-bar);padding-inline:var(--_et-qdt-frame);padding-block-end:var(--_et-qdt-frame);border:1px solid var(--_et-qdt-border);border-radius:.6rem;box-shadow:0 1rem 4rem #00000073;overflow:hidden}.et-query-devtools-move{position:absolute;inset-inline:0;inset-block-start:0;block-size:var(--_et-qdt-title-bar);cursor:move;z-index:2}.et-query-devtools-panel:where([data-dock=float]) .et-query-devtools-body{border-radius:.3rem;overflow:hidden}.et-query-devtools-move:after{content:\"\";position:absolute;inset-inline:50%;inset-block-start:.9rem;inline-size:3rem;margin-inline-start:-1.5rem;block-size:.6rem;background-image:radial-gradient(currentcolor 40%,transparent 42%);background-size:.4rem .3rem;color:var(--_et-qdt-subtle)}@media(hover:hover){.et-query-devtools-move:hover:after{color:var(--_et-qdt-accent)}}.et-query-devtools-panel:where([data-dock=float][data-parked]){opacity:.85}@media(hover:hover){.et-query-devtools-panel:where([data-dock=float][data-parked]):hover{opacity:1}}.et-query-devtools-panel:where([data-dock=float][data-parked]) .et-query-devtools-move{cursor:grab;background:var(--_et-qdt-active)}.et-query-devtools-panel:where([data-dock=float][data-parked]) .et-query-devtools-move:after{color:var(--_et-qdt-accent)}.et-query-devtools-host:where([data-dock=left]){inset-block:0;inset-inline-end:auto}.et-query-devtools-panel:where([data-dock=left]){inline-size:auto;block-size:100%;max-block-size:none;max-inline-size:90vw;border-block-start:0;border-inline-end:1px solid var(--_et-qdt-border);box-shadow:.4rem 0 2rem #00000059}.et-query-devtools-host:where([data-dock=top]){inset-block-start:0;inset-block-end:auto}.et-query-devtools-panel:where([data-dock=top]){border-block-start:0;border-block-end:1px solid var(--_et-qdt-border);box-shadow:0 .4rem 2rem #00000059}.et-query-devtools-host:where([data-dock=popout]){position:static;inline-size:100%;block-size:100%}.et-query-devtools-panel:where([data-dock=popout]){block-size:100%;max-block-size:none;border:0;box-shadow:none}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-header{flex-wrap:wrap}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-tabs,.et-query-devtools-header-actions){flex:1 1 auto;flex-wrap:nowrap;min-inline-size:0;overflow-x:auto}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-tabs,.et-query-devtools-header-actions)>*{flex:none}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-master-detail,.et-query-devtools-split){flex-direction:column}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-list,.et-query-devtools-detail,.et-query-devtools-drawer,.et-query-devtools-split .et-query-devtools-scroll){flex:1 1 50%;min-inline-size:0;min-block-size:0;max-inline-size:none;border-inline-start:0;border-inline-end:0}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-detail,.et-query-devtools-drawer){border-block-start:1px solid var(--_et-qdt-border)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-master-detail>.et-query-devtools-list{flex:0 1 var(--_et-qdt-list-height, 50%);min-block-size:var(--_et-qdt-list-height, 0);max-block-size:var(--_et-qdt-list-height, none)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-split>.et-query-devtools-drawer{flex:0 1 var(--_et-qdt-drawer-height, 50%);min-block-size:var(--_et-qdt-drawer-height, 0);max-block-size:var(--_et-qdt-drawer-height, none)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-pane-resize{cursor:ns-resize}.et-query-devtools-panel--resizing{-webkit-user-select:none;user-select:none}.et-query-devtools-resize,.et-query-devtools-pane-resize{touch-action:none}.et-query-devtools-resize{position:absolute;inset-inline:0;inset-block-start:0;block-size:.6rem;cursor:ns-resize;z-index:1}.et-query-devtools-panel:where([data-dock=right]) .et-query-devtools-resize{inset-inline:0 auto;inset-block:0;inline-size:.6rem;block-size:auto;cursor:ew-resize}.et-query-devtools-panel:where([data-dock=left]) .et-query-devtools-resize{inset-inline:auto 0;inset-block:0;inline-size:.6rem;block-size:auto;cursor:ew-resize}.et-query-devtools-panel:where([data-dock=top]) .et-query-devtools-resize{inset-block:auto 0}.et-query-devtools-resize:after{content:\"\";position:absolute;inset-inline:50%;inset-block-start:.2rem;inline-size:4rem;margin-inline-start:-2rem;block-size:.2rem;border-radius:999px;background:var(--_et-qdt-border)}.et-query-devtools-panel:where([data-dock=right]) .et-query-devtools-resize:after{inset-inline:.2rem auto;inset-block:50% auto;inline-size:.2rem;block-size:4rem;margin-inline-start:0;margin-block-start:-2rem}.et-query-devtools-panel:where([data-dock=left]) .et-query-devtools-resize:after{inset-inline:auto .2rem;inset-block:50% auto;inline-size:.2rem;block-size:4rem;margin-inline-start:0;margin-block-start:-2rem}.et-query-devtools-panel:where([data-dock=top]) .et-query-devtools-resize:after{inset-block:auto .2rem}@media(hover:hover){.et-query-devtools-resize:hover:after{background:var(--_et-qdt-accent)}}.et-query-devtools-header{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding-inline:.8rem;border-block-end:1px solid var(--_et-qdt-border);flex:0 0 auto}.et-query-devtools-armed-bar{display:flex;align-items:center;gap:.8rem;flex:0 0 auto;padding:.6rem .8rem;background:color-mix(in srgb,var(--_et-qdt-error) 14%,transparent);border-block-end:1px solid color-mix(in srgb,var(--_et-qdt-error) 45%,transparent);color:var(--_et-qdt-error);font-size:1.1rem}.et-query-devtools-armed-text{flex:1 1 auto;min-inline-size:0}.et-query-devtools-notice-bar{display:flex;align-items:center;gap:.8rem;flex:0 0 auto;padding:.6rem .8rem;background:var(--_et-qdt-hover);border-block-end:1px solid var(--_et-qdt-border);color:var(--_et-qdt-fg);font-size:1.1rem}.et-query-devtools-notice-bar .et-query-devtools-btn{flex:0 0 auto}.et-query-devtools-armed-orphans{display:block;opacity:.85}.et-query-devtools-armed-dot{flex:0 0 auto;inline-size:.8rem;block-size:.8rem;border-radius:50%;background:var(--_et-qdt-error);animation:et-query-devtools-armed-pulse 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.et-query-devtools-armed-dot{animation:none}}@keyframes et-query-devtools-armed-pulse{50%{opacity:.25}}.et-query-devtools-armed-bar .et-query-devtools-btn{flex:0 0 auto;border-color:color-mix(in srgb,var(--_et-qdt-error) 55%,transparent);color:var(--_et-qdt-error)}.et-query-devtools-tabs{display:flex;flex-wrap:wrap;gap:.2rem}.et-query-devtools-tab{appearance:none;display:inline-flex;align-items:center;gap:.5rem;border:none;background:transparent;color:var(--_et-qdt-muted);padding:.9rem 1rem;cursor:pointer;border-block-end:2px solid transparent;font:inherit}@media(hover:hover){.et-query-devtools-tab:hover{color:var(--_et-qdt-fg)}}.et-query-devtools-tab--active{color:var(--_et-qdt-fg);border-block-end-color:var(--_et-qdt-accent)}.et-query-devtools-tab-badge{display:inline-block;padding-inline:.45rem;border-radius:999px;background:color-mix(in srgb,var(--_et-qdt-interaction) 12%,transparent);color:var(--_et-qdt-muted);font-size:1rem;font-variant-numeric:tabular-nums}.et-query-devtools-tab-badge--error{background:color-mix(in srgb,var(--_et-qdt-error) 25%,transparent);color:var(--_et-qdt-fg)}.et-query-devtools-menu{display:contents}.et-query-devtools-menu-caret{font-size:.9em;opacity:.7}.et-query-devtools-menu-glyph{display:inline-block;min-inline-size:1.2rem;text-align:center}.et-query-devtools-menu>[data-menu-open]{background:var(--_et-qdt-hover);color:var(--_et-qdt-fg)}.et-menu .et-query-devtools-menu-item-glyph{display:inline-block;inline-size:16px;text-align:center}.et-menu-item-content:has(.et-query-devtools-menu-item-note){display:flex;flex-direction:column;align-items:start;gap:2px;padding-block:8px}.et-query-devtools-menu-item-note{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55));font-size:12px}.et-query-devtools-header-actions{display:flex;align-items:center;gap:.2rem;flex:0 0 auto}.et-query-devtools-header-divider{inline-size:1px;block-size:1.6rem;margin-inline:.4rem;background:var(--_et-qdt-border)}.et-query-devtools-inspect-btn{position:relative}.et-query-devtools-inspect-icon{inline-size:1.4rem;block-size:1.4rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round}.et-query-devtools-inspect-icon-dot{fill:currentColor;stroke:none}.et-query-devtools-btn.et-query-devtools-inspect-btn--active,.et-query-devtools-btn.et-query-devtools-inspect-btn--active:hover{color:#09090b;background:var(--_et-qdt-accent);border-color:var(--_et-qdt-accent)}.et-query-devtools-inspect-btn--active:after{content:\"\";position:absolute;inset:-.3rem;border:1px solid var(--_et-qdt-accent);border-radius:calc(var(--_et-qdt-radius) + .3rem);pointer-events:none;animation:et-query-devtools-inspect-pulse 1.4s ease-in-out infinite}.et-query-devtools-inspect-btn--active .et-query-devtools-inspect-icon-ring{animation:et-query-devtools-inspect-pulse 1.4s ease-in-out infinite}@keyframes et-query-devtools-inspect-pulse{0%,to{opacity:.2}50%{opacity:1}}@media(prefers-reduced-motion:reduce){.et-query-devtools-inspect-btn--active:after,.et-query-devtools-inspect-btn--active .et-query-devtools-inspect-icon-ring{animation:none;opacity:1}}.et-query-devtools-close{appearance:none;border:none;background:transparent;color:var(--_et-qdt-muted);cursor:pointer;padding:.6rem;font:inherit}.et-query-devtools-kbd{border-radius:.3rem;background:var(--_et-qdt-hover);box-shadow:inset 0 0 0 1px var(--_et-qdt-border);color:var(--_et-qdt-muted);padding:.15rem .4rem;font:inherit;font-size:1.1rem;line-height:1.2;white-space:nowrap}.et-query-devtools-kbd--inverse{background:#00000026;box-shadow:inset 0 0 0 1px #00000040;color:inherit}@media(hover:none)and (pointer:coarse){.et-query-devtools-kbd{display:none}}.et-query-devtools-inspect-box{position:fixed;z-index:2147483002;pointer-events:none;border:2px solid var(--_et-qdt-accent);background:color-mix(in srgb,var(--_et-qdt-accent) 15%,transparent);border-radius:.2rem}.et-query-devtools-inspect-tag{position:absolute;inset-block-start:100%;inset-inline-start:0;margin-block-start:.2rem;padding:.2rem .5rem;border-radius:.3rem;background:var(--_et-qdt-accent);color:#09090b;font-family:ui-monospace,monospace;font-size:1.1rem;font-weight:600;white-space:nowrap}@media(hover:hover){.et-query-devtools-close:hover{color:var(--_et-qdt-fg)}}.et-query-devtools-body{flex:1 1 auto;min-block-size:0;overflow:hidden}.et-query-devtools-detail{flex:1 1 auto;min-inline-size:0;overflow-y:auto;padding:1rem}.et-query-devtools-detail .et-query-devtools-meta,.et-query-devtools-drawer .et-query-devtools-meta{padding:.8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 3%,transparent)}.et-query-devtools-detail .et-query-devtools-section-row,.et-query-devtools-drawer .et-query-devtools-section-row{padding-block-start:.8rem;border-block-start:1px solid var(--_et-qdt-border)}.et-query-devtools-filter-chip{display:inline-flex;align-items:center;gap:.6rem;padding:.3rem .35rem .3rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--_et-qdt-accent) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--_et-qdt-accent) 45%,transparent);color:var(--_et-qdt-accent);font-size:1.1rem;font-weight:600;letter-spacing:.02em}.et-query-devtools-filter-icon{font-size:1.3rem;line-height:1}.et-query-devtools-filter-count{border-radius:999px;background:var(--_et-qdt-accent);color:#09090b;min-inline-size:1.8rem;padding:0 .5rem;text-align:center}.et-query-devtools-filter-clear{appearance:none;display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:transparent;color:var(--_et-qdt-muted);cursor:pointer;padding:.3rem .6rem;font:inherit;font-size:1.15rem;line-height:1.4}@media(hover:hover){.et-query-devtools-filter-clear:hover{border-color:color-mix(in srgb,var(--_et-qdt-accent) 60%,transparent);color:var(--_et-qdt-fg)}}.et-query-devtools-scroll{block-size:100%;overflow:auto;padding:1rem;display:flex;flex-direction:column;gap:1rem}.et-query-devtools-split{display:flex;block-size:100%;min-block-size:0}.et-query-devtools-split .et-query-devtools-scroll{flex:1 1 auto;min-inline-size:0}.et-query-devtools-pane{display:flex;flex-direction:column;flex:1 1 auto;block-size:100%;min-inline-size:0;min-block-size:0;overflow:hidden}.et-query-devtools-pane>.et-query-devtools-scroll{padding-block:0 1rem}.et-query-devtools-pane-resize{flex:0 0 .5rem;align-self:stretch;cursor:ew-resize;background:transparent;transition:background .12s ease}.et-query-devtools-pane-resize:active{background:var(--_et-qdt-accent)}@media(hover:hover){.et-query-devtools-pane-resize:hover{background:var(--_et-qdt-accent)}}.et-query-devtools-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;padding:.8rem;position:sticky;inset-block-start:0;z-index:1;background:var(--_et-qdt-bg);border-block-end:1px solid var(--_et-qdt-border)}.et-query-devtools-scroll>.et-query-devtools-toolbar{inset-block-start:-1rem}.et-query-devtools-toolbar-row{display:flex;align-items:center;flex-wrap:wrap;flex:1 1 100%;gap:.5rem}.et-query-devtools-field{display:inline-flex;align-items:center;gap:.6rem;color:var(--_et-qdt-muted)}.et-query-devtools-select{flex:0 0 auto;min-block-size:var(--_et-qdt-control-h);background:color-mix(in srgb,var(--_et-qdt-interaction) 5%,var(--_et-qdt-bg));color:var(--_et-qdt-fg);border:1px solid transparent;border-radius:var(--_et-qdt-radius);padding:.4rem .6rem;font:inherit;font-size:1.15rem}.et-query-devtools-select option{background-color:var(--_et-qdt-bg);color:var(--_et-qdt-fg)}.et-query-devtools-count{color:var(--_et-qdt-subtle)}.et-query-devtools-row{display:flex;align-items:stretch;inline-size:100%;min-block-size:var(--_et-qdt-row-h);border-block-end:1px solid var(--_et-qdt-border);color:var(--_et-qdt-fg)}@media(hover:hover){.et-query-devtools-row:hover{background:var(--_et-qdt-hover)}}.et-query-devtools-method{font-weight:700;font-size:1.1rem;color:var(--_et-qdt-muted);white-space:nowrap}.et-query-devtools-route{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;min-inline-size:0}.et-query-devtools-status{inline-size:.8rem;block-size:.8rem;border-radius:999px;flex:0 0 auto;background:var(--_et-qdt-subtle)}.et-query-devtools-status[data-status=success]{background:var(--_et-qdt-success)}.et-query-devtools-status[data-status=error]{background:var(--_et-qdt-error)}.et-query-devtools-status[data-status=loading],.et-query-devtools-status[data-status=running]{background:var(--_et-qdt-loading)}.et-query-devtools-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;flex:0 0 auto;min-block-size:var(--_et-qdt-control-h);border:1px solid transparent;border-radius:var(--_et-qdt-radius);background:transparent;color:var(--_et-qdt-muted);padding:.25rem .7rem;font:inherit;font-size:1.15rem;line-height:1.4;white-space:nowrap;cursor:pointer;transition:color .12s ease,background-color .12s ease,border-color .12s ease}@media(hover:hover){.et-query-devtools-btn:hover:not(:disabled){background:var(--_et-qdt-hover);color:var(--_et-qdt-fg)}}.et-query-devtools-btn:focus-visible{outline:2px solid var(--_et-qdt-accent);outline-offset:1px}.et-query-devtools-btn:disabled{color:var(--_et-qdt-subtle);cursor:default;background:transparent;opacity:.6}.et-query-devtools-btn--primary,.et-query-devtools-btn--primary:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-accent) 16%,transparent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 40%,transparent);color:var(--_et-qdt-accent)}@media(hover:hover){.et-query-devtools-btn--primary:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-accent) 26%,transparent)}}@media(hover:hover){.et-query-devtools-btn--danger:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-error) 16%,transparent);color:var(--_et-qdt-error)}}.et-query-devtools-btn--tampered,.et-query-devtools-btn--tampered:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-error) 14%,transparent);border-color:color-mix(in srgb,var(--_et-qdt-error) 45%,transparent);color:var(--_et-qdt-error)}.et-query-devtools-icon-btn{inline-size:var(--_et-qdt-control-h);padding-inline:0;font-size:1.3rem}.et-query-devtools-btn-group{display:inline-flex;flex:0 0 auto;border:1px solid var(--_et-qdt-border);border-radius:var(--_et-qdt-radius);overflow:hidden}.et-query-devtools-btn-group>.et-query-devtools-btn{border-radius:0;border-block:0;border-inline-start:0;border-inline-end:1px solid var(--_et-qdt-border)}.et-query-devtools-btn-group>.et-query-devtools-btn:last-child{border-inline-end:0}.et-query-devtools-toolbar-btn{margin-inline-start:auto;flex:0 0 auto}.et-query-devtools-meta{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;margin:0 0 1rem}.et-query-devtools-meta dt{color:var(--_et-qdt-muted)}.et-query-devtools-meta dd{margin:0;overflow-wrap:anywhere}.et-query-devtools-section{margin:1rem 0 .4rem;font-size:1.1rem;text-transform:uppercase;letter-spacing:.05em;color:var(--_et-qdt-muted)}.et-query-devtools-stat{padding:.6rem .8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 3%,transparent)}.et-query-devtools-stat dt{font-size:1rem;text-transform:uppercase;letter-spacing:.05em;color:var(--_et-qdt-muted)}.et-query-devtools-stat dd{margin:0;font-size:1.5rem;font-variant-numeric:tabular-nums}.et-query-devtools-stat-sub{display:block;font-size:1rem;color:var(--_et-qdt-subtle)}.et-query-devtools-json{margin:0;padding:.8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 4%,transparent);overflow-x:auto;white-space:pre-wrap;overflow-wrap:anywhere;max-block-size:24rem;overflow-y:auto}.et-query-devtools-json--error{border-color:color-mix(in srgb,var(--_et-qdt-error) 50%,transparent)}.et-query-devtools-mono{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.et-query-devtools-url{display:inline-block;max-inline-size:32rem;margin-inline-start:.6rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.et-query-devtools-chips,.et-query-devtools-chip-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-block-end:.8rem}.et-query-devtools-chip{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .6rem;border-radius:999px;border:1px solid var(--_et-qdt-border);font-size:1.1rem;color:var(--_et-qdt-fg);background:color-mix(in srgb,var(--_et-qdt-interaction) 6%,transparent)}.et-query-devtools-chip--muted{color:var(--_et-qdt-muted)}.et-query-devtools-retry-glyph{font-size:.7em;line-height:1}.et-query-devtools-chip--loading{color:var(--_et-qdt-loading);border-color:color-mix(in srgb,var(--_et-qdt-loading) 50%,transparent)}.et-query-devtools-chip--error{color:var(--_et-qdt-error);border-color:color-mix(in srgb,var(--_et-qdt-error) 50%,transparent)}.et-query-devtools-chip--success{color:var(--_et-qdt-success);border-color:color-mix(in srgb,var(--_et-qdt-success) 50%,transparent)}button.et-query-devtools-chip--button{appearance:none;cursor:pointer;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}@media(hover:hover){button.et-query-devtools-chip--button:hover{border-color:var(--_et-qdt-accent);color:var(--_et-qdt-accent)}}.et-query-devtools-facet{appearance:none;min-block-size:var(--_et-qdt-control-h);padding-inline:.8rem;background:transparent;cursor:pointer;color:var(--_et-qdt-muted);font:inherit;font-size:1.1rem;line-height:1.4}@media(hover:hover){.et-query-devtools-facet:hover:not(:disabled){color:var(--_et-qdt-fg);background:var(--_et-qdt-hover);border-color:color-mix(in srgb,var(--_et-qdt-accent) 60%,transparent)}}.et-query-devtools-facet:disabled{color:var(--_et-qdt-subtle);cursor:default}.et-query-devtools-facet--active{color:var(--_et-qdt-accent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-accent) 14%,transparent)}.et-query-devtools-facet-count{font-variant-numeric:tabular-nums;color:inherit;opacity:.75}.et-query-devtools-card{border:1px solid var(--_et-qdt-border);border-radius:.6rem;padding:1rem}.et-query-devtools-card--armed{border-color:color-mix(in srgb,var(--_et-qdt-error) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-error) 6%,transparent)}.et-query-devtools-card-head{display:flex;align-items:center;gap:.6rem;margin-block-end:.8rem}.et-query-devtools-inner-queries{display:flex;flex-direction:column;gap:.3rem}.et-query-devtools-inner-row{display:flex;align-items:center;gap:.6rem;inline-size:100%;text-align:start;appearance:none;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:transparent;color:var(--_et-qdt-fg);padding:.4rem .6rem;cursor:pointer;font:inherit}@media(hover:hover){.et-query-devtools-inner-row:hover:not([disabled]){background:var(--_et-qdt-hover)}}.et-query-devtools-inner-row--active{background:var(--_et-qdt-active);border-color:var(--_et-qdt-accent)}.et-query-devtools-inner-row[disabled]{cursor:default;opacity:.6}.et-query-devtools-step-toggle{display:flex;align-items:center;gap:.6rem;inline-size:100%;text-align:start;appearance:none;border:none;background:transparent;color:var(--_et-qdt-fg);padding:.6rem;cursor:pointer;font:inherit}@media(hover:hover){.et-query-devtools-step-toggle:hover{background:var(--_et-qdt-hover)}}.et-query-devtools-step-index{flex:1 1 auto;min-inline-size:0}.et-query-devtools-step-caret{color:var(--_et-qdt-muted)}.et-query-devtools-table{inline-size:100%;border-collapse:collapse}.et-query-devtools-table th,.et-query-devtools-table td{text-align:start;padding:.5rem .6rem;border-block-end:1px solid var(--_et-qdt-border);vertical-align:top}.et-query-devtools-table td .et-query-devtools-chip{padding-block:0;line-height:1.4}.et-query-devtools-table th{color:var(--_et-qdt-muted);font-weight:600;position:sticky;inset-block-start:0;background:var(--_et-qdt-bg)}.et-query-devtools-table tr[data-status=error] td{color:var(--_et-qdt-error)}.et-query-devtools-empty{color:var(--_et-qdt-subtle);padding:1.2rem;text-align:center}.et-query-devtools-cell-actions{display:inline-flex;gap:.4rem;white-space:nowrap}.et-query-devtools-section-row{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-block-start:1rem}.et-query-devtools-search{flex:1 1 16rem;min-inline-size:0;min-block-size:var(--_et-qdt-control-h);background:color-mix(in srgb,var(--_et-qdt-interaction) 5%,transparent);color:var(--_et-qdt-fg);border:1px solid transparent;border-radius:var(--_et-qdt-radius);padding:.4rem .8rem;font:inherit;font-size:1.15rem}.et-query-devtools-search:focus{outline:none;border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:var(--_et-qdt-bg)}.et-query-devtools-row-link{display:inline-flex;align-items:center;gap:.6rem;appearance:none;border:0;background:none;padding:0;color:inherit;font:inherit;text-align:start;cursor:pointer}.et-query-devtools-row-link:focus-visible .et-query-devtools-url{color:var(--_et-qdt-accent);text-decoration:underline}@media(hover:hover){.et-query-devtools-row-link:hover .et-query-devtools-url{color:var(--_et-qdt-accent);text-decoration:underline}}.et-query-devtools-hint{flex:1 1 24rem;color:var(--_et-qdt-muted);font-size:1.1rem;margin:0}.et-query-devtools-input{inline-size:100%;background:var(--_et-qdt-bg);color:var(--_et-qdt-fg);border:1px solid var(--_et-qdt-border);border-radius:.4rem;padding:.4rem .6rem;font:inherit}.et-query-devtools-input--number{inline-size:8rem;font-variant-numeric:tabular-nums}.et-query-devtools-editor{border:1px solid var(--_et-qdt-border);border-radius:.4rem;padding:.8rem;margin-block-end:1rem}.et-query-devtools-editor-error{color:var(--_et-qdt-error);margin:.4rem 0 0}.et-query-devtools-btn--active{color:var(--_et-qdt-accent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-accent) 12%,transparent)}}\n"], dependencies: [{ kind: "component", type: QueryDevtoolsAuthTabComponent, selector: "et-query-devtools-auth-tab" }, { kind: "component", type: QueryDevtoolsCacheTabComponent, selector: "et-query-devtools-cache-tab" }, { kind: "component", type: QueryDevtoolsEventsTabComponent, selector: "et-query-devtools-events-tab" }, { kind: "component", type: QueryDevtoolsAboutComponent, selector: "et-query-devtools-about" }, { kind: "component", type: QueryDevtoolsSettingsComponent, selector: "et-query-devtools-settings" }, { kind: "component", type: QueryDevtoolsFaultsTabComponent, selector: "et-query-devtools-faults-tab" }, { kind: "component", type: QueryDevtoolsFormsTabComponent, selector: "et-query-devtools-forms-tab" }, { kind: "component", type: QueryDevtoolsMocksTabComponent, selector: "et-query-devtools-mocks-tab" }, { kind: "component", type: QueryDevtoolsQueriesTabComponent, selector: "et-query-devtools-queries-tab" }, { kind: "component", type: QueryDevtoolsSequencesTabComponent, selector: "et-query-devtools-sequences-tab" }, { kind: "component", type: QueryDevtoolsSocketsTabComponent, selector: "et-query-devtools-sockets-tab" }, { kind: "component", type: QueryDevtoolsStacksTabComponent, selector: "et-query-devtools-stacks-tab" }, { kind: "component", type: QueryDevtoolsTimelineTabComponent, selector: "et-query-devtools-timeline-tab" }, { kind: "component", type: QueryDevtoolsToggleComponent, selector: "et-query-devtools-toggle", inputs: ["tampered"], outputs: ["openChange"] }, { kind: "directive", type: DragHandleDirective, selector: "[etDragHandle]", inputs: ["commitThreshold", "disabled"], outputs: ["dragTapped", "dragStarted", "dragMoved", "dragEnded", "dragCancelled"] }, { kind: "component", type: MenuComponent, selector: "et-menu" }, { kind: "directive", type: MenuDirective, selector: "[etMenu]", inputs: ["placement", "fallbackPlacements", "offset", "viewportPadding", "arrow", "arrowPadding", "autoFocus", "hoverOpen", "loop", "hoverOpenDelay", "hoverCloseDelay", "disabled", "open"], outputs: ["openChange"], exportAs: ["etMenu"] }, { kind: "component", type: MenuItemComponent, selector: "button[et-menu-item], a[et-menu-item]", inputs: ["variant"] }, { kind: "component", type: MenuRadioGroupComponent, selector: "et-menu-radio-group" }, { kind: "component", type: MenuRadioItemComponent, selector: "et-menu-radio-item", inputs: ["icon"] }, { kind: "directive", type: MenuSurfaceDirective, selector: "ng-template[etMenuSurface]", exportAs: ["etMenuSurface"] }, { kind: "directive", type: MenuTriggerDirective, selector: "[etMenuTrigger]", exportAs: ["etMenuTrigger"] }, { kind: "component", type: ResizeHandlesComponent, selector: "et-resize-handles", inputs: ["edges", "disabled"], outputs: ["resizeStarted", "resizeMoved", "resizeEnded", "resizeCancelled"] }], encapsulation: i0.ViewEncapsulation.None }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "22.0.7", type: QueryDevtoolsComponent, isStandalone: true, selector: "et-query-devtools", inputs: { startOpen: { classPropertyName: "startOpen", publicName: "startOpen", isSignal: true, isRequired: false, transformFunction: null } }, host: { properties: { "attr.data-dock": "dock()" }, classAttribute: "et-query-devtools-host" }, providers: [{ provide: QUERY_DEVTOOLS_HOST, useExisting: QueryDevtoolsComponent }], viewQueries: [{ propertyName: "panelEl", first: true, predicate: ["panel"], descendants: true, isSignal: true }], ngImport: i0, template: "@if (open()) {\n  <section\n    #panel\n    [class.et-query-devtools-panel--resizing]=\"resizing()\"\n    [attr.data-dock]=\"poppedOut() ? 'popout' : dock()\"\n    [attr.data-pane-axis]=\"paneAxis()\"\n    [attr.data-parked]=\"floatParked() ? '' : null\"\n    [style.block-size.px]=\"panelBlockSize()\"\n    [style.inline-size.px]=\"panelInlineSize()\"\n    [style.inset-block-start.px]=\"panelInsetBlock()\"\n    [style.inset-inline-start.px]=\"panelInsetInline()\"\n    [style.--_et-qdt-list-width.px]=\"listWidth()\"\n    [style.--_et-qdt-drawer-width.px]=\"drawerWidth()\"\n    [style.--_et-qdt-list-height.px]=\"listHeight()\"\n    [style.--_et-qdt-drawer-height.px]=\"drawerHeight()\"\n    class=\"et-query-devtools-panel\"\n  >\n    <!-- A pop-out is sized by its window, so there is no edge to drag. A float is a window in the page:\n         a title bar to move it and every edge to resize it, on the same `@ethlete/core` primitives the\n         stream pip window uses. A dock has one edge, and it does both. -->\n    @if (floating()) {\n      <!-- Parked, the panel is a grab strip: the edge handles would eat most of the peek that is left\n           to click, and resizing something you cannot see is not a thing to offer. -->\n      <et-resize-handles\n        [edges]=\"FLOAT_RESIZE_EDGES\"\n        [disabled]=\"floatParked()\"\n        (resizeStarted)=\"startFloatResize()\"\n        (resizeMoved)=\"resizeFloat($event)\"\n        (resizeEnded)=\"endFloatResize()\"\n        (resizeCancelled)=\"endFloatResize()\"\n      />\n      <div\n        (dragMoved)=\"moveFloat($event)\"\n        (dragEnded)=\"endFloatMove()\"\n        (dragCancelled)=\"endFloatMove()\"\n        (dragTapped)=\"restoreFloat()\"\n        class=\"et-query-devtools-move\"\n        title=\"Drag to move \u2014 shove it off an edge to park it, click the strip to bring it back\"\n        aria-hidden=\"true\"\n        etDragHandle\n      ></div>\n    } @else if (!poppedOut()) {\n      <div\n        (pointerdown)=\"startResize($event)\"\n        class=\"et-query-devtools-resize\"\n        title=\"Drag to resize\"\n        aria-hidden=\"true\"\n      ></div>\n    }\n    <header class=\"et-query-devtools-header\">\n      <nav class=\"et-query-devtools-tabs\" role=\"tablist\">\n        @for (tab of visibleTabs(); track tab.id) {\n          @let badge = tabBadges()[tab.id];\n          <button\n            [class.et-query-devtools-tab--active]=\"activeTab() === tab.id\"\n            [attr.aria-selected]=\"activeTab() === tab.id\"\n            (click)=\"activeTab.set(tab.id)\"\n            class=\"et-query-devtools-tab\"\n            type=\"button\"\n            role=\"tab\"\n          >\n            {{ tab.label }}\n            @if (badge.count) {\n              <span class=\"et-query-devtools-tab-badge\">{{ badge.count }}</span>\n            }\n            @if (badge.errors) {\n              <span\n                class=\"et-query-devtools-tab-badge et-query-devtools-tab-badge--error\"\n                title=\"{{ badge.errors }} {{ badge.errorNoun ?? 'failing' }}\"\n              >\n                {{ badge.errors }}\n              </span>\n            }\n          </button>\n        }\n\n        @if (overflowTabs().length; as overflowCount) {\n          <div class=\"et-query-devtools-menu\" etMenu>\n            <button\n              [title]=\"overflowCount + ' tabs with nothing in them'\"\n              class=\"et-query-devtools-tab\"\n              type=\"button\"\n              etMenuTrigger\n            >\n              More\n              <span class=\"et-query-devtools-menu-caret\" aria-hidden=\"true\">\u25BE</span>\n            </button>\n\n            <ng-template etMenuSurface>\n              <et-menu>\n                @for (tab of overflowTabs(); track tab.id) {\n                  <button (activate)=\"activeTab.set(tab.id)\" et-menu-item type=\"button\">{{ tab.label }}</button>\n                }\n              </et-menu>\n            </ng-template>\n          </div>\n        }\n      </nav>\n\n      <div class=\"et-query-devtools-header-actions\">\n        <button\n          [class.et-query-devtools-inspect-btn--active]=\"inspectActive()\"\n          [attr.aria-pressed]=\"inspectActive()\"\n          (click)=\"toggleInspect()\"\n          class=\"et-query-devtools-btn et-query-devtools-inspect-btn\"\n          type=\"button\"\n          title=\"Inspect: hover the UI to find its query\"\n        >\n          <svg\n            class=\"et-query-devtools-inspect-icon\"\n            viewBox=\"0 0 16 16\"\n            width=\"14\"\n            height=\"14\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n            focusable=\"false\"\n          >\n            <circle class=\"et-query-devtools-inspect-icon-ring\" cx=\"8\" cy=\"8\" r=\"4.25\" />\n            <circle class=\"et-query-devtools-inspect-icon-dot\" cx=\"8\" cy=\"8\" r=\"1.15\" />\n            <path d=\"M8 0.9v2.1M8 13v2.1M0.9 8h2.1M13 8h2.1\" />\n          </svg>\n          {{ inspectActive() ? 'Inspecting' : 'Inspect' }}\n          @if (inspectActive()) {\n            <kbd class=\"et-query-devtools-kbd et-query-devtools-kbd--inverse\">Esc</kbd>\n          }\n        </button>\n        <button\n          (click)=\"downloadSession()\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n          title=\"Download every registered entry, the event log, the cache totals and anything armed as one JSON file - the attachment for a bug report\"\n        >\n          <span aria-hidden=\"true\">\u2913</span>\n          Session\n        </button>\n        <!-- A gear, not a tab: Settings holds nothing to count, so the badge/overflow logic would push it\n             behind More - and the one control that explains a panel behaving oddly may not be hidden. -->\n        <button\n          [class.et-query-devtools-btn--active]=\"activeTab() === 'settings'\"\n          [attr.aria-pressed]=\"activeTab() === 'settings'\"\n          (click)=\"toggleSettings()\"\n          class=\"et-query-devtools-btn et-query-devtools-icon-btn\"\n          type=\"button\"\n          title=\"Settings: where panel state is kept, and the limits it holds\"\n          aria-label=\"Settings\"\n        >\n          <span aria-hidden=\"true\">\u2699</span>\n        </button>\n        @if (!poppedOut()) {\n          @let layout = currentLayout();\n          <div class=\"et-query-devtools-menu\" etMenu placement=\"bottom-end\">\n            <button class=\"et-query-devtools-btn\" title=\"Where the panel sits\" type=\"button\" etMenuTrigger>\n              <span class=\"et-query-devtools-menu-glyph\" aria-hidden=\"true\">{{ layout.glyph }}</span>\n              {{ layout.label }}\n              <span class=\"et-query-devtools-menu-caret\" aria-hidden=\"true\">\u25BE</span>\n            </button>\n\n            <ng-template etMenuSurface>\n              <et-menu>\n                <et-menu-radio-group [value]=\"dock()\">\n                  @for (option of LAYOUTS; track option.id) {\n                    <!-- eslint-disable ethlete/prefer-static-boolean-properties -- closeOnActivate is tri-state (boolean | undefined); a transform would collapse its unset state -->\n                    <et-menu-radio-item\n                      [value]=\"option.id\"\n                      [title]=\"option.hint\"\n                      [closeOnActivate]=\"true\"\n                      (activate)=\"selectLayout(option.id)\"\n                    >\n                      <!-- eslint-enable ethlete/prefer-static-boolean-properties -->\n                      <span class=\"et-query-devtools-menu-item-glyph\" aria-hidden=\"true\">{{ option.glyph }}</span>\n                      {{ option.label }}\n                    </et-menu-radio-item>\n                  }\n                </et-menu-radio-group>\n              </et-menu>\n            </ng-template>\n          </div>\n        }\n        <span class=\"et-query-devtools-header-divider\" aria-hidden=\"true\"></span>\n        <button\n          (click)=\"toggleOpen()\"\n          class=\"et-query-devtools-btn et-query-devtools-btn--danger\"\n          type=\"button\"\n          title=\"{{ poppedOut() ? 'Bring the panel back into the app window' : 'Close devtools (' + shortcut + ')' }}\"\n        >\n          @if (poppedOut()) {\n            <span aria-hidden=\"true\">\u29C8</span>\n            Dock back\n          } @else {\n            <span aria-hidden=\"true\">\u2715</span>\n            Close\n            <kbd class=\"et-query-devtools-kbd\">{{ shortcut }}</kbd>\n          }\n        </button>\n      </div>\n    </header>\n\n    @if (popOutBlocked()) {\n      <div class=\"et-query-devtools-notice-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-text\">\n          The browser blocked the pop-up window. Allow pop-ups for this site, or float the panel over the page instead \u2014\n          a float needs no permission.\n        </span>\n        <button (click)=\"floatPanel()\" class=\"et-query-devtools-btn\" type=\"button\">Float instead</button>\n        <button (click)=\"popOutBlocked.set(false)\" class=\"et-query-devtools-btn\" type=\"button\">Dismiss</button>\n      </div>\n    }\n\n    @if (armedFaultClients(); as armed) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          <strong>Faults armed</strong> on\n          <span class=\"et-query-devtools-mono\">{{ armed.join(', ') }}</span>\n          \u2014 every failure and delay you see from\n          {{ armed.length === 1 ? 'this client' : 'these clients' }} is injected, not the API.\n          @if (faultsRestored()) {\n            They came back from your last page load \u2014 set <em>Armed faults</em> back to <em>none</em> in Settings to\n            stop that.\n          }\n        </span>\n        <button\n          [disabled]=\"activeTab() === 'faults'\"\n          (click)=\"activeTab.set('faults')\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n        >\n          Review\n        </button>\n        <button (click)=\"CLEAR_FAULTS()\" class=\"et-query-devtools-btn\" type=\"button\">Disarm all</button>\n      </div>\n    }\n\n    @if (armedMockRoutes(); as mocked) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          <strong>Mocks armed</strong> on\n          <span class=\"et-query-devtools-mono\">{{ mocked.join(', ') }}</span>\n          \u2014 {{ mocked.length === 1 ? 'that route is' : 'those routes are' }} answered by the panel, so nothing they show\n          reached the API.\n          @if (mocksRestored()) {\n            They came back from your last page load \u2014 set <em>Armed mocks</em> back to <em>none</em> in Settings to stop\n            that.\n          }\n        </span>\n        <button\n          [disabled]=\"activeTab() === 'mocks'\"\n          (click)=\"activeTab.set('mocks')\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n        >\n          Review\n        </button>\n        <button (click)=\"DISARM_MOCKS()\" class=\"et-query-devtools-btn\" type=\"button\">Disarm all</button>\n      </div>\n    }\n\n    @if (restoredOverrides(); as restored) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          @if (restored.ops) {\n            <strong>Overrides re-armed</strong> \u2014 {{ restored.ops }} {{ restored.ops === 1 ? 'edit' : 'edits' }} from\n            your last page load {{ restored.ops === 1 ? 'is' : 'are' }} back on {{ restored.queries }}\n            {{ restored.queries === 1 ? 'query' : 'queries' }}, so those responses are not what the API sent.\n            @if (restored.fromLocalStorage) {\n              They came back from <strong>localStorage</strong>, so they outlive closing this tab \u2014 clear them, or set\n              overrides back to <em>session</em> in Settings.\n            }\n          } @else {\n            <strong>Overrides could not be re-armed.</strong>\n          }\n          @if (restored.orphaned.length) {\n            <span class=\"et-query-devtools-armed-orphans\">\n              {{ restored.orphaned.length }} stored\n              {{ restored.orphaned.length === 1 ? 'override' : 'overrides' }} matched no query \u2014\n              <span class=\"et-query-devtools-mono\">{{ restored.orphaned.join(', ') }}</span>\n            </span>\n          }\n        </span>\n        @if (restored.firstId; as firstId) {\n          <button (click)=\"reviewRestoredOverrides(firstId)\" class=\"et-query-devtools-btn\" type=\"button\">Review</button>\n        }\n        <button (click)=\"DROP_RESTORED_OVERRIDES()\" class=\"et-query-devtools-btn\" type=\"button\">Drop all</button>\n      </div>\n    }\n\n    <div class=\"et-query-devtools-body\">\n      @switch (activeTab()) {\n        <!-- QUERIES -->\n        @case ('queries') {\n          <et-query-devtools-queries-tab />\n        }\n\n        <!-- STACKS -->\n        @case ('stacks') {\n          <et-query-devtools-stacks-tab />\n        }\n\n        <!-- SEQUENCES -->\n        @case ('sequences') {\n          <et-query-devtools-sequences-tab />\n        }\n\n        <!-- FORMS -->\n        @case ('forms') {\n          <et-query-devtools-forms-tab />\n        }\n\n        <!-- AUTH -->\n        @case ('auth') {\n          <et-query-devtools-auth-tab />\n        }\n\n        <!-- SOCKETS -->\n        @case ('ws') {\n          <et-query-devtools-sockets-tab />\n        }\n\n        <!-- CACHE -->\n        @case ('cache') {\n          <et-query-devtools-cache-tab />\n        }\n\n        <!-- LOCKS -->\n        @case ('locks') {\n          <et-query-devtools-locks-tab />\n        }\n\n        <!-- TIMELINE -->\n        @case ('timeline') {\n          <et-query-devtools-timeline-tab />\n        }\n\n        <!-- EVENTS -->\n        @case ('events') {\n          <et-query-devtools-events-tab />\n        }\n\n        <!-- FAULTS -->\n        @case ('faults') {\n          <et-query-devtools-faults-tab />\n        }\n\n        <!-- MOCKS -->\n        @case ('mocks') {\n          <et-query-devtools-mocks-tab />\n        }\n\n        <!-- ABOUT -->\n        @case ('about') {\n          <et-query-devtools-about />\n        }\n\n        <!-- SETTINGS -->\n        @case ('settings') {\n          <et-query-devtools-settings />\n        }\n      }\n    </div>\n  </section>\n}\n\n@if (!open()) {\n  <et-query-devtools-toggle [tampered]=\"panelTampered()\" (openChange)=\"toggleOpen()\" />\n}\n\n@if (inspectActive() && inspectHover(); as hover) {\n  <div\n    [style.left.px]=\"hover.rect.left\"\n    [style.top.px]=\"hover.rect.top\"\n    [style.width.px]=\"hover.rect.width\"\n    [style.height.px]=\"hover.rect.height\"\n    class=\"et-query-devtools-inspect-box\"\n  >\n    <span class=\"et-query-devtools-inspect-tag\">{{ inspectLabel(hover.entries) }}</span>\n  </div>\n}\n\n@if (locatedRect(); as rect) {\n  <div\n    [style.left.px]=\"rect.left\"\n    [style.top.px]=\"rect.top\"\n    [style.width.px]=\"rect.width\"\n    [style.height.px]=\"rect.height\"\n    class=\"et-query-devtools-inspect-box\"\n  >\n    <span class=\"et-query-devtools-inspect-tag\">created here</span>\n  </div>\n}\n", styles: ["@layer components{.et-query-devtools-host{--_et-qdt-bg: var(--et-surface-background-solid, rgb(24 24 27));--_et-qdt-fg: var(--et-surface-color-solid, rgb(244 244 245));--_et-qdt-muted: var(--et-surface-color-muted-solid, rgb(161 161 170));--_et-qdt-subtle: var(--et-surface-color-subtle-solid, rgb(113 113 122));--_et-qdt-border: var(--et-surface-border-solid, rgb(255 255 255 / .12));--_et-qdt-interaction: var(--et-surface-interaction-solid, rgb(255 255 255));--_et-qdt-accent: var(--et-theme-color-primary-solid, rgb(96 165 250));--_et-qdt-hover: color-mix(in srgb, var(--_et-qdt-interaction) 10%, transparent);--_et-qdt-active: color-mix(in srgb, var(--_et-qdt-interaction) 18%, transparent);--_et-qdt-success: rgb(34 197 94);--_et-qdt-error: rgb(239 68 68);--_et-qdt-loading: rgb(234 179 8);--_et-qdt-title-bar: 2.4rem;--_et-qdt-radius: .5rem;--_et-qdt-control-h: 2.4rem;--_et-qdt-row-h: 3.6rem;position:fixed;inset-inline:0;inset-block-end:0;z-index:2147483000;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:1.2rem;line-height:1.4;pointer-events:none}.et-query-devtools-host>*{pointer-events:auto}@media(pointer:coarse){.et-query-devtools-host{--_et-qdt-control-h: 3.4rem;--_et-qdt-row-h: 4.4rem}}.et-query-devtools-panel{position:relative;display:flex;flex-direction:column;inline-size:100%;min-block-size:20rem;max-block-size:90vh;background:var(--_et-qdt-bg);color:var(--_et-qdt-fg);border-block-start:1px solid var(--_et-qdt-border);box-shadow:0 -.4rem 2rem #00000059}.et-query-devtools-host:where([data-dock=right]){inset-block:0;inset-inline-start:auto}.et-query-devtools-panel:where([data-dock=right]){inline-size:auto;block-size:100%;max-block-size:none;max-inline-size:90vw;border-block-start:0;border-inline-start:1px solid var(--_et-qdt-border);box-shadow:-.4rem 0 2rem #00000059}.et-query-devtools-host:where([data-dock=float]){inset:0}.et-query-devtools-panel:where([data-dock=float]){--_et-qdt-frame: .8rem;--et-resize-handles-edge-size: var(--_et-qdt-frame);--et-resize-handles-touch-edge-size: var(--_et-qdt-frame);--et-resize-handles-corner-size: 1.6rem;--et-resize-handles-touch-corner-size: 1.6rem;--et-resize-handles-edge-inset: 1.6rem;--et-resize-handles-side-top: var(--_et-qdt-title-bar);--et-resize-handles-side-bottom: 1.6rem;--et-resize-handles-z-index: 3;position:absolute;inline-size:auto;min-block-size:0;max-block-size:none;padding-block-start:var(--_et-qdt-title-bar);padding-inline:var(--_et-qdt-frame);padding-block-end:var(--_et-qdt-frame);border:1px solid var(--_et-qdt-border);border-radius:.6rem;box-shadow:0 1rem 4rem #00000073;overflow:hidden}.et-query-devtools-move{position:absolute;inset-inline:0;inset-block-start:0;block-size:var(--_et-qdt-title-bar);cursor:move;z-index:2}.et-query-devtools-panel:where([data-dock=float]) .et-query-devtools-body{border-radius:.3rem;overflow:hidden}.et-query-devtools-move:after{content:\"\";position:absolute;inset-inline:50%;inset-block-start:.9rem;inline-size:3rem;margin-inline-start:-1.5rem;block-size:.6rem;background-image:radial-gradient(currentcolor 40%,transparent 42%);background-size:.4rem .3rem;color:var(--_et-qdt-subtle)}@media(hover:hover){.et-query-devtools-move:hover:after{color:var(--_et-qdt-accent)}}.et-query-devtools-panel:where([data-dock=float][data-parked]){opacity:.85}@media(hover:hover){.et-query-devtools-panel:where([data-dock=float][data-parked]):hover{opacity:1}}.et-query-devtools-panel:where([data-dock=float][data-parked]) .et-query-devtools-move{cursor:grab;background:var(--_et-qdt-active)}.et-query-devtools-panel:where([data-dock=float][data-parked]) .et-query-devtools-move:after{color:var(--_et-qdt-accent)}.et-query-devtools-host:where([data-dock=left]){inset-block:0;inset-inline-end:auto}.et-query-devtools-panel:where([data-dock=left]){inline-size:auto;block-size:100%;max-block-size:none;max-inline-size:90vw;border-block-start:0;border-inline-end:1px solid var(--_et-qdt-border);box-shadow:.4rem 0 2rem #00000059}.et-query-devtools-host:where([data-dock=top]){inset-block-start:0;inset-block-end:auto}.et-query-devtools-panel:where([data-dock=top]){border-block-start:0;border-block-end:1px solid var(--_et-qdt-border);box-shadow:0 .4rem 2rem #00000059}.et-query-devtools-host:where([data-dock=popout]){position:static;inline-size:100%;block-size:100%}.et-query-devtools-panel:where([data-dock=popout]){block-size:100%;max-block-size:none;border:0;box-shadow:none}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-header{flex-wrap:wrap}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-tabs,.et-query-devtools-header-actions){flex:1 1 auto;flex-wrap:nowrap;min-inline-size:0;overflow-x:auto}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-tabs,.et-query-devtools-header-actions)>*{flex:none}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-master-detail,.et-query-devtools-split){flex-direction:column}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-list,.et-query-devtools-detail,.et-query-devtools-drawer,.et-query-devtools-split .et-query-devtools-scroll){flex:1 1 50%;min-inline-size:0;min-block-size:0;max-inline-size:none;border-inline-start:0;border-inline-end:0}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-detail,.et-query-devtools-drawer){border-block-start:1px solid var(--_et-qdt-border)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-master-detail>.et-query-devtools-list{flex:0 1 var(--_et-qdt-list-height, 50%);min-block-size:var(--_et-qdt-list-height, 0);max-block-size:var(--_et-qdt-list-height, none)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-split>.et-query-devtools-drawer{flex:0 1 var(--_et-qdt-drawer-height, 50%);min-block-size:var(--_et-qdt-drawer-height, 0);max-block-size:var(--_et-qdt-drawer-height, none)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-pane-resize{cursor:ns-resize}.et-query-devtools-panel--resizing{-webkit-user-select:none;user-select:none}.et-query-devtools-resize,.et-query-devtools-pane-resize{touch-action:none}.et-query-devtools-resize{position:absolute;inset-inline:0;inset-block-start:0;block-size:.6rem;cursor:ns-resize;z-index:1}.et-query-devtools-panel:where([data-dock=right]) .et-query-devtools-resize{inset-inline:0 auto;inset-block:0;inline-size:.6rem;block-size:auto;cursor:ew-resize}.et-query-devtools-panel:where([data-dock=left]) .et-query-devtools-resize{inset-inline:auto 0;inset-block:0;inline-size:.6rem;block-size:auto;cursor:ew-resize}.et-query-devtools-panel:where([data-dock=top]) .et-query-devtools-resize{inset-block:auto 0}.et-query-devtools-resize:after{content:\"\";position:absolute;inset-inline:50%;inset-block-start:.2rem;inline-size:4rem;margin-inline-start:-2rem;block-size:.2rem;border-radius:999px;background:var(--_et-qdt-border)}.et-query-devtools-panel:where([data-dock=right]) .et-query-devtools-resize:after{inset-inline:.2rem auto;inset-block:50% auto;inline-size:.2rem;block-size:4rem;margin-inline-start:0;margin-block-start:-2rem}.et-query-devtools-panel:where([data-dock=left]) .et-query-devtools-resize:after{inset-inline:auto .2rem;inset-block:50% auto;inline-size:.2rem;block-size:4rem;margin-inline-start:0;margin-block-start:-2rem}.et-query-devtools-panel:where([data-dock=top]) .et-query-devtools-resize:after{inset-block:auto .2rem}@media(hover:hover){.et-query-devtools-resize:hover:after{background:var(--_et-qdt-accent)}}.et-query-devtools-header{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding-inline:.8rem;border-block-end:1px solid var(--_et-qdt-border);flex:0 0 auto}.et-query-devtools-armed-bar{display:flex;align-items:center;gap:.8rem;flex:0 0 auto;padding:.6rem .8rem;background:color-mix(in srgb,var(--_et-qdt-error) 14%,transparent);border-block-end:1px solid color-mix(in srgb,var(--_et-qdt-error) 45%,transparent);color:var(--_et-qdt-error);font-size:1.1rem}.et-query-devtools-armed-text{flex:1 1 auto;min-inline-size:0}.et-query-devtools-notice-bar{display:flex;align-items:center;gap:.8rem;flex:0 0 auto;padding:.6rem .8rem;background:var(--_et-qdt-hover);border-block-end:1px solid var(--_et-qdt-border);color:var(--_et-qdt-fg);font-size:1.1rem}.et-query-devtools-notice-bar .et-query-devtools-btn{flex:0 0 auto}.et-query-devtools-armed-orphans{display:block;opacity:.85}.et-query-devtools-armed-dot{flex:0 0 auto;inline-size:.8rem;block-size:.8rem;border-radius:50%;background:var(--_et-qdt-error);animation:et-query-devtools-armed-pulse 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.et-query-devtools-armed-dot{animation:none}}@keyframes et-query-devtools-armed-pulse{50%{opacity:.25}}.et-query-devtools-armed-bar .et-query-devtools-btn{flex:0 0 auto;border-color:color-mix(in srgb,var(--_et-qdt-error) 55%,transparent);color:var(--_et-qdt-error)}.et-query-devtools-tabs{display:flex;flex-wrap:wrap;gap:.2rem}.et-query-devtools-tab{appearance:none;display:inline-flex;align-items:center;gap:.5rem;border:none;background:transparent;color:var(--_et-qdt-muted);padding:.9rem 1rem;cursor:pointer;border-block-end:2px solid transparent;font:inherit}@media(hover:hover){.et-query-devtools-tab:hover{color:var(--_et-qdt-fg)}}.et-query-devtools-tab--active{color:var(--_et-qdt-fg);border-block-end-color:var(--_et-qdt-accent)}.et-query-devtools-tab-badge{display:inline-block;padding-inline:.45rem;border-radius:999px;background:color-mix(in srgb,var(--_et-qdt-interaction) 12%,transparent);color:var(--_et-qdt-muted);font-size:1rem;font-variant-numeric:tabular-nums}.et-query-devtools-tab-badge--error{background:color-mix(in srgb,var(--_et-qdt-error) 25%,transparent);color:var(--_et-qdt-fg)}.et-query-devtools-menu{display:contents}.et-query-devtools-menu-caret{font-size:.9em;opacity:.7}.et-query-devtools-menu-glyph{display:inline-block;min-inline-size:1.2rem;text-align:center}.et-query-devtools-menu>[data-menu-open]{background:var(--_et-qdt-hover);color:var(--_et-qdt-fg)}.et-menu .et-query-devtools-menu-item-glyph{display:inline-block;inline-size:16px;text-align:center}.et-menu-item-content:has(.et-query-devtools-menu-item-note){display:flex;flex-direction:column;align-items:start;gap:2px;padding-block:8px}.et-query-devtools-menu-item-note{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55));font-size:12px}.et-query-devtools-header-actions{display:flex;align-items:center;gap:.2rem;flex:0 0 auto}.et-query-devtools-header-divider{inline-size:1px;block-size:1.6rem;margin-inline:.4rem;background:var(--_et-qdt-border)}.et-query-devtools-inspect-btn{position:relative}.et-query-devtools-inspect-icon{inline-size:1.4rem;block-size:1.4rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round}.et-query-devtools-inspect-icon-dot{fill:currentColor;stroke:none}.et-query-devtools-btn.et-query-devtools-inspect-btn--active,.et-query-devtools-btn.et-query-devtools-inspect-btn--active:hover{color:#09090b;background:var(--_et-qdt-accent);border-color:var(--_et-qdt-accent)}.et-query-devtools-inspect-btn--active:after{content:\"\";position:absolute;inset:-.3rem;border:1px solid var(--_et-qdt-accent);border-radius:calc(var(--_et-qdt-radius) + .3rem);pointer-events:none;animation:et-query-devtools-inspect-pulse 1.4s ease-in-out infinite}.et-query-devtools-inspect-btn--active .et-query-devtools-inspect-icon-ring{animation:et-query-devtools-inspect-pulse 1.4s ease-in-out infinite}@keyframes et-query-devtools-inspect-pulse{0%,to{opacity:.2}50%{opacity:1}}@media(prefers-reduced-motion:reduce){.et-query-devtools-inspect-btn--active:after,.et-query-devtools-inspect-btn--active .et-query-devtools-inspect-icon-ring{animation:none;opacity:1}}.et-query-devtools-close{appearance:none;border:none;background:transparent;color:var(--_et-qdt-muted);cursor:pointer;padding:.6rem;font:inherit}.et-query-devtools-kbd{border-radius:.3rem;background:var(--_et-qdt-hover);box-shadow:inset 0 0 0 1px var(--_et-qdt-border);color:var(--_et-qdt-muted);padding:.15rem .4rem;font:inherit;font-size:1.1rem;line-height:1.2;white-space:nowrap}.et-query-devtools-kbd--inverse{background:#00000026;box-shadow:inset 0 0 0 1px #00000040;color:inherit}@media(hover:none)and (pointer:coarse){.et-query-devtools-kbd{display:none}}.et-query-devtools-inspect-box{position:fixed;z-index:2147483002;pointer-events:none;border:2px solid var(--_et-qdt-accent);background:color-mix(in srgb,var(--_et-qdt-accent) 15%,transparent);border-radius:.2rem}.et-query-devtools-inspect-tag{position:absolute;inset-block-start:100%;inset-inline-start:0;margin-block-start:.2rem;padding:.2rem .5rem;border-radius:.3rem;background:var(--_et-qdt-accent);color:#09090b;font-family:ui-monospace,monospace;font-size:1.1rem;font-weight:600;white-space:nowrap}@media(hover:hover){.et-query-devtools-close:hover{color:var(--_et-qdt-fg)}}.et-query-devtools-body{flex:1 1 auto;min-block-size:0;overflow:hidden}.et-query-devtools-detail{flex:1 1 auto;min-inline-size:0;overflow-y:auto;padding:1rem}.et-query-devtools-detail .et-query-devtools-meta,.et-query-devtools-drawer .et-query-devtools-meta{padding:.8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 3%,transparent)}.et-query-devtools-detail .et-query-devtools-section-row,.et-query-devtools-drawer .et-query-devtools-section-row{padding-block-start:.8rem;border-block-start:1px solid var(--_et-qdt-border)}.et-query-devtools-filter-chip{display:inline-flex;align-items:center;gap:.6rem;padding:.3rem .35rem .3rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--_et-qdt-accent) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--_et-qdt-accent) 45%,transparent);color:var(--_et-qdt-accent);font-size:1.1rem;font-weight:600;letter-spacing:.02em}.et-query-devtools-filter-icon{font-size:1.3rem;line-height:1}.et-query-devtools-filter-count{border-radius:999px;background:var(--_et-qdt-accent);color:#09090b;min-inline-size:1.8rem;padding:0 .5rem;text-align:center}.et-query-devtools-filter-clear{appearance:none;display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:transparent;color:var(--_et-qdt-muted);cursor:pointer;padding:.3rem .6rem;font:inherit;font-size:1.15rem;line-height:1.4}@media(hover:hover){.et-query-devtools-filter-clear:hover{border-color:color-mix(in srgb,var(--_et-qdt-accent) 60%,transparent);color:var(--_et-qdt-fg)}}.et-query-devtools-scroll{block-size:100%;overflow:auto;padding:1rem;display:flex;flex-direction:column;gap:1rem}.et-query-devtools-split{display:flex;block-size:100%;min-block-size:0}.et-query-devtools-split .et-query-devtools-scroll{flex:1 1 auto;min-inline-size:0}.et-query-devtools-pane{display:flex;flex-direction:column;flex:1 1 auto;block-size:100%;min-inline-size:0;min-block-size:0;overflow:hidden}.et-query-devtools-pane>.et-query-devtools-scroll{padding-block:0 1rem}.et-query-devtools-pane-resize{flex:0 0 .5rem;align-self:stretch;cursor:ew-resize;background:transparent;transition:background .12s ease}.et-query-devtools-pane-resize:active{background:var(--_et-qdt-accent)}@media(hover:hover){.et-query-devtools-pane-resize:hover{background:var(--_et-qdt-accent)}}.et-query-devtools-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;padding:.8rem;position:sticky;inset-block-start:0;z-index:1;background:var(--_et-qdt-bg);border-block-end:1px solid var(--_et-qdt-border)}.et-query-devtools-scroll>.et-query-devtools-toolbar{inset-block-start:-1rem}.et-query-devtools-toolbar-row{display:flex;align-items:center;flex-wrap:wrap;flex:1 1 100%;gap:.5rem}.et-query-devtools-field{display:inline-flex;align-items:center;gap:.6rem;color:var(--_et-qdt-muted)}.et-query-devtools-select{flex:0 0 auto;min-block-size:var(--_et-qdt-control-h);background:color-mix(in srgb,var(--_et-qdt-interaction) 5%,var(--_et-qdt-bg));color:var(--_et-qdt-fg);border:1px solid transparent;border-radius:var(--_et-qdt-radius);padding:.4rem .6rem;font:inherit;font-size:1.15rem}.et-query-devtools-select option{background-color:var(--_et-qdt-bg);color:var(--_et-qdt-fg)}.et-query-devtools-count{color:var(--_et-qdt-subtle)}.et-query-devtools-row{display:flex;align-items:stretch;inline-size:100%;min-block-size:var(--_et-qdt-row-h);border-block-end:1px solid var(--_et-qdt-border);color:var(--_et-qdt-fg)}@media(hover:hover){.et-query-devtools-row:hover{background:var(--_et-qdt-hover)}}.et-query-devtools-method{font-weight:700;font-size:1.1rem;color:var(--_et-qdt-muted);white-space:nowrap}.et-query-devtools-route{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;min-inline-size:0}.et-query-devtools-status{inline-size:.8rem;block-size:.8rem;border-radius:999px;flex:0 0 auto;background:var(--_et-qdt-subtle)}.et-query-devtools-status[data-status=success]{background:var(--_et-qdt-success)}.et-query-devtools-status[data-status=error]{background:var(--_et-qdt-error)}.et-query-devtools-status[data-status=loading],.et-query-devtools-status[data-status=running]{background:var(--_et-qdt-loading)}.et-query-devtools-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;flex:0 0 auto;min-block-size:var(--_et-qdt-control-h);border:1px solid transparent;border-radius:var(--_et-qdt-radius);background:transparent;color:var(--_et-qdt-muted);padding:.25rem .7rem;font:inherit;font-size:1.15rem;line-height:1.4;white-space:nowrap;cursor:pointer;transition:color .12s ease,background-color .12s ease,border-color .12s ease}@media(hover:hover){.et-query-devtools-btn:hover:not(:disabled){background:var(--_et-qdt-hover);color:var(--_et-qdt-fg)}}.et-query-devtools-btn:focus-visible{outline:2px solid var(--_et-qdt-accent);outline-offset:1px}.et-query-devtools-btn:disabled{color:var(--_et-qdt-subtle);cursor:default;background:transparent;opacity:.6}.et-query-devtools-btn--primary,.et-query-devtools-btn--primary:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-accent) 16%,transparent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 40%,transparent);color:var(--_et-qdt-accent)}@media(hover:hover){.et-query-devtools-btn--primary:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-accent) 26%,transparent)}}@media(hover:hover){.et-query-devtools-btn--danger:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-error) 16%,transparent);color:var(--_et-qdt-error)}}.et-query-devtools-btn--tampered,.et-query-devtools-btn--tampered:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-error) 14%,transparent);border-color:color-mix(in srgb,var(--_et-qdt-error) 45%,transparent);color:var(--_et-qdt-error)}.et-query-devtools-icon-btn{inline-size:var(--_et-qdt-control-h);padding-inline:0;font-size:1.3rem}.et-query-devtools-btn-group{display:inline-flex;flex:0 0 auto;border:1px solid var(--_et-qdt-border);border-radius:var(--_et-qdt-radius);overflow:hidden}.et-query-devtools-btn-group>.et-query-devtools-btn{border-radius:0;border-block:0;border-inline-start:0;border-inline-end:1px solid var(--_et-qdt-border)}.et-query-devtools-btn-group>.et-query-devtools-btn:last-child{border-inline-end:0}.et-query-devtools-toolbar-btn{margin-inline-start:auto;flex:0 0 auto}.et-query-devtools-meta{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;margin:0 0 1rem}.et-query-devtools-meta dt{color:var(--_et-qdt-muted)}.et-query-devtools-meta dd{margin:0;overflow-wrap:anywhere}.et-query-devtools-section{margin:1rem 0 .4rem;font-size:1.1rem;text-transform:uppercase;letter-spacing:.05em;color:var(--_et-qdt-muted)}.et-query-devtools-stat{padding:.6rem .8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 3%,transparent)}.et-query-devtools-stat dt{font-size:1rem;text-transform:uppercase;letter-spacing:.05em;color:var(--_et-qdt-muted)}.et-query-devtools-stat dd{margin:0;font-size:1.5rem;font-variant-numeric:tabular-nums}.et-query-devtools-stat-sub{display:block;font-size:1rem;color:var(--_et-qdt-subtle)}.et-query-devtools-json{margin:0;padding:.8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 4%,transparent);overflow-x:auto;white-space:pre-wrap;overflow-wrap:anywhere;max-block-size:24rem;overflow-y:auto}.et-query-devtools-json--error{border-color:color-mix(in srgb,var(--_et-qdt-error) 50%,transparent)}.et-query-devtools-mono{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.et-query-devtools-url{display:inline-block;max-inline-size:32rem;margin-inline-start:.6rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.et-query-devtools-chips,.et-query-devtools-chip-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-block-end:.8rem}.et-query-devtools-chip{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .6rem;border-radius:999px;border:1px solid var(--_et-qdt-border);font-size:1.1rem;color:var(--_et-qdt-fg);background:color-mix(in srgb,var(--_et-qdt-interaction) 6%,transparent)}.et-query-devtools-chip--muted{color:var(--_et-qdt-muted)}.et-query-devtools-retry-glyph{font-size:.7em;line-height:1}.et-query-devtools-chip--loading{color:var(--_et-qdt-loading);border-color:color-mix(in srgb,var(--_et-qdt-loading) 50%,transparent)}.et-query-devtools-chip--error{color:var(--_et-qdt-error);border-color:color-mix(in srgb,var(--_et-qdt-error) 50%,transparent)}.et-query-devtools-chip--success{color:var(--_et-qdt-success);border-color:color-mix(in srgb,var(--_et-qdt-success) 50%,transparent)}button.et-query-devtools-chip--button{appearance:none;cursor:pointer;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}@media(hover:hover){button.et-query-devtools-chip--button:hover{border-color:var(--_et-qdt-accent);color:var(--_et-qdt-accent)}}.et-query-devtools-facet{appearance:none;min-block-size:var(--_et-qdt-control-h);padding-inline:.8rem;background:transparent;cursor:pointer;color:var(--_et-qdt-muted);font:inherit;font-size:1.1rem;line-height:1.4}@media(hover:hover){.et-query-devtools-facet:hover:not(:disabled){color:var(--_et-qdt-fg);background:var(--_et-qdt-hover);border-color:color-mix(in srgb,var(--_et-qdt-accent) 60%,transparent)}}.et-query-devtools-facet:disabled{color:var(--_et-qdt-subtle);cursor:default}.et-query-devtools-facet--active{color:var(--_et-qdt-accent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-accent) 14%,transparent)}.et-query-devtools-facet-count{font-variant-numeric:tabular-nums;color:inherit;opacity:.75}.et-query-devtools-card{border:1px solid var(--_et-qdt-border);border-radius:.6rem;padding:1rem}.et-query-devtools-card--armed{border-color:color-mix(in srgb,var(--_et-qdt-error) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-error) 6%,transparent)}.et-query-devtools-card-head{display:flex;align-items:center;gap:.6rem;margin-block-end:.8rem}.et-query-devtools-inner-queries{display:flex;flex-direction:column;gap:.3rem}.et-query-devtools-inner-row{display:flex;align-items:center;gap:.6rem;inline-size:100%;text-align:start;appearance:none;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:transparent;color:var(--_et-qdt-fg);padding:.4rem .6rem;cursor:pointer;font:inherit}@media(hover:hover){.et-query-devtools-inner-row:hover:not([disabled]){background:var(--_et-qdt-hover)}}.et-query-devtools-inner-row--active{background:var(--_et-qdt-active);border-color:var(--_et-qdt-accent)}.et-query-devtools-inner-row[disabled]{cursor:default;opacity:.6}.et-query-devtools-step-toggle{display:flex;align-items:center;gap:.6rem;inline-size:100%;text-align:start;appearance:none;border:none;background:transparent;color:var(--_et-qdt-fg);padding:.6rem;cursor:pointer;font:inherit}@media(hover:hover){.et-query-devtools-step-toggle:hover{background:var(--_et-qdt-hover)}}.et-query-devtools-step-index{flex:1 1 auto;min-inline-size:0}.et-query-devtools-step-caret{color:var(--_et-qdt-muted)}.et-query-devtools-table{inline-size:100%;border-collapse:collapse}.et-query-devtools-table th,.et-query-devtools-table td{text-align:start;padding:.5rem .6rem;border-block-end:1px solid var(--_et-qdt-border);vertical-align:top}.et-query-devtools-table td .et-query-devtools-chip{padding-block:0;line-height:1.4}.et-query-devtools-table th{color:var(--_et-qdt-muted);font-weight:600;position:sticky;inset-block-start:0;background:var(--_et-qdt-bg)}.et-query-devtools-table tr[data-status=error] td{color:var(--_et-qdt-error)}.et-query-devtools-empty{color:var(--_et-qdt-subtle);padding:1.2rem;text-align:center}.et-query-devtools-cell-actions{display:inline-flex;gap:.4rem;white-space:nowrap}.et-query-devtools-section-row{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-block-start:1rem}.et-query-devtools-search{flex:1 1 16rem;min-inline-size:0;min-block-size:var(--_et-qdt-control-h);background:color-mix(in srgb,var(--_et-qdt-interaction) 5%,transparent);color:var(--_et-qdt-fg);border:1px solid transparent;border-radius:var(--_et-qdt-radius);padding:.4rem .8rem;font:inherit;font-size:1.15rem}.et-query-devtools-search:focus{outline:none;border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:var(--_et-qdt-bg)}.et-query-devtools-row-link{display:inline-flex;align-items:center;gap:.6rem;appearance:none;border:0;background:none;padding:0;color:inherit;font:inherit;text-align:start;cursor:pointer}.et-query-devtools-row-link:focus-visible .et-query-devtools-url{color:var(--_et-qdt-accent);text-decoration:underline}@media(hover:hover){.et-query-devtools-row-link:hover .et-query-devtools-url{color:var(--_et-qdt-accent);text-decoration:underline}}.et-query-devtools-hint{flex:1 1 24rem;color:var(--_et-qdt-muted);font-size:1.1rem;margin:0}.et-query-devtools-input{inline-size:100%;background:var(--_et-qdt-bg);color:var(--_et-qdt-fg);border:1px solid var(--_et-qdt-border);border-radius:.4rem;padding:.4rem .6rem;font:inherit}.et-query-devtools-input--number{inline-size:8rem;font-variant-numeric:tabular-nums}.et-query-devtools-editor{border:1px solid var(--_et-qdt-border);border-radius:.4rem;padding:.8rem;margin-block-end:1rem}.et-query-devtools-editor-error{color:var(--_et-qdt-error);margin:.4rem 0 0}.et-query-devtools-btn--active{color:var(--_et-qdt-accent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-accent) 12%,transparent)}}\n"], dependencies: [{ kind: "component", type: QueryDevtoolsAuthTabComponent, selector: "et-query-devtools-auth-tab" }, { kind: "component", type: QueryDevtoolsCacheTabComponent, selector: "et-query-devtools-cache-tab" }, { kind: "component", type: QueryDevtoolsEventsTabComponent, selector: "et-query-devtools-events-tab" }, { kind: "component", type: QueryDevtoolsAboutComponent, selector: "et-query-devtools-about" }, { kind: "component", type: QueryDevtoolsSettingsComponent, selector: "et-query-devtools-settings" }, { kind: "component", type: QueryDevtoolsFaultsTabComponent, selector: "et-query-devtools-faults-tab" }, { kind: "component", type: QueryDevtoolsFormsTabComponent, selector: "et-query-devtools-forms-tab" }, { kind: "component", type: QueryDevtoolsLocksTabComponent, selector: "et-query-devtools-locks-tab" }, { kind: "component", type: QueryDevtoolsMocksTabComponent, selector: "et-query-devtools-mocks-tab" }, { kind: "component", type: QueryDevtoolsQueriesTabComponent, selector: "et-query-devtools-queries-tab" }, { kind: "component", type: QueryDevtoolsSequencesTabComponent, selector: "et-query-devtools-sequences-tab" }, { kind: "component", type: QueryDevtoolsSocketsTabComponent, selector: "et-query-devtools-sockets-tab" }, { kind: "component", type: QueryDevtoolsStacksTabComponent, selector: "et-query-devtools-stacks-tab" }, { kind: "component", type: QueryDevtoolsTimelineTabComponent, selector: "et-query-devtools-timeline-tab" }, { kind: "component", type: QueryDevtoolsToggleComponent, selector: "et-query-devtools-toggle", inputs: ["tampered"], outputs: ["openChange"] }, { kind: "directive", type: DragHandleDirective, selector: "[etDragHandle]", inputs: ["commitThreshold", "disabled"], outputs: ["dragTapped", "dragStarted", "dragMoved", "dragEnded", "dragCancelled"] }, { kind: "component", type: MenuComponent, selector: "et-menu" }, { kind: "directive", type: MenuDirective, selector: "[etMenu]", inputs: ["placement", "fallbackPlacements", "offset", "viewportPadding", "arrow", "arrowPadding", "autoFocus", "hoverOpen", "loop", "hoverOpenDelay", "hoverCloseDelay", "disabled", "open"], outputs: ["openChange"], exportAs: ["etMenu"] }, { kind: "component", type: MenuItemComponent, selector: "button[et-menu-item], a[et-menu-item]", inputs: ["variant"] }, { kind: "component", type: MenuRadioGroupComponent, selector: "et-menu-radio-group" }, { kind: "component", type: MenuRadioItemComponent, selector: "et-menu-radio-item", inputs: ["icon"] }, { kind: "directive", type: MenuSurfaceDirective, selector: "ng-template[etMenuSurface]", exportAs: ["etMenuSurface"] }, { kind: "directive", type: MenuTriggerDirective, selector: "[etMenuTrigger]", exportAs: ["etMenuTrigger"] }, { kind: "component", type: ResizeHandlesComponent, selector: "et-resize-handles", inputs: ["edges", "disabled"], outputs: ["resizeStarted", "resizeMoved", "resizeEnded", "resizeCancelled"] }], encapsulation: i0.ViewEncapsulation.None }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImport: i0, type: QueryDevtoolsComponent, decorators: [{
             type: Component,
@@ -6648,6 +6797,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                         QueryDevtoolsSettingsComponent,
                         QueryDevtoolsFaultsTabComponent,
                         QueryDevtoolsFormsTabComponent,
+                        QueryDevtoolsLocksTabComponent,
                         QueryDevtoolsMocksTabComponent,
                         QueryDevtoolsQueriesTabComponent,
                         QueryDevtoolsSequencesTabComponent,
@@ -6667,7 +6817,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "22.0.7", ngImpor
                     ], providers: [{ provide: QUERY_DEVTOOLS_HOST, useExisting: QueryDevtoolsComponent }], host: {
                         class: 'et-query-devtools-host',
                         '[attr.data-dock]': 'dock()',
-                    }, template: "@if (open()) {\n  <section\n    #panel\n    [class.et-query-devtools-panel--resizing]=\"resizing()\"\n    [attr.data-dock]=\"poppedOut() ? 'popout' : dock()\"\n    [attr.data-pane-axis]=\"paneAxis()\"\n    [attr.data-parked]=\"floatParked() ? '' : null\"\n    [style.block-size.px]=\"panelBlockSize()\"\n    [style.inline-size.px]=\"panelInlineSize()\"\n    [style.inset-block-start.px]=\"panelInsetBlock()\"\n    [style.inset-inline-start.px]=\"panelInsetInline()\"\n    [style.--_et-qdt-list-width.px]=\"listWidth()\"\n    [style.--_et-qdt-drawer-width.px]=\"drawerWidth()\"\n    [style.--_et-qdt-list-height.px]=\"listHeight()\"\n    [style.--_et-qdt-drawer-height.px]=\"drawerHeight()\"\n    class=\"et-query-devtools-panel\"\n  >\n    <!-- A pop-out is sized by its window, so there is no edge to drag. A float is a window in the page:\n         a title bar to move it and every edge to resize it, on the same `@ethlete/core` primitives the\n         stream pip window uses. A dock has one edge, and it does both. -->\n    @if (floating()) {\n      <!-- Parked, the panel is a grab strip: the edge handles would eat most of the peek that is left\n           to click, and resizing something you cannot see is not a thing to offer. -->\n      <et-resize-handles\n        [edges]=\"FLOAT_RESIZE_EDGES\"\n        [disabled]=\"floatParked()\"\n        (resizeStarted)=\"startFloatResize()\"\n        (resizeMoved)=\"resizeFloat($event)\"\n        (resizeEnded)=\"endFloatResize()\"\n        (resizeCancelled)=\"endFloatResize()\"\n      />\n      <div\n        (dragMoved)=\"moveFloat($event)\"\n        (dragEnded)=\"endFloatMove()\"\n        (dragCancelled)=\"endFloatMove()\"\n        (dragTapped)=\"restoreFloat()\"\n        class=\"et-query-devtools-move\"\n        title=\"Drag to move \u2014 shove it off an edge to park it, click the strip to bring it back\"\n        aria-hidden=\"true\"\n        etDragHandle\n      ></div>\n    } @else if (!poppedOut()) {\n      <div\n        (pointerdown)=\"startResize($event)\"\n        class=\"et-query-devtools-resize\"\n        title=\"Drag to resize\"\n        aria-hidden=\"true\"\n      ></div>\n    }\n    <header class=\"et-query-devtools-header\">\n      <nav class=\"et-query-devtools-tabs\" role=\"tablist\">\n        @for (tab of visibleTabs(); track tab.id) {\n          @let badge = tabBadges()[tab.id];\n          <button\n            [class.et-query-devtools-tab--active]=\"activeTab() === tab.id\"\n            [attr.aria-selected]=\"activeTab() === tab.id\"\n            (click)=\"activeTab.set(tab.id)\"\n            class=\"et-query-devtools-tab\"\n            type=\"button\"\n            role=\"tab\"\n          >\n            {{ tab.label }}\n            @if (badge.count) {\n              <span class=\"et-query-devtools-tab-badge\">{{ badge.count }}</span>\n            }\n            @if (badge.errors) {\n              <span\n                class=\"et-query-devtools-tab-badge et-query-devtools-tab-badge--error\"\n                title=\"{{ badge.errors }} {{ badge.errorNoun ?? 'failing' }}\"\n              >\n                {{ badge.errors }}\n              </span>\n            }\n          </button>\n        }\n\n        @if (overflowTabs().length; as overflowCount) {\n          <div class=\"et-query-devtools-menu\" etMenu>\n            <button\n              [title]=\"overflowCount + ' tabs with nothing in them'\"\n              class=\"et-query-devtools-tab\"\n              type=\"button\"\n              etMenuTrigger\n            >\n              More\n              <span class=\"et-query-devtools-menu-caret\" aria-hidden=\"true\">\u25BE</span>\n            </button>\n\n            <ng-template etMenuSurface>\n              <et-menu>\n                @for (tab of overflowTabs(); track tab.id) {\n                  <button (activate)=\"activeTab.set(tab.id)\" et-menu-item type=\"button\">{{ tab.label }}</button>\n                }\n              </et-menu>\n            </ng-template>\n          </div>\n        }\n      </nav>\n\n      <div class=\"et-query-devtools-header-actions\">\n        <button\n          [class.et-query-devtools-inspect-btn--active]=\"inspectActive()\"\n          [attr.aria-pressed]=\"inspectActive()\"\n          (click)=\"toggleInspect()\"\n          class=\"et-query-devtools-btn et-query-devtools-inspect-btn\"\n          type=\"button\"\n          title=\"Inspect: hover the UI to find its query\"\n        >\n          <svg\n            class=\"et-query-devtools-inspect-icon\"\n            viewBox=\"0 0 16 16\"\n            width=\"14\"\n            height=\"14\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n            focusable=\"false\"\n          >\n            <circle class=\"et-query-devtools-inspect-icon-ring\" cx=\"8\" cy=\"8\" r=\"4.25\" />\n            <circle class=\"et-query-devtools-inspect-icon-dot\" cx=\"8\" cy=\"8\" r=\"1.15\" />\n            <path d=\"M8 0.9v2.1M8 13v2.1M0.9 8h2.1M13 8h2.1\" />\n          </svg>\n          {{ inspectActive() ? 'Inspecting' : 'Inspect' }}\n          @if (inspectActive()) {\n            <kbd class=\"et-query-devtools-kbd et-query-devtools-kbd--inverse\">Esc</kbd>\n          }\n        </button>\n        <button\n          (click)=\"downloadSession()\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n          title=\"Download every registered entry, the event log, the cache totals and anything armed as one JSON file - the attachment for a bug report\"\n        >\n          <span aria-hidden=\"true\">\u2913</span>\n          Session\n        </button>\n        <!-- A gear, not a tab: Settings holds nothing to count, so the badge/overflow logic would push it\n             behind More - and the one control that explains a panel behaving oddly may not be hidden. -->\n        <button\n          [class.et-query-devtools-btn--active]=\"activeTab() === 'settings'\"\n          [attr.aria-pressed]=\"activeTab() === 'settings'\"\n          (click)=\"toggleSettings()\"\n          class=\"et-query-devtools-btn et-query-devtools-icon-btn\"\n          type=\"button\"\n          title=\"Settings: where panel state is kept, and the limits it holds\"\n          aria-label=\"Settings\"\n        >\n          <span aria-hidden=\"true\">\u2699</span>\n        </button>\n        @if (!poppedOut()) {\n          @let layout = currentLayout();\n          <div class=\"et-query-devtools-menu\" etMenu placement=\"bottom-end\">\n            <button class=\"et-query-devtools-btn\" title=\"Where the panel sits\" type=\"button\" etMenuTrigger>\n              <span class=\"et-query-devtools-menu-glyph\" aria-hidden=\"true\">{{ layout.glyph }}</span>\n              {{ layout.label }}\n              <span class=\"et-query-devtools-menu-caret\" aria-hidden=\"true\">\u25BE</span>\n            </button>\n\n            <ng-template etMenuSurface>\n              <et-menu>\n                <et-menu-radio-group [value]=\"dock()\">\n                  @for (option of LAYOUTS; track option.id) {\n                    <!-- eslint-disable ethlete/prefer-static-boolean-properties -- closeOnActivate is tri-state (boolean | undefined); a transform would collapse its unset state -->\n                    <et-menu-radio-item\n                      [value]=\"option.id\"\n                      [title]=\"option.hint\"\n                      [closeOnActivate]=\"true\"\n                      (activate)=\"selectLayout(option.id)\"\n                    >\n                      <!-- eslint-enable ethlete/prefer-static-boolean-properties -->\n                      <span class=\"et-query-devtools-menu-item-glyph\" aria-hidden=\"true\">{{ option.glyph }}</span>\n                      {{ option.label }}\n                    </et-menu-radio-item>\n                  }\n                </et-menu-radio-group>\n              </et-menu>\n            </ng-template>\n          </div>\n        }\n        <span class=\"et-query-devtools-header-divider\" aria-hidden=\"true\"></span>\n        <button\n          (click)=\"toggleOpen()\"\n          class=\"et-query-devtools-btn et-query-devtools-btn--danger\"\n          type=\"button\"\n          title=\"{{ poppedOut() ? 'Bring the panel back into the app window' : 'Close devtools (' + shortcut + ')' }}\"\n        >\n          @if (poppedOut()) {\n            <span aria-hidden=\"true\">\u29C8</span>\n            Dock back\n          } @else {\n            <span aria-hidden=\"true\">\u2715</span>\n            Close\n            <kbd class=\"et-query-devtools-kbd\">{{ shortcut }}</kbd>\n          }\n        </button>\n      </div>\n    </header>\n\n    @if (popOutBlocked()) {\n      <div class=\"et-query-devtools-notice-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-text\">\n          The browser blocked the pop-up window. Allow pop-ups for this site, or float the panel over the page instead \u2014\n          a float needs no permission.\n        </span>\n        <button (click)=\"floatPanel()\" class=\"et-query-devtools-btn\" type=\"button\">Float instead</button>\n        <button (click)=\"popOutBlocked.set(false)\" class=\"et-query-devtools-btn\" type=\"button\">Dismiss</button>\n      </div>\n    }\n\n    @if (armedFaultClients(); as armed) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          <strong>Faults armed</strong> on\n          <span class=\"et-query-devtools-mono\">{{ armed.join(', ') }}</span>\n          \u2014 every failure and delay you see from\n          {{ armed.length === 1 ? 'this client' : 'these clients' }} is injected, not the API.\n          @if (faultsRestored()) {\n            They came back from your last page load \u2014 set <em>Armed faults</em> back to <em>none</em> in Settings to\n            stop that.\n          }\n        </span>\n        <button\n          [disabled]=\"activeTab() === 'faults'\"\n          (click)=\"activeTab.set('faults')\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n        >\n          Review\n        </button>\n        <button (click)=\"CLEAR_FAULTS()\" class=\"et-query-devtools-btn\" type=\"button\">Disarm all</button>\n      </div>\n    }\n\n    @if (armedMockRoutes(); as mocked) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          <strong>Mocks armed</strong> on\n          <span class=\"et-query-devtools-mono\">{{ mocked.join(', ') }}</span>\n          \u2014 {{ mocked.length === 1 ? 'that route is' : 'those routes are' }} answered by the panel, so nothing they show\n          reached the API.\n          @if (mocksRestored()) {\n            They came back from your last page load \u2014 set <em>Armed mocks</em> back to <em>none</em> in Settings to stop\n            that.\n          }\n        </span>\n        <button\n          [disabled]=\"activeTab() === 'mocks'\"\n          (click)=\"activeTab.set('mocks')\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n        >\n          Review\n        </button>\n        <button (click)=\"DISARM_MOCKS()\" class=\"et-query-devtools-btn\" type=\"button\">Disarm all</button>\n      </div>\n    }\n\n    @if (restoredOverrides(); as restored) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          @if (restored.ops) {\n            <strong>Overrides re-armed</strong> \u2014 {{ restored.ops }} {{ restored.ops === 1 ? 'edit' : 'edits' }} from\n            your last page load {{ restored.ops === 1 ? 'is' : 'are' }} back on {{ restored.queries }}\n            {{ restored.queries === 1 ? 'query' : 'queries' }}, so those responses are not what the API sent.\n            @if (restored.fromLocalStorage) {\n              They came back from <strong>localStorage</strong>, so they outlive closing this tab \u2014 clear them, or set\n              overrides back to <em>session</em> in Settings.\n            }\n          } @else {\n            <strong>Overrides could not be re-armed.</strong>\n          }\n          @if (restored.orphaned.length) {\n            <span class=\"et-query-devtools-armed-orphans\">\n              {{ restored.orphaned.length }} stored\n              {{ restored.orphaned.length === 1 ? 'override' : 'overrides' }} matched no query \u2014\n              <span class=\"et-query-devtools-mono\">{{ restored.orphaned.join(', ') }}</span>\n            </span>\n          }\n        </span>\n        @if (restored.firstId; as firstId) {\n          <button (click)=\"reviewRestoredOverrides(firstId)\" class=\"et-query-devtools-btn\" type=\"button\">Review</button>\n        }\n        <button (click)=\"DROP_RESTORED_OVERRIDES()\" class=\"et-query-devtools-btn\" type=\"button\">Drop all</button>\n      </div>\n    }\n\n    <div class=\"et-query-devtools-body\">\n      @switch (activeTab()) {\n        <!-- QUERIES -->\n        @case ('queries') {\n          <et-query-devtools-queries-tab />\n        }\n\n        <!-- STACKS -->\n        @case ('stacks') {\n          <et-query-devtools-stacks-tab />\n        }\n\n        <!-- SEQUENCES -->\n        @case ('sequences') {\n          <et-query-devtools-sequences-tab />\n        }\n\n        <!-- FORMS -->\n        @case ('forms') {\n          <et-query-devtools-forms-tab />\n        }\n\n        <!-- AUTH -->\n        @case ('auth') {\n          <et-query-devtools-auth-tab />\n        }\n\n        <!-- SOCKETS -->\n        @case ('ws') {\n          <et-query-devtools-sockets-tab />\n        }\n\n        <!-- CACHE -->\n        @case ('cache') {\n          <et-query-devtools-cache-tab />\n        }\n\n        <!-- TIMELINE -->\n        @case ('timeline') {\n          <et-query-devtools-timeline-tab />\n        }\n\n        <!-- EVENTS -->\n        @case ('events') {\n          <et-query-devtools-events-tab />\n        }\n\n        <!-- FAULTS -->\n        @case ('faults') {\n          <et-query-devtools-faults-tab />\n        }\n\n        <!-- MOCKS -->\n        @case ('mocks') {\n          <et-query-devtools-mocks-tab />\n        }\n\n        <!-- ABOUT -->\n        @case ('about') {\n          <et-query-devtools-about />\n        }\n\n        <!-- SETTINGS -->\n        @case ('settings') {\n          <et-query-devtools-settings />\n        }\n      }\n    </div>\n  </section>\n}\n\n@if (!open()) {\n  <et-query-devtools-toggle [tampered]=\"panelTampered()\" (openChange)=\"toggleOpen()\" />\n}\n\n@if (inspectActive() && inspectHover(); as hover) {\n  <div\n    [style.left.px]=\"hover.rect.left\"\n    [style.top.px]=\"hover.rect.top\"\n    [style.width.px]=\"hover.rect.width\"\n    [style.height.px]=\"hover.rect.height\"\n    class=\"et-query-devtools-inspect-box\"\n  >\n    <span class=\"et-query-devtools-inspect-tag\">{{ inspectLabel(hover.entries) }}</span>\n  </div>\n}\n\n@if (locatedRect(); as rect) {\n  <div\n    [style.left.px]=\"rect.left\"\n    [style.top.px]=\"rect.top\"\n    [style.width.px]=\"rect.width\"\n    [style.height.px]=\"rect.height\"\n    class=\"et-query-devtools-inspect-box\"\n  >\n    <span class=\"et-query-devtools-inspect-tag\">created here</span>\n  </div>\n}\n", styles: ["@layer components{.et-query-devtools-host{--_et-qdt-bg: var(--et-surface-background-solid, rgb(24 24 27));--_et-qdt-fg: var(--et-surface-color-solid, rgb(244 244 245));--_et-qdt-muted: var(--et-surface-color-muted-solid, rgb(161 161 170));--_et-qdt-subtle: var(--et-surface-color-subtle-solid, rgb(113 113 122));--_et-qdt-border: var(--et-surface-border-solid, rgb(255 255 255 / .12));--_et-qdt-interaction: var(--et-surface-interaction-solid, rgb(255 255 255));--_et-qdt-accent: var(--et-theme-color-primary-solid, rgb(96 165 250));--_et-qdt-hover: color-mix(in srgb, var(--_et-qdt-interaction) 10%, transparent);--_et-qdt-active: color-mix(in srgb, var(--_et-qdt-interaction) 18%, transparent);--_et-qdt-success: rgb(34 197 94);--_et-qdt-error: rgb(239 68 68);--_et-qdt-loading: rgb(234 179 8);--_et-qdt-title-bar: 2.4rem;--_et-qdt-radius: .5rem;--_et-qdt-control-h: 2.4rem;--_et-qdt-row-h: 3.6rem;position:fixed;inset-inline:0;inset-block-end:0;z-index:2147483000;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:1.2rem;line-height:1.4;pointer-events:none}.et-query-devtools-host>*{pointer-events:auto}@media(pointer:coarse){.et-query-devtools-host{--_et-qdt-control-h: 3.4rem;--_et-qdt-row-h: 4.4rem}}.et-query-devtools-panel{position:relative;display:flex;flex-direction:column;inline-size:100%;min-block-size:20rem;max-block-size:90vh;background:var(--_et-qdt-bg);color:var(--_et-qdt-fg);border-block-start:1px solid var(--_et-qdt-border);box-shadow:0 -.4rem 2rem #00000059}.et-query-devtools-host:where([data-dock=right]){inset-block:0;inset-inline-start:auto}.et-query-devtools-panel:where([data-dock=right]){inline-size:auto;block-size:100%;max-block-size:none;max-inline-size:90vw;border-block-start:0;border-inline-start:1px solid var(--_et-qdt-border);box-shadow:-.4rem 0 2rem #00000059}.et-query-devtools-host:where([data-dock=float]){inset:0}.et-query-devtools-panel:where([data-dock=float]){--_et-qdt-frame: .8rem;--et-resize-handles-edge-size: var(--_et-qdt-frame);--et-resize-handles-touch-edge-size: var(--_et-qdt-frame);--et-resize-handles-corner-size: 1.6rem;--et-resize-handles-touch-corner-size: 1.6rem;--et-resize-handles-edge-inset: 1.6rem;--et-resize-handles-side-top: var(--_et-qdt-title-bar);--et-resize-handles-side-bottom: 1.6rem;--et-resize-handles-z-index: 3;position:absolute;inline-size:auto;min-block-size:0;max-block-size:none;padding-block-start:var(--_et-qdt-title-bar);padding-inline:var(--_et-qdt-frame);padding-block-end:var(--_et-qdt-frame);border:1px solid var(--_et-qdt-border);border-radius:.6rem;box-shadow:0 1rem 4rem #00000073;overflow:hidden}.et-query-devtools-move{position:absolute;inset-inline:0;inset-block-start:0;block-size:var(--_et-qdt-title-bar);cursor:move;z-index:2}.et-query-devtools-panel:where([data-dock=float]) .et-query-devtools-body{border-radius:.3rem;overflow:hidden}.et-query-devtools-move:after{content:\"\";position:absolute;inset-inline:50%;inset-block-start:.9rem;inline-size:3rem;margin-inline-start:-1.5rem;block-size:.6rem;background-image:radial-gradient(currentcolor 40%,transparent 42%);background-size:.4rem .3rem;color:var(--_et-qdt-subtle)}@media(hover:hover){.et-query-devtools-move:hover:after{color:var(--_et-qdt-accent)}}.et-query-devtools-panel:where([data-dock=float][data-parked]){opacity:.85}@media(hover:hover){.et-query-devtools-panel:where([data-dock=float][data-parked]):hover{opacity:1}}.et-query-devtools-panel:where([data-dock=float][data-parked]) .et-query-devtools-move{cursor:grab;background:var(--_et-qdt-active)}.et-query-devtools-panel:where([data-dock=float][data-parked]) .et-query-devtools-move:after{color:var(--_et-qdt-accent)}.et-query-devtools-host:where([data-dock=left]){inset-block:0;inset-inline-end:auto}.et-query-devtools-panel:where([data-dock=left]){inline-size:auto;block-size:100%;max-block-size:none;max-inline-size:90vw;border-block-start:0;border-inline-end:1px solid var(--_et-qdt-border);box-shadow:.4rem 0 2rem #00000059}.et-query-devtools-host:where([data-dock=top]){inset-block-start:0;inset-block-end:auto}.et-query-devtools-panel:where([data-dock=top]){border-block-start:0;border-block-end:1px solid var(--_et-qdt-border);box-shadow:0 .4rem 2rem #00000059}.et-query-devtools-host:where([data-dock=popout]){position:static;inline-size:100%;block-size:100%}.et-query-devtools-panel:where([data-dock=popout]){block-size:100%;max-block-size:none;border:0;box-shadow:none}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-header{flex-wrap:wrap}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-tabs,.et-query-devtools-header-actions){flex:1 1 auto;flex-wrap:nowrap;min-inline-size:0;overflow-x:auto}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-tabs,.et-query-devtools-header-actions)>*{flex:none}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-master-detail,.et-query-devtools-split){flex-direction:column}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-list,.et-query-devtools-detail,.et-query-devtools-drawer,.et-query-devtools-split .et-query-devtools-scroll){flex:1 1 50%;min-inline-size:0;min-block-size:0;max-inline-size:none;border-inline-start:0;border-inline-end:0}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-detail,.et-query-devtools-drawer){border-block-start:1px solid var(--_et-qdt-border)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-master-detail>.et-query-devtools-list{flex:0 1 var(--_et-qdt-list-height, 50%);min-block-size:var(--_et-qdt-list-height, 0);max-block-size:var(--_et-qdt-list-height, none)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-split>.et-query-devtools-drawer{flex:0 1 var(--_et-qdt-drawer-height, 50%);min-block-size:var(--_et-qdt-drawer-height, 0);max-block-size:var(--_et-qdt-drawer-height, none)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-pane-resize{cursor:ns-resize}.et-query-devtools-panel--resizing{-webkit-user-select:none;user-select:none}.et-query-devtools-resize,.et-query-devtools-pane-resize{touch-action:none}.et-query-devtools-resize{position:absolute;inset-inline:0;inset-block-start:0;block-size:.6rem;cursor:ns-resize;z-index:1}.et-query-devtools-panel:where([data-dock=right]) .et-query-devtools-resize{inset-inline:0 auto;inset-block:0;inline-size:.6rem;block-size:auto;cursor:ew-resize}.et-query-devtools-panel:where([data-dock=left]) .et-query-devtools-resize{inset-inline:auto 0;inset-block:0;inline-size:.6rem;block-size:auto;cursor:ew-resize}.et-query-devtools-panel:where([data-dock=top]) .et-query-devtools-resize{inset-block:auto 0}.et-query-devtools-resize:after{content:\"\";position:absolute;inset-inline:50%;inset-block-start:.2rem;inline-size:4rem;margin-inline-start:-2rem;block-size:.2rem;border-radius:999px;background:var(--_et-qdt-border)}.et-query-devtools-panel:where([data-dock=right]) .et-query-devtools-resize:after{inset-inline:.2rem auto;inset-block:50% auto;inline-size:.2rem;block-size:4rem;margin-inline-start:0;margin-block-start:-2rem}.et-query-devtools-panel:where([data-dock=left]) .et-query-devtools-resize:after{inset-inline:auto .2rem;inset-block:50% auto;inline-size:.2rem;block-size:4rem;margin-inline-start:0;margin-block-start:-2rem}.et-query-devtools-panel:where([data-dock=top]) .et-query-devtools-resize:after{inset-block:auto .2rem}@media(hover:hover){.et-query-devtools-resize:hover:after{background:var(--_et-qdt-accent)}}.et-query-devtools-header{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding-inline:.8rem;border-block-end:1px solid var(--_et-qdt-border);flex:0 0 auto}.et-query-devtools-armed-bar{display:flex;align-items:center;gap:.8rem;flex:0 0 auto;padding:.6rem .8rem;background:color-mix(in srgb,var(--_et-qdt-error) 14%,transparent);border-block-end:1px solid color-mix(in srgb,var(--_et-qdt-error) 45%,transparent);color:var(--_et-qdt-error);font-size:1.1rem}.et-query-devtools-armed-text{flex:1 1 auto;min-inline-size:0}.et-query-devtools-notice-bar{display:flex;align-items:center;gap:.8rem;flex:0 0 auto;padding:.6rem .8rem;background:var(--_et-qdt-hover);border-block-end:1px solid var(--_et-qdt-border);color:var(--_et-qdt-fg);font-size:1.1rem}.et-query-devtools-notice-bar .et-query-devtools-btn{flex:0 0 auto}.et-query-devtools-armed-orphans{display:block;opacity:.85}.et-query-devtools-armed-dot{flex:0 0 auto;inline-size:.8rem;block-size:.8rem;border-radius:50%;background:var(--_et-qdt-error);animation:et-query-devtools-armed-pulse 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.et-query-devtools-armed-dot{animation:none}}@keyframes et-query-devtools-armed-pulse{50%{opacity:.25}}.et-query-devtools-armed-bar .et-query-devtools-btn{flex:0 0 auto;border-color:color-mix(in srgb,var(--_et-qdt-error) 55%,transparent);color:var(--_et-qdt-error)}.et-query-devtools-tabs{display:flex;flex-wrap:wrap;gap:.2rem}.et-query-devtools-tab{appearance:none;display:inline-flex;align-items:center;gap:.5rem;border:none;background:transparent;color:var(--_et-qdt-muted);padding:.9rem 1rem;cursor:pointer;border-block-end:2px solid transparent;font:inherit}@media(hover:hover){.et-query-devtools-tab:hover{color:var(--_et-qdt-fg)}}.et-query-devtools-tab--active{color:var(--_et-qdt-fg);border-block-end-color:var(--_et-qdt-accent)}.et-query-devtools-tab-badge{display:inline-block;padding-inline:.45rem;border-radius:999px;background:color-mix(in srgb,var(--_et-qdt-interaction) 12%,transparent);color:var(--_et-qdt-muted);font-size:1rem;font-variant-numeric:tabular-nums}.et-query-devtools-tab-badge--error{background:color-mix(in srgb,var(--_et-qdt-error) 25%,transparent);color:var(--_et-qdt-fg)}.et-query-devtools-menu{display:contents}.et-query-devtools-menu-caret{font-size:.9em;opacity:.7}.et-query-devtools-menu-glyph{display:inline-block;min-inline-size:1.2rem;text-align:center}.et-query-devtools-menu>[data-menu-open]{background:var(--_et-qdt-hover);color:var(--_et-qdt-fg)}.et-menu .et-query-devtools-menu-item-glyph{display:inline-block;inline-size:16px;text-align:center}.et-menu-item-content:has(.et-query-devtools-menu-item-note){display:flex;flex-direction:column;align-items:start;gap:2px;padding-block:8px}.et-query-devtools-menu-item-note{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55));font-size:12px}.et-query-devtools-header-actions{display:flex;align-items:center;gap:.2rem;flex:0 0 auto}.et-query-devtools-header-divider{inline-size:1px;block-size:1.6rem;margin-inline:.4rem;background:var(--_et-qdt-border)}.et-query-devtools-inspect-btn{position:relative}.et-query-devtools-inspect-icon{inline-size:1.4rem;block-size:1.4rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round}.et-query-devtools-inspect-icon-dot{fill:currentColor;stroke:none}.et-query-devtools-btn.et-query-devtools-inspect-btn--active,.et-query-devtools-btn.et-query-devtools-inspect-btn--active:hover{color:#09090b;background:var(--_et-qdt-accent);border-color:var(--_et-qdt-accent)}.et-query-devtools-inspect-btn--active:after{content:\"\";position:absolute;inset:-.3rem;border:1px solid var(--_et-qdt-accent);border-radius:calc(var(--_et-qdt-radius) + .3rem);pointer-events:none;animation:et-query-devtools-inspect-pulse 1.4s ease-in-out infinite}.et-query-devtools-inspect-btn--active .et-query-devtools-inspect-icon-ring{animation:et-query-devtools-inspect-pulse 1.4s ease-in-out infinite}@keyframes et-query-devtools-inspect-pulse{0%,to{opacity:.2}50%{opacity:1}}@media(prefers-reduced-motion:reduce){.et-query-devtools-inspect-btn--active:after,.et-query-devtools-inspect-btn--active .et-query-devtools-inspect-icon-ring{animation:none;opacity:1}}.et-query-devtools-close{appearance:none;border:none;background:transparent;color:var(--_et-qdt-muted);cursor:pointer;padding:.6rem;font:inherit}.et-query-devtools-kbd{border-radius:.3rem;background:var(--_et-qdt-hover);box-shadow:inset 0 0 0 1px var(--_et-qdt-border);color:var(--_et-qdt-muted);padding:.15rem .4rem;font:inherit;font-size:1.1rem;line-height:1.2;white-space:nowrap}.et-query-devtools-kbd--inverse{background:#00000026;box-shadow:inset 0 0 0 1px #00000040;color:inherit}@media(hover:none)and (pointer:coarse){.et-query-devtools-kbd{display:none}}.et-query-devtools-inspect-box{position:fixed;z-index:2147483002;pointer-events:none;border:2px solid var(--_et-qdt-accent);background:color-mix(in srgb,var(--_et-qdt-accent) 15%,transparent);border-radius:.2rem}.et-query-devtools-inspect-tag{position:absolute;inset-block-start:100%;inset-inline-start:0;margin-block-start:.2rem;padding:.2rem .5rem;border-radius:.3rem;background:var(--_et-qdt-accent);color:#09090b;font-family:ui-monospace,monospace;font-size:1.1rem;font-weight:600;white-space:nowrap}@media(hover:hover){.et-query-devtools-close:hover{color:var(--_et-qdt-fg)}}.et-query-devtools-body{flex:1 1 auto;min-block-size:0;overflow:hidden}.et-query-devtools-detail{flex:1 1 auto;min-inline-size:0;overflow-y:auto;padding:1rem}.et-query-devtools-detail .et-query-devtools-meta,.et-query-devtools-drawer .et-query-devtools-meta{padding:.8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 3%,transparent)}.et-query-devtools-detail .et-query-devtools-section-row,.et-query-devtools-drawer .et-query-devtools-section-row{padding-block-start:.8rem;border-block-start:1px solid var(--_et-qdt-border)}.et-query-devtools-filter-chip{display:inline-flex;align-items:center;gap:.6rem;padding:.3rem .35rem .3rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--_et-qdt-accent) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--_et-qdt-accent) 45%,transparent);color:var(--_et-qdt-accent);font-size:1.1rem;font-weight:600;letter-spacing:.02em}.et-query-devtools-filter-icon{font-size:1.3rem;line-height:1}.et-query-devtools-filter-count{border-radius:999px;background:var(--_et-qdt-accent);color:#09090b;min-inline-size:1.8rem;padding:0 .5rem;text-align:center}.et-query-devtools-filter-clear{appearance:none;display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:transparent;color:var(--_et-qdt-muted);cursor:pointer;padding:.3rem .6rem;font:inherit;font-size:1.15rem;line-height:1.4}@media(hover:hover){.et-query-devtools-filter-clear:hover{border-color:color-mix(in srgb,var(--_et-qdt-accent) 60%,transparent);color:var(--_et-qdt-fg)}}.et-query-devtools-scroll{block-size:100%;overflow:auto;padding:1rem;display:flex;flex-direction:column;gap:1rem}.et-query-devtools-split{display:flex;block-size:100%;min-block-size:0}.et-query-devtools-split .et-query-devtools-scroll{flex:1 1 auto;min-inline-size:0}.et-query-devtools-pane{display:flex;flex-direction:column;flex:1 1 auto;block-size:100%;min-inline-size:0;min-block-size:0;overflow:hidden}.et-query-devtools-pane>.et-query-devtools-scroll{padding-block:0 1rem}.et-query-devtools-pane-resize{flex:0 0 .5rem;align-self:stretch;cursor:ew-resize;background:transparent;transition:background .12s ease}.et-query-devtools-pane-resize:active{background:var(--_et-qdt-accent)}@media(hover:hover){.et-query-devtools-pane-resize:hover{background:var(--_et-qdt-accent)}}.et-query-devtools-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;padding:.8rem;position:sticky;inset-block-start:0;z-index:1;background:var(--_et-qdt-bg);border-block-end:1px solid var(--_et-qdt-border)}.et-query-devtools-scroll>.et-query-devtools-toolbar{inset-block-start:-1rem}.et-query-devtools-toolbar-row{display:flex;align-items:center;flex-wrap:wrap;flex:1 1 100%;gap:.5rem}.et-query-devtools-field{display:inline-flex;align-items:center;gap:.6rem;color:var(--_et-qdt-muted)}.et-query-devtools-select{flex:0 0 auto;min-block-size:var(--_et-qdt-control-h);background:color-mix(in srgb,var(--_et-qdt-interaction) 5%,var(--_et-qdt-bg));color:var(--_et-qdt-fg);border:1px solid transparent;border-radius:var(--_et-qdt-radius);padding:.4rem .6rem;font:inherit;font-size:1.15rem}.et-query-devtools-select option{background-color:var(--_et-qdt-bg);color:var(--_et-qdt-fg)}.et-query-devtools-count{color:var(--_et-qdt-subtle)}.et-query-devtools-row{display:flex;align-items:stretch;inline-size:100%;min-block-size:var(--_et-qdt-row-h);border-block-end:1px solid var(--_et-qdt-border);color:var(--_et-qdt-fg)}@media(hover:hover){.et-query-devtools-row:hover{background:var(--_et-qdt-hover)}}.et-query-devtools-method{font-weight:700;font-size:1.1rem;color:var(--_et-qdt-muted);white-space:nowrap}.et-query-devtools-route{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;min-inline-size:0}.et-query-devtools-status{inline-size:.8rem;block-size:.8rem;border-radius:999px;flex:0 0 auto;background:var(--_et-qdt-subtle)}.et-query-devtools-status[data-status=success]{background:var(--_et-qdt-success)}.et-query-devtools-status[data-status=error]{background:var(--_et-qdt-error)}.et-query-devtools-status[data-status=loading],.et-query-devtools-status[data-status=running]{background:var(--_et-qdt-loading)}.et-query-devtools-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;flex:0 0 auto;min-block-size:var(--_et-qdt-control-h);border:1px solid transparent;border-radius:var(--_et-qdt-radius);background:transparent;color:var(--_et-qdt-muted);padding:.25rem .7rem;font:inherit;font-size:1.15rem;line-height:1.4;white-space:nowrap;cursor:pointer;transition:color .12s ease,background-color .12s ease,border-color .12s ease}@media(hover:hover){.et-query-devtools-btn:hover:not(:disabled){background:var(--_et-qdt-hover);color:var(--_et-qdt-fg)}}.et-query-devtools-btn:focus-visible{outline:2px solid var(--_et-qdt-accent);outline-offset:1px}.et-query-devtools-btn:disabled{color:var(--_et-qdt-subtle);cursor:default;background:transparent;opacity:.6}.et-query-devtools-btn--primary,.et-query-devtools-btn--primary:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-accent) 16%,transparent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 40%,transparent);color:var(--_et-qdt-accent)}@media(hover:hover){.et-query-devtools-btn--primary:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-accent) 26%,transparent)}}@media(hover:hover){.et-query-devtools-btn--danger:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-error) 16%,transparent);color:var(--_et-qdt-error)}}.et-query-devtools-btn--tampered,.et-query-devtools-btn--tampered:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-error) 14%,transparent);border-color:color-mix(in srgb,var(--_et-qdt-error) 45%,transparent);color:var(--_et-qdt-error)}.et-query-devtools-icon-btn{inline-size:var(--_et-qdt-control-h);padding-inline:0;font-size:1.3rem}.et-query-devtools-btn-group{display:inline-flex;flex:0 0 auto;border:1px solid var(--_et-qdt-border);border-radius:var(--_et-qdt-radius);overflow:hidden}.et-query-devtools-btn-group>.et-query-devtools-btn{border-radius:0;border-block:0;border-inline-start:0;border-inline-end:1px solid var(--_et-qdt-border)}.et-query-devtools-btn-group>.et-query-devtools-btn:last-child{border-inline-end:0}.et-query-devtools-toolbar-btn{margin-inline-start:auto;flex:0 0 auto}.et-query-devtools-meta{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;margin:0 0 1rem}.et-query-devtools-meta dt{color:var(--_et-qdt-muted)}.et-query-devtools-meta dd{margin:0;overflow-wrap:anywhere}.et-query-devtools-section{margin:1rem 0 .4rem;font-size:1.1rem;text-transform:uppercase;letter-spacing:.05em;color:var(--_et-qdt-muted)}.et-query-devtools-stat{padding:.6rem .8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 3%,transparent)}.et-query-devtools-stat dt{font-size:1rem;text-transform:uppercase;letter-spacing:.05em;color:var(--_et-qdt-muted)}.et-query-devtools-stat dd{margin:0;font-size:1.5rem;font-variant-numeric:tabular-nums}.et-query-devtools-stat-sub{display:block;font-size:1rem;color:var(--_et-qdt-subtle)}.et-query-devtools-json{margin:0;padding:.8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 4%,transparent);overflow-x:auto;white-space:pre-wrap;overflow-wrap:anywhere;max-block-size:24rem;overflow-y:auto}.et-query-devtools-json--error{border-color:color-mix(in srgb,var(--_et-qdt-error) 50%,transparent)}.et-query-devtools-mono{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.et-query-devtools-url{display:inline-block;max-inline-size:32rem;margin-inline-start:.6rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.et-query-devtools-chips,.et-query-devtools-chip-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-block-end:.8rem}.et-query-devtools-chip{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .6rem;border-radius:999px;border:1px solid var(--_et-qdt-border);font-size:1.1rem;color:var(--_et-qdt-fg);background:color-mix(in srgb,var(--_et-qdt-interaction) 6%,transparent)}.et-query-devtools-chip--muted{color:var(--_et-qdt-muted)}.et-query-devtools-retry-glyph{font-size:.7em;line-height:1}.et-query-devtools-chip--loading{color:var(--_et-qdt-loading);border-color:color-mix(in srgb,var(--_et-qdt-loading) 50%,transparent)}.et-query-devtools-chip--error{color:var(--_et-qdt-error);border-color:color-mix(in srgb,var(--_et-qdt-error) 50%,transparent)}.et-query-devtools-chip--success{color:var(--_et-qdt-success);border-color:color-mix(in srgb,var(--_et-qdt-success) 50%,transparent)}button.et-query-devtools-chip--button{appearance:none;cursor:pointer;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}@media(hover:hover){button.et-query-devtools-chip--button:hover{border-color:var(--_et-qdt-accent);color:var(--_et-qdt-accent)}}.et-query-devtools-facet{appearance:none;min-block-size:var(--_et-qdt-control-h);padding-inline:.8rem;background:transparent;cursor:pointer;color:var(--_et-qdt-muted);font:inherit;font-size:1.1rem;line-height:1.4}@media(hover:hover){.et-query-devtools-facet:hover:not(:disabled){color:var(--_et-qdt-fg);background:var(--_et-qdt-hover);border-color:color-mix(in srgb,var(--_et-qdt-accent) 60%,transparent)}}.et-query-devtools-facet:disabled{color:var(--_et-qdt-subtle);cursor:default}.et-query-devtools-facet--active{color:var(--_et-qdt-accent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-accent) 14%,transparent)}.et-query-devtools-facet-count{font-variant-numeric:tabular-nums;color:inherit;opacity:.75}.et-query-devtools-card{border:1px solid var(--_et-qdt-border);border-radius:.6rem;padding:1rem}.et-query-devtools-card--armed{border-color:color-mix(in srgb,var(--_et-qdt-error) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-error) 6%,transparent)}.et-query-devtools-card-head{display:flex;align-items:center;gap:.6rem;margin-block-end:.8rem}.et-query-devtools-inner-queries{display:flex;flex-direction:column;gap:.3rem}.et-query-devtools-inner-row{display:flex;align-items:center;gap:.6rem;inline-size:100%;text-align:start;appearance:none;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:transparent;color:var(--_et-qdt-fg);padding:.4rem .6rem;cursor:pointer;font:inherit}@media(hover:hover){.et-query-devtools-inner-row:hover:not([disabled]){background:var(--_et-qdt-hover)}}.et-query-devtools-inner-row--active{background:var(--_et-qdt-active);border-color:var(--_et-qdt-accent)}.et-query-devtools-inner-row[disabled]{cursor:default;opacity:.6}.et-query-devtools-step-toggle{display:flex;align-items:center;gap:.6rem;inline-size:100%;text-align:start;appearance:none;border:none;background:transparent;color:var(--_et-qdt-fg);padding:.6rem;cursor:pointer;font:inherit}@media(hover:hover){.et-query-devtools-step-toggle:hover{background:var(--_et-qdt-hover)}}.et-query-devtools-step-index{flex:1 1 auto;min-inline-size:0}.et-query-devtools-step-caret{color:var(--_et-qdt-muted)}.et-query-devtools-table{inline-size:100%;border-collapse:collapse}.et-query-devtools-table th,.et-query-devtools-table td{text-align:start;padding:.5rem .6rem;border-block-end:1px solid var(--_et-qdt-border);vertical-align:top}.et-query-devtools-table td .et-query-devtools-chip{padding-block:0;line-height:1.4}.et-query-devtools-table th{color:var(--_et-qdt-muted);font-weight:600;position:sticky;inset-block-start:0;background:var(--_et-qdt-bg)}.et-query-devtools-table tr[data-status=error] td{color:var(--_et-qdt-error)}.et-query-devtools-empty{color:var(--_et-qdt-subtle);padding:1.2rem;text-align:center}.et-query-devtools-cell-actions{display:inline-flex;gap:.4rem;white-space:nowrap}.et-query-devtools-section-row{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-block-start:1rem}.et-query-devtools-search{flex:1 1 16rem;min-inline-size:0;min-block-size:var(--_et-qdt-control-h);background:color-mix(in srgb,var(--_et-qdt-interaction) 5%,transparent);color:var(--_et-qdt-fg);border:1px solid transparent;border-radius:var(--_et-qdt-radius);padding:.4rem .8rem;font:inherit;font-size:1.15rem}.et-query-devtools-search:focus{outline:none;border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:var(--_et-qdt-bg)}.et-query-devtools-row-link{display:inline-flex;align-items:center;gap:.6rem;appearance:none;border:0;background:none;padding:0;color:inherit;font:inherit;text-align:start;cursor:pointer}.et-query-devtools-row-link:focus-visible .et-query-devtools-url{color:var(--_et-qdt-accent);text-decoration:underline}@media(hover:hover){.et-query-devtools-row-link:hover .et-query-devtools-url{color:var(--_et-qdt-accent);text-decoration:underline}}.et-query-devtools-hint{flex:1 1 24rem;color:var(--_et-qdt-muted);font-size:1.1rem;margin:0}.et-query-devtools-input{inline-size:100%;background:var(--_et-qdt-bg);color:var(--_et-qdt-fg);border:1px solid var(--_et-qdt-border);border-radius:.4rem;padding:.4rem .6rem;font:inherit}.et-query-devtools-input--number{inline-size:8rem;font-variant-numeric:tabular-nums}.et-query-devtools-editor{border:1px solid var(--_et-qdt-border);border-radius:.4rem;padding:.8rem;margin-block-end:1rem}.et-query-devtools-editor-error{color:var(--_et-qdt-error);margin:.4rem 0 0}.et-query-devtools-btn--active{color:var(--_et-qdt-accent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-accent) 12%,transparent)}}\n"] }]
+                    }, template: "@if (open()) {\n  <section\n    #panel\n    [class.et-query-devtools-panel--resizing]=\"resizing()\"\n    [attr.data-dock]=\"poppedOut() ? 'popout' : dock()\"\n    [attr.data-pane-axis]=\"paneAxis()\"\n    [attr.data-parked]=\"floatParked() ? '' : null\"\n    [style.block-size.px]=\"panelBlockSize()\"\n    [style.inline-size.px]=\"panelInlineSize()\"\n    [style.inset-block-start.px]=\"panelInsetBlock()\"\n    [style.inset-inline-start.px]=\"panelInsetInline()\"\n    [style.--_et-qdt-list-width.px]=\"listWidth()\"\n    [style.--_et-qdt-drawer-width.px]=\"drawerWidth()\"\n    [style.--_et-qdt-list-height.px]=\"listHeight()\"\n    [style.--_et-qdt-drawer-height.px]=\"drawerHeight()\"\n    class=\"et-query-devtools-panel\"\n  >\n    <!-- A pop-out is sized by its window, so there is no edge to drag. A float is a window in the page:\n         a title bar to move it and every edge to resize it, on the same `@ethlete/core` primitives the\n         stream pip window uses. A dock has one edge, and it does both. -->\n    @if (floating()) {\n      <!-- Parked, the panel is a grab strip: the edge handles would eat most of the peek that is left\n           to click, and resizing something you cannot see is not a thing to offer. -->\n      <et-resize-handles\n        [edges]=\"FLOAT_RESIZE_EDGES\"\n        [disabled]=\"floatParked()\"\n        (resizeStarted)=\"startFloatResize()\"\n        (resizeMoved)=\"resizeFloat($event)\"\n        (resizeEnded)=\"endFloatResize()\"\n        (resizeCancelled)=\"endFloatResize()\"\n      />\n      <div\n        (dragMoved)=\"moveFloat($event)\"\n        (dragEnded)=\"endFloatMove()\"\n        (dragCancelled)=\"endFloatMove()\"\n        (dragTapped)=\"restoreFloat()\"\n        class=\"et-query-devtools-move\"\n        title=\"Drag to move \u2014 shove it off an edge to park it, click the strip to bring it back\"\n        aria-hidden=\"true\"\n        etDragHandle\n      ></div>\n    } @else if (!poppedOut()) {\n      <div\n        (pointerdown)=\"startResize($event)\"\n        class=\"et-query-devtools-resize\"\n        title=\"Drag to resize\"\n        aria-hidden=\"true\"\n      ></div>\n    }\n    <header class=\"et-query-devtools-header\">\n      <nav class=\"et-query-devtools-tabs\" role=\"tablist\">\n        @for (tab of visibleTabs(); track tab.id) {\n          @let badge = tabBadges()[tab.id];\n          <button\n            [class.et-query-devtools-tab--active]=\"activeTab() === tab.id\"\n            [attr.aria-selected]=\"activeTab() === tab.id\"\n            (click)=\"activeTab.set(tab.id)\"\n            class=\"et-query-devtools-tab\"\n            type=\"button\"\n            role=\"tab\"\n          >\n            {{ tab.label }}\n            @if (badge.count) {\n              <span class=\"et-query-devtools-tab-badge\">{{ badge.count }}</span>\n            }\n            @if (badge.errors) {\n              <span\n                class=\"et-query-devtools-tab-badge et-query-devtools-tab-badge--error\"\n                title=\"{{ badge.errors }} {{ badge.errorNoun ?? 'failing' }}\"\n              >\n                {{ badge.errors }}\n              </span>\n            }\n          </button>\n        }\n\n        @if (overflowTabs().length; as overflowCount) {\n          <div class=\"et-query-devtools-menu\" etMenu>\n            <button\n              [title]=\"overflowCount + ' tabs with nothing in them'\"\n              class=\"et-query-devtools-tab\"\n              type=\"button\"\n              etMenuTrigger\n            >\n              More\n              <span class=\"et-query-devtools-menu-caret\" aria-hidden=\"true\">\u25BE</span>\n            </button>\n\n            <ng-template etMenuSurface>\n              <et-menu>\n                @for (tab of overflowTabs(); track tab.id) {\n                  <button (activate)=\"activeTab.set(tab.id)\" et-menu-item type=\"button\">{{ tab.label }}</button>\n                }\n              </et-menu>\n            </ng-template>\n          </div>\n        }\n      </nav>\n\n      <div class=\"et-query-devtools-header-actions\">\n        <button\n          [class.et-query-devtools-inspect-btn--active]=\"inspectActive()\"\n          [attr.aria-pressed]=\"inspectActive()\"\n          (click)=\"toggleInspect()\"\n          class=\"et-query-devtools-btn et-query-devtools-inspect-btn\"\n          type=\"button\"\n          title=\"Inspect: hover the UI to find its query\"\n        >\n          <svg\n            class=\"et-query-devtools-inspect-icon\"\n            viewBox=\"0 0 16 16\"\n            width=\"14\"\n            height=\"14\"\n            fill=\"none\"\n            aria-hidden=\"true\"\n            focusable=\"false\"\n          >\n            <circle class=\"et-query-devtools-inspect-icon-ring\" cx=\"8\" cy=\"8\" r=\"4.25\" />\n            <circle class=\"et-query-devtools-inspect-icon-dot\" cx=\"8\" cy=\"8\" r=\"1.15\" />\n            <path d=\"M8 0.9v2.1M8 13v2.1M0.9 8h2.1M13 8h2.1\" />\n          </svg>\n          {{ inspectActive() ? 'Inspecting' : 'Inspect' }}\n          @if (inspectActive()) {\n            <kbd class=\"et-query-devtools-kbd et-query-devtools-kbd--inverse\">Esc</kbd>\n          }\n        </button>\n        <button\n          (click)=\"downloadSession()\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n          title=\"Download every registered entry, the event log, the cache totals and anything armed as one JSON file - the attachment for a bug report\"\n        >\n          <span aria-hidden=\"true\">\u2913</span>\n          Session\n        </button>\n        <!-- A gear, not a tab: Settings holds nothing to count, so the badge/overflow logic would push it\n             behind More - and the one control that explains a panel behaving oddly may not be hidden. -->\n        <button\n          [class.et-query-devtools-btn--active]=\"activeTab() === 'settings'\"\n          [attr.aria-pressed]=\"activeTab() === 'settings'\"\n          (click)=\"toggleSettings()\"\n          class=\"et-query-devtools-btn et-query-devtools-icon-btn\"\n          type=\"button\"\n          title=\"Settings: where panel state is kept, and the limits it holds\"\n          aria-label=\"Settings\"\n        >\n          <span aria-hidden=\"true\">\u2699</span>\n        </button>\n        @if (!poppedOut()) {\n          @let layout = currentLayout();\n          <div class=\"et-query-devtools-menu\" etMenu placement=\"bottom-end\">\n            <button class=\"et-query-devtools-btn\" title=\"Where the panel sits\" type=\"button\" etMenuTrigger>\n              <span class=\"et-query-devtools-menu-glyph\" aria-hidden=\"true\">{{ layout.glyph }}</span>\n              {{ layout.label }}\n              <span class=\"et-query-devtools-menu-caret\" aria-hidden=\"true\">\u25BE</span>\n            </button>\n\n            <ng-template etMenuSurface>\n              <et-menu>\n                <et-menu-radio-group [value]=\"dock()\">\n                  @for (option of LAYOUTS; track option.id) {\n                    <!-- eslint-disable ethlete/prefer-static-boolean-properties -- closeOnActivate is tri-state (boolean | undefined); a transform would collapse its unset state -->\n                    <et-menu-radio-item\n                      [value]=\"option.id\"\n                      [title]=\"option.hint\"\n                      [closeOnActivate]=\"true\"\n                      (activate)=\"selectLayout(option.id)\"\n                    >\n                      <!-- eslint-enable ethlete/prefer-static-boolean-properties -->\n                      <span class=\"et-query-devtools-menu-item-glyph\" aria-hidden=\"true\">{{ option.glyph }}</span>\n                      {{ option.label }}\n                    </et-menu-radio-item>\n                  }\n                </et-menu-radio-group>\n              </et-menu>\n            </ng-template>\n          </div>\n        }\n        <span class=\"et-query-devtools-header-divider\" aria-hidden=\"true\"></span>\n        <button\n          (click)=\"toggleOpen()\"\n          class=\"et-query-devtools-btn et-query-devtools-btn--danger\"\n          type=\"button\"\n          title=\"{{ poppedOut() ? 'Bring the panel back into the app window' : 'Close devtools (' + shortcut + ')' }}\"\n        >\n          @if (poppedOut()) {\n            <span aria-hidden=\"true\">\u29C8</span>\n            Dock back\n          } @else {\n            <span aria-hidden=\"true\">\u2715</span>\n            Close\n            <kbd class=\"et-query-devtools-kbd\">{{ shortcut }}</kbd>\n          }\n        </button>\n      </div>\n    </header>\n\n    @if (popOutBlocked()) {\n      <div class=\"et-query-devtools-notice-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-text\">\n          The browser blocked the pop-up window. Allow pop-ups for this site, or float the panel over the page instead \u2014\n          a float needs no permission.\n        </span>\n        <button (click)=\"floatPanel()\" class=\"et-query-devtools-btn\" type=\"button\">Float instead</button>\n        <button (click)=\"popOutBlocked.set(false)\" class=\"et-query-devtools-btn\" type=\"button\">Dismiss</button>\n      </div>\n    }\n\n    @if (armedFaultClients(); as armed) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          <strong>Faults armed</strong> on\n          <span class=\"et-query-devtools-mono\">{{ armed.join(', ') }}</span>\n          \u2014 every failure and delay you see from\n          {{ armed.length === 1 ? 'this client' : 'these clients' }} is injected, not the API.\n          @if (faultsRestored()) {\n            They came back from your last page load \u2014 set <em>Armed faults</em> back to <em>none</em> in Settings to\n            stop that.\n          }\n        </span>\n        <button\n          [disabled]=\"activeTab() === 'faults'\"\n          (click)=\"activeTab.set('faults')\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n        >\n          Review\n        </button>\n        <button (click)=\"CLEAR_FAULTS()\" class=\"et-query-devtools-btn\" type=\"button\">Disarm all</button>\n      </div>\n    }\n\n    @if (armedMockRoutes(); as mocked) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          <strong>Mocks armed</strong> on\n          <span class=\"et-query-devtools-mono\">{{ mocked.join(', ') }}</span>\n          \u2014 {{ mocked.length === 1 ? 'that route is' : 'those routes are' }} answered by the panel, so nothing they show\n          reached the API.\n          @if (mocksRestored()) {\n            They came back from your last page load \u2014 set <em>Armed mocks</em> back to <em>none</em> in Settings to stop\n            that.\n          }\n        </span>\n        <button\n          [disabled]=\"activeTab() === 'mocks'\"\n          (click)=\"activeTab.set('mocks')\"\n          class=\"et-query-devtools-btn\"\n          type=\"button\"\n        >\n          Review\n        </button>\n        <button (click)=\"DISARM_MOCKS()\" class=\"et-query-devtools-btn\" type=\"button\">Disarm all</button>\n      </div>\n    }\n\n    @if (restoredOverrides(); as restored) {\n      <div class=\"et-query-devtools-armed-bar\" role=\"status\">\n        <span class=\"et-query-devtools-armed-dot\" aria-hidden=\"true\"></span>\n        <span class=\"et-query-devtools-armed-text\">\n          @if (restored.ops) {\n            <strong>Overrides re-armed</strong> \u2014 {{ restored.ops }} {{ restored.ops === 1 ? 'edit' : 'edits' }} from\n            your last page load {{ restored.ops === 1 ? 'is' : 'are' }} back on {{ restored.queries }}\n            {{ restored.queries === 1 ? 'query' : 'queries' }}, so those responses are not what the API sent.\n            @if (restored.fromLocalStorage) {\n              They came back from <strong>localStorage</strong>, so they outlive closing this tab \u2014 clear them, or set\n              overrides back to <em>session</em> in Settings.\n            }\n          } @else {\n            <strong>Overrides could not be re-armed.</strong>\n          }\n          @if (restored.orphaned.length) {\n            <span class=\"et-query-devtools-armed-orphans\">\n              {{ restored.orphaned.length }} stored\n              {{ restored.orphaned.length === 1 ? 'override' : 'overrides' }} matched no query \u2014\n              <span class=\"et-query-devtools-mono\">{{ restored.orphaned.join(', ') }}</span>\n            </span>\n          }\n        </span>\n        @if (restored.firstId; as firstId) {\n          <button (click)=\"reviewRestoredOverrides(firstId)\" class=\"et-query-devtools-btn\" type=\"button\">Review</button>\n        }\n        <button (click)=\"DROP_RESTORED_OVERRIDES()\" class=\"et-query-devtools-btn\" type=\"button\">Drop all</button>\n      </div>\n    }\n\n    <div class=\"et-query-devtools-body\">\n      @switch (activeTab()) {\n        <!-- QUERIES -->\n        @case ('queries') {\n          <et-query-devtools-queries-tab />\n        }\n\n        <!-- STACKS -->\n        @case ('stacks') {\n          <et-query-devtools-stacks-tab />\n        }\n\n        <!-- SEQUENCES -->\n        @case ('sequences') {\n          <et-query-devtools-sequences-tab />\n        }\n\n        <!-- FORMS -->\n        @case ('forms') {\n          <et-query-devtools-forms-tab />\n        }\n\n        <!-- AUTH -->\n        @case ('auth') {\n          <et-query-devtools-auth-tab />\n        }\n\n        <!-- SOCKETS -->\n        @case ('ws') {\n          <et-query-devtools-sockets-tab />\n        }\n\n        <!-- CACHE -->\n        @case ('cache') {\n          <et-query-devtools-cache-tab />\n        }\n\n        <!-- LOCKS -->\n        @case ('locks') {\n          <et-query-devtools-locks-tab />\n        }\n\n        <!-- TIMELINE -->\n        @case ('timeline') {\n          <et-query-devtools-timeline-tab />\n        }\n\n        <!-- EVENTS -->\n        @case ('events') {\n          <et-query-devtools-events-tab />\n        }\n\n        <!-- FAULTS -->\n        @case ('faults') {\n          <et-query-devtools-faults-tab />\n        }\n\n        <!-- MOCKS -->\n        @case ('mocks') {\n          <et-query-devtools-mocks-tab />\n        }\n\n        <!-- ABOUT -->\n        @case ('about') {\n          <et-query-devtools-about />\n        }\n\n        <!-- SETTINGS -->\n        @case ('settings') {\n          <et-query-devtools-settings />\n        }\n      }\n    </div>\n  </section>\n}\n\n@if (!open()) {\n  <et-query-devtools-toggle [tampered]=\"panelTampered()\" (openChange)=\"toggleOpen()\" />\n}\n\n@if (inspectActive() && inspectHover(); as hover) {\n  <div\n    [style.left.px]=\"hover.rect.left\"\n    [style.top.px]=\"hover.rect.top\"\n    [style.width.px]=\"hover.rect.width\"\n    [style.height.px]=\"hover.rect.height\"\n    class=\"et-query-devtools-inspect-box\"\n  >\n    <span class=\"et-query-devtools-inspect-tag\">{{ inspectLabel(hover.entries) }}</span>\n  </div>\n}\n\n@if (locatedRect(); as rect) {\n  <div\n    [style.left.px]=\"rect.left\"\n    [style.top.px]=\"rect.top\"\n    [style.width.px]=\"rect.width\"\n    [style.height.px]=\"rect.height\"\n    class=\"et-query-devtools-inspect-box\"\n  >\n    <span class=\"et-query-devtools-inspect-tag\">created here</span>\n  </div>\n}\n", styles: ["@layer components{.et-query-devtools-host{--_et-qdt-bg: var(--et-surface-background-solid, rgb(24 24 27));--_et-qdt-fg: var(--et-surface-color-solid, rgb(244 244 245));--_et-qdt-muted: var(--et-surface-color-muted-solid, rgb(161 161 170));--_et-qdt-subtle: var(--et-surface-color-subtle-solid, rgb(113 113 122));--_et-qdt-border: var(--et-surface-border-solid, rgb(255 255 255 / .12));--_et-qdt-interaction: var(--et-surface-interaction-solid, rgb(255 255 255));--_et-qdt-accent: var(--et-theme-color-primary-solid, rgb(96 165 250));--_et-qdt-hover: color-mix(in srgb, var(--_et-qdt-interaction) 10%, transparent);--_et-qdt-active: color-mix(in srgb, var(--_et-qdt-interaction) 18%, transparent);--_et-qdt-success: rgb(34 197 94);--_et-qdt-error: rgb(239 68 68);--_et-qdt-loading: rgb(234 179 8);--_et-qdt-title-bar: 2.4rem;--_et-qdt-radius: .5rem;--_et-qdt-control-h: 2.4rem;--_et-qdt-row-h: 3.6rem;position:fixed;inset-inline:0;inset-block-end:0;z-index:2147483000;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,Liberation Mono,monospace;font-size:1.2rem;line-height:1.4;pointer-events:none}.et-query-devtools-host>*{pointer-events:auto}@media(pointer:coarse){.et-query-devtools-host{--_et-qdt-control-h: 3.4rem;--_et-qdt-row-h: 4.4rem}}.et-query-devtools-panel{position:relative;display:flex;flex-direction:column;inline-size:100%;min-block-size:20rem;max-block-size:90vh;background:var(--_et-qdt-bg);color:var(--_et-qdt-fg);border-block-start:1px solid var(--_et-qdt-border);box-shadow:0 -.4rem 2rem #00000059}.et-query-devtools-host:where([data-dock=right]){inset-block:0;inset-inline-start:auto}.et-query-devtools-panel:where([data-dock=right]){inline-size:auto;block-size:100%;max-block-size:none;max-inline-size:90vw;border-block-start:0;border-inline-start:1px solid var(--_et-qdt-border);box-shadow:-.4rem 0 2rem #00000059}.et-query-devtools-host:where([data-dock=float]){inset:0}.et-query-devtools-panel:where([data-dock=float]){--_et-qdt-frame: .8rem;--et-resize-handles-edge-size: var(--_et-qdt-frame);--et-resize-handles-touch-edge-size: var(--_et-qdt-frame);--et-resize-handles-corner-size: 1.6rem;--et-resize-handles-touch-corner-size: 1.6rem;--et-resize-handles-edge-inset: 1.6rem;--et-resize-handles-side-top: var(--_et-qdt-title-bar);--et-resize-handles-side-bottom: 1.6rem;--et-resize-handles-z-index: 3;position:absolute;inline-size:auto;min-block-size:0;max-block-size:none;padding-block-start:var(--_et-qdt-title-bar);padding-inline:var(--_et-qdt-frame);padding-block-end:var(--_et-qdt-frame);border:1px solid var(--_et-qdt-border);border-radius:.6rem;box-shadow:0 1rem 4rem #00000073;overflow:hidden}.et-query-devtools-move{position:absolute;inset-inline:0;inset-block-start:0;block-size:var(--_et-qdt-title-bar);cursor:move;z-index:2}.et-query-devtools-panel:where([data-dock=float]) .et-query-devtools-body{border-radius:.3rem;overflow:hidden}.et-query-devtools-move:after{content:\"\";position:absolute;inset-inline:50%;inset-block-start:.9rem;inline-size:3rem;margin-inline-start:-1.5rem;block-size:.6rem;background-image:radial-gradient(currentcolor 40%,transparent 42%);background-size:.4rem .3rem;color:var(--_et-qdt-subtle)}@media(hover:hover){.et-query-devtools-move:hover:after{color:var(--_et-qdt-accent)}}.et-query-devtools-panel:where([data-dock=float][data-parked]){opacity:.85}@media(hover:hover){.et-query-devtools-panel:where([data-dock=float][data-parked]):hover{opacity:1}}.et-query-devtools-panel:where([data-dock=float][data-parked]) .et-query-devtools-move{cursor:grab;background:var(--_et-qdt-active)}.et-query-devtools-panel:where([data-dock=float][data-parked]) .et-query-devtools-move:after{color:var(--_et-qdt-accent)}.et-query-devtools-host:where([data-dock=left]){inset-block:0;inset-inline-end:auto}.et-query-devtools-panel:where([data-dock=left]){inline-size:auto;block-size:100%;max-block-size:none;max-inline-size:90vw;border-block-start:0;border-inline-end:1px solid var(--_et-qdt-border);box-shadow:.4rem 0 2rem #00000059}.et-query-devtools-host:where([data-dock=top]){inset-block-start:0;inset-block-end:auto}.et-query-devtools-panel:where([data-dock=top]){border-block-start:0;border-block-end:1px solid var(--_et-qdt-border);box-shadow:0 .4rem 2rem #00000059}.et-query-devtools-host:where([data-dock=popout]){position:static;inline-size:100%;block-size:100%}.et-query-devtools-panel:where([data-dock=popout]){block-size:100%;max-block-size:none;border:0;box-shadow:none}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-header{flex-wrap:wrap}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-tabs,.et-query-devtools-header-actions){flex:1 1 auto;flex-wrap:nowrap;min-inline-size:0;overflow-x:auto}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-tabs,.et-query-devtools-header-actions)>*{flex:none}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-master-detail,.et-query-devtools-split){flex-direction:column}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-list,.et-query-devtools-detail,.et-query-devtools-drawer,.et-query-devtools-split .et-query-devtools-scroll){flex:1 1 50%;min-inline-size:0;min-block-size:0;max-inline-size:none;border-inline-start:0;border-inline-end:0}.et-query-devtools-panel:where([data-pane-axis=block]) :is(.et-query-devtools-detail,.et-query-devtools-drawer){border-block-start:1px solid var(--_et-qdt-border)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-master-detail>.et-query-devtools-list{flex:0 1 var(--_et-qdt-list-height, 50%);min-block-size:var(--_et-qdt-list-height, 0);max-block-size:var(--_et-qdt-list-height, none)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-split>.et-query-devtools-drawer{flex:0 1 var(--_et-qdt-drawer-height, 50%);min-block-size:var(--_et-qdt-drawer-height, 0);max-block-size:var(--_et-qdt-drawer-height, none)}.et-query-devtools-panel:where([data-pane-axis=block]) .et-query-devtools-pane-resize{cursor:ns-resize}.et-query-devtools-panel--resizing{-webkit-user-select:none;user-select:none}.et-query-devtools-resize,.et-query-devtools-pane-resize{touch-action:none}.et-query-devtools-resize{position:absolute;inset-inline:0;inset-block-start:0;block-size:.6rem;cursor:ns-resize;z-index:1}.et-query-devtools-panel:where([data-dock=right]) .et-query-devtools-resize{inset-inline:0 auto;inset-block:0;inline-size:.6rem;block-size:auto;cursor:ew-resize}.et-query-devtools-panel:where([data-dock=left]) .et-query-devtools-resize{inset-inline:auto 0;inset-block:0;inline-size:.6rem;block-size:auto;cursor:ew-resize}.et-query-devtools-panel:where([data-dock=top]) .et-query-devtools-resize{inset-block:auto 0}.et-query-devtools-resize:after{content:\"\";position:absolute;inset-inline:50%;inset-block-start:.2rem;inline-size:4rem;margin-inline-start:-2rem;block-size:.2rem;border-radius:999px;background:var(--_et-qdt-border)}.et-query-devtools-panel:where([data-dock=right]) .et-query-devtools-resize:after{inset-inline:.2rem auto;inset-block:50% auto;inline-size:.2rem;block-size:4rem;margin-inline-start:0;margin-block-start:-2rem}.et-query-devtools-panel:where([data-dock=left]) .et-query-devtools-resize:after{inset-inline:auto .2rem;inset-block:50% auto;inline-size:.2rem;block-size:4rem;margin-inline-start:0;margin-block-start:-2rem}.et-query-devtools-panel:where([data-dock=top]) .et-query-devtools-resize:after{inset-block:auto .2rem}@media(hover:hover){.et-query-devtools-resize:hover:after{background:var(--_et-qdt-accent)}}.et-query-devtools-header{display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding-inline:.8rem;border-block-end:1px solid var(--_et-qdt-border);flex:0 0 auto}.et-query-devtools-armed-bar{display:flex;align-items:center;gap:.8rem;flex:0 0 auto;padding:.6rem .8rem;background:color-mix(in srgb,var(--_et-qdt-error) 14%,transparent);border-block-end:1px solid color-mix(in srgb,var(--_et-qdt-error) 45%,transparent);color:var(--_et-qdt-error);font-size:1.1rem}.et-query-devtools-armed-text{flex:1 1 auto;min-inline-size:0}.et-query-devtools-notice-bar{display:flex;align-items:center;gap:.8rem;flex:0 0 auto;padding:.6rem .8rem;background:var(--_et-qdt-hover);border-block-end:1px solid var(--_et-qdt-border);color:var(--_et-qdt-fg);font-size:1.1rem}.et-query-devtools-notice-bar .et-query-devtools-btn{flex:0 0 auto}.et-query-devtools-armed-orphans{display:block;opacity:.85}.et-query-devtools-armed-dot{flex:0 0 auto;inline-size:.8rem;block-size:.8rem;border-radius:50%;background:var(--_et-qdt-error);animation:et-query-devtools-armed-pulse 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.et-query-devtools-armed-dot{animation:none}}@keyframes et-query-devtools-armed-pulse{50%{opacity:.25}}.et-query-devtools-armed-bar .et-query-devtools-btn{flex:0 0 auto;border-color:color-mix(in srgb,var(--_et-qdt-error) 55%,transparent);color:var(--_et-qdt-error)}.et-query-devtools-tabs{display:flex;flex-wrap:wrap;gap:.2rem}.et-query-devtools-tab{appearance:none;display:inline-flex;align-items:center;gap:.5rem;border:none;background:transparent;color:var(--_et-qdt-muted);padding:.9rem 1rem;cursor:pointer;border-block-end:2px solid transparent;font:inherit}@media(hover:hover){.et-query-devtools-tab:hover{color:var(--_et-qdt-fg)}}.et-query-devtools-tab--active{color:var(--_et-qdt-fg);border-block-end-color:var(--_et-qdt-accent)}.et-query-devtools-tab-badge{display:inline-block;padding-inline:.45rem;border-radius:999px;background:color-mix(in srgb,var(--_et-qdt-interaction) 12%,transparent);color:var(--_et-qdt-muted);font-size:1rem;font-variant-numeric:tabular-nums}.et-query-devtools-tab-badge--error{background:color-mix(in srgb,var(--_et-qdt-error) 25%,transparent);color:var(--_et-qdt-fg)}.et-query-devtools-menu{display:contents}.et-query-devtools-menu-caret{font-size:.9em;opacity:.7}.et-query-devtools-menu-glyph{display:inline-block;min-inline-size:1.2rem;text-align:center}.et-query-devtools-menu>[data-menu-open]{background:var(--_et-qdt-hover);color:var(--_et-qdt-fg)}.et-menu .et-query-devtools-menu-item-glyph{display:inline-block;inline-size:16px;text-align:center}.et-menu-item-content:has(.et-query-devtools-menu-item-note){display:flex;flex-direction:column;align-items:start;gap:2px;padding-block:8px}.et-query-devtools-menu-item-note{color:var(--et-surface-color-muted-solid, rgb(255 255 255 / .55));font-size:12px}.et-query-devtools-header-actions{display:flex;align-items:center;gap:.2rem;flex:0 0 auto}.et-query-devtools-header-divider{inline-size:1px;block-size:1.6rem;margin-inline:.4rem;background:var(--_et-qdt-border)}.et-query-devtools-inspect-btn{position:relative}.et-query-devtools-inspect-icon{inline-size:1.4rem;block-size:1.4rem;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round}.et-query-devtools-inspect-icon-dot{fill:currentColor;stroke:none}.et-query-devtools-btn.et-query-devtools-inspect-btn--active,.et-query-devtools-btn.et-query-devtools-inspect-btn--active:hover{color:#09090b;background:var(--_et-qdt-accent);border-color:var(--_et-qdt-accent)}.et-query-devtools-inspect-btn--active:after{content:\"\";position:absolute;inset:-.3rem;border:1px solid var(--_et-qdt-accent);border-radius:calc(var(--_et-qdt-radius) + .3rem);pointer-events:none;animation:et-query-devtools-inspect-pulse 1.4s ease-in-out infinite}.et-query-devtools-inspect-btn--active .et-query-devtools-inspect-icon-ring{animation:et-query-devtools-inspect-pulse 1.4s ease-in-out infinite}@keyframes et-query-devtools-inspect-pulse{0%,to{opacity:.2}50%{opacity:1}}@media(prefers-reduced-motion:reduce){.et-query-devtools-inspect-btn--active:after,.et-query-devtools-inspect-btn--active .et-query-devtools-inspect-icon-ring{animation:none;opacity:1}}.et-query-devtools-close{appearance:none;border:none;background:transparent;color:var(--_et-qdt-muted);cursor:pointer;padding:.6rem;font:inherit}.et-query-devtools-kbd{border-radius:.3rem;background:var(--_et-qdt-hover);box-shadow:inset 0 0 0 1px var(--_et-qdt-border);color:var(--_et-qdt-muted);padding:.15rem .4rem;font:inherit;font-size:1.1rem;line-height:1.2;white-space:nowrap}.et-query-devtools-kbd--inverse{background:#00000026;box-shadow:inset 0 0 0 1px #00000040;color:inherit}@media(hover:none)and (pointer:coarse){.et-query-devtools-kbd{display:none}}.et-query-devtools-inspect-box{position:fixed;z-index:2147483002;pointer-events:none;border:2px solid var(--_et-qdt-accent);background:color-mix(in srgb,var(--_et-qdt-accent) 15%,transparent);border-radius:.2rem}.et-query-devtools-inspect-tag{position:absolute;inset-block-start:100%;inset-inline-start:0;margin-block-start:.2rem;padding:.2rem .5rem;border-radius:.3rem;background:var(--_et-qdt-accent);color:#09090b;font-family:ui-monospace,monospace;font-size:1.1rem;font-weight:600;white-space:nowrap}@media(hover:hover){.et-query-devtools-close:hover{color:var(--_et-qdt-fg)}}.et-query-devtools-body{flex:1 1 auto;min-block-size:0;overflow:hidden}.et-query-devtools-detail{flex:1 1 auto;min-inline-size:0;overflow-y:auto;padding:1rem}.et-query-devtools-detail .et-query-devtools-meta,.et-query-devtools-drawer .et-query-devtools-meta{padding:.8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 3%,transparent)}.et-query-devtools-detail .et-query-devtools-section-row,.et-query-devtools-drawer .et-query-devtools-section-row{padding-block-start:.8rem;border-block-start:1px solid var(--_et-qdt-border)}.et-query-devtools-filter-chip{display:inline-flex;align-items:center;gap:.6rem;padding:.3rem .35rem .3rem .7rem;border-radius:999px;background:color-mix(in srgb,var(--_et-qdt-accent) 16%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--_et-qdt-accent) 45%,transparent);color:var(--_et-qdt-accent);font-size:1.1rem;font-weight:600;letter-spacing:.02em}.et-query-devtools-filter-icon{font-size:1.3rem;line-height:1}.et-query-devtools-filter-count{border-radius:999px;background:var(--_et-qdt-accent);color:#09090b;min-inline-size:1.8rem;padding:0 .5rem;text-align:center}.et-query-devtools-filter-clear{appearance:none;display:inline-flex;align-items:center;gap:.5rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:transparent;color:var(--_et-qdt-muted);cursor:pointer;padding:.3rem .6rem;font:inherit;font-size:1.15rem;line-height:1.4}@media(hover:hover){.et-query-devtools-filter-clear:hover{border-color:color-mix(in srgb,var(--_et-qdt-accent) 60%,transparent);color:var(--_et-qdt-fg)}}.et-query-devtools-scroll{block-size:100%;overflow:auto;padding:1rem;display:flex;flex-direction:column;gap:1rem}.et-query-devtools-split{display:flex;block-size:100%;min-block-size:0}.et-query-devtools-split .et-query-devtools-scroll{flex:1 1 auto;min-inline-size:0}.et-query-devtools-pane{display:flex;flex-direction:column;flex:1 1 auto;block-size:100%;min-inline-size:0;min-block-size:0;overflow:hidden}.et-query-devtools-pane>.et-query-devtools-scroll{padding-block:0 1rem}.et-query-devtools-pane-resize{flex:0 0 .5rem;align-self:stretch;cursor:ew-resize;background:transparent;transition:background .12s ease}.et-query-devtools-pane-resize:active{background:var(--_et-qdt-accent)}@media(hover:hover){.et-query-devtools-pane-resize:hover{background:var(--_et-qdt-accent)}}.et-query-devtools-toolbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:.6rem;padding:.8rem;position:sticky;inset-block-start:0;z-index:1;background:var(--_et-qdt-bg);border-block-end:1px solid var(--_et-qdt-border)}.et-query-devtools-scroll>.et-query-devtools-toolbar{inset-block-start:-1rem}.et-query-devtools-toolbar-row{display:flex;align-items:center;flex-wrap:wrap;flex:1 1 100%;gap:.5rem}.et-query-devtools-field{display:inline-flex;align-items:center;gap:.6rem;color:var(--_et-qdt-muted)}.et-query-devtools-select{flex:0 0 auto;min-block-size:var(--_et-qdt-control-h);background:color-mix(in srgb,var(--_et-qdt-interaction) 5%,var(--_et-qdt-bg));color:var(--_et-qdt-fg);border:1px solid transparent;border-radius:var(--_et-qdt-radius);padding:.4rem .6rem;font:inherit;font-size:1.15rem}.et-query-devtools-select option{background-color:var(--_et-qdt-bg);color:var(--_et-qdt-fg)}.et-query-devtools-count{color:var(--_et-qdt-subtle)}.et-query-devtools-row{display:flex;align-items:stretch;inline-size:100%;min-block-size:var(--_et-qdt-row-h);border-block-end:1px solid var(--_et-qdt-border);color:var(--_et-qdt-fg)}@media(hover:hover){.et-query-devtools-row:hover{background:var(--_et-qdt-hover)}}.et-query-devtools-method{font-weight:700;font-size:1.1rem;color:var(--_et-qdt-muted);white-space:nowrap}.et-query-devtools-route{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;flex:1 1 auto;min-inline-size:0}.et-query-devtools-status{inline-size:.8rem;block-size:.8rem;border-radius:999px;flex:0 0 auto;background:var(--_et-qdt-subtle)}.et-query-devtools-status[data-status=success]{background:var(--_et-qdt-success)}.et-query-devtools-status[data-status=error]{background:var(--_et-qdt-error)}.et-query-devtools-status[data-status=loading],.et-query-devtools-status[data-status=running]{background:var(--_et-qdt-loading)}.et-query-devtools-btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;flex:0 0 auto;min-block-size:var(--_et-qdt-control-h);border:1px solid transparent;border-radius:var(--_et-qdt-radius);background:transparent;color:var(--_et-qdt-muted);padding:.25rem .7rem;font:inherit;font-size:1.15rem;line-height:1.4;white-space:nowrap;cursor:pointer;transition:color .12s ease,background-color .12s ease,border-color .12s ease}@media(hover:hover){.et-query-devtools-btn:hover:not(:disabled){background:var(--_et-qdt-hover);color:var(--_et-qdt-fg)}}.et-query-devtools-btn:focus-visible{outline:2px solid var(--_et-qdt-accent);outline-offset:1px}.et-query-devtools-btn:disabled{color:var(--_et-qdt-subtle);cursor:default;background:transparent;opacity:.6}.et-query-devtools-btn--primary,.et-query-devtools-btn--primary:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-accent) 16%,transparent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 40%,transparent);color:var(--_et-qdt-accent)}@media(hover:hover){.et-query-devtools-btn--primary:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-accent) 26%,transparent)}}@media(hover:hover){.et-query-devtools-btn--danger:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-error) 16%,transparent);color:var(--_et-qdt-error)}}.et-query-devtools-btn--tampered,.et-query-devtools-btn--tampered:hover:not(:disabled){background:color-mix(in srgb,var(--_et-qdt-error) 14%,transparent);border-color:color-mix(in srgb,var(--_et-qdt-error) 45%,transparent);color:var(--_et-qdt-error)}.et-query-devtools-icon-btn{inline-size:var(--_et-qdt-control-h);padding-inline:0;font-size:1.3rem}.et-query-devtools-btn-group{display:inline-flex;flex:0 0 auto;border:1px solid var(--_et-qdt-border);border-radius:var(--_et-qdt-radius);overflow:hidden}.et-query-devtools-btn-group>.et-query-devtools-btn{border-radius:0;border-block:0;border-inline-start:0;border-inline-end:1px solid var(--_et-qdt-border)}.et-query-devtools-btn-group>.et-query-devtools-btn:last-child{border-inline-end:0}.et-query-devtools-toolbar-btn{margin-inline-start:auto;flex:0 0 auto}.et-query-devtools-meta{display:grid;grid-template-columns:auto 1fr;gap:.3rem 1rem;margin:0 0 1rem}.et-query-devtools-meta dt{color:var(--_et-qdt-muted)}.et-query-devtools-meta dd{margin:0;overflow-wrap:anywhere}.et-query-devtools-section{margin:1rem 0 .4rem;font-size:1.1rem;text-transform:uppercase;letter-spacing:.05em;color:var(--_et-qdt-muted)}.et-query-devtools-stat{padding:.6rem .8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 3%,transparent)}.et-query-devtools-stat dt{font-size:1rem;text-transform:uppercase;letter-spacing:.05em;color:var(--_et-qdt-muted)}.et-query-devtools-stat dd{margin:0;font-size:1.5rem;font-variant-numeric:tabular-nums}.et-query-devtools-stat-sub{display:block;font-size:1rem;color:var(--_et-qdt-subtle)}.et-query-devtools-json{margin:0;padding:.8rem;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:color-mix(in srgb,var(--_et-qdt-interaction) 4%,transparent);overflow-x:auto;white-space:pre-wrap;overflow-wrap:anywhere;max-block-size:24rem;overflow-y:auto}.et-query-devtools-json--error{border-color:color-mix(in srgb,var(--_et-qdt-error) 50%,transparent)}.et-query-devtools-mono{font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.et-query-devtools-url{display:inline-block;max-inline-size:32rem;margin-inline-start:.6rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}.et-query-devtools-chips,.et-query-devtools-chip-row{display:flex;flex-wrap:wrap;gap:.4rem;margin-block-end:.8rem}.et-query-devtools-chip{display:inline-flex;align-items:center;gap:.3rem;padding:.2rem .6rem;border-radius:999px;border:1px solid var(--_et-qdt-border);font-size:1.1rem;color:var(--_et-qdt-fg);background:color-mix(in srgb,var(--_et-qdt-interaction) 6%,transparent)}.et-query-devtools-chip--muted{color:var(--_et-qdt-muted)}.et-query-devtools-retry-glyph{font-size:.7em;line-height:1}.et-query-devtools-chip--loading{color:var(--_et-qdt-loading);border-color:color-mix(in srgb,var(--_et-qdt-loading) 50%,transparent)}.et-query-devtools-chip--error{color:var(--_et-qdt-error);border-color:color-mix(in srgb,var(--_et-qdt-error) 50%,transparent)}.et-query-devtools-chip--success{color:var(--_et-qdt-success);border-color:color-mix(in srgb,var(--_et-qdt-success) 50%,transparent)}button.et-query-devtools-chip--button{appearance:none;cursor:pointer;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}@media(hover:hover){button.et-query-devtools-chip--button:hover{border-color:var(--_et-qdt-accent);color:var(--_et-qdt-accent)}}.et-query-devtools-facet{appearance:none;min-block-size:var(--_et-qdt-control-h);padding-inline:.8rem;background:transparent;cursor:pointer;color:var(--_et-qdt-muted);font:inherit;font-size:1.1rem;line-height:1.4}@media(hover:hover){.et-query-devtools-facet:hover:not(:disabled){color:var(--_et-qdt-fg);background:var(--_et-qdt-hover);border-color:color-mix(in srgb,var(--_et-qdt-accent) 60%,transparent)}}.et-query-devtools-facet:disabled{color:var(--_et-qdt-subtle);cursor:default}.et-query-devtools-facet--active{color:var(--_et-qdt-accent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-accent) 14%,transparent)}.et-query-devtools-facet-count{font-variant-numeric:tabular-nums;color:inherit;opacity:.75}.et-query-devtools-card{border:1px solid var(--_et-qdt-border);border-radius:.6rem;padding:1rem}.et-query-devtools-card--armed{border-color:color-mix(in srgb,var(--_et-qdt-error) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-error) 6%,transparent)}.et-query-devtools-card-head{display:flex;align-items:center;gap:.6rem;margin-block-end:.8rem}.et-query-devtools-inner-queries{display:flex;flex-direction:column;gap:.3rem}.et-query-devtools-inner-row{display:flex;align-items:center;gap:.6rem;inline-size:100%;text-align:start;appearance:none;border:1px solid var(--_et-qdt-border);border-radius:.4rem;background:transparent;color:var(--_et-qdt-fg);padding:.4rem .6rem;cursor:pointer;font:inherit}@media(hover:hover){.et-query-devtools-inner-row:hover:not([disabled]){background:var(--_et-qdt-hover)}}.et-query-devtools-inner-row--active{background:var(--_et-qdt-active);border-color:var(--_et-qdt-accent)}.et-query-devtools-inner-row[disabled]{cursor:default;opacity:.6}.et-query-devtools-step-toggle{display:flex;align-items:center;gap:.6rem;inline-size:100%;text-align:start;appearance:none;border:none;background:transparent;color:var(--_et-qdt-fg);padding:.6rem;cursor:pointer;font:inherit}@media(hover:hover){.et-query-devtools-step-toggle:hover{background:var(--_et-qdt-hover)}}.et-query-devtools-step-index{flex:1 1 auto;min-inline-size:0}.et-query-devtools-step-caret{color:var(--_et-qdt-muted)}.et-query-devtools-table{inline-size:100%;border-collapse:collapse}.et-query-devtools-table th,.et-query-devtools-table td{text-align:start;padding:.5rem .6rem;border-block-end:1px solid var(--_et-qdt-border);vertical-align:top}.et-query-devtools-table td .et-query-devtools-chip{padding-block:0;line-height:1.4}.et-query-devtools-table th{color:var(--_et-qdt-muted);font-weight:600;position:sticky;inset-block-start:0;background:var(--_et-qdt-bg)}.et-query-devtools-table tr[data-status=error] td{color:var(--_et-qdt-error)}.et-query-devtools-empty{color:var(--_et-qdt-subtle);padding:1.2rem;text-align:center}.et-query-devtools-cell-actions{display:inline-flex;gap:.4rem;white-space:nowrap}.et-query-devtools-section-row{display:flex;align-items:center;justify-content:space-between;gap:.8rem;margin-block-start:1rem}.et-query-devtools-search{flex:1 1 16rem;min-inline-size:0;min-block-size:var(--_et-qdt-control-h);background:color-mix(in srgb,var(--_et-qdt-interaction) 5%,transparent);color:var(--_et-qdt-fg);border:1px solid transparent;border-radius:var(--_et-qdt-radius);padding:.4rem .8rem;font:inherit;font-size:1.15rem}.et-query-devtools-search:focus{outline:none;border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:var(--_et-qdt-bg)}.et-query-devtools-row-link{display:inline-flex;align-items:center;gap:.6rem;appearance:none;border:0;background:none;padding:0;color:inherit;font:inherit;text-align:start;cursor:pointer}.et-query-devtools-row-link:focus-visible .et-query-devtools-url{color:var(--_et-qdt-accent);text-decoration:underline}@media(hover:hover){.et-query-devtools-row-link:hover .et-query-devtools-url{color:var(--_et-qdt-accent);text-decoration:underline}}.et-query-devtools-hint{flex:1 1 24rem;color:var(--_et-qdt-muted);font-size:1.1rem;margin:0}.et-query-devtools-input{inline-size:100%;background:var(--_et-qdt-bg);color:var(--_et-qdt-fg);border:1px solid var(--_et-qdt-border);border-radius:.4rem;padding:.4rem .6rem;font:inherit}.et-query-devtools-input--number{inline-size:8rem;font-variant-numeric:tabular-nums}.et-query-devtools-editor{border:1px solid var(--_et-qdt-border);border-radius:.4rem;padding:.8rem;margin-block-end:1rem}.et-query-devtools-editor-error{color:var(--_et-qdt-error);margin:.4rem 0 0}.et-query-devtools-btn--active{color:var(--_et-qdt-accent);border-color:color-mix(in srgb,var(--_et-qdt-accent) 55%,transparent);background:color-mix(in srgb,var(--_et-qdt-accent) 12%,transparent)}}\n"] }]
         }], ctorParameters: () => [], propDecorators: { startOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "startOpen", required: false }] }], panelEl: [{ type: i0.ViewChild, args: ['panel', { isSignal: true }] }] } });
 
 const QUERY_DEVTOOLS_IMPORTS = [QueryDevtoolsComponent];