@takazudo/zdtp 0.4.13 → 0.4.15

package/dist/utils/numeric-transform.d.ts

@@ -0,0 +1,32 @@
+/**
+ * Pure numeric transforms used by the bulk token action bar.
+ *
+ * Values are kept as a magnitude + unit pair so a transform never has to
+ * guess whether a number belongs to `rem`, `px`, or is unitless. Parsing and
+ * formatting deliberately use the same helpers as the token model's regular
+ * numeric controls.
+ */
+export interface NumericValue {
+    magnitude: number;
+    unit: string;
+}
+export type NumericTransform = (value: NumericValue) => NumericValue;
+/** Parse a stored token value, retaining its actual suffix when present. */
+export declare function parseNumericTransformValue(value: string, fallbackUnit?: string): NumericValue | null;
+/** Short aliases for callers that use the token-model helper naming. */
+export declare const parseNumericValue: typeof parseNumericTransformValue;
+/** Format a transformed value using the canonical token-model formatter. */
+export declare function formatNumericTransformValue(value: NumericValue): string;
+export declare const formatNumericValue: typeof formatNumericTransformValue;
+export declare function multiply(value: NumericValue, factor: number): NumericValue;
+export declare function multiply(factor: number, value: NumericValue): NumericValue;
+export declare function multiply(factor: number): NumericTransform;
+export declare function add(value: NumericValue, amount: number): NumericValue;
+export declare function add(amount: number, value: NumericValue): NumericValue;
+export declare function add(amount: number): NumericTransform;
+export declare function roundToStep(value: NumericValue, step: number): NumericValue;
+export declare function roundToStep(step: number, value: NumericValue): NumericValue;
+export declare function roundToStep(step: number): NumericTransform;
+export declare function setTo(value: NumericValue, magnitude: number): NumericValue;
+export declare function setTo(magnitude: number, value: NumericValue): NumericValue;
+export declare function setTo(magnitude: number): NumericTransform;

package/dist/utils/token-diff.d.ts

@@ -0,0 +1,25 @@
+/** Canonical UI-facing changed-token evaluation and revert helpers. */
+import type { PanelConfig } from '../config/panel-config';
+import type { ColorTweakState, SemanticValue, TweakState } from '../state/tweak-state';
+import { type TokenAddress, type TokenIndexEntry } from './token-index';
+export type ColorBaseline = ColorTweakState | {
+    color: ColorTweakState;
+    secondary?: ColorTweakState;
+} | undefined;
+export type TweakStateUpdater = (state: TweakState) => TweakState;
+/** Canonical diff-only rule for sparse non-color overrides. */
+export declare function flatOverrideChanged(value: string | undefined, defaultValue: string): boolean;
+/**
+ * Compare semantic mappings by the CSS value they resolve to. Role aliases
+ * and numeric indices are equal when they select the same palette slot;
+ * literal and ref variants compare structurally.
+ */
+export declare function semanticMappingsEqual(current: SemanticValue, original: SemanticValue, currentColor: ColorTweakState, originalColor: ColorTweakState | undefined): boolean;
+export declare function currentTokenValue(entry: TokenIndexEntry, state: TweakState, cfg?: PanelConfig): string | SemanticValue | undefined;
+export declare function isChanged(entry: TokenIndexEntry, state: TweakState, baseline: ColorBaseline, cfg?: PanelConfig): boolean;
+export declare function changedEntries(entries: readonly TokenIndexEntry[], state: TweakState, baseline: ColorBaseline, cfg?: PanelConfig): TokenIndexEntry[];
+export declare function changedCounts(entries: readonly TokenIndexEntry[], state: TweakState, baseline: ColorBaseline, cfg?: PanelConfig): Record<string, number>;
+export declare function formatCssDeclarations(entries: readonly TokenIndexEntry[], state: TweakState, cfg: PanelConfig): string;
+export declare function revertEntry(entry: TokenIndexEntry, baseline: ColorBaseline, cfg: PanelConfig): TweakStateUpdater;
+export declare function revertEntries(entries: readonly TokenIndexEntry[], baseline: ColorBaseline, cfg: PanelConfig): TweakStateUpdater;
+export declare function addressMatches(entry: TokenIndexEntry, address: TokenAddress): boolean;

package/dist/utils/token-graph.d.ts

@@ -0,0 +1,23 @@
+/** State-aware token dependency graph. References are address-based, never cssVar-based. */
+import type { PanelConfig } from '../config/panel-config';
+import type { TweakState } from '../state/tweak-state';
+import { type ColorBaseline } from './token-diff';
+import { type TokenAddress, type TokenIndexEntry } from './token-index';
+export type ResolutionHop = {
+    kind: 'token';
+    address: TokenAddress;
+    cssVar: string;
+    value?: undefined;
+} | {
+    kind: 'literal';
+    value: string;
+    address?: undefined;
+    cssVar?: undefined;
+};
+export interface TokenGraph {
+    entries: readonly TokenIndexEntry[];
+    dependentsOf(address: TokenAddress): readonly TokenAddress[];
+    rampSiblings(address: TokenAddress): readonly TokenAddress[];
+    resolutionChain(address: TokenAddress): readonly ResolutionHop[];
+}
+export declare function buildTokenGraph(cfg: PanelConfig, state: TweakState, baseline?: ColorBaseline): TokenGraph;

package/dist/utils/token-index.d.ts

@@ -0,0 +1,30 @@
+/** Pure, manifest-ordered token index with collision-safe stable addresses. */
+import type { PanelConfig } from '../config/panel-config';
+import type { SemanticValue, TierValueKind } from '../tokens/tier-model';
+export interface TokenAddress {
+    tabId: string;
+    tierId: string;
+    itemId: string;
+}
+export type TokenSource = 'item' | 'palette-slot' | 'semantic';
+export interface TokenIndexEntry {
+    address: TokenAddress;
+    tabLabel: string;
+    tierLabel: string;
+    cssVar: string;
+    label: string;
+    kind: TierValueKind['kind'];
+    default: string | SemanticValue;
+    source: TokenSource;
+}
+export interface TokenIndex {
+    entries: readonly TokenIndexEntry[];
+    entry(address: TokenAddress): TokenIndexEntry | undefined;
+    addressesForCssVar(cssVar: string): readonly TokenAddress[];
+}
+/** Internal metadata accessor used by state evaluators without widening index entries. */
+export declare function paletteSlotIndex(entry: TokenIndexEntry): number | undefined;
+/** A stable internal key. Length prefixes avoid delimiter collisions in host ids. */
+export declare function tokenAddressKey(address: TokenAddress): string;
+export declare function sameTokenAddress(a: TokenAddress, b: TokenAddress): boolean;
+export declare function buildTokenIndex(cfg: PanelConfig): TokenIndex;

package/dist/zdtp.css

@@ -1 +1 @@
-:where(.tokenpanel-shell,[data-design-token-panel-modal],.tokenpanel-highlight-settings-popover,.tokenpanel-color-picker,.tokenpanel-tooltip,.tokenpanel-elpath-label,.tokenpanel-elpath-toast){color-scheme:dark;--tokentweak-color-fg: #b8b8b8;--tokentweak-color-bg: #181818;--tokentweak-color-muted: #888888;--tokentweak-color-surface: #1c1c1c;--tokentweak-color-accent: #d69a66;--tokentweak-color-accent-hover: #a7c0e3;--tokentweak-color-code-bg: #383838;--tokentweak-color-code-fg: #e0e0e0;--tokentweak-color-success: #93bb77;--tokentweak-color-danger: #da6871;--tokentweak-color-warning: #dfbb77;--tokentweak-font-mono: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--tokentweak-pad-2xs: 2px;--tokentweak-pad-xs: 6px;--tokentweak-pad-sm: 8px;--tokentweak-pad-md: 12px;--tokentweak-pad-lg: 16px;--tokentweak-pad-xl: 24px;--tokentweak-pad-2xl: 32px;--tokentweak-gap-2xs: 7px;--tokentweak-gap-xs: 14px;--tokentweak-gap-sm: 20px;--tokentweak-gap-md: 24px;--tokentweak-gap-lg: 28px;--tokentweak-gap-xl: 40px;--tokentweak-gap-2xl: 56px;--tokentweak-text-micro: 12px;--tokentweak-text-caption: 14px;--tokentweak-text-small: 16px;--tokentweak-text-body: 19px;--tokentweak-text-subheading: 22px;--tokentweak-text-heading: 48px;--tokentweak-text-display: 60px;--radius-tokentweak: 4px;--tokentweak-z-overlay: 2147482990;--tokentweak-z-shell: 2147482991;--tokentweak-z-settings-popover: 2147482992;--tokentweak-z-color-picker: 2147482993;--tokentweak-z-tooltip: 2147482994;--tokentweak-z-inspector-box: 2147483000;--tokentweak-z-toast: 2147483001}.tokenpanel-color-picker{position:fixed;width:320px;padding:var(--tokentweak-pad-md);background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-muted);border-radius:var(--radius-tokentweak);box-shadow:0 8px 24px #0006;display:flex;flex-direction:column;gap:var(--tokentweak-gap-2xs);z-index:var(--tokentweak-z-color-picker);color:var(--tokentweak-color-fg);font-size:var(--tokentweak-text-caption)}.tokenpanel-color-picker[data-mode-shell=expanded]{width:520px;padding:var(--tokentweak-pad-lg);gap:var(--tokentweak-gap-xs)}.tokenpanel-color-picker-header{display:flex;align-items:center;gap:var(--tokentweak-gap-2xs)}.tokenpanel-color-picker-drag-handle{flex-shrink:0;cursor:grab;color:var(--tokentweak-color-muted);font-size:var(--tokentweak-text-caption);line-height:1;padding:var(--tokentweak-pad-2xs);border-radius:var(--radius-tokentweak);-webkit-user-select:none;user-select:none;touch-action:none}.tokenpanel-color-picker-drag-handle:hover{color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-drag-handle:active{cursor:grabbing}.tokenpanel-color-picker-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-caption)}.tokenpanel-color-picker-mode-toggle{display:flex;align-items:center;gap:2px;background:var(--tokentweak-color-bg);border:1px solid var(--tokentweak-color-muted);border-radius:999px;padding:2px;flex-shrink:0}.tokenpanel-color-picker-mode-btn{border-radius:999px;padding-inline:var(--tokentweak-pad-xs);padding-block:var(--tokentweak-pad-2xs);font-size:var(--tokentweak-text-micro);color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .12s ease,color .12s ease;white-space:nowrap}.tokenpanel-color-picker-mode-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-mode-btn[aria-pressed=true]{background-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-mode-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-expand-btn{flex-shrink:0;color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none;padding:var(--tokentweak-pad-2xs);border-radius:var(--radius-tokentweak);transition:color .12s ease}.tokenpanel-color-picker-expand-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-expand-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-close-btn{position:relative;flex-shrink:0;min-width:16px;color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none;padding:var(--tokentweak-pad-2xs);border-radius:var(--radius-tokentweak);text-align:center;transition:color .12s ease}.tokenpanel-color-picker-close-btn:after{content:"";position:absolute;inset:-4px}.tokenpanel-color-picker-close-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-close-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-top-row{display:flex;align-items:center;gap:var(--tokentweak-gap-2xs)}.tokenpanel-color-picker-preview{position:relative;flex-shrink:0;width:48px;height:48px;border-radius:var(--radius-tokentweak);border:1px solid var(--tokentweak-color-muted);overflow:hidden}.tokenpanel-color-picker-preview-checkerboard{position:absolute;inset:0;background-image:repeating-conic-gradient(gray 0% 25%,silver 0% 50%);background-size:10px 10px}.tokenpanel-color-picker-preview-color{position:absolute;inset:0}.tokenpanel-color-picker-hex-input{flex:1;min-width:0;font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-caption);background:var(--tokentweak-color-bg);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);border-radius:var(--radius-tokentweak);padding:var(--tokentweak-pad-2xs) var(--tokentweak-pad-xs);transition:border-color .12s ease}.tokenpanel-color-picker-hex-input:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-hex-input:focus-visible{border-color:var(--tokentweak-color-accent);outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:2px}.tokenpanel-color-picker-grid>[role=row]{display:contents}.tokenpanel-color-picker[data-mode-shell=expanded] .tokenpanel-color-picker-grid{grid-template-columns:repeat(12,1fr)}.tokenpanel-color-picker-grid-cell{position:relative;aspect-ratio:1;border-radius:var(--radius-tokentweak);cursor:pointer;transition:box-shadow .12s ease}.tokenpanel-color-picker-grid-cell:hover{box-shadow:0 0 0 2px var(--tokentweak-color-fg)}.tokenpanel-color-picker-grid-cell[aria-selected=true]{box-shadow:0 0 0 2px var(--tokentweak-color-accent)}.tokenpanel-color-picker-grid-cell:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-grid-cell[data-oog=true]:after{content:"";position:absolute;inset:1px;border:1px dashed oklch(98% 0 0 / .4);border-radius:var(--radius-tokentweak);pointer-events:none}.tokenpanel-color-picker-sliders{display:flex;flex-direction:column;gap:var(--tokentweak-gap-2xs)}.tokenpanel-color-picker-slider-row{display:flex;align-items:center;gap:var(--tokentweak-gap-2xs)}.tokenpanel-color-picker-slider-label{flex-shrink:0;width:20px;font-size:var(--tokentweak-text-micro);color:var(--tokentweak-color-muted);-webkit-user-select:none;user-select:none}.tokenpanel-color-picker-slider{flex:1;position:relative;height:24px;display:flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none}.tokenpanel-color-picker-slider:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:var(--radius-tokentweak)}.tokenpanel-color-picker-slider-track{width:100%;height:18px;border-radius:9px;overflow:hidden;border:1px solid var(--tokentweak-color-muted)}.tokenpanel-color-picker-slider-thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:14px;height:14px;border-radius:50%;background:var(--tokentweak-color-fg);border:2px solid var(--tokentweak-color-bg);box-shadow:0 0 0 1px var(--tokentweak-color-muted);pointer-events:none}.tokenpanel-color-picker-slider-value{flex-shrink:0;width:48px;text-align:right;font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-micro);color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-readout{display:none;font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-micro);color:var(--tokentweak-color-muted);padding-top:var(--tokentweak-pad-2xs);border-top:1px solid var(--tokentweak-color-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tokenpanel-color-picker[data-mode-shell=expanded] .tokenpanel-color-picker-readout{display:block}.tokenpanel-palette-chart svg{fill:currentColor;overflow:visible}.tokenpanel-palette-chart{position:relative;width:100%;height:280px;border-radius:var(--radius-tokentweak);overflow:hidden;touch-action:none}.tokenpanel-palette-chart-bands{position:absolute;inset:0;display:block;width:100%;height:100%}.tokenpanel-palette-chart-band.is-invalid{fill:var(--tokentweak-color-surface);stroke:var(--tokentweak-color-muted);stroke-dasharray:4 3;stroke-width:1;vector-effect:non-scaling-stroke}.tokenpanel-palette-chart-curve{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;overflow:visible}.tokenpanel-palette-chart-hit-line{fill:none;pointer-events:stroke;cursor:grab}.tokenpanel-palette-chart-hit-line:active{cursor:grabbing}.tokenpanel-palette-chart-line{fill:none}.tokenpanel-palette-chart-curve--l .tokenpanel-palette-chart-line{stroke:var(--tokentweak-color-accent)}.tokenpanel-palette-chart-curve--c .tokenpanel-palette-chart-line{stroke:var(--tokentweak-color-success)}.tokenpanel-palette-chart-curve--h .tokenpanel-palette-chart-line{stroke:var(--tokentweak-color-warning)}.tokenpanel-palette-chart-node-visual{fill:var(--tokentweak-color-bg)}.tokenpanel-palette-chart-node-visual.is-readonly{stroke-dasharray:2 2}.tokenpanel-palette-chart-curve--l .tokenpanel-palette-chart-node-visual{stroke:var(--tokentweak-color-accent)}.tokenpanel-palette-chart-curve--c .tokenpanel-palette-chart-node-visual{stroke:var(--tokentweak-color-success)}.tokenpanel-palette-chart-curve--h .tokenpanel-palette-chart-node-visual{stroke:var(--tokentweak-color-warning)}.tokenpanel-palette-chart-node-hit{pointer-events:all;cursor:grab;outline:none}.tokenpanel-palette-chart-node-hit:active{cursor:grabbing}.tokenpanel-palette-chart-node-hit:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-palette-chart-readonly-blocker{pointer-events:all;cursor:default}.tokenpanel-palette-chart-blockers{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}.tokenpanel-palette-edit-view{display:flex;flex-direction:column;gap:14px}.tokenpanel-palette-edit-group{border:1px solid var(--tokentweak-color-muted);border-radius:var(--radius-tokentweak);overflow:hidden}.tokenpanel-palette-edit-group-header{display:flex;align-items:center;gap:8px;padding:8px 10px;cursor:pointer;-webkit-user-select:none;user-select:none}.tokenpanel-palette-edit-group-header:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:-2px}.tokenpanel-palette-edit-group.is-active .tokenpanel-palette-edit-group-header{border-bottom:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-edit-group-chevron{flex:none;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;color:var(--tokentweak-color-muted);transform:rotate(-90deg);transition:transform .15s ease}.tokenpanel-palette-edit-group-chevron.is-open{transform:rotate(0)}.tokenpanel-palette-edit-group-heading{flex:1 1 auto;min-width:0;margin:0;color:var(--tokentweak-color-fg);font-family:inherit;font-weight:600;font-size:13px;line-height:20px;text-transform:none;letter-spacing:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-palette-edit-group-preview{flex:none;display:flex;align-items:center;gap:3px}.tokenpanel-palette-edit-preview-chip{width:12px;height:12px;border-radius:3px;border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .12);pointer-events:none}.tokenpanel-palette-edit-preview-chip.is-invalid,.tokenpanel-palette-edit-swatch[data-invalid],.tokenpanel-palette-readout-swatch.is-invalid{background-color:var(--tokentweak-color-surface);background-image:repeating-linear-gradient(135deg,transparent 0 4px,rgb(from var(--tokentweak-color-muted) r g b / .25) 4px 6px)}.tokenpanel-palette-edit-group-body{display:flex;flex-direction:column;gap:8px;padding:10px}.tokenpanel-palette-edit-swatches{display:flex;gap:4px}.tokenpanel-palette-edit-swatch{position:relative;flex:1 1 0;height:30px;border-radius:var(--radius-tokentweak);border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .08);outline:0 solid transparent;cursor:pointer;transition:outline-width .08s ease}.tokenpanel-palette-edit-swatch.is-selected{outline:2px solid var(--tokentweak-color-accent);outline-offset:1px}.tokenpanel-palette-edit-swatch:focus-visible{outline:2px solid var(--tokentweak-color-accent-hover);outline-offset:1px}.tokenpanel-palette-edit-swatch.is-readonly{border-style:double;border-width:3px}.tokenpanel-palette-edit-swatch-lock{position:absolute;inset:2px 2px auto auto;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:var(--radius-tokentweak);color:var(--tokentweak-color-fg);background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-muted);pointer-events:none}.tokenpanel-palette-edit-swatch-lock svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.tokenpanel-palette-edit-swatch[data-out-of-gamut]{border-style:dashed;border-color:var(--tokentweak-color-danger);border-width:2px}.tokenpanel-palette-edit-swatch[data-invalid]{border-style:dashed;border-color:var(--tokentweak-color-muted)}.tokenpanel-palette-edit-swatch-idx{position:absolute;inset:auto 0 2px;text-align:center;font-size:9px;color:#0000008c;text-shadow:0 0 2px rgba(255,255,255,.4);pointer-events:none}.tokenpanel-palette-edit-editor{border:1px solid var(--tokentweak-color-muted);border-radius:var(--radius-tokentweak);background:var(--tokentweak-color-surface)}.tokenpanel-palette-edit-editor-bar{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-edit-editor-title{flex:1 1 auto;font-size:11px;color:var(--tokentweak-color-muted)}.tokenpanel-palette-edit-channels{display:flex;gap:3px}.tokenpanel-palette-edit-channel{padding:4px 9px;font-size:11px;font-weight:650;border-radius:var(--radius-tokentweak);border:1px solid var(--tokentweak-color-muted);color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.tokenpanel-palette-edit-channel:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:1px}.tokenpanel-palette-edit-channel--l.is-on{border-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-accent)}.tokenpanel-palette-edit-channel--c.is-on{border-color:var(--tokentweak-color-success);color:var(--tokentweak-color-success)}.tokenpanel-palette-edit-channel--h.is-on{border-color:var(--tokentweak-color-warning);color:var(--tokentweak-color-warning)}.tokenpanel-palette-edit-direct{display:flex;align-items:center;gap:8px;padding:8px 10px;border-top:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-edit-direct-hint{font-size:11px;color:var(--tokentweak-color-muted)}.tokenpanel-palette-readout{display:flex;gap:10px;align-items:center;padding:8px 10px 10px;border-top:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-readout-swatch{flex:none;width:40px;height:40px;border-radius:var(--radius-tokentweak);border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .12)}.tokenpanel-palette-readout-rows{font-family:var(--tokentweak-font-mono);font-size:10.5px;color:var(--tokentweak-color-fg);line-height:1.5}.tokenpanel-palette-readout-key{display:inline-block;width:42px;color:var(--tokentweak-color-muted);font-weight:600}.tokenpanel-palette-readout-gamut{margin-top:4px;color:var(--tokentweak-color-danger);font-size:10px}.tokenpanel-palette-mode-toggle{display:inline-flex;align-self:flex-start;border:1px solid var(--tokentweak-color-muted);border-radius:6px;overflow:hidden}.tokenpanel-palette-mode-btn{padding:4px 16px;font-size:12px;line-height:20px;color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .15s ease,color .15s ease}.tokenpanel-palette-mode-btn+.tokenpanel-palette-mode-btn{border-left:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-mode-btn:hover{color:var(--tokentweak-color-fg);background-color:rgb(from var(--tokentweak-color-fg) r g b / .06)}.tokenpanel-palette-mode-btn.is-active{background-color:rgb(from var(--tokentweak-color-accent) r g b / .16);color:var(--tokentweak-color-accent);font-weight:600}.tokenpanel-palette-mode-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:-2px}.tokenpanel-palette-check-view{display:flex;flex-direction:column;gap:var(--tokentweak-gap-xs)}.tokenpanel-palette-check-toolbar{display:flex;align-items:center;gap:20px}.tokenpanel-palette-check-switch{display:inline-flex;align-items:center;gap:5px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.tokenpanel-palette-check-switch input[type=checkbox]{accent-color:var(--tokentweak-color-accent);margin:0}.tokenpanel-palette-check-switch:hover{color:var(--tokentweak-color-fg)}.tokenpanel-palette-check-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:var(--tokentweak-gap-xs);align-items:start}.tokenpanel-palette-check-col{display:flex;flex-direction:column;gap:18px;min-width:0}.tokenpanel-palette-check-col-cap{margin-bottom:-6px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;letter-spacing:0;text-transform:uppercase}.tokenpanel-palette-check-base-row{display:flex;align-items:center;gap:8px;padding:4px 8px;margin-inline:-8px;border:1px solid transparent;border-radius:var(--radius-tokentweak);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .12s ease,border-color .12s ease}.tokenpanel-palette-check-base-row:hover{background-color:rgb(from var(--tokentweak-color-fg) r g b / .06)}.tokenpanel-palette-check-base-row:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:-2px}.tokenpanel-palette-check-base-row.is-selected{border-color:var(--tokentweak-color-accent);background-color:rgb(from var(--tokentweak-color-accent) r g b / .12)}.tokenpanel-palette-check-base-row.is-selected .tokenpanel-palette-check-row-name{color:var(--tokentweak-color-accent)}.tokenpanel-palette-check-base-row.is-disabled{cursor:not-allowed;border-style:dashed}.tokenpanel-palette-check-base-row.is-disabled:hover{background-color:transparent}.tokenpanel-palette-check-swatch{flex-shrink:0;width:18px;height:18px;border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .16);border-radius:var(--radius-tokentweak)}.tokenpanel-palette-check-swatch.is-invalid,.tokenpanel-palette-check-aa-sample.is-invalid{background-color:var(--tokentweak-color-surface);background-image:repeating-linear-gradient(135deg,transparent 0 4px,rgb(from var(--tokentweak-color-muted) r g b / .25) 4px 6px)}.tokenpanel-palette-check-row-name{flex:1;min-width:0;overflow:hidden;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-palette-check-row-value{color:var(--tokentweak-color-muted);font-size:10px;overflow:hidden;text-overflow:ellipsis}.tokenpanel-palette-check-na{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px}.tokenpanel-palette-check-candidate-row{display:flex;align-items:center;gap:8px;padding:3px 0}.tokenpanel-palette-check-aa-sample{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:36px;height:24px;border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .12);border-radius:var(--radius-tokentweak);font-size:12px;font-weight:600}.tokenpanel-palette-check-ratio{flex-shrink:0;width:38px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:12px;font-variant-numeric:tabular-nums;text-align:right}.tokenpanel-palette-check-chip{flex-shrink:0;min-width:36px;padding:2px 7px;border-radius:999px;color:#fff;font-family:var(--tokentweak-font-mono);font-size:10px;font-weight:700;letter-spacing:0;text-align:center}.tokenpanel-palette-check-chip.is-na{border:1px dashed var(--tokentweak-color-muted);color:var(--tokentweak-color-muted)}.tokenpanel-palette-check-footer{padding-top:12px;border-top:1px solid rgb(from var(--tokentweak-color-muted) r g b / .35);color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:12px}.tokenpanel-palette-check-tally-count,.tokenpanel-palette-check-tally-total{color:var(--tokentweak-color-fg);font-weight:700}.tokenpanel-palette-check-tally-mode{color:var(--tokentweak-color-fg)}.tokenpanel-palette-check-tally-base{color:var(--tokentweak-color-accent)}:where(.tokenpanel-shell,[data-design-token-panel-modal],.tokenpanel-color-picker,.tokenpanel-highlight-settings-popover,.tokenpanel-tooltip,.tokenpanel-elpath-label,.tokenpanel-elpath-toast){box-sizing:border-box}:where(.tokenpanel-shell,[data-design-token-panel-modal],.tokenpanel-color-picker,.tokenpanel-highlight-settings-popover) :where(*,*:before,*:after){box-sizing:border-box}.tokenpanel-shell{container:tokenpanel / inline-size;z-index:var(--tokentweak-z-shell);display:flex;flex-direction:column;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);border-radius:0;box-shadow:0 4px 24px #00000040}.tokenpanel-resize-handle{position:absolute;right:2px;bottom:2px;width:16px;height:16px;cursor:nwse-resize;-webkit-user-select:none;user-select:none;background-image:repeating-linear-gradient(-45deg,transparent 0,transparent 2px,var(--tokentweak-color-muted) 2px,var(--tokentweak-color-muted) 3px);-webkit-mask-image:linear-gradient(135deg,transparent 50%,#000 50%);mask-image:linear-gradient(135deg,transparent 50%,#000 50%);border-bottom-right-radius:0;transition:opacity .15s ease;opacity:.7}.tokenpanel-resize-handle:hover,.tokenpanel-resize-handle:focus-visible{opacity:1}.tokenpanel-header{display:flex;align-items:center;gap:var(--tokentweak-pad-md);padding-inline:var(--tokentweak-pad-xl);padding-block:var(--tokentweak-gap-xs);border-bottom:1px solid var(--tokentweak-color-muted);flex-shrink:0;position:relative}.tokenpanel-title{color:var(--tokentweak-color-fg);font-weight:600;font-size:14px;flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.tokenpanel-action-link{color:var(--tokentweak-color-accent);font-size:12px;background:none;border:none;padding:0;cursor:pointer;transition:color .15s ease;white-space:nowrap;flex-shrink:0}.tokenpanel-action-link:hover{color:var(--tokentweak-color-accent-hover)}.tokenpanel-actions-menu-btn{display:none;color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;align-items:center;justify-content:center;transition:color .15s ease}.tokenpanel-actions-menu-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-actions-menu-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-actions-popover{position:absolute;top:calc(100% + 4px);left:var(--tokentweak-pad-xl);z-index:var(--tokentweak-z-color-picker);display:flex;flex-direction:column;min-width:180px;background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-muted);border-radius:6px;box-shadow:0 8px 24px #0006;padding:4px}.tokenpanel-actions-popover .tokenpanel-action-link{text-align:left;padding:6px 10px;border-radius:4px;font-size:13px}.tokenpanel-actions-popover .tokenpanel-action-link:hover{background:rgb(from var(--tokentweak-color-fg) r g b / .06)}.tokenpanel-spacer{flex:1}.tokenpanel-close-btn{color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;transition:color .15s ease;display:inline-flex;align-items:center;justify-content:center}.tokenpanel-close-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-tabbar{display:flex;align-items:center;border-bottom:1px solid var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-xl);flex-shrink:0;gap:var(--tokentweak-pad-md)}.tokenpanel-tabbar-tabs{display:flex;align-items:center;gap:2px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}.tokenpanel-tabbar-tabs::-webkit-scrollbar{display:none}.tokenpanel-tabbar-tabs.has-overflow{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent)}.tokenpanel-tab-button{border:none;background:none;padding-inline:var(--tokentweak-pad-md);padding-block:var(--tokentweak-gap-xs);font-size:14px;cursor:pointer;border-bottom:2px solid transparent;color:var(--tokentweak-color-muted);white-space:nowrap;flex-shrink:0;transition:color .15s ease,border-color .15s ease}.tokenpanel-tab-button:hover,.tokenpanel-tab-button:focus-visible{color:var(--tokentweak-color-fg);text-decoration:underline}.tokenpanel-tab-button.is-active{color:var(--tokentweak-color-fg);border-bottom-color:var(--tokentweak-color-accent);text-decoration:none}.tokenpanel-density{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);flex-shrink:0}.tokenpanel-density-label{color:var(--tokentweak-color-muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em;-webkit-user-select:none;user-select:none;cursor:pointer}.tokenpanel-density-slider{width:80px;accent-color:var(--tokentweak-color-accent);cursor:pointer}@container tokenpanel (max-width: 479px){.tokenpanel-header>.tokenpanel-action-link{display:none}.tokenpanel-actions-menu-btn{display:inline-flex}}@container tokenpanel (max-width: 379px){.tokenpanel-density-label{display:none}}@container tokenpanel (max-width: 299px){.tokenpanel-density-slider{width:56px}}.tokenpanel-body{flex:1;min-height:0;overflow-y:auto;padding-inline:var(--tokentweak-pad-xl);padding-block:var(--tokentweak-gap-sm)}.tokenpanel-notes-heading{margin:0 0 var(--tokentweak-gap-2xs) 0;color:var(--tokentweak-color-fg);font-family:inherit;font-weight:600;font-size:15px;line-height:22px}.tokenpanel-notes-body{color:var(--tokentweak-color-fg);font-size:13px;line-height:1.6;display:flex;flex-direction:column;gap:var(--tokentweak-gap-2xs)}:where(.tokenpanel-shell) .tokenpanel-notes-body h1,:where(.tokenpanel-shell) .tokenpanel-notes-body h2,:where(.tokenpanel-shell) .tokenpanel-notes-body h3,:where(.tokenpanel-shell) .tokenpanel-notes-body h4,:where(.tokenpanel-shell) .tokenpanel-notes-body h5,:where(.tokenpanel-shell) .tokenpanel-notes-body h6{display:block!important;margin:var(--tokentweak-gap-2xs) 0!important;padding:0!important;border:0!important;background:none!important;color:var(--tokentweak-color-fg)!important;font-family:inherit!important;font-weight:600!important;font-size:14px!important;line-height:1.4!important;text-transform:none!important;letter-spacing:normal!important}:where(.tokenpanel-shell) .tokenpanel-notes-body p{display:block!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;padding:0!important;color:var(--tokentweak-color-fg)!important;font-size:13px!important;line-height:1.6!important;font-weight:400!important;font-style:normal!important}:where(.tokenpanel-shell) .tokenpanel-notes-body ul,:where(.tokenpanel-shell) .tokenpanel-notes-body ol{display:block!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;padding:0 0 0 20px!important;color:var(--tokentweak-color-fg)!important;list-style:revert!important}:where(.tokenpanel-shell) .tokenpanel-notes-body li{display:list-item!important;margin:0!important;padding:0!important}:where(.tokenpanel-shell) .tokenpanel-notes-body a{color:var(--tokentweak-color-accent)!important;text-decoration:underline!important;cursor:pointer!important;background:none!important}:where(.tokenpanel-shell) .tokenpanel-notes-body a:hover,:where(.tokenpanel-shell) .tokenpanel-notes-body a:focus-visible{color:var(--tokentweak-color-accent-hover)!important}:where(.tokenpanel-shell) .tokenpanel-notes-body table{display:table!important;width:100%!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;border-collapse:collapse!important;font-size:13px!important}:where(.tokenpanel-shell) .tokenpanel-notes-body thead{display:table-header-group!important}:where(.tokenpanel-shell) .tokenpanel-notes-body tbody{display:table-row-group!important}:where(.tokenpanel-shell) .tokenpanel-notes-body tr{display:table-row!important}:where(.tokenpanel-shell) .tokenpanel-notes-body th,:where(.tokenpanel-shell) .tokenpanel-notes-body td{display:table-cell!important;border:1px solid var(--tokentweak-color-muted)!important;padding:var(--tokentweak-pad-2xs) var(--tokentweak-pad-xs)!important;text-align:left!important;color:var(--tokentweak-color-fg)!important;font-weight:400!important}:where(.tokenpanel-shell) .tokenpanel-notes-body th{font-weight:600!important}:where(.tokenpanel-shell) .tokenpanel-notes-body blockquote{display:block!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;padding:var(--tokentweak-pad-xs) var(--tokentweak-pad-md)!important;border:0!important;border-left:3px solid var(--tokentweak-color-muted)!important;color:var(--tokentweak-color-muted)!important;font-style:normal!important}:where(.tokenpanel-shell) .tokenpanel-notes-body pre,:where(.tokenpanel-shell) .tokenpanel-notes-body code{font-family:var(--tokentweak-font-mono)!important;font-size:12px!important;color:var(--tokentweak-color-code-fg)!important;background:var(--tokentweak-color-code-bg)!important}:where(.tokenpanel-shell) .tokenpanel-notes-body code{display:inline!important;padding:1px 4px!important;border-radius:3px!important}:where(.tokenpanel-shell) .tokenpanel-notes-body pre{display:block!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;padding:var(--tokentweak-pad-sm)!important;border-radius:6px!important;overflow-x:auto!important;white-space:pre!important}:where(.tokenpanel-shell) .tokenpanel-notes-body pre code{padding:0!important;background:none!important}:where(.tokenpanel-shell) .tokenpanel-notes-body hr{display:block!important;margin:var(--tokentweak-gap-2xs) 0!important;height:0!important;border:0!important;border-top:1px solid var(--tokentweak-color-muted)!important}:where(.tokenpanel-shell) .tokenpanel-notes-body img{max-width:100%!important;height:auto!important;display:block!important}:where(.tokenpanel-shell) .tokenpanel-notes-body strong,:where(.tokenpanel-shell) .tokenpanel-notes-body b{font-weight:700!important;font-style:normal!important}:where(.tokenpanel-shell) .tokenpanel-notes-body em,:where(.tokenpanel-shell) .tokenpanel-notes-body i{font-style:italic!important;font-weight:inherit!important}.tokenpanel-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:192px;padding-block:var(--tokentweak-gap-md);padding-inline:var(--tokentweak-pad-xl)}.tokenpanel-empty-state-text{color:var(--tokentweak-color-muted, #a8a8a8);font-size:13px;line-height:1.5;max-width:512px;margin:0}.tokenpanel-empty-state-text code{font-family:var(--tokentweak-font-mono, Menlo, Monaco, Consolas, monospace);font-size:13px;color:var(--tokentweak-color-fg)}.tokenpanel-empty-state-link{color:var(--tokentweak-color-accent);text-decoration:underline;transition:color .15s ease}.tokenpanel-empty-state-link:hover,.tokenpanel-empty-state-link:focus-visible{color:var(--tokentweak-color-accent-hover)}.tokenpanel-tab-content{display:flex;flex-direction:column;gap:var(--tokentweak-gap-sm)}.tokenpanel-tab-actions{display:flex;align-items:center;gap:var(--tokentweak-pad-md)}.tokenpanel-tab-section{position:relative;flex-shrink:0;border:1px solid var(--tokentweak-color-muted);border-radius:8px;padding:18px 14px 14px}.tokenpanel-tab-section-heading{position:absolute;top:-10px;left:12px;background:var(--tokentweak-color-surface);padding:0 8px;margin:0;color:var(--tokentweak-color-fg);font-family:inherit;font-weight:600;font-size:13px;line-height:20px;text-transform:none;letter-spacing:normal}.tokenpanel-tab-section-heading--color{font-size:14px}.tokenpanel-tab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--tokenpanel-grid-min, 288px),1fr));gap:var(--tokentweak-gap-xs)}.tokenpanel-color-preset-select{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-sm);padding-block:2px;font-size:12px;border-radius:var(--radius-tokentweak);max-width:224px;cursor:pointer;transition:border-color .15s ease}.tokenpanel-color-preset-select:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-palette-grid,.tokenpanel-color-palette-grid--secondary{display:grid;grid-template-columns:repeat(auto-fit,minmax(56px,1fr));gap:var(--tokentweak-pad-sm)}.tokenpanel-color-base-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--tokenpanel-grid-min, 176px),1fr));gap:6px}.tokenpanel-color-swatch-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;width:100%}.tokenpanel-color-swatch-button{display:block;border:1px solid var(--tokentweak-color-muted);cursor:pointer;width:56px;height:56px;border-radius:var(--radius-tokentweak);background:none;padding:0;transition:border-color .15s ease}.tokenpanel-color-swatch-button:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-swatch-button:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-field{display:inline-flex}.tokenpanel-color-field-swatch{display:block;width:44px;height:28px;border:1px solid var(--tokentweak-color-muted);border-radius:var(--radius-tokentweak);cursor:pointer;padding:0;transition:border-color .15s ease}.tokenpanel-color-field-swatch:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-field-swatch:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-field-swatch[aria-disabled=true]{cursor:default;opacity:.6}.tokenpanel-color-swatch-label-row{display:flex;align-items:center;gap:4px;min-width:0;max-width:100%}.tokenpanel-color-swatch-label{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);-webkit-user-select:none;user-select:none;font-size:11px;line-height:1.1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-tooltip{position:fixed;z-index:var(--tokentweak-z-tooltip);pointer-events:none;background:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);border-radius:4px;padding:4px 8px;font-family:var(--tokentweak-font-mono);font-size:11px;line-height:1.3;white-space:nowrap;box-shadow:0 4px 12px #00000080;opacity:0;transform:translateY(2px);transition:opacity 90ms ease,transform 90ms ease}.tokenpanel-tooltip[data-show=true]{opacity:1;transform:translateY(0)}.tokenpanel-tooltip--help{white-space:normal;max-width:320px}.tokenpanel-help-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:15px;height:15px;border-radius:50%;border:1px solid var(--tokentweak-color-muted);color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;line-height:1;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.tokenpanel-help-icon:hover,.tokenpanel-help-icon.is-pinned{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg);background-color:rgb(from var(--tokentweak-color-fg) r g b / .1)}.tokenpanel-help-icon:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-help-icon:after{content:"";position:absolute;inset:-5px}.tokenpanel-popover{border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);padding:12px;border-radius:var(--radius-tokentweak);box-shadow:0 4px 12px #0000004d}.tokenpanel-palette-selector{position:relative;width:100%;display:flex;align-items:center;gap:6px}.tokenpanel-palette-trigger{display:flex;align-items:center;gap:4px;flex:1;min-width:0;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);padding-inline:6px;padding-block:4px;font-size:12px;border-radius:var(--radius-tokentweak);cursor:pointer;transition:border-color .15s ease}.tokenpanel-palette-trigger:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-palette-trigger:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-palette-trigger-label{flex:1;min-width:0;text-align:left;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-palette-trigger-color{flex-shrink:0;border:1px solid var(--tokentweak-color-muted);width:14px;height:14px;border-radius:2px}.tokenpanel-palette-trigger-value{flex-shrink:0;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);width:2.5em}.tokenpanel-palette-trigger-icon{color:var(--tokentweak-color-muted);flex-shrink:0}.tokenpanel-palette-options{border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);padding:10px;border-radius:var(--radius-tokentweak);box-shadow:0 4px 12px #0000004d}.tokenpanel-palette-options-extras{display:flex;gap:6px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-extra-option{display:flex;align-items:center;gap:6px;padding-inline:8px;padding-block:4px;border-radius:4px;font-size:16px;background:none;border:none;cursor:pointer;transition:background-color .15s ease}.tokenpanel-palette-extra-option:hover{background-color:rgb(from var(--tokentweak-color-fg) r g b / .1)}.tokenpanel-palette-extra-option.is-selected{background-color:rgb(from var(--tokentweak-color-accent) r g b / .2)}.tokenpanel-palette-extra-option.is-active{outline:2px solid var(--tokentweak-color-accent);outline-offset:1px}.tokenpanel-palette-extra-color{width:28px;height:28px;border-radius:3px;border:1px solid var(--tokentweak-color-muted)}.tokenpanel-palette-extra-label{color:var(--tokentweak-color-fg)}.tokenpanel-palette-options-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px}.tokenpanel-palette-option-button{width:48px;height:48px;border-radius:3px;border:1px solid var(--tokentweak-color-muted);cursor:pointer;padding:0;transition:box-shadow .15s ease}.tokenpanel-palette-option-button:hover{box-shadow:0 0 0 2px var(--tokentweak-color-fg)}.tokenpanel-palette-option-button.is-selected{box-shadow:0 0 0 2px var(--tokentweak-color-accent)}.tokenpanel-palette-option-button.is-active{outline:2px solid var(--tokentweak-color-fg);outline-offset:1px}.tokenpanel-row{display:flex;align-items:center;gap:var(--tokentweak-pad-sm)}.tokenpanel-row--stacked{display:flex;flex-direction:column;gap:2px}.tokenpanel-row--column{display:flex;flex-direction:column;gap:4px}.tokenpanel-row-head{display:flex;align-items:center;gap:var(--tokentweak-pad-sm)}.tokenpanel-row-label{color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);flex:1;min-width:0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-row-input-group{display:flex;align-items:center;gap:4px;flex-shrink:0}.tokenpanel-row-number-input{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);text-align:right;font-size:12px;width:80px;border-radius:var(--radius-tokentweak)}.tokenpanel-row-number-input:disabled{opacity:.6}.tokenpanel-row-number-input--invalid{border-color:var(--tokentweak-color-danger);color:var(--tokentweak-color-danger)}.tokenpanel-row-unit{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);-webkit-user-select:none;user-select:none;font-size:12px;width:32px}.tokenpanel-row-unit--interactive{cursor:pointer;border-radius:2px}.tokenpanel-row-unit--interactive:hover{color:var(--tokentweak-color-fg)}.tokenpanel-row-unit--interactive:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-row-unit--interactive[aria-disabled=true]{cursor:default;opacity:.6}.tokenpanel-row-select{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);font-size:12px;width:112px;border-radius:var(--radius-tokentweak)}.tokenpanel-row-select:disabled{opacity:.6}.tokenpanel-row-text-input{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);font-size:12px;flex:1;min-width:0;border-radius:var(--radius-tokentweak)}.tokenpanel-row-text-input:disabled{opacity:.6}.tokenpanel-pill-toggle{display:flex;align-items:center;gap:var(--tokentweak-pad-xs);flex-shrink:0;cursor:pointer}.tokenpanel-pill-toggle-checkbox{accent-color:var(--tokentweak-color-accent)}.tokenpanel-pill-toggle-text{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:12px}[data-design-token-panel-modal]{margin-inline:auto;width:100%;max-width:736px;max-height:80vh;overflow-y:auto;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);padding:var(--tokentweak-pad-xl);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-user-select:text;user-select:text}[data-design-token-panel-modal]::backdrop{background-color:rgb(from var(--tokentweak-color-bg) r g b / .8)}[data-design-token-panel-modal] [class*=__header]{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--tokentweak-pad-md);margin-bottom:var(--tokentweak-gap-sm)}[data-design-token-panel-modal] [class*=__title]{font-size:var(--tokentweak-text-subheading);font-weight:700;color:var(--tokentweak-color-fg)}[data-design-token-panel-modal] [class*=__hint]{font-size:var(--tokentweak-text-small);color:var(--tokentweak-color-muted);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__section-heading]{font-size:var(--tokentweak-text-small);font-weight:700;color:var(--tokentweak-color-fg);margin-top:var(--tokentweak-gap-sm);margin-bottom:var(--tokentweak-gap-2xs)}[data-design-token-panel-modal] [class*=__list]:not([class*=__list-item]){overflow-x:auto;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__list-item]{font-family:var(--tokentweak-font-mono)}[data-design-token-panel-modal] [class*=__actions]{display:flex;align-items:center;gap:var(--tokentweak-pad-md);margin-top:var(--tokentweak-gap-md)}[data-design-token-panel-modal] [class*=__toggle]{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-xs);font-size:var(--tokentweak-text-small);color:var(--tokentweak-color-fg);cursor:pointer;margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__textarea]{width:100%;min-height:192px;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-small);resize:vertical;margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__json]{overflow-x:auto;border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small);white-space:pre;font-family:var(--tokentweak-font-mono)}[data-design-token-panel-modal] [class*=__status]{font-size:var(--tokentweak-text-small);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__status--info]{color:var(--tokentweak-color-success)}[data-design-token-panel-modal] [class*=__status--error]{color:var(--tokentweak-color-danger)}[data-design-token-panel-modal] [class*=__status--warning]{color:var(--tokentweak-color-warning)}[data-design-token-panel-modal] [class*=__status--success]{color:var(--tokentweak-color-success)}[data-design-token-panel-modal] [class*=__applying]{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-muted);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small)}[data-design-token-panel-modal] [class*=__spinner]{display:inline-block;width:16px;height:16px;border:2px solid var(--tokentweak-color-muted);border-top-color:var(--tokentweak-color-fg);border-radius:50%;animation:design-token-panel-modal-spin .75s linear infinite}@keyframes design-token-panel-modal-spin{to{transform:rotate(360deg)}}[data-design-token-panel-modal] [class*=__revert-hint]{font-size:var(--tokentweak-text-small);font-style:italic;color:var(--tokentweak-color-muted);margin-top:var(--tokentweak-gap-sm);margin-bottom:var(--tokentweak-gap-2xs)}[data-design-token-panel-modal] [class*=__button]{border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-lg);padding-block:var(--tokentweak-gap-2xs);font-size:var(--tokentweak-text-small);cursor:pointer;transition:color .15s ease,border-color .15s ease,background-color .15s ease}[data-design-token-panel-modal] [class*=__button]:hover,[data-design-token-panel-modal] [class*=__button]:focus-visible{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg)}[data-design-token-panel-modal] [class*=__button]:disabled{cursor:not-allowed;opacity:.5}[data-design-token-panel-modal] [class*=__button--primary]{border-color:var(--tokentweak-color-accent);background-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-bg)}[data-design-token-panel-modal] [class*=__button--primary]:hover,[data-design-token-panel-modal] [class*=__button--primary]:focus-visible{border-color:var(--tokentweak-color-accent-hover);background-color:var(--tokentweak-color-accent-hover);color:var(--tokentweak-color-bg)}[data-design-token-panel-modal] [class*=__close-button]{border:1px solid var(--tokentweak-color-muted);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-sm);padding-block:var(--tokentweak-gap-2xs);font-size:var(--tokentweak-text-small);cursor:pointer;transition:color .15s ease,border-color .15s ease}[data-design-token-panel-modal] [class*=__close-button]:hover,[data-design-token-panel-modal] [class*=__close-button]:focus-visible{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg)}.tokenpanel-tier-ref-selector{flex:1;min-width:0}.tokenpanel-tier-ref-selector--grouped{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);flex-wrap:wrap}select.tokenpanel-tier-ref-select{width:100%;background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-muted);border-radius:var(--radius-tokentweak);padding-inline:var(--tokentweak-pad-sm);padding-block:4px;font-family:var(--tokentweak-font-mono);font-size:12px;cursor:pointer}.tokenpanel-tier-ref-selector--grouped>select.tokenpanel-tier-ref-select{flex:1;min-width:0;width:auto}select.tokenpanel-tier-ref-select:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-row-label-sub{display:block;font-size:var(--tokentweak-text-micro, 11px);color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);line-height:1.2}.tokenpanel-per-mode-toggle{display:inline-flex;align-items:center;gap:4px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.tokenpanel-per-mode-fields{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);flex-wrap:wrap}.tokenpanel-semantic-resolved-chip{width:18px;height:18px;flex-shrink:0;border:1px solid var(--tokentweak-color-muted);border-radius:3px;pointer-events:none}.tokenpanel-per-mode-field{display:inline-flex;align-items:center;gap:4px}.tokenpanel-per-mode-label{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;white-space:nowrap}.tokenpanel-tab-section-heading--with-help{display:inline-flex!important;align-items:center;gap:6px}.tokenpanel-tab-section [role=heading]{display:block}.tokenpanel-code{font-family:var(--tokentweak-font-mono);font-size:inherit;background:none;color:inherit;padding:0;border:none;border-radius:0;white-space:pre-wrap}[data-design-token-panel-modal] [class*=__button][aria-disabled=true]{cursor:not-allowed;opacity:.5;pointer-events:none}[data-design-token-panel-modal] [role=button]:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-action-link:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-close-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-tab-button:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-highlight-overlay{margin:0;padding:0;border:0;background:transparent;display:block}.tokenpanel-highlight-toggle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;color:var(--tokentweak-color-muted);cursor:pointer;vertical-align:middle;border-radius:2px;transition:background-color .15s ease,color .15s ease}.tokenpanel-highlight-toggle:hover{color:var(--tokentweak-color-fg);background-color:rgb(from var(--tokentweak-color-fg) r g b / .1)}.tokenpanel-highlight-toggle:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-highlight-toggle.is-active{opacity:1}:where(.tokenpanel-shell) svg{fill:currentColor!important;pointer-events:none;display:inline-block;overflow:visible}:where(.tokenpanel-shell) .tokenpanel-highlight-toggle svg{fill:none!important;stroke:currentColor}.tokenpanel-highlight-settings-popover{width:370px;background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-muted);border-radius:6px;box-shadow:0 8px 32px #00000080}.tokenpanel-highlight-settings-header{padding:10px 16px;border-bottom:1px solid var(--tokentweak-color-muted);font-weight:600;font-size:13px;color:var(--tokentweak-color-fg);display:flex;align-items:center;justify-content:space-between;gap:12px}.tokenpanel-highlight-settings-header-label{flex:1;min-width:0}.tokenpanel-highlight-settings-outline-control{display:flex;align-items:center;gap:4px;flex-shrink:0}.tokenpanel-highlight-settings-outline-input{width:44px;background:var(--tokentweak-color-bg);border:1px solid var(--tokentweak-color-muted);border-radius:3px;color:var(--tokentweak-color-fg);font-size:12px;font-variant-numeric:tabular-nums;padding:3px 6px;text-align:right}.tokenpanel-highlight-settings-outline-px{color:var(--tokentweak-color-muted);font-size:12px;font-weight:400}.tokenpanel-highlight-settings-list{padding:4px 0;display:grid;grid-template-columns:1fr 1fr}.tokenpanel-highlight-settings-row{display:grid;grid-template-columns:22px 32px 1fr;gap:8px;align-items:center;padding:8px 12px}.tokenpanel-highlight-settings-row:hover{background:rgb(from var(--tokentweak-color-fg) r g b / .03)}.tokenpanel-highlight-settings-num{color:var(--tokentweak-color-muted);font-variant-numeric:tabular-nums;text-align:right;font-size:11px}.tokenpanel-highlight-settings-ring{width:28px;height:28px;border-radius:3px;background:transparent;box-sizing:border-box;cursor:pointer;flex-shrink:0}.tokenpanel-highlight-settings-ring:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-highlight-settings-name{font-family:var(--tokentweak-font-mono);font-size:12px;color:var(--tokentweak-color-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-highlight-settings-name.is-active{color:var(--tokentweak-color-fg)}.tokenpanel-highlight-settings-footer{padding:12px 16px;border-top:1px solid var(--tokentweak-color-muted);display:flex;justify-content:flex-end;gap:var(--tokentweak-pad-sm)}.tokenpanel-highlight-settings-reset-btn{padding:6px 12px;background:var(--tokentweak-color-code-bg);border:1px solid var(--tokentweak-color-muted);border-radius:3px;cursor:pointer;font-size:12px;color:var(--tokentweak-color-fg);transition:background .15s ease}.tokenpanel-highlight-settings-reset-btn:hover{background:rgb(from var(--tokentweak-color-fg) r g b / .08)}.tokenpanel-highlight-settings-reset-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:3px}.tokenpanel-gear-btn{color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;transition:color .15s ease;display:inline-flex;align-items:center;justify-content:center}.tokenpanel-gear-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-gear-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-elpath-toggle,.tokenpanel-tweaker-toggle{color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;transition:color .15s ease;display:inline-flex;align-items:center;justify-content:center}.tokenpanel-elpath-toggle:hover,.tokenpanel-tweaker-toggle:hover{color:var(--tokentweak-color-fg)}.tokenpanel-elpath-toggle:focus-visible,.tokenpanel-tweaker-toggle:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-elpath-toggle.is-active,.tokenpanel-tweaker-toggle.is-active{color:var(--tokentweak-color-accent)}:where(.tokenpanel-shell) .tokenpanel-elpath-toggle svg,:where(.tokenpanel-shell) .tokenpanel-tweaker-toggle svg{fill:none!important;stroke:currentColor}html.tokenpanel-elpath-inspecting,html.tokenpanel-elpath-inspecting *{cursor:crosshair!important;-webkit-user-select:none!important;user-select:none!important}.tokenpanel-elpath-box{margin:0;padding:0;border:0;pointer-events:none;box-sizing:border-box;background:#6fa8dc40;outline:1px solid rgb(111 168 220 / .9);outline-offset:-1px;box-shadow:inset 0 0 0 1px #6fa8dce6}.tokenpanel-elpath-label{pointer-events:none;display:inline-flex;align-items:baseline;gap:8px;max-width:90vw;padding:2px 6px;border-radius:3px;background:var(--tokentweak-color-surface, #1c1c1c);color:var(--tokentweak-color-fg, #b8b8b8);font-family:var(--tokentweak-font-mono, Menlo, Monaco, Consolas, monospace);font-size:11px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 1px 3px #0006}.tokenpanel-elpath-label-name{color:var(--tokentweak-color-accent, #d69a66);font-weight:600;overflow:hidden;text-overflow:ellipsis}.tokenpanel-elpath-label-size{color:var(--tokentweak-color-muted, #888888);flex-shrink:0}.tokenpanel-elpath-toast{pointer-events:none;display:inline-flex;align-items:center;gap:8px;margin:12px auto 0;padding:8px 14px;border-radius:6px;background:var(--tokentweak-color-surface, #1c1c1c);color:var(--tokentweak-color-fg, #b8b8b8);font-family:var(--tokentweak-font-mono, Menlo, Monaco, Consolas, monospace);font-size:12px;line-height:1.4;max-width:min(90vw,520px);box-shadow:0 4px 16px #00000073;border:1px solid rgb(255 255 255 / .08)}.tokenpanel-elpath-toast .tokenpanel-elpath-toast-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-elpath-toast svg{flex-shrink:0;fill:none!important;stroke:var(--tokentweak-color-success, #93bb77);pointer-events:none;display:inline-block;overflow:visible}.tokenpanel-elpath-toast.is-error svg{stroke:var(--tokentweak-color-danger, #da6871)}.tokenpanel-row-number-input:focus-visible,.tokenpanel-row-text-input:focus-visible,.tokenpanel-row-select:focus-visible,.tokenpanel-color-preset-select:focus-visible,.tokenpanel-density-slider:focus-visible,.tokenpanel-pill-toggle-checkbox:focus-visible,.tokenpanel-highlight-settings-outline-input:focus-visible,[data-design-token-panel-modal] [class*=__textarea]:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-close-btn{position:relative}.tokenpanel-close-btn:after{content:"";position:absolute;inset:-4px}.tokenpanel-gear-btn{position:relative}.tokenpanel-gear-btn:after{content:"";position:absolute;inset:-5px}.tokenpanel-elpath-toggle,.tokenpanel-tweaker-toggle{position:relative}.tokenpanel-elpath-toggle:after,.tokenpanel-tweaker-toggle:after{content:"";position:absolute;inset:-4px}.tokenpanel-highlight-toggle{position:relative}.tokenpanel-highlight-toggle:after{content:"";position:absolute;inset:-4px}.tokenpanel-resize-handle{overflow:visible}.tokenpanel-resize-handle:after{content:"";position:absolute;inset:-4px;cursor:nwse-resize}@media(prefers-reduced-motion:reduce){[data-design-token-panel-modal] [class*=__spinner]{animation:design-token-panel-modal-pulse 1.5s ease-in-out infinite}@keyframes design-token-panel-modal-pulse{0%,to{opacity:1}50%{opacity:.4}}.tokenpanel-tooltip{transform:none;transition:opacity 90ms ease}.tokenpanel-tooltip[data-show=true]{transform:none}}
+:where(.tokenpanel-shell,.tokenpanel-mini-pill,[data-design-token-panel-modal],.tokenpanel-highlight-settings-popover,.tokenpanel-chain-popover,.tokenpanel-color-picker,.tokenpanel-tooltip,.tokenpanel-elpath-label,.tokenpanel-elpath-toast,.tokenpanel-element-inspect-box,.tokenpanel-element-inspect-label,.tokenpanel-element-inspect-view){color-scheme:dark;--tokentweak-palette-base-0: oklch(.18 0 0);--tokentweak-palette-base-1: oklch(.25 0 0);--tokentweak-palette-base-2: oklch(.34 0 0);--tokentweak-palette-base-3: oklch(.536 0 0);--tokentweak-palette-base-4: oklch(.66 0 0);--tokentweak-palette-base-5: oklch(.8 0 0);--tokentweak-palette-base-6: oklch(.91 0 0);--tokentweak-color-fg: var(--tokentweak-palette-base-5);--tokentweak-color-bg: var(--tokentweak-palette-base-0);--tokentweak-color-muted: var(--tokentweak-palette-base-4);--tokentweak-color-border: var(--tokentweak-palette-base-3);--tokentweak-color-surface: var(--tokentweak-palette-base-1);--tokentweak-color-accent: #d69a66;--tokentweak-color-accent-bar: #efb477;--tokentweak-color-accent-hover: #a7c0e3;--tokentweak-color-code-bg: var(--tokentweak-palette-base-2);--tokentweak-color-code-fg: var(--tokentweak-palette-base-6);--tokentweak-color-success: #93bb77;--tokentweak-color-danger: #da6871;--tokentweak-color-warning: #dfbb77;--tokentweak-font-mono: Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;--tokentweak-pad-2xs: 2px;--tokentweak-pad-xs: 6px;--tokentweak-pad-sm: 8px;--tokentweak-pad-md: 12px;--tokentweak-pad-lg: 16px;--tokentweak-pad-xl: 24px;--tokentweak-pad-2xl: 32px;--tokentweak-gap-2xs: 7px;--tokentweak-gap-xs: 14px;--tokentweak-gap-sm: 20px;--tokentweak-gap-md: 24px;--tokentweak-gap-lg: 28px;--tokentweak-gap-xl: 40px;--tokentweak-gap-2xl: 56px;--tokentweak-text-micro: 12px;--tokentweak-text-caption: 14px;--tokentweak-text-small: 16px;--tokentweak-text-body: 19px;--tokentweak-text-subheading: 22px;--tokentweak-text-heading: 48px;--tokentweak-text-display: 60px;--radius-tokentweak: 4px;--tokentweak-z-overlay: 2147482990;--tokentweak-z-shell: 2147482991;--tokentweak-z-settings-popover: 2147482992;--tokentweak-z-color-picker: 2147482993;--tokentweak-z-tooltip: 2147482994;--tokentweak-z-command-palette: 2147482995;--tokentweak-z-inspector-box: 2147483000;--tokentweak-z-toast: 2147483001}.tokenpanel-color-picker{position:fixed;width:320px;padding:var(--tokentweak-pad-md);background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);box-shadow:0 8px 24px #0006;display:flex;flex-direction:column;gap:var(--tokentweak-gap-2xs);z-index:var(--tokentweak-z-color-picker);color:var(--tokentweak-color-fg);font-size:var(--tokentweak-text-caption)}.tokenpanel-color-picker[data-mode-shell=expanded]{width:520px;padding:var(--tokentweak-pad-lg);gap:var(--tokentweak-gap-xs)}.tokenpanel-color-picker-header{display:flex;align-items:center;gap:var(--tokentweak-gap-2xs)}.tokenpanel-color-picker-drag-handle{flex-shrink:0;cursor:grab;color:var(--tokentweak-color-muted);font-size:var(--tokentweak-text-caption);line-height:1;padding:var(--tokentweak-pad-2xs);border-radius:var(--radius-tokentweak);-webkit-user-select:none;user-select:none;touch-action:none}.tokenpanel-color-picker-drag-handle:hover{color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-drag-handle:active{cursor:grabbing}.tokenpanel-color-picker-label{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-caption)}.tokenpanel-color-picker-mode-toggle{display:flex;align-items:center;gap:2px;background:var(--tokentweak-color-bg);border:1px solid var(--tokentweak-color-border);border-radius:999px;padding:2px;flex-shrink:0}.tokenpanel-color-picker-mode-btn{border-radius:999px;padding-inline:var(--tokentweak-pad-xs);padding-block:var(--tokentweak-pad-2xs);font-size:var(--tokentweak-text-micro);color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .12s ease,color .12s ease;white-space:nowrap}.tokenpanel-color-picker-mode-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-mode-btn[aria-pressed=true]{background-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-mode-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-expand-btn{flex-shrink:0;color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none;padding:var(--tokentweak-pad-2xs);border-radius:var(--radius-tokentweak);transition:color .12s ease}.tokenpanel-color-picker-expand-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-expand-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-close-btn{position:relative;flex-shrink:0;min-width:16px;color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none;padding:var(--tokentweak-pad-2xs);border-radius:var(--radius-tokentweak);text-align:center;transition:color .12s ease}.tokenpanel-color-picker-close-btn:after{content:"";position:absolute;inset:-4px}.tokenpanel-color-picker-close-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-close-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-top-row{display:flex;align-items:center;gap:var(--tokentweak-gap-2xs)}.tokenpanel-color-picker-preview{position:relative;flex-shrink:0;width:48px;height:48px;border-radius:var(--radius-tokentweak);border:1px solid var(--tokentweak-color-border);overflow:hidden}.tokenpanel-color-picker-preview-checkerboard{position:absolute;inset:0;background-image:repeating-conic-gradient(gray 0% 25%,silver 0% 50%);background-size:10px 10px}.tokenpanel-color-picker-preview-color{position:absolute;inset:0}.tokenpanel-color-picker-hex-input{flex:1;min-width:0;font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-caption);background:var(--tokentweak-color-bg);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);padding:var(--tokentweak-pad-2xs) var(--tokentweak-pad-xs);transition:border-color .12s ease}.tokenpanel-color-picker-hex-input:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-hex-input:focus-visible{border-color:var(--tokentweak-color-accent);outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:2px}.tokenpanel-color-picker-grid>[role=row]{display:contents}.tokenpanel-color-picker[data-mode-shell=expanded] .tokenpanel-color-picker-grid{grid-template-columns:repeat(12,1fr)}.tokenpanel-color-picker-grid-cell{position:relative;aspect-ratio:1;border-radius:var(--radius-tokentweak);cursor:pointer;transition:box-shadow .12s ease}.tokenpanel-color-picker-grid-cell:hover{box-shadow:0 0 0 2px var(--tokentweak-color-fg)}.tokenpanel-color-picker-grid-cell[aria-selected=true]{box-shadow:0 0 0 2px var(--tokentweak-color-accent)}.tokenpanel-color-picker-grid-cell:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-picker-grid-cell[data-oog=true]:after{content:"";position:absolute;inset:1px;border:1px dashed oklch(98% 0 0 / .4);border-radius:var(--radius-tokentweak);pointer-events:none}.tokenpanel-color-picker-sliders{display:flex;flex-direction:column;gap:var(--tokentweak-gap-2xs)}.tokenpanel-color-picker-slider-row{display:flex;align-items:center;gap:var(--tokentweak-gap-2xs)}.tokenpanel-color-picker-slider-label{flex-shrink:0;width:20px;font-size:var(--tokentweak-text-micro);color:var(--tokentweak-color-muted);-webkit-user-select:none;user-select:none}.tokenpanel-color-picker-slider{flex:1;position:relative;height:24px;display:flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;touch-action:none}.tokenpanel-color-picker-slider:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:var(--radius-tokentweak)}.tokenpanel-color-picker-slider-track{width:100%;height:18px;border-radius:9px;overflow:hidden;border:1px solid var(--tokentweak-color-border)}.tokenpanel-color-picker-slider-thumb{position:absolute;top:50%;transform:translate(-50%,-50%);width:14px;height:14px;border-radius:50%;background:var(--tokentweak-color-fg);border:2px solid var(--tokentweak-color-bg);box-shadow:0 0 0 1px var(--tokentweak-color-border);pointer-events:none}.tokenpanel-color-picker-slider-value{flex-shrink:0;width:48px;text-align:right;font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-micro);color:var(--tokentweak-color-fg)}.tokenpanel-color-picker-readout{display:none;font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-micro);color:var(--tokentweak-color-muted);padding-top:var(--tokentweak-pad-2xs);border-top:1px solid var(--tokentweak-color-border);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tokenpanel-color-picker[data-mode-shell=expanded] .tokenpanel-color-picker-readout{display:block}.tokenpanel-palette-chart svg{fill:currentColor;overflow:visible}.tokenpanel-palette-chart{position:relative;width:100%;height:280px;border-radius:var(--radius-tokentweak);overflow:hidden;touch-action:none}.tokenpanel-palette-chart-bands{position:absolute;inset:0;display:block;width:100%;height:100%}.tokenpanel-palette-chart-band.is-invalid{fill:var(--tokentweak-color-surface);stroke:var(--tokentweak-color-muted);stroke-dasharray:4 3;stroke-width:1;vector-effect:non-scaling-stroke}.tokenpanel-palette-chart-curve{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none;overflow:visible}.tokenpanel-palette-chart-hit-line{fill:none;pointer-events:stroke;cursor:grab}.tokenpanel-palette-chart-hit-line:active{cursor:grabbing}.tokenpanel-palette-chart-line{fill:none}.tokenpanel-palette-chart-curve--l .tokenpanel-palette-chart-line{stroke:var(--tokentweak-color-accent)}.tokenpanel-palette-chart-curve--c .tokenpanel-palette-chart-line{stroke:var(--tokentweak-color-success)}.tokenpanel-palette-chart-curve--h .tokenpanel-palette-chart-line{stroke:var(--tokentweak-color-warning)}.tokenpanel-palette-chart-node-visual{fill:var(--tokentweak-color-bg)}.tokenpanel-palette-chart-node-visual.is-readonly{stroke-dasharray:2 2}.tokenpanel-palette-chart-curve--l .tokenpanel-palette-chart-node-visual{stroke:var(--tokentweak-color-accent)}.tokenpanel-palette-chart-curve--c .tokenpanel-palette-chart-node-visual{stroke:var(--tokentweak-color-success)}.tokenpanel-palette-chart-curve--h .tokenpanel-palette-chart-node-visual{stroke:var(--tokentweak-color-warning)}.tokenpanel-palette-chart-node-hit{pointer-events:all;cursor:grab;outline:none}.tokenpanel-palette-chart-node-hit:active{cursor:grabbing}.tokenpanel-palette-chart-node-hit:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-palette-chart-readonly-blocker{pointer-events:all;cursor:default}.tokenpanel-palette-chart-blockers{position:absolute;inset:0;display:block;width:100%;height:100%;pointer-events:none}.tokenpanel-palette-edit-view{display:flex;flex-direction:column;gap:14px}.tokenpanel-palette-edit-group{border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);overflow:hidden}.tokenpanel-palette-edit-group-header{display:flex;align-items:center;gap:8px;padding:8px 10px;cursor:pointer;-webkit-user-select:none;user-select:none}.tokenpanel-palette-edit-group-header:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:-2px}.tokenpanel-palette-edit-group.is-active .tokenpanel-palette-edit-group-header{border-bottom:1px solid var(--tokentweak-color-border)}.tokenpanel-palette-edit-group-chevron{flex:none;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;color:var(--tokentweak-color-muted);transform:rotate(-90deg);transition:transform .15s ease}.tokenpanel-palette-edit-group-chevron.is-open{transform:rotate(0)}.tokenpanel-palette-edit-group-heading{flex:1 1 auto;min-width:0;margin:0;color:var(--tokentweak-color-fg);font-family:inherit;font-weight:600;font-size:13px;line-height:20px;text-transform:none;letter-spacing:normal;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-palette-edit-group-preview{flex:none;display:flex;align-items:center;gap:3px}.tokenpanel-palette-edit-preview-chip{width:12px;height:12px;border-radius:3px;border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .12);pointer-events:none}.tokenpanel-palette-edit-preview-chip.is-invalid,.tokenpanel-palette-edit-swatch[data-invalid],.tokenpanel-palette-readout-swatch.is-invalid{background-color:var(--tokentweak-color-surface);background-image:repeating-linear-gradient(135deg,transparent 0 4px,rgb(from var(--tokentweak-color-muted) r g b / .25) 4px 6px)}.tokenpanel-palette-edit-group-body{display:flex;flex-direction:column;gap:8px;padding:10px}.tokenpanel-palette-edit-swatches{display:flex;gap:4px}.tokenpanel-palette-edit-swatch{position:relative;flex:1 1 0;height:30px;border-radius:var(--radius-tokentweak);border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .08);outline:0 solid transparent;cursor:pointer;transition:outline-width .08s ease}.tokenpanel-palette-edit-swatch.is-selected{outline:2px solid var(--tokentweak-color-accent);outline-offset:1px}.tokenpanel-palette-edit-swatch:focus-visible{outline:2px solid var(--tokentweak-color-accent-hover);outline-offset:1px}.tokenpanel-palette-edit-swatch.is-readonly{border-style:double;border-width:3px}.tokenpanel-palette-edit-swatch-lock{position:absolute;inset:2px 2px auto auto;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:var(--radius-tokentweak);color:var(--tokentweak-color-fg);background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-border);pointer-events:none}.tokenpanel-palette-edit-swatch-lock svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.tokenpanel-palette-edit-swatch[data-out-of-gamut]{border-style:dashed;border-color:var(--tokentweak-color-danger);border-width:2px}.tokenpanel-palette-edit-swatch[data-invalid]{border-style:dashed;border-color:var(--tokentweak-color-border)}.tokenpanel-palette-edit-swatch-idx{position:absolute;inset:auto 0 2px;text-align:center;font-size:9px;color:#0000008c;text-shadow:0 0 2px rgba(255,255,255,.4);pointer-events:none}.tokenpanel-palette-edit-editor{border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);background:var(--tokentweak-color-surface)}.tokenpanel-palette-edit-editor-bar{display:flex;align-items:center;gap:8px;padding:8px 10px;border-bottom:1px solid var(--tokentweak-color-border)}.tokenpanel-palette-edit-editor-title{flex:1 1 auto;font-size:11px;color:var(--tokentweak-color-muted)}.tokenpanel-palette-edit-channels{display:flex;gap:3px}.tokenpanel-palette-edit-channel{padding:4px 9px;font-size:11px;font-weight:650;border-radius:var(--radius-tokentweak);border:1px solid var(--tokentweak-color-border);color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none}.tokenpanel-palette-edit-channel:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:1px}.tokenpanel-palette-edit-channel--l.is-on{border-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-accent)}.tokenpanel-palette-edit-channel--c.is-on{border-color:var(--tokentweak-color-success);color:var(--tokentweak-color-success)}.tokenpanel-palette-edit-channel--h.is-on{border-color:var(--tokentweak-color-warning);color:var(--tokentweak-color-warning)}.tokenpanel-palette-edit-direct{display:flex;align-items:center;gap:8px;padding:8px 10px;border-top:1px solid var(--tokentweak-color-border)}.tokenpanel-palette-edit-direct-hint{font-size:11px;color:var(--tokentweak-color-muted)}.tokenpanel-palette-readout{display:flex;gap:10px;align-items:center;padding:8px 10px 10px;border-top:1px solid var(--tokentweak-color-border)}.tokenpanel-palette-readout-swatch{flex:none;width:40px;height:40px;border-radius:var(--radius-tokentweak);border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .12)}.tokenpanel-palette-readout-rows{font-family:var(--tokentweak-font-mono);font-size:10.5px;color:var(--tokentweak-color-fg);line-height:1.5}.tokenpanel-palette-readout-key{display:inline-block;width:42px;color:var(--tokentweak-color-muted);font-weight:600}.tokenpanel-palette-readout-gamut{margin-top:4px;color:var(--tokentweak-color-danger);font-size:10px}.tokenpanel-palette-mode-toggle{display:inline-flex;align-self:flex-start;border:1px solid var(--tokentweak-color-border);border-radius:6px;overflow:hidden}.tokenpanel-palette-mode-btn{padding:4px 16px;font-size:12px;line-height:20px;color:var(--tokentweak-color-muted);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .15s ease,color .15s ease}.tokenpanel-palette-mode-btn+.tokenpanel-palette-mode-btn{border-left:1px solid var(--tokentweak-color-border)}.tokenpanel-palette-mode-btn:hover{color:var(--tokentweak-color-fg);background-color:rgb(from var(--tokentweak-color-fg) r g b / .06)}.tokenpanel-palette-mode-btn.is-active{background-color:rgb(from var(--tokentweak-color-accent) r g b / .16);color:var(--tokentweak-color-accent);font-weight:600}.tokenpanel-palette-mode-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:-2px}.tokenpanel-palette-check-view{display:flex;flex-direction:column;gap:var(--tokentweak-gap-xs)}.tokenpanel-palette-check-toolbar{display:flex;align-items:center;gap:20px}.tokenpanel-palette-check-switch{display:inline-flex;align-items:center;gap:5px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.tokenpanel-palette-check-switch input[type=checkbox]{accent-color:var(--tokentweak-color-accent);margin:0}.tokenpanel-palette-check-switch:hover{color:var(--tokentweak-color-fg)}.tokenpanel-palette-check-cols{display:grid;grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:var(--tokentweak-gap-xs);align-items:start}.tokenpanel-palette-check-col{display:flex;flex-direction:column;gap:18px;min-width:0}.tokenpanel-palette-check-col-cap{margin-bottom:-6px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;letter-spacing:0;text-transform:uppercase}.tokenpanel-palette-check-base-row{display:flex;align-items:center;gap:8px;padding:4px 8px;margin-inline:-8px;border:1px solid transparent;border-radius:var(--radius-tokentweak);cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .12s ease,border-color .12s ease}.tokenpanel-palette-check-base-row:hover{background-color:rgb(from var(--tokentweak-color-fg) r g b / .06)}.tokenpanel-palette-check-base-row:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:-2px}.tokenpanel-palette-check-base-row.is-selected{border-color:var(--tokentweak-color-accent);background-color:rgb(from var(--tokentweak-color-accent) r g b / .12)}.tokenpanel-palette-check-base-row.is-selected .tokenpanel-palette-check-row-name{color:var(--tokentweak-color-accent)}.tokenpanel-palette-check-base-row.is-disabled{cursor:not-allowed;border-style:dashed}.tokenpanel-palette-check-base-row.is-disabled:hover{background-color:transparent}.tokenpanel-palette-check-swatch{flex-shrink:0;width:18px;height:18px;border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .16);border-radius:var(--radius-tokentweak)}.tokenpanel-palette-check-swatch.is-invalid,.tokenpanel-palette-check-aa-sample.is-invalid{background-color:var(--tokentweak-color-surface);background-image:repeating-linear-gradient(135deg,transparent 0 4px,rgb(from var(--tokentweak-color-muted) r g b / .25) 4px 6px)}.tokenpanel-palette-check-row-name{flex:1;min-width:0;overflow:hidden;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:12px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-palette-check-row-value{color:var(--tokentweak-color-muted);font-size:10px;overflow:hidden;text-overflow:ellipsis}.tokenpanel-palette-check-na{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px}.tokenpanel-palette-check-candidate-row{display:flex;align-items:center;gap:8px;padding:3px 0}.tokenpanel-palette-check-aa-sample{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:36px;height:24px;border:1px solid rgb(from var(--tokentweak-color-fg) r g b / .12);border-radius:var(--radius-tokentweak);font-size:12px;font-weight:600}.tokenpanel-palette-check-ratio{flex-shrink:0;width:38px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:12px;font-variant-numeric:tabular-nums;text-align:right}.tokenpanel-palette-check-chip{flex-shrink:0;min-width:36px;padding:2px 7px;border-radius:999px;color:#fff;font-family:var(--tokentweak-font-mono);font-size:10px;font-weight:700;letter-spacing:0;text-align:center}.tokenpanel-palette-check-chip.is-na{border:1px dashed var(--tokentweak-color-border);color:var(--tokentweak-color-muted)}.tokenpanel-palette-check-footer{padding-top:12px;border-top:1px solid rgb(from var(--tokentweak-color-border) r g b / .35);color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:12px}.tokenpanel-palette-check-tally-count,.tokenpanel-palette-check-tally-total{color:var(--tokentweak-color-fg);font-weight:700}.tokenpanel-palette-check-tally-mode{color:var(--tokentweak-color-fg)}.tokenpanel-palette-check-tally-base{color:var(--tokentweak-color-accent)}.tokenpanel-specimen-toolbar{display:flex;align-items:center;flex-wrap:wrap;gap:var(--tokentweak-pad-sm);color:var(--tokentweak-color-muted);font-size:12px}.tokenpanel-specimen-field{display:flex;align-items:center;flex:1 1 280px;min-width:0;gap:var(--tokentweak-pad-sm);padding:2px 8px;border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);background:var(--tokentweak-color-bg)}.tokenpanel-specimen-field-label{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase}.tokenpanel-specimen-text-input{flex:1;min-width:0;border:0;outline:0;background:transparent;color:var(--tokentweak-color-fg);font:inherit}.tokenpanel-specimen-presets{display:inline-flex;overflow:hidden;border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak)}.tokenpanel-specimen-preset{padding:3px 8px;color:var(--tokentweak-color-muted);cursor:pointer}.tokenpanel-specimen-preset:hover,.tokenpanel-specimen-preset:focus-visible{color:var(--tokentweak-color-accent)}.tokenpanel-specimen-preset:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:-2px}.tokenpanel-specimen-preset.is-active{color:var(--tokentweak-color-fg);background:var(--tokentweak-color-surface)}.tokenpanel-specimen-width{display:flex;align-items:center;gap:var(--tokentweak-pad-sm)}.tokenpanel-specimen-width input{width:90px;accent-color:var(--tokentweak-color-accent)}.tokenpanel-specimen-width-value{min-width:40px;font-family:var(--tokentweak-font-mono)}.tokenpanel-specimen-on-page-toggle{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);color:var(--tokentweak-color-fg);cursor:pointer;-webkit-user-select:none;user-select:none}.tokenpanel-specimen-on-page-toggle input{accent-color:var(--tokentweak-color-accent)}.tokenpanel-row--specimen-compact .tokenpanel-specimen-size-text,.tokenpanel-row--specimen-compact .tokenpanel-specimen-line-height-text{display:none}.tokenpanel-on-page-specimen{display:block;box-sizing:border-box;margin:0 0 24px;padding:14px 18px;border:1px dashed var(--tokentweak-color-accent, currentColor);border-radius:8px;background:Canvas;color:inherit;font:inherit}.tokenpanel-on-page-specimen-heading{display:flex;align-items:baseline;justify-content:space-between;gap:var(--tokentweak-pad-md, 12px);margin-bottom:var(--tokentweak-pad-sm, 8px);color:var(--tokentweak-color-accent, currentColor);font:11px/1.4 var(--tokentweak-font-mono, monospace);letter-spacing:.06em;text-transform:uppercase}.tokenpanel-on-page-specimen-heading>span:last-child{color:var(--tokentweak-color-muted, currentColor);text-align:right}.tokenpanel-on-page-specimen-section+.tokenpanel-on-page-specimen-section{margin-top:var(--tokentweak-pad-md, 12px)}.tokenpanel-on-page-specimen-section-label{margin-bottom:var(--tokentweak-pad-2xs, 2px);color:var(--tokentweak-color-muted, currentColor);font:10px/1.4 var(--tokentweak-font-mono, monospace);letter-spacing:.06em;text-transform:uppercase}.tokenpanel-on-page-specimen-row{display:grid;grid-template-columns:minmax(130px,150px) minmax(0,1fr);align-items:center;gap:var(--tokentweak-pad-md, 12px);min-width:0;padding:5px 0;border-bottom:1px dashed color-mix(in srgb,currentColor 20%,transparent)}.tokenpanel-on-page-specimen-row:last-child{border-bottom:0}.tokenpanel-on-page-specimen-meta{display:flex;min-width:0;flex-direction:column;overflow:hidden;color:var(--tokentweak-color-muted, currentColor);font:11px/1.35 var(--tokentweak-font-mono, monospace);white-space:nowrap;text-overflow:ellipsis}.tokenpanel-on-page-specimen-meta>span{overflow:hidden;text-overflow:ellipsis}.tokenpanel-on-page-specimen-meta>span+span{color:var(--tokentweak-color-accent-hover, currentColor);font-size:10px}.tokenpanel-on-page-specimen-size-text,.tokenpanel-on-page-specimen-line-height-text{min-width:0;overflow:hidden;text-overflow:ellipsis}.tokenpanel-on-page-specimen-size-text{line-height:1.15;white-space:nowrap}.tokenpanel-on-page-specimen-line-height-text{max-width:100%;overflow:hidden;padding:0 var(--tokentweak-pad-sm, 8px);border-radius:3px;background-color:color-mix(in srgb,currentColor 3%,transparent);background-image:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--tokenpanel-specimen-line) - 1px),color-mix(in srgb,currentColor 45%,transparent) calc(var(--tokenpanel-specimen-line) - 1px),color-mix(in srgb,currentColor 45%,transparent) var(--tokenpanel-specimen-line));background-origin:content-box}@media(max-width:620px){.tokenpanel-on-page-specimen-row{grid-template-columns:minmax(110px,130px) minmax(0,1fr);gap:var(--tokentweak-pad-sm, 8px)}}.tokenpanel-row--specimen-size .tokenpanel-row-head,.tokenpanel-row--specimen-line-height .tokenpanel-row-head,.tokenpanel-row.tokenpanel-row--specimen-size{display:grid;grid-template-columns:13px minmax(120px,150px) minmax(0,1fr) auto repeat(3,auto);align-items:center;column-gap:var(--tokentweak-pad-xs);row-gap:var(--tokentweak-pad-xs);min-width:0;width:100%}.tokenpanel-row--specimen-size .tokenpanel-row-label,.tokenpanel-row--specimen-line-height .tokenpanel-row-label,.tokenpanel-row.tokenpanel-row--specimen-size>.tokenpanel-row-label{display:none}.tokenpanel-specimen-size-leading,.tokenpanel-specimen-line-height-leading{display:contents}.tokenpanel-row--specimen-size .tokenpanel-bulk-row-checkbox,.tokenpanel-row--specimen-line-height .tokenpanel-bulk-row-checkbox{grid-column:1}.tokenpanel-row--specimen-size .tokenpanel-specimen-meta,.tokenpanel-row--specimen-line-height .tokenpanel-specimen-meta{grid-column:2}.tokenpanel-row--specimen-size .tokenpanel-specimen-size-text,.tokenpanel-row--specimen-line-height .tokenpanel-specimen-line-height-text{grid-column:3}.tokenpanel-row--specimen-size .tokenpanel-row-input-group,.tokenpanel-row--specimen-line-height .tokenpanel-row-input-group,.tokenpanel-row.tokenpanel-row--specimen-size>.tokenpanel-row-select,.tokenpanel-row.tokenpanel-row--specimen-size>.tokenpanel-tier-ref-selector{grid-column:4}.tokenpanel-row--specimen-size .tokenpanel-row-number-input,.tokenpanel-row--specimen-line-height .tokenpanel-row-number-input{width:64px}.tokenpanel-row--specimen-size .tokenpanel-row-unit,.tokenpanel-row--specimen-line-height .tokenpanel-row-unit{width:28px}.tokenpanel-row--specimen-size .tokenpanel-changed-revert,.tokenpanel-row--specimen-line-height .tokenpanel-changed-revert{grid-column:5}.tokenpanel-row--specimen-size .tokenpanel-chain-button,.tokenpanel-row--specimen-line-height .tokenpanel-chain-button{grid-column:6}.tokenpanel-row--specimen-size .tokenpanel-highlight-toggle,.tokenpanel-row--specimen-line-height .tokenpanel-highlight-toggle{grid-column:7}.tokenpanel-row--specimen-size :is(.tokenpanel-bulk-preview,.tokenpanel-changed-tail),.tokenpanel-row--specimen-line-height :is(.tokenpanel-bulk-preview,.tokenpanel-changed-tail){grid-column:2 / -1}.tokenpanel-specimen-meta{display:flex;min-width:0;flex-direction:column;overflow:hidden;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:11px;white-space:nowrap;text-overflow:ellipsis}.tokenpanel-specimen-meta span{overflow:hidden;text-overflow:ellipsis}.tokenpanel-specimen-meta span+span{color:var(--tokentweak-color-accent-hover);font-size:10px}.tokenpanel-specimen-size-text{min-width:0;overflow:hidden;color:var(--tokentweak-color-fg);line-height:1.15;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-row--specimen-line-height .tokenpanel-row-head{align-items:start}.tokenpanel-specimen-line-height-text{max-width:100%;overflow:hidden;padding:0 8px;border-radius:3px;background-color:rgb(from var(--tokentweak-color-fg) r g b / .03);background-image:repeating-linear-gradient(to bottom,transparent 0,transparent calc(var(--tokenpanel-specimen-line) - 1px),rgb(from var(--tokentweak-color-accent) r g b / .45) calc(var(--tokenpanel-specimen-line) - 1px),rgb(from var(--tokentweak-color-accent) r g b / .45) var(--tokenpanel-specimen-line));background-origin:content-box;color:var(--tokentweak-color-fg)}.tokenpanel-preview-glyph{position:relative;display:inline-flex;width:52px;height:26px;flex-shrink:0;align-items:center;justify-content:center;overflow:hidden}.tokenpanel-preview-glyph--bar{width:72px;justify-content:flex-start}.tokenpanel-preview-glyph--bar>span{max-width:70px;height:6px;border-radius:1px;background:var(--tokentweak-color-accent)}.tokenpanel-preview-glyph--radius>span{width:22px;height:22px;border:2px solid var(--tokentweak-color-accent)}.tokenpanel-preview-glyph-track{position:absolute;right:3px;left:3px;height:1px;background:var(--tokentweak-color-muted)}.tokenpanel-preview-glyph-dot{position:absolute;left:3px;width:8px;height:8px;border-radius:50%;background:var(--tokentweak-color-accent);transition-property:transform;transition-timing-function:ease}.tokenpanel-preview-glyph--duration:hover .tokenpanel-preview-glyph-dot{transform:translate(38px)}@container tokenpanel (max-width: 620px){.tokenpanel-row--specimen-size .tokenpanel-row-head,.tokenpanel-row--specimen-line-height .tokenpanel-row-head,.tokenpanel-row.tokenpanel-row--specimen-size{grid-template-columns:13px minmax(110px,145px) minmax(0,1fr) auto repeat(3,auto);column-gap:var(--tokentweak-pad-sm)}.tokenpanel-row--specimen-size .tokenpanel-row-number-input,.tokenpanel-row--specimen-line-height .tokenpanel-row-number-input{width:80px}.tokenpanel-row--specimen-size .tokenpanel-row-unit,.tokenpanel-row--specimen-line-height .tokenpanel-row-unit{width:32px}}.tokenpanel-element-inspect-toggle{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;padding:0;border:0;background:none;color:var(--tokentweak-color-muted);cursor:pointer;transition:color .15s ease,background-color .15s ease}.tokenpanel-element-inspect-toggle:hover,.tokenpanel-element-inspect-toggle:focus-visible{color:var(--tokentweak-color-fg)}.tokenpanel-element-inspect-toggle.is-active{color:var(--tokentweak-color-accent);background:rgb(from var(--tokentweak-color-accent) r g b / .12);border-radius:3px}.tokenpanel-element-inspect-toggle:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-element-inspect-toggle:after{content:"";position:absolute;inset:-4px}html.tokenpanel-element-inspect-inspecting,html.tokenpanel-element-inspect-inspecting *{cursor:crosshair!important;-webkit-user-select:none!important;user-select:none!important}.tokenpanel-element-inspect-box{box-sizing:border-box!important;margin:0!important;padding:0!important;border:0!important;display:block!important;background:rgb(from var(--tokentweak-color-accent-hover) r g b / .25);outline:1px solid rgb(from var(--tokentweak-color-accent-hover) r g b / .9);outline-offset:-1px;box-shadow:inset 0 0 0 1px rgb(from var(--tokentweak-color-accent-hover) r g b / .9);pointer-events:none}.tokenpanel-element-inspect-box.is-pinned{background:transparent;outline-style:dashed;outline-color:var(--tokentweak-color-accent);box-shadow:inset 0 0 0 1px var(--tokentweak-color-accent)}.tokenpanel-element-inspect-label{box-sizing:border-box!important;display:inline-flex!important;align-items:baseline;gap:var(--tokentweak-pad-sm, 8px);max-width:90vw;margin:0!important;padding:2px 6px!important;border-radius:3px;background:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono, monospace);font-size:11px;line-height:1.4;white-space:nowrap;overflow:hidden;box-shadow:0 1px 3px rgb(from var(--tokentweak-color-bg) r g b / .4);pointer-events:none}.tokenpanel-element-inspect-label.is-pinned{background:var(--tokentweak-color-accent);color:var(--tokentweak-color-bg)}.tokenpanel-element-inspect-label-name{overflow:hidden;color:var(--tokentweak-color-accent);font-weight:600;text-overflow:ellipsis}.tokenpanel-element-inspect-label.is-pinned .tokenpanel-element-inspect-label-name{color:var(--tokentweak-color-bg)}.tokenpanel-element-inspect-label-size{flex-shrink:0;color:var(--tokentweak-color-muted)}.tokenpanel-element-inspect-label.is-pinned .tokenpanel-element-inspect-label-size{color:var(--tokentweak-color-bg)}.tokenpanel-element-inspect-view{display:flex;flex-direction:column;gap:var(--tokentweak-gap-md);color:var(--tokentweak-color-fg)}.tokenpanel-element-inspect-breadcrumb{display:flex;align-items:center;flex-wrap:wrap;gap:4px;min-height:24px;margin-block:calc(var(--tokentweak-pad-sm) * -1);font-family:var(--tokentweak-font-mono);font-size:12px}.tokenpanel-element-inspect-pinned-label{color:var(--tokentweak-color-muted);font-size:10px;letter-spacing:.04em;text-transform:uppercase}.tokenpanel-element-inspect-crumb,.tokenpanel-element-inspect-clear,.tokenpanel-element-inspect-jump{position:relative;min-height:22px;padding:2px 8px;border:1px solid var(--tokentweak-color-border);border-radius:3px;background:none;color:var(--tokentweak-color-muted);cursor:pointer;font:inherit;font-size:11px;white-space:nowrap}.tokenpanel-element-inspect-crumb:hover,.tokenpanel-element-inspect-crumb:focus-visible,.tokenpanel-element-inspect-clear:hover,.tokenpanel-element-inspect-clear:focus-visible,.tokenpanel-element-inspect-jump:hover,.tokenpanel-element-inspect-jump:focus-visible{border-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-accent-hover)}.tokenpanel-element-inspect-crumb.is-pinned{border-color:var(--tokentweak-color-accent);background:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-fg)}.tokenpanel-element-inspect-clear{margin-left:auto;border-color:transparent;color:var(--tokentweak-color-accent)}.tokenpanel-element-inspect-section{position:relative;flex-shrink:0;padding:var(--tokentweak-gap-sm) var(--tokentweak-pad-md) var(--tokentweak-pad-md);border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak)}.tokenpanel-element-inspect-section-heading{position:absolute;top:-10px;left:12px;padding-inline:var(--tokentweak-pad-sm);background:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);font-size:13px;font-weight:600;line-height:20px}.tokenpanel-element-inspect-rows{display:flex;flex-direction:column;gap:var(--tokentweak-pad-md)}.tokenpanel-element-inspect-row{display:grid;grid-template-columns:minmax(130px,1fr) minmax(160px,1.2fr) minmax(130px,1fr);align-items:center;gap:var(--tokentweak-pad-md);min-width:0}.tokenpanel-element-inspect-row.is-unconfirmed{opacity:.45}.tokenpanel-element-inspect-token-label,.tokenpanel-element-inspect-property{display:flex;flex-direction:column;min-width:0;font-family:var(--tokentweak-font-mono);line-height:1.3}.tokenpanel-element-inspect-token-var{overflow:hidden;color:var(--tokentweak-color-fg);text-overflow:ellipsis;white-space:nowrap}.tokenpanel-element-inspect-token-id,.tokenpanel-element-inspect-expression{overflow:hidden;color:var(--tokentweak-color-muted);font-size:11px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-element-inspect-property-name{color:var(--tokentweak-color-accent-hover);font-family:var(--tokentweak-font-mono);font-size:12px}.tokenpanel-element-inspect-not-confirmed{color:var(--tokentweak-color-warning);font-size:10px}.tokenpanel-element-inspect-edit-value,.tokenpanel-element-inspect-color-value{display:flex;align-items:center;justify-content:flex-end;gap:4px;min-width:0}.tokenpanel-element-inspect-number-input,.tokenpanel-element-inspect-text-input,.tokenpanel-element-inspect-select{box-sizing:border-box;min-width:0;width:100%;padding:2px 6px;border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);background:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:12px}.tokenpanel-element-inspect-number-input{max-width:80px;text-align:right}.tokenpanel-element-inspect-unit{flex-shrink:0;width:28px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:12px}.tokenpanel-element-inspect-number-input:disabled,.tokenpanel-element-inspect-text-input:disabled,.tokenpanel-element-inspect-select:disabled{opacity:.6}.tokenpanel-element-inspect-number-input:focus-visible,.tokenpanel-element-inspect-text-input:focus-visible,.tokenpanel-element-inspect-select:focus-visible,.tokenpanel-element-inspect-crumb:focus-visible,.tokenpanel-element-inspect-clear:focus-visible,.tokenpanel-element-inspect-jump:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-element-inspect-swatch{width:28px;height:22px;flex-shrink:0;border:1px solid var(--tokentweak-color-border);border-radius:3px}.tokenpanel-element-inspect-resolved-value{overflow:hidden;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:11px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-element-inspect-jump{flex-shrink:0;border-color:transparent;color:var(--tokentweak-color-accent);font-size:10px}.tokenpanel-element-inspect-empty,.tokenpanel-element-inspect-warning{color:var(--tokentweak-color-muted);font-size:11px}.tokenpanel-element-inspect-empty--start{padding:var(--tokentweak-gap-lg) var(--tokentweak-pad-md);text-align:center}.tokenpanel-element-inspect-kbd{padding-inline:4px;border:1px solid var(--tokentweak-color-border);border-bottom-width:2px;border-radius:3px;background:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:10px}.tokenpanel-element-inspect-warning{padding:var(--tokentweak-pad-sm) var(--tokentweak-pad-md);border-left:2px solid var(--tokentweak-color-warning)}.tokenpanel-element-inspect-value-empty{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px}@container tokenpanel (max-width: 620px){.tokenpanel-element-inspect-row{grid-template-columns:minmax(110px,1fr) minmax(120px,1fr)}.tokenpanel-element-inspect-row>:last-child{grid-column:2}}:where(.tokenpanel-shell,.tokenpanel-mini-pill,[data-design-token-panel-modal],.tokenpanel-color-picker,.tokenpanel-highlight-settings-popover,.tokenpanel-chain-popover,.tokenpanel-tooltip,.tokenpanel-elpath-label,.tokenpanel-elpath-toast,.tokenpanel-element-inspect-box,.tokenpanel-element-inspect-label,.tokenpanel-element-inspect-view){box-sizing:border-box}:where(.tokenpanel-shell,.tokenpanel-mini-pill,[data-design-token-panel-modal],.tokenpanel-color-picker,.tokenpanel-highlight-settings-popover,.tokenpanel-chain-popover,.tokenpanel-element-inspect-view) :where(*,*:before,*:after){box-sizing:border-box}.tokenpanel-shell{container:tokenpanel / inline-size;z-index:var(--tokentweak-z-shell);display:flex;flex-direction:column;border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-surface);border-radius:0;box-shadow:0 4px 24px #00000040;transition:opacity .2s ease}.tokenpanel-shell.is-ghosted{opacity:.35}.tokenpanel-shell.is-docked-right{border-width:0 0 0 1px;box-shadow:none}.tokenpanel-shell.is-docked-bottom{border-width:1px 0 0;box-shadow:none}.tokenpanel-shell.is-docked-right .tokenpanel-header,.tokenpanel-shell.is-docked-bottom .tokenpanel-header{cursor:default!important}.tokenpanel-dock-resize-handle{position:absolute;-webkit-user-select:none;user-select:none}.tokenpanel-dock-resize-handle.is-right{inset-block:0;left:-3px;width:6px;cursor:ew-resize}.tokenpanel-dock-resize-handle.is-bottom{inset-inline:0;top:-3px;height:6px;cursor:ns-resize}.tokenpanel-dock-modes{display:flex;gap:2px;padding:1px;border:1px solid var(--tokentweak-color-border);border-radius:3px;flex-shrink:0}.tokenpanel-dock-mode{display:inline-flex;align-items:center;justify-content:center;min-width:24px;min-height:24px;padding:3px;color:var(--tokentweak-color-muted);cursor:pointer}.tokenpanel-dock-mode:hover,.tokenpanel-dock-mode:focus-visible{color:var(--tokentweak-color-fg);background:var(--tokentweak-color-bg)}.tokenpanel-dock-mode.is-active{color:var(--tokentweak-color-accent);background:var(--tokentweak-color-bg)}:where(.tokenpanel-shell) .tokenpanel-dock-mode svg{fill:none!important}.tokenpanel-dock-modes.is-compact{flex-direction:column;border:0;padding:0}.tokenpanel-dock-modes.is-compact .tokenpanel-dock-mode{justify-content:flex-start;gap:var(--tokentweak-pad-sm);padding:var(--tokentweak-pad-sm) var(--tokentweak-pad-md)}.tokenpanel-mini-pill{position:fixed;right:20px;bottom:20px;z-index:var(--tokentweak-z-shell, 2147482991);display:flex;align-items:center;gap:10px;box-sizing:border-box;padding:6px 8px 6px 14px;border:1px solid var(--tokentweak-color-border, #6d6d6d);border-radius:999px;background:var(--tokentweak-color-surface, #1c1c1c);color:var(--tokentweak-color-fg, #b8b8b8);font-size:12px;line-height:16px;box-shadow:0 4px 24px #0000004d}.tokenpanel-mini-pill-brand{color:var(--tokentweak-color-fg, #b8b8b8);font-weight:600}.tokenpanel-mini-pill-changed-count{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding-inline:5px;border-radius:999px;background:var(--tokentweak-color-accent, #d69a66);color:var(--tokentweak-color-bg, #181818);font-size:10px;font-weight:700}.tokenpanel-mini-pill-changed-count:empty,.tokenpanel-mini-pill-undo:empty{display:none}.tokenpanel-mini-pill-changes{color:var(--tokentweak-color-muted, #888888)}.tokenpanel-mini-pill-divider{width:1px;height:16px;flex-shrink:0;background:var(--tokentweak-color-border, #6d6d6d);opacity:.55}.tokenpanel-mini-pill-undo{display:inline-flex;align-items:center;min-height:24px}.tokenpanel-mini-pill-apply,.tokenpanel-mini-pill-expand{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:24px;min-height:24px;border:0;border-radius:999px;background:none;color:var(--tokentweak-color-accent, #d69a66);cursor:pointer;flex-shrink:0;transition:color .15s ease,background-color .15s ease}.tokenpanel-mini-pill-apply{padding-inline:4px;font:inherit;font-weight:600}.tokenpanel-mini-pill-expand{padding:4px;color:var(--tokentweak-color-muted, #888888)}.tokenpanel-mini-pill-apply:hover,.tokenpanel-mini-pill-apply:focus-visible,.tokenpanel-mini-pill-expand:hover,.tokenpanel-mini-pill-expand:focus-visible{background:var(--tokentweak-color-bg, #181818);color:var(--tokentweak-color-fg, #b8b8b8)}.tokenpanel-mini-pill-apply:focus-visible,.tokenpanel-mini-pill-expand:focus-visible{outline:2px solid var(--tokentweak-color-accent, #d69a66);outline-offset:2px}.tokenpanel-mini-pill-apply[aria-disabled=true]{background:none;color:var(--tokentweak-color-muted, #888888);cursor:not-allowed;opacity:.6}.tokenpanel-ghost-idle-toggle{display:flex;align-items:center;gap:var(--tokentweak-pad-xs);flex-shrink:0;color:var(--tokentweak-color-fg);font-size:12px;line-height:16px;white-space:nowrap;cursor:pointer;-webkit-user-select:none;user-select:none}.tokenpanel-ghost-idle-toggle.is-compact{padding:var(--tokentweak-pad-sm) var(--tokentweak-pad-md)}.tokenpanel-ghost-idle-checkbox{accent-color:var(--tokentweak-color-accent);cursor:pointer}.tokenpanel-resize-handle{position:absolute;right:2px;bottom:2px;width:16px;height:16px;cursor:nwse-resize;-webkit-user-select:none;user-select:none;background-image:repeating-linear-gradient(-45deg,transparent 0,transparent 2px,var(--tokentweak-color-border) 2px,var(--tokentweak-color-border) 3px);-webkit-mask-image:linear-gradient(135deg,transparent 50%,#000 50%);mask-image:linear-gradient(135deg,transparent 50%,#000 50%);border-bottom-right-radius:0;transition:opacity .15s ease;opacity:.7}.tokenpanel-resize-handle:hover,.tokenpanel-resize-handle:focus-visible{opacity:1}.tokenpanel-header{display:flex;min-width:0;align-items:center;gap:var(--tokentweak-pad-md);padding-inline:var(--tokentweak-pad-xl);padding-block:var(--tokentweak-gap-xs);border-bottom:1px solid var(--tokentweak-color-border);flex-shrink:0;position:relative}.tokenpanel-title{color:var(--tokentweak-color-fg);font-weight:600;font-size:14px;flex-shrink:1;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}.tokenpanel-action-link{color:var(--tokentweak-color-accent);font-size:12px;background:none;border:none;padding:0;cursor:pointer;transition:color .15s ease;white-space:nowrap;flex-shrink:0}.tokenpanel-action-link:hover{color:var(--tokentweak-color-accent-hover)}.tokenpanel-action-link[aria-disabled=true]{color:var(--tokentweak-color-muted);cursor:not-allowed;opacity:.6}.tokenpanel-actions-menu-btn{display:none;color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;align-items:center;justify-content:center;transition:color .15s ease}.tokenpanel-actions-menu-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-actions-menu-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-actions-popover{position:absolute;top:calc(100% + 4px);left:var(--tokentweak-pad-xl);z-index:var(--tokentweak-z-color-picker);display:flex;flex-direction:column;min-width:180px;background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-border);border-radius:6px;box-shadow:0 8px 24px #0006;padding:4px}.tokenpanel-actions-popover .tokenpanel-action-link{text-align:left;padding:6px 10px;border-radius:4px;font-size:13px}.tokenpanel-actions-popover .tokenpanel-action-link:hover{background:rgb(from var(--tokentweak-color-fg) r g b / .06)}.tokenpanel-actions-popover .tokenpanel-action-link[aria-disabled=true]{background:none}.tokenpanel-spacer{flex:1}.tokenpanel-close-btn{color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;transition:color .15s ease;display:inline-flex;align-items:center;justify-content:center}.tokenpanel-close-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-search-control{display:flex;align-items:center;gap:var(--tokentweak-pad-xs);width:260px;min-width:0;padding:var(--tokentweak-pad-2xs) var(--tokentweak-pad-sm);color:var(--tokentweak-color-muted);background:var(--tokentweak-color-bg);border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);flex-shrink:1}.tokenpanel-search-glyph{display:inline-flex;align-items:center;flex-shrink:0}.tokenpanel-search-glyph svg,.tokenpanel-search-compact-btn svg{fill:none!important;stroke:currentColor}.tokenpanel-search-input{flex:1 1 auto;width:100%;min-width:0;padding:0;color:var(--tokentweak-color-fg);font:inherit;font-family:var(--tokentweak-font-mono);font-size:12px;background:none;border:0;outline:none}.tokenpanel-search-input::placeholder{color:var(--tokentweak-color-muted)}.tokenpanel-search-key{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;line-height:1}.tokenpanel-search-compact-btn{display:none;align-items:center;justify-content:center;width:20px;height:20px;padding:0;color:var(--tokentweak-color-muted);background:none;border:0;cursor:pointer}.tokenpanel-search-compact-btn:hover,.tokenpanel-search-compact-btn:focus-visible{color:var(--tokentweak-color-fg)}.tokenpanel-search-compact-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-history-controls{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-2xs);flex-shrink:0}.tokenpanel-history-button,.tokenpanel-history-toggle{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;padding:0;border:0;border-radius:var(--radius-tokentweak);background:none;color:var(--tokentweak-color-muted);cursor:pointer;flex-shrink:0;transition:color .15s ease,background-color .15s ease,opacity .15s ease}.tokenpanel-history-button:hover,.tokenpanel-history-button:focus-visible,.tokenpanel-history-toggle:hover,.tokenpanel-history-toggle:focus-visible,.tokenpanel-history-toggle.is-active{color:var(--tokentweak-color-fg);background:var(--tokentweak-color-bg)}.tokenpanel-history-button:focus-visible,.tokenpanel-history-toggle:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-history-button.is-disabled,.tokenpanel-history-button[aria-disabled=true]{opacity:.3;cursor:default}.tokenpanel-history-count{min-width:30px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;line-height:16px;text-align:center;-webkit-user-select:none;user-select:none}.tokenpanel-history-icon{fill:none!important;stroke:currentColor!important;pointer-events:none}.tokenpanel-shell.is-history-open{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-rows:auto auto minmax(0,1fr) auto}.tokenpanel-shell.is-history-open>.tokenpanel-header,.tokenpanel-shell.is-history-open>.tokenpanel-tabbar,.tokenpanel-shell.is-history-open>.tokenpanel-footer{grid-column:1 / -1}.tokenpanel-shell.is-history-open>.tokenpanel-header{grid-row:1}.tokenpanel-shell.is-history-open>.tokenpanel-tabbar{grid-row:2}.tokenpanel-shell.is-history-open>.tokenpanel-body{grid-column:1;grid-row:3}.tokenpanel-shell.is-history-open>.tokenpanel-history-rail{grid-column:2;grid-row:3}.tokenpanel-history-rail{display:flex;flex-direction:column;width:270px;min-width:0;min-height:0;overflow:hidden;border-left:1px solid var(--tokentweak-color-border);background:var(--tokentweak-color-bg);color:var(--tokentweak-color-fg)}.tokenpanel-history-rail-heading,.tokenpanel-history-heading{display:flex;align-items:center;gap:var(--tokentweak-pad-xs);min-height:34px;padding:var(--tokentweak-pad-sm) var(--tokentweak-pad-md);border-bottom:1px solid var(--tokentweak-color-border);color:var(--tokentweak-color-muted);font-size:11px;letter-spacing:.08em;text-transform:uppercase}.tokenpanel-history-heading{justify-content:space-between}.tokenpanel-history-heading-count{letter-spacing:normal;text-transform:none}.tokenpanel-snapshots{display:flex;flex-direction:column;gap:var(--tokentweak-pad-xs);padding:var(--tokentweak-pad-sm) var(--tokentweak-pad-md);border-bottom:1px solid var(--tokentweak-color-border)}.tokenpanel-snapshot-row,.tokenpanel-snapshot-compare{display:flex;align-items:center;gap:var(--tokentweak-pad-xs);min-width:0;font-size:12px}.tokenpanel-snapshot-tag{display:inline-flex;align-items:center;justify-content:center;width:20px;height:20px;padding:0;border:0;border-radius:var(--radius-tokentweak);background:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-fg);cursor:pointer;font-size:11px;font-weight:700;flex-shrink:0}.tokenpanel-snapshot-tag:hover,.tokenpanel-snapshot-tag:focus-visible,.tokenpanel-snapshot-tag.is-selected{background:var(--tokentweak-color-accent);color:var(--tokentweak-color-bg)}.tokenpanel-snapshot-tag[aria-disabled=true]{opacity:.5;cursor:default}.tokenpanel-snapshot-tag:focus-visible,.tokenpanel-snapshot-save:focus-visible,.tokenpanel-snapshot-segmented [role=button]:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-snapshot-meta{min-width:0;overflow:hidden;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;text-overflow:ellipsis;white-space:nowrap;flex:1}.tokenpanel-snapshot-save{padding:3px 6px;border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);background:none;color:var(--tokentweak-color-accent);cursor:pointer;font-size:10px;white-space:nowrap;flex-shrink:0}.tokenpanel-snapshot-save:hover{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg)}.tokenpanel-snapshot-compare{padding-top:var(--tokentweak-pad-2xs)}.tokenpanel-snapshot-compare-label{min-width:0;color:var(--tokentweak-color-muted);font-size:11px;flex:1}.tokenpanel-snapshot-segmented{display:inline-flex;overflow:hidden;border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);flex-shrink:0}.tokenpanel-snapshot-segmented [role=button]{min-width:25px;padding:3px 7px;border:0;background:none;color:var(--tokentweak-color-muted);cursor:pointer;font-size:11px}.tokenpanel-snapshot-segmented [role=button]+[role=button]{border-left:1px solid var(--tokentweak-color-border)}.tokenpanel-snapshot-segmented [role=button]:hover,.tokenpanel-snapshot-segmented [role=button].is-selected{background:var(--tokentweak-color-accent);color:var(--tokentweak-color-bg)}.tokenpanel-snapshot-segmented [role=button][aria-disabled=true]{opacity:.45;cursor:default}.tokenpanel-snapshot-flip-hint{min-width:12px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;text-align:center}.tokenpanel-history-notice{display:block;overflow:hidden;max-height:42px;padding:var(--tokentweak-pad-xs) var(--tokentweak-pad-md);border-bottom:1px solid var(--tokentweak-color-border);color:var(--tokentweak-color-warning);font-size:10px;line-height:14px;text-overflow:ellipsis}.tokenpanel-history-list{min-height:0;overflow:auto;padding-block:var(--tokentweak-pad-2xs);flex:1}.tokenpanel-history-entry{display:flex;flex-direction:column;align-items:flex-start;width:100%;gap:2px;padding:var(--tokentweak-pad-xs) var(--tokentweak-pad-md);border:0;border-left:2px solid transparent;border-radius:0;background:none;color:var(--tokentweak-color-fg);cursor:pointer;text-align:left}.tokenpanel-history-entry:hover,.tokenpanel-history-entry:focus-visible{background:var(--tokentweak-color-surface)}.tokenpanel-history-entry:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:-2px}.tokenpanel-history-entry.is-current{border-left-color:var(--tokentweak-color-accent);background:var(--tokentweak-color-surface)}.tokenpanel-history-entry.is-future{opacity:.4}.tokenpanel-history-entry-address{max-width:100%;overflow:hidden;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);font-size:11px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-history-entry-reason,.tokenpanel-history-entry-detail{max-width:100%;overflow:hidden;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-history-entry-reason{color:var(--tokentweak-color-accent)}.tokenpanel-history-start .tokenpanel-history-entry-detail{color:var(--tokentweak-color-muted)}.tokenpanel-history-empty{padding:var(--tokentweak-pad-md);color:var(--tokentweak-color-muted);font-size:11px}@container tokenpanel (max-width: 639px){.tokenpanel-shell.is-history-open{display:flex;flex-direction:column}.tokenpanel-shell.is-history-open>.tokenpanel-history-rail{display:none}}.tokenpanel-tabbar{display:flex;align-items:center;border-bottom:1px solid var(--tokentweak-color-border);padding-inline:var(--tokentweak-pad-xl);flex-shrink:0;gap:var(--tokentweak-pad-md);position:relative}.tokenpanel-search-matchbar{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);min-height:28px;padding-inline:var(--tokentweak-pad-xl);color:var(--tokentweak-color-muted);font-size:12px;border-bottom:1px solid var(--tokentweak-color-border);flex-shrink:0}.tokenpanel-search-match-count{color:var(--tokentweak-color-fg);font-weight:700}.tokenpanel-search-hint{color:var(--tokentweak-color-muted)}.tokenpanel-search-chip{padding:0;color:var(--tokentweak-color-muted);font:inherit;background:none;border:0;cursor:pointer}.tokenpanel-search-chip:hover,.tokenpanel-search-chip:focus-visible{color:var(--tokentweak-color-accent)}.tokenpanel-search-chip:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-tabbar-tabs{display:flex;align-items:center;gap:2px;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none}.tokenpanel-tabbar-tabs::-webkit-scrollbar{display:none}.tokenpanel-tabbar-tabs.has-overflow{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 28px),transparent)}.tokenpanel-tab-overflow{position:relative;flex-shrink:0}.tokenpanel-tab-overflow-trigger{display:flex;align-items:center;justify-content:center;width:28px;height:28px;border:0;border-inline-start:1px solid var(--tokentweak-color-border);background:none;color:var(--tokentweak-color-muted);cursor:pointer}.tokenpanel-tab-overflow-trigger:hover,.tokenpanel-tab-overflow-trigger:focus-visible{color:var(--tokentweak-color-fg)}.tokenpanel-tab-overflow-trigger:focus-visible,.tokenpanel-tab-overflow-popover:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-tab-overflow-trigger svg{fill:none!important;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.tokenpanel-tab-overflow-popover{position:absolute;top:calc(100% + 4px);right:0;z-index:var(--tokentweak-z-color-picker);display:flex;flex-direction:column;min-width:160px;max-width:min(240px,calc(100cqw - 16px));max-height:280px;overflow-y:auto;padding:4px;border:1px solid var(--tokentweak-color-border);border-radius:6px;background:var(--tokentweak-color-surface);box-shadow:0 8px 24px #0006}.tokenpanel-tab-overflow-option{padding:6px 10px;border-radius:4px;color:var(--tokentweak-color-muted);cursor:pointer;font-size:13px;white-space:nowrap}.tokenpanel-tab-overflow-option.is-focused{background:rgb(from var(--tokentweak-color-fg) r g b / .06);color:var(--tokentweak-color-fg)}.tokenpanel-tab-overflow-option[aria-selected=true]{color:var(--tokentweak-color-accent);font-weight:600}.tokenpanel-tab-button{border:none;background:none;padding-inline:var(--tokentweak-pad-md);padding-block:var(--tokentweak-gap-xs);font-size:14px;cursor:pointer;border-bottom:2px solid transparent;color:var(--tokentweak-color-muted);white-space:nowrap;flex-shrink:0;transition:color .15s ease,border-color .15s ease}.tokenpanel-tab-button:hover,.tokenpanel-tab-button:focus-visible{color:var(--tokentweak-color-fg);text-decoration:underline}.tokenpanel-tab-button.is-active{color:var(--tokentweak-color-fg);border-bottom-color:var(--tokentweak-color-accent);text-decoration:none}.tokenpanel-density{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);flex-shrink:0}.tokenpanel-density-label{color:var(--tokentweak-color-muted);font-size:11px;text-transform:uppercase;letter-spacing:.05em;-webkit-user-select:none;user-select:none;cursor:pointer}.tokenpanel-density-slider{width:80px;accent-color:var(--tokentweak-color-accent);cursor:pointer}.tokenpanel-density.is-compact,.tokenpanel-actions-popover .tokenpanel-changed-only-toggle{width:100%;box-sizing:border-box;padding:var(--tokentweak-pad-sm) var(--tokentweak-pad-md)}.tokenpanel-density.is-compact .tokenpanel-density-slider{min-width:0;flex:1}@container tokenpanel (max-width: 479px){.tokenpanel-header{gap:var(--tokentweak-pad-sm)}.tokenpanel-header>.tokenpanel-action-link{display:none}.tokenpanel-header>.tokenpanel-history-controls,.tokenpanel-header>.tokenpanel-apply-sync,.tokenpanel-header>.tokenpanel-dock-modes,.tokenpanel-header>.tokenpanel-elpath-toggle,.tokenpanel-header>.tokenpanel-element-inspect-toggle,.tokenpanel-header>.tokenpanel-tweaker-toggle{display:none}.tokenpanel-tabbar>.tokenpanel-density,.tokenpanel-tabbar>.tokenpanel-ghost-idle-toggle,.tokenpanel-tabbar>.tokenpanel-changed-only-toggle{display:none}.tokenpanel-search-control{width:auto;padding:0;background:none;border-color:transparent}.tokenpanel-search-glyph,.tokenpanel-search-input,.tokenpanel-search-key{display:none}.tokenpanel-search-compact-btn,.tokenpanel-actions-menu-btn{display:inline-flex}}@container tokenpanel (max-width: 379px){.tokenpanel-density-label{display:none}.tokenpanel-density.is-compact .tokenpanel-density-label{display:inline}}@container tokenpanel (max-width: 299px){.tokenpanel-density-slider{width:56px}}.tokenpanel-body{flex:1;min-height:0;overflow-y:auto;padding-inline:var(--tokentweak-pad-xl);padding-block:var(--tokentweak-gap-sm)}.tokenpanel-footer{display:flex;align-items:center;min-width:0;min-height:34px;padding-inline:var(--tokentweak-pad-xl);padding-block:var(--tokentweak-pad-xs);border-top:1px solid var(--tokentweak-color-border);flex-shrink:0}.tokenpanel-command-palette-backdrop{position:absolute;inset:0;z-index:var(--tokentweak-z-command-palette);background:#00000073}.tokenpanel-command-palette{position:absolute;top:60px;left:50%;display:flex;flex-direction:column;width:min(520px,calc(100% - 32px));max-height:min(460px,calc(100% - 80px));overflow:hidden;color:var(--tokentweak-color-fg);background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-border);border-radius:6px;box-shadow:0 16px 48px #00000080;transform:translate(-50%)}.tokenpanel-command-palette-input{padding:var(--tokentweak-pad-md) var(--tokentweak-pad-lg);color:var(--tokentweak-color-fg);font:inherit;font-family:var(--tokentweak-font-mono);font-size:14px;background:none;border:0;border-bottom:1px solid var(--tokentweak-color-border);outline:none}.tokenpanel-command-palette-input::placeholder{color:var(--tokentweak-color-muted)}.tokenpanel-command-palette-list{min-height:0;padding-block:var(--tokentweak-pad-xs);overflow-y:auto}.tokenpanel-command-palette-group{padding:var(--tokentweak-pad-sm) var(--tokentweak-pad-lg) var(--tokentweak-pad-2xs);color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;letter-spacing:.1em;text-transform:uppercase}.tokenpanel-command-palette-item{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);padding:var(--tokentweak-pad-xs) var(--tokentweak-pad-lg);cursor:pointer}.tokenpanel-command-palette-item:hover,.tokenpanel-command-palette-item.is-selected{color:var(--tokentweak-color-accent);background:rgb(from var(--tokentweak-color-fg) r g b / .06)}.tokenpanel-command-palette-item.is-disabled{background:none;color:var(--tokentweak-color-muted);cursor:not-allowed;opacity:.6}.tokenpanel-command-palette-item-label{min-width:0;overflow:hidden;font-size:13px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-command-palette-item-detail{min-width:0;margin-left:auto;overflow:hidden;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-command-palette-item.is-selected .tokenpanel-command-palette-item-detail{color:var(--tokentweak-color-accent-hover)}.tokenpanel-command-palette-item.is-disabled .tokenpanel-command-palette-item-detail{color:var(--tokentweak-color-muted)}.tokenpanel-command-palette-empty{padding:var(--tokentweak-pad-lg);color:var(--tokentweak-color-muted);font-size:13px}.tokenpanel-command-palette-footer{display:flex;gap:var(--tokentweak-pad-md);padding:var(--tokentweak-pad-xs) var(--tokentweak-pad-lg);color:var(--tokentweak-color-muted);font-size:11px;border-top:1px solid var(--tokentweak-color-border)}.tokenpanel-command-palette-footer-hint{margin-left:auto;font-family:var(--tokentweak-font-mono)}.tokenpanel-notes-heading{margin:0 0 var(--tokentweak-gap-2xs) 0;color:var(--tokentweak-color-fg);font-family:inherit;font-weight:600;font-size:15px;line-height:22px}.tokenpanel-notes-body{color:var(--tokentweak-color-fg);font-size:13px;line-height:1.6;display:flex;flex-direction:column;gap:var(--tokentweak-gap-2xs)}:where(.tokenpanel-shell) .tokenpanel-notes-body h1,:where(.tokenpanel-shell) .tokenpanel-notes-body h2,:where(.tokenpanel-shell) .tokenpanel-notes-body h3,:where(.tokenpanel-shell) .tokenpanel-notes-body h4,:where(.tokenpanel-shell) .tokenpanel-notes-body h5,:where(.tokenpanel-shell) .tokenpanel-notes-body h6{display:block!important;margin:var(--tokentweak-gap-2xs) 0!important;padding:0!important;border:0!important;background:none!important;color:var(--tokentweak-color-fg)!important;font-family:inherit!important;font-weight:600!important;font-size:14px!important;line-height:1.4!important;text-transform:none!important;letter-spacing:normal!important}:where(.tokenpanel-shell) .tokenpanel-notes-body p{display:block!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;padding:0!important;color:var(--tokentweak-color-fg)!important;font-size:13px!important;line-height:1.6!important;font-weight:400!important;font-style:normal!important}:where(.tokenpanel-shell) .tokenpanel-notes-body ul,:where(.tokenpanel-shell) .tokenpanel-notes-body ol{display:block!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;padding:0 0 0 20px!important;color:var(--tokentweak-color-fg)!important;list-style:revert!important}:where(.tokenpanel-shell) .tokenpanel-notes-body li{display:list-item!important;margin:0!important;padding:0!important}:where(.tokenpanel-shell) .tokenpanel-notes-body a{color:var(--tokentweak-color-accent)!important;text-decoration:underline!important;cursor:pointer!important;background:none!important}:where(.tokenpanel-shell) .tokenpanel-notes-body a:hover,:where(.tokenpanel-shell) .tokenpanel-notes-body a:focus-visible{color:var(--tokentweak-color-accent-hover)!important}:where(.tokenpanel-shell) .tokenpanel-notes-body table{display:table!important;width:100%!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;border-collapse:collapse!important;font-size:13px!important}:where(.tokenpanel-shell) .tokenpanel-notes-body thead{display:table-header-group!important}:where(.tokenpanel-shell) .tokenpanel-notes-body tbody{display:table-row-group!important}:where(.tokenpanel-shell) .tokenpanel-notes-body tr{display:table-row!important}:where(.tokenpanel-shell) .tokenpanel-notes-body th,:where(.tokenpanel-shell) .tokenpanel-notes-body td{display:table-cell!important;border:1px solid var(--tokentweak-color-border)!important;padding:var(--tokentweak-pad-2xs) var(--tokentweak-pad-xs)!important;text-align:left!important;color:var(--tokentweak-color-fg)!important;font-weight:400!important}:where(.tokenpanel-shell) .tokenpanel-notes-body th{font-weight:600!important}:where(.tokenpanel-shell) .tokenpanel-notes-body blockquote{display:block!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;padding:var(--tokentweak-pad-xs) var(--tokentweak-pad-md)!important;border:0!important;border-left:3px solid var(--tokentweak-color-border)!important;color:var(--tokentweak-color-muted)!important;font-style:normal!important}:where(.tokenpanel-shell) .tokenpanel-notes-body pre,:where(.tokenpanel-shell) .tokenpanel-notes-body code{font-family:var(--tokentweak-font-mono)!important;font-size:12px!important;color:var(--tokentweak-color-code-fg)!important;background:var(--tokentweak-color-code-bg)!important}:where(.tokenpanel-shell) .tokenpanel-notes-body code{display:inline!important;padding:1px 4px!important;border-radius:3px!important}:where(.tokenpanel-shell) .tokenpanel-notes-body pre{display:block!important;margin:0 0 var(--tokentweak-gap-2xs) 0!important;padding:var(--tokentweak-pad-sm)!important;border-radius:6px!important;overflow-x:auto!important;white-space:pre!important}:where(.tokenpanel-shell) .tokenpanel-notes-body pre code{padding:0!important;background:none!important}:where(.tokenpanel-shell) .tokenpanel-notes-body hr{display:block!important;margin:var(--tokentweak-gap-2xs) 0!important;height:0!important;border:0!important;border-top:1px solid var(--tokentweak-color-border)!important}:where(.tokenpanel-shell) .tokenpanel-notes-body img{max-width:100%!important;height:auto!important;display:block!important}:where(.tokenpanel-shell) .tokenpanel-notes-body strong,:where(.tokenpanel-shell) .tokenpanel-notes-body b{font-weight:700!important;font-style:normal!important}:where(.tokenpanel-shell) .tokenpanel-notes-body em,:where(.tokenpanel-shell) .tokenpanel-notes-body i{font-style:italic!important;font-weight:inherit!important}.tokenpanel-empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:192px;padding-block:var(--tokentweak-gap-md);padding-inline:var(--tokentweak-pad-xl)}.tokenpanel-empty-state-text{color:var(--tokentweak-color-muted, #a8a8a8);font-size:13px;line-height:1.5;max-width:512px;margin:0}.tokenpanel-empty-state-text code{font-family:var(--tokentweak-font-mono, Menlo, Monaco, Consolas, monospace);font-size:13px;color:var(--tokentweak-color-fg)}.tokenpanel-empty-state-link{color:var(--tokentweak-color-accent);text-decoration:underline;transition:color .15s ease}.tokenpanel-empty-state-link:hover,.tokenpanel-empty-state-link:focus-visible{color:var(--tokentweak-color-accent-hover)}.tokenpanel-tab-content{display:flex;flex-direction:column;gap:var(--tokentweak-gap-sm)}.tokenpanel-tab-actions{display:flex;align-items:center;gap:var(--tokentweak-pad-md)}.tokenpanel-bulk-tier-controls{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-xs);margin-left:var(--tokentweak-pad-xs)}.tokenpanel-bulk-checkbox{flex:0 0 auto;width:13px;height:13px;margin:0;accent-color:var(--tokentweak-color-accent);cursor:pointer}.tokenpanel-bulk-checkbox:disabled{cursor:default;opacity:.45}.tokenpanel-bulk-tier-quick{display:none;align-items:center;gap:2px}.tokenpanel-tab-section:hover .tokenpanel-bulk-tier-quick,.tokenpanel-tab-section:focus-within .tokenpanel-bulk-tier-quick{display:inline-flex}.tokenpanel-bulk-quick-btn{min-width:28px;padding-inline:var(--tokentweak-pad-xs);padding-block:1px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;line-height:16px;cursor:pointer;border-radius:2px}.tokenpanel-bulk-quick-btn:hover,.tokenpanel-bulk-quick-btn:focus-visible{color:var(--tokentweak-color-fg);background:var(--tokentweak-color-bg)}.tokenpanel-row--bulk-selected{background:rgb(from var(--tokentweak-color-accent) r g b / .08);border-radius:4px}.tokenpanel-bulk-preview{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-xs);min-width:0;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;line-height:16px;white-space:nowrap;-webkit-user-select:none;user-select:none}.tokenpanel-bulk-preview-new{color:var(--tokentweak-color-accent)}.tokenpanel-bulk-preview-arrow{color:var(--tokentweak-color-muted)}.tokenpanel-bulk-action-bar{position:sticky;bottom:calc(-1 * var(--tokentweak-gap-sm));z-index:var(--tokentweak-z-color-picker);display:flex;align-items:center;flex-wrap:wrap;gap:var(--tokentweak-pad-sm);margin-inline:calc(-1 * var(--tokentweak-pad-xl));margin-top:var(--tokentweak-gap-2xs);padding-inline:var(--tokentweak-pad-xl);padding-block:var(--tokentweak-pad-sm);border-top:1px solid var(--tokentweak-color-accent);background:var(--tokentweak-color-bg);box-shadow:0 -8px 24px #0006;color:var(--tokentweak-color-fg);font-size:12px}.tokenpanel-bulk-selection-count{color:var(--tokentweak-color-fg);font-weight:600;white-space:nowrap}.tokenpanel-bulk-operation{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-xs);color:var(--tokentweak-color-muted);white-space:nowrap}.tokenpanel-bulk-number-input{width:60px;min-width:0;border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);background:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);padding-inline:var(--tokentweak-pad-xs);padding-block:2px;font-family:var(--tokentweak-font-mono);font-size:12px;text-align:right}.tokenpanel-bulk-number-input.is-active{border-color:var(--tokentweak-color-accent)}.tokenpanel-bulk-number-input:focus,.tokenpanel-bulk-number-input:focus-visible{border-color:var(--tokentweak-color-accent);outline:2px solid var(--tokentweak-color-accent);outline-offset:1px}.tokenpanel-bulk-ramp{flex:0 0 auto;display:inline-block;height:28px;overflow:visible;color:var(--tokentweak-color-muted)}.tokenpanel-bulk-ramp-old{fill:var(--tokentweak-color-muted)!important;opacity:.55}.tokenpanel-bulk-ramp-new{fill:var(--tokentweak-color-accent)!important;opacity:.85}.tokenpanel-bulk-clear{white-space:nowrap}.tokenpanel-bulk-apply{display:inline-flex;align-items:center;justify-content:center;padding-inline:var(--tokentweak-pad-md);padding-block:var(--tokentweak-pad-xs);border:1px solid var(--tokentweak-color-accent);border-radius:var(--radius-tokentweak);background:var(--tokentweak-color-accent);color:var(--tokentweak-color-bg);font-size:12px;font-weight:600;cursor:pointer;white-space:nowrap}.tokenpanel-bulk-apply:hover,.tokenpanel-bulk-apply:focus-visible{background:var(--tokentweak-color-accent-hover);border-color:var(--tokentweak-color-accent-hover)}.tokenpanel-bulk-apply[aria-disabled=true]{cursor:default;opacity:.6}.tokenpanel-tab-section{position:relative;flex-shrink:0;border:1px solid var(--tokentweak-color-border);border-radius:8px;padding:18px 14px 14px}.tokenpanel-tab-section-heading{position:absolute;top:-10px;left:12px;background:var(--tokentweak-color-surface);padding:0 8px;margin:0;color:var(--tokentweak-color-fg);font-family:inherit;font-weight:600;font-size:13px;line-height:20px;text-transform:none;letter-spacing:normal}.tokenpanel-tab-section-heading--color{font-size:14px}.tokenpanel-tab-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--tokenpanel-grid-min, 288px),1fr));gap:var(--tokentweak-gap-xs)}.tokenpanel-tab-grid--specimen{grid-template-columns:minmax(0,1fr);padding-inline:4px}.tokenpanel-color-preset-select{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-border);padding-inline:var(--tokentweak-pad-sm);padding-block:2px;font-size:12px;border-radius:var(--radius-tokentweak);max-width:224px;cursor:pointer;transition:border-color .15s ease}.tokenpanel-color-preset-select:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-palette-grid,.tokenpanel-color-palette-grid--secondary{display:grid;grid-template-columns:repeat(auto-fit,minmax(56px,1fr));gap:var(--tokentweak-pad-sm)}.tokenpanel-color-base-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--tokenpanel-grid-min, 176px),1fr));gap:6px}.tokenpanel-color-swatch-wrap{display:flex;flex-direction:column;align-items:center;gap:4px;min-width:0;width:100%}.tokenpanel-color-swatch-button{display:block;border:1px solid var(--tokentweak-color-border);cursor:pointer;width:56px;height:56px;border-radius:var(--radius-tokentweak);background:none;padding:0;transition:border-color .15s ease}.tokenpanel-color-swatch-button:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-swatch-button:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-field{display:inline-flex}.tokenpanel-color-field-swatch{display:block;width:44px;height:28px;border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);cursor:pointer;padding:0;transition:border-color .15s ease}.tokenpanel-color-field-swatch:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-color-field-swatch:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-color-field-swatch[aria-disabled=true]{cursor:default;opacity:.6}.tokenpanel-color-swatch-label-row{display:flex;align-items:center;gap:4px;min-width:0;max-width:100%}.tokenpanel-color-swatch-label{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);-webkit-user-select:none;user-select:none;font-size:11px;line-height:1.1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-tooltip{position:fixed;z-index:var(--tokentweak-z-tooltip);pointer-events:none;background:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-border);border-radius:4px;padding:4px 8px;font-family:var(--tokentweak-font-mono);font-size:11px;line-height:1.3;width:max-content;max-width:calc(100vw - 12px);white-space:normal;overflow-wrap:anywhere;box-shadow:0 4px 12px #00000080;opacity:0;transform:translateY(2px);transition:opacity 90ms ease,transform 90ms ease}.tokenpanel-tooltip[data-show=true]{opacity:1;transform:translateY(0)}.tokenpanel-tooltip--help{white-space:normal;max-width:min(320px,calc(100vw - 12px))}.tokenpanel-help-icon{position:relative;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:15px;height:15px;border-radius:50%;border:1px solid var(--tokentweak-color-border);color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;line-height:1;cursor:pointer;-webkit-user-select:none;user-select:none;transition:background-color .15s ease,color .15s ease,border-color .15s ease}.tokenpanel-help-icon:hover,.tokenpanel-help-icon.is-pinned{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg);background-color:rgb(from var(--tokentweak-color-fg) r g b / .1)}.tokenpanel-help-icon:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-help-icon:after{content:"";position:absolute;inset:-5px}.tokenpanel-popover{border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-surface);padding:12px;border-radius:var(--radius-tokentweak);box-shadow:0 4px 12px #0000004d}.tokenpanel-palette-selector{position:relative;width:100%;display:flex;align-items:center;gap:6px}.tokenpanel-palette-trigger{display:flex;align-items:center;gap:4px;flex:1;min-width:0;border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-surface);padding-inline:6px;padding-block:4px;font-size:12px;border-radius:var(--radius-tokentweak);cursor:pointer;transition:border-color .15s ease}.tokenpanel-palette-trigger:hover{border-color:var(--tokentweak-color-fg)}.tokenpanel-palette-trigger:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-palette-trigger-label{flex:1;min-width:0;text-align:left;color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-palette-trigger-color{flex-shrink:0;border:1px solid var(--tokentweak-color-border);width:14px;height:14px;border-radius:2px}.tokenpanel-palette-trigger-value{flex-shrink:0;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);width:2.5em}.tokenpanel-palette-trigger-icon{color:var(--tokentweak-color-muted);flex-shrink:0}.tokenpanel-palette-options{border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-surface);padding:10px;border-radius:var(--radius-tokentweak);box-shadow:0 4px 12px #0000004d}.tokenpanel-palette-options-extras{display:flex;gap:6px;margin-bottom:8px;padding-bottom:8px;border-bottom:1px solid var(--tokentweak-color-border)}.tokenpanel-palette-extra-option{display:flex;align-items:center;gap:6px;padding-inline:8px;padding-block:4px;border-radius:4px;font-size:16px;background:none;border:none;cursor:pointer;transition:background-color .15s ease}.tokenpanel-palette-extra-option:hover{background-color:rgb(from var(--tokentweak-color-fg) r g b / .1)}.tokenpanel-palette-extra-option.is-selected{background-color:rgb(from var(--tokentweak-color-accent) r g b / .2)}.tokenpanel-palette-extra-option.is-active{outline:2px solid var(--tokentweak-color-accent);outline-offset:1px}.tokenpanel-palette-extra-color{width:28px;height:28px;border-radius:3px;border:1px solid var(--tokentweak-color-border)}.tokenpanel-palette-extra-label{color:var(--tokentweak-color-fg)}.tokenpanel-palette-options-grid{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:5px}.tokenpanel-palette-option-button{width:48px;height:48px;border-radius:3px;border:1px solid var(--tokentweak-color-border);cursor:pointer;padding:0;transition:box-shadow .15s ease}.tokenpanel-palette-option-button:hover{box-shadow:0 0 0 2px var(--tokentweak-color-fg)}.tokenpanel-palette-option-button.is-selected{box-shadow:0 0 0 2px var(--tokentweak-color-accent)}.tokenpanel-palette-option-button.is-active{outline:2px solid var(--tokentweak-color-fg);outline-offset:1px}.tokenpanel-row{display:flex;align-items:center;gap:var(--tokentweak-pad-sm)}.tokenpanel-row--stacked{display:flex;flex-direction:column;gap:2px}.tokenpanel-row--column{display:flex;flex-direction:column;gap:4px}.tokenpanel-row--flash{animation:tokenpanel-row-flash .9s ease-out}@keyframes tokenpanel-row-flash{0%,35%{outline:1px solid var(--tokentweak-color-accent)}to{outline-color:transparent}}.tokenpanel-row-head{display:flex;align-items:center;gap:var(--tokentweak-pad-sm)}.tokenpanel-row-label{color:var(--tokentweak-color-fg);font-family:var(--tokentweak-font-mono);flex:1;min-width:0;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-row-input-group{display:flex;align-items:center;gap:4px;flex-shrink:0}.tokenpanel-row-number-input{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-border);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);text-align:right;font-size:12px;width:80px;border-radius:var(--radius-tokentweak)}.tokenpanel-row-number-input:disabled{opacity:.6}.tokenpanel-row-number-input--invalid{border-color:var(--tokentweak-color-danger);color:var(--tokentweak-color-danger)}.tokenpanel-row-unit{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);-webkit-user-select:none;user-select:none;font-size:12px;width:32px}.tokenpanel-row-unit--interactive{cursor:pointer;border-radius:2px}.tokenpanel-row-unit--interactive:hover{color:var(--tokentweak-color-fg)}.tokenpanel-row-unit--interactive:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-row-unit--interactive[aria-disabled=true]{cursor:default;opacity:.6}.tokenpanel-row-select{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-border);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);font-size:12px;width:112px;border-radius:var(--radius-tokentweak)}.tokenpanel-row-select:disabled{opacity:.6}.tokenpanel-row-text-input{background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-border);padding-inline:6px;padding-block:2px;font-family:var(--tokentweak-font-mono);font-size:12px;flex:1;min-width:0;border-radius:var(--radius-tokentweak)}.tokenpanel-row-text-input:disabled{opacity:.6}.tokenpanel-pill-toggle{display:flex;align-items:center;gap:var(--tokentweak-pad-xs);flex-shrink:0;cursor:pointer}.tokenpanel-pill-toggle-checkbox{accent-color:var(--tokentweak-color-accent)}.tokenpanel-pill-toggle-text{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:12px}[data-design-token-panel-modal]{margin-inline:auto;width:100%;max-width:736px;max-height:80vh;overflow-y:auto;border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);padding:var(--tokentweak-pad-xl);position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);-webkit-user-select:text;user-select:text}[data-design-token-panel-modal]::backdrop{background-color:rgb(from var(--tokentweak-color-bg) r g b / .8)}[data-design-token-panel-modal] [class*=__header]{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--tokentweak-pad-md);margin-bottom:var(--tokentweak-gap-sm)}[data-design-token-panel-modal] [class*=__title]{font-size:var(--tokentweak-text-subheading);font-weight:700;color:var(--tokentweak-color-fg)}[data-design-token-panel-modal] [class*=__hint]{font-size:var(--tokentweak-text-small);color:var(--tokentweak-color-muted);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__section-heading]{font-size:var(--tokentweak-text-small);font-weight:700;color:var(--tokentweak-color-fg);margin-top:var(--tokentweak-gap-sm);margin-bottom:var(--tokentweak-gap-2xs)}[data-design-token-panel-modal] [class*=__list]:not([class*=__list-item]){overflow-x:auto;border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__list-item]{font-family:var(--tokentweak-font-mono)}[data-design-token-panel-modal] [class*=__actions]{display:flex;align-items:center;gap:var(--tokentweak-pad-md);margin-top:var(--tokentweak-gap-md)}.tokenpanel-apply-sync{color:var(--tokentweak-color-success);font-size:var(--tokentweak-text-small);white-space:nowrap}.tokenpanel-apply-sync.is-unsaved{color:var(--tokentweak-color-warning)}.tokenpanel-apply-preview{display:grid;grid-template-columns:minmax(180px,34%) minmax(0,1fr);min-height:320px;max-height:58vh;border:1px solid var(--tokentweak-color-border);background:var(--tokentweak-color-code-bg)}.tokenpanel-apply-preview-files{overflow:auto;border-right:1px solid var(--tokentweak-color-border)}.tokenpanel-apply-preview-file{display:flex;align-items:center;gap:var(--tokentweak-gap-xs);padding:var(--tokentweak-pad-sm);cursor:pointer;font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-small)}.tokenpanel-apply-preview-file.is-selected{background:var(--tokentweak-color-surface)}.tokenpanel-apply-preview-file input,.tokenpanel-apply-preview-hunk-header input{accent-color:var(--tokentweak-color-accent)}.tokenpanel-apply-preview-file-name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-apply-preview-file-meta{color:var(--tokentweak-color-muted);font-size:var(--tokentweak-text-small);white-space:nowrap}.tokenpanel-apply-preview-unrouted{margin:var(--tokentweak-pad-sm);padding:var(--tokentweak-pad-sm);border:1px solid var(--tokentweak-color-warning);color:var(--tokentweak-color-warning);font-size:var(--tokentweak-text-small)}.tokenpanel-apply-preview-diff{overflow:auto;font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-small)}.tokenpanel-apply-preview-hunk{border-bottom:1px solid var(--tokentweak-color-border)}.tokenpanel-apply-preview-hunk.is-off .is-delete,.tokenpanel-apply-preview-hunk.is-off .is-add{opacity:.35;text-decoration:line-through}.tokenpanel-apply-preview-hunk-header{position:sticky;top:0;display:flex;align-items:center;gap:var(--tokentweak-gap-xs);padding:var(--tokentweak-pad-xs) var(--tokentweak-pad-sm);background:var(--tokentweak-color-surface);color:var(--tokentweak-color-accent)}.tokenpanel-apply-preview-line{display:flex;min-width:max-content;white-space:pre;line-height:18px}.tokenpanel-apply-preview-line-number{width:44px;padding-right:var(--tokentweak-pad-sm);color:var(--tokentweak-color-muted);text-align:right;-webkit-user-select:none;user-select:none}.tokenpanel-apply-preview-line.is-context{color:var(--tokentweak-color-muted)}.tokenpanel-apply-preview-line.is-delete{color:var(--tokentweak-color-danger);background:rgb(from var(--tokentweak-color-danger) r g b / .14)}.tokenpanel-apply-preview-line.is-add{color:var(--tokentweak-color-success);background:rgb(from var(--tokentweak-color-success) r g b / .14)}[data-design-token-panel-modal] [class*=__toggle]{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-xs);font-size:var(--tokentweak-text-small);color:var(--tokentweak-color-fg);cursor:pointer;margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__textarea]{width:100%;min-height:192px;border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-family:var(--tokentweak-font-mono);font-size:var(--tokentweak-text-small);resize:vertical;margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__json]{overflow-x:auto;border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small);white-space:pre;font-family:var(--tokentweak-font-mono)}[data-design-token-panel-modal] [class*=__status]{font-size:var(--tokentweak-text-small);margin-bottom:var(--tokentweak-gap-xs)}[data-design-token-panel-modal] [class*=__status--info]{color:var(--tokentweak-color-success)}[data-design-token-panel-modal] [class*=__status--error]{color:var(--tokentweak-color-danger)}[data-design-token-panel-modal] [class*=__status--warning]{color:var(--tokentweak-color-warning)}[data-design-token-panel-modal] [class*=__status--success]{color:var(--tokentweak-color-success)}[data-design-token-panel-modal] [class*=__applying]{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-muted);padding:var(--tokentweak-pad-sm);font-size:var(--tokentweak-text-small)}[data-design-token-panel-modal] [class*=__spinner]{display:inline-block;width:16px;height:16px;border:2px solid var(--tokentweak-color-border);border-top-color:var(--tokentweak-color-fg);border-radius:50%;animation:design-token-panel-modal-spin .75s linear infinite}@keyframes design-token-panel-modal-spin{to{transform:rotate(360deg)}}[data-design-token-panel-modal] [class*=__revert-hint]{font-size:var(--tokentweak-text-small);font-style:italic;color:var(--tokentweak-color-muted);margin-top:var(--tokentweak-gap-sm);margin-bottom:var(--tokentweak-gap-2xs)}[data-design-token-panel-modal] [class*=__button]{border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-lg);padding-block:var(--tokentweak-gap-2xs);font-size:var(--tokentweak-text-small);cursor:pointer;transition:color .15s ease,border-color .15s ease,background-color .15s ease}[data-design-token-panel-modal] [class*=__button]:hover,[data-design-token-panel-modal] [class*=__button]:focus-visible{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg)}[data-design-token-panel-modal] [class*=__button]:disabled{cursor:not-allowed;opacity:.5}[data-design-token-panel-modal] [class*=__button--primary]{border-color:var(--tokentweak-color-accent);background-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-bg)}[data-design-token-panel-modal] [class*=__button--primary]:hover,[data-design-token-panel-modal] [class*=__button--primary]:focus-visible{border-color:var(--tokentweak-color-accent-hover);background-color:var(--tokentweak-color-accent-hover);color:var(--tokentweak-color-bg)}[data-design-token-panel-modal] [class*=__close-button]{border:1px solid var(--tokentweak-color-border);background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-muted);padding-inline:var(--tokentweak-pad-sm);padding-block:var(--tokentweak-gap-2xs);font-size:var(--tokentweak-text-small);cursor:pointer;transition:color .15s ease,border-color .15s ease}[data-design-token-panel-modal] [class*=__close-button]:hover,[data-design-token-panel-modal] [class*=__close-button]:focus-visible{color:var(--tokentweak-color-fg);border-color:var(--tokentweak-color-fg)}.tokenpanel-tier-ref-selector{flex:1;min-width:0}.tokenpanel-tier-ref-selector--grouped{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);flex-wrap:wrap}select.tokenpanel-tier-ref-select{width:100%;background-color:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);border:1px solid var(--tokentweak-color-border);border-radius:var(--radius-tokentweak);padding-inline:var(--tokentweak-pad-sm);padding-block:4px;font-family:var(--tokentweak-font-mono);font-size:12px;cursor:pointer}.tokenpanel-tier-ref-selector--grouped>select.tokenpanel-tier-ref-select{flex:1;min-width:0;width:auto}select.tokenpanel-tier-ref-select:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-row-label-sub{display:block;font-size:var(--tokentweak-text-micro, 11px);color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);line-height:1.2}.tokenpanel-per-mode-toggle{display:inline-flex;align-items:center;gap:4px;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;cursor:pointer;-webkit-user-select:none;user-select:none;white-space:nowrap}.tokenpanel-per-mode-fields{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);flex-wrap:wrap}.tokenpanel-semantic-resolved-chip{width:18px;height:18px;flex-shrink:0;border:1px solid var(--tokentweak-color-border);border-radius:3px;pointer-events:none}.tokenpanel-per-mode-field{display:inline-flex;align-items:center;gap:4px}.tokenpanel-per-mode-label{color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;white-space:nowrap}.tokenpanel-tab-section-heading--with-help{display:inline-flex!important;align-items:center;gap:6px}.tokenpanel-tab-section [role=heading]{display:block}.tokenpanel-code{font-family:var(--tokentweak-font-mono);font-size:inherit;background:none;color:inherit;padding:0;border:none;border-radius:0;white-space:pre-wrap}[data-design-token-panel-modal] [class*=__button][aria-disabled=true]{cursor:not-allowed;opacity:.5;pointer-events:none}[data-design-token-panel-modal] [role=button]:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-action-link:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-close-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-tab-button:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-highlight-overlay{margin:0;padding:0;border:0;background:transparent;display:block}.tokenpanel-highlight-toggle{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;width:16px;height:16px;color:var(--tokentweak-color-muted);cursor:pointer;vertical-align:middle;border-radius:2px;transition:background-color .15s ease,color .15s ease}.tokenpanel-highlight-toggle:hover{color:var(--tokentweak-color-fg);background-color:rgb(from var(--tokentweak-color-fg) r g b / .1)}.tokenpanel-highlight-toggle:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-highlight-toggle.is-active{opacity:1}.tokenpanel-chain-button{position:relative;display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;flex-shrink:0;border-radius:2px;color:var(--tokentweak-color-muted);cursor:pointer;transition:background-color .15s ease,color .15s ease}.tokenpanel-chain-button:hover,.tokenpanel-chain-button:focus-visible,.tokenpanel-chain-button.is-open{color:var(--tokentweak-color-accent);background-color:rgb(from var(--tokentweak-color-fg) r g b / .1)}.tokenpanel-chain-button:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-chain-button:after{content:"";position:absolute;inset:-4px}:where(.tokenpanel-shell) .tokenpanel-chain-button svg{fill:none!important;stroke:currentColor!important}.tokenpanel-chain-popover{box-sizing:border-box;width:min(460px,calc(100vw - 16px));max-height:calc(100vh - 16px);overflow-y:auto;padding:var(--tokentweak-pad-md);border:1px solid var(--tokentweak-color-border);border-radius:6px;background:var(--tokentweak-color-surface);color:var(--tokentweak-color-fg);box-shadow:0 8px 32px #00000080;font-family:var(--tokentweak-font-mono);font-size:11px;line-height:1.4}.tokenpanel-chain-hops{display:flex;align-items:center;flex-wrap:wrap;gap:4px;padding-bottom:var(--tokentweak-pad-sm);border-bottom:1px solid var(--tokentweak-color-border)}.tokenpanel-chain-hop-wrap{display:inline-flex;align-items:center;gap:4px;min-width:0}.tokenpanel-chain-hop{display:inline-flex;align-items:center;gap:5px;max-width:100%;padding:3px 6px;border-radius:3px;background:var(--tokentweak-color-code-bg);color:var(--tokentweak-color-code-fg);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-chain-hop.is-literal{color:var(--tokentweak-color-accent-hover)}.tokenpanel-chain-hop-swatch{display:inline-block;width:12px;height:12px;flex:0 0 auto;border:1px solid var(--tokentweak-color-border);border-radius:2px}.tokenpanel-chain-arrow{color:var(--tokentweak-color-muted)}.tokenpanel-chain-row{display:flex;align-items:flex-start;flex-wrap:wrap;gap:var(--tokentweak-pad-sm);min-height:22px;padding-top:var(--tokentweak-pad-sm)}.tokenpanel-chain-row-label{flex:0 0 104px;color:var(--tokentweak-color-muted);font-size:10px;letter-spacing:.06em;text-transform:uppercase}.tokenpanel-chain-row-value{color:var(--tokentweak-color-fg);font-variant-numeric:tabular-nums}.tokenpanel-chain-row-action{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-xs);margin-left:auto;color:var(--tokentweak-color-muted);white-space:nowrap}.tokenpanel-chain-chip-list{display:inline-flex;flex:1 1 180px;flex-wrap:wrap;gap:4px;min-width:0}.tokenpanel-chain-chip{display:inline-flex;align-items:center;max-width:100%;padding:2px 6px;border:1px solid var(--tokentweak-color-border);border-radius:3px;background:none;color:var(--tokentweak-color-fg);cursor:pointer;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-chain-chip:hover,.tokenpanel-chain-chip:focus-visible{border-color:var(--tokentweak-color-accent);color:var(--tokentweak-color-accent)}.tokenpanel-chain-chip:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:1px}.tokenpanel-chain-empty{color:var(--tokentweak-color-muted)}:where(.tokenpanel-shell,.tokenpanel-mini-pill) svg{fill:currentColor!important;pointer-events:none;display:inline-block;overflow:visible}:where(.tokenpanel-chain-popover) svg{fill:currentColor!important;pointer-events:none;display:inline-block;overflow:visible}:where(.tokenpanel-chain-popover) .tokenpanel-highlight-toggle svg{fill:none!important;stroke:currentColor!important}:where(.tokenpanel-shell) .tokenpanel-highlight-toggle svg{fill:none!important;stroke:currentColor}:where(.tokenpanel-mini-pill) svg{fill:none!important;stroke:currentColor}.tokenpanel-highlight-settings-popover{width:370px;background:var(--tokentweak-color-surface);border:1px solid var(--tokentweak-color-border);border-radius:6px;box-shadow:0 8px 32px #00000080}.tokenpanel-highlight-settings-header{padding:10px 16px;border-bottom:1px solid var(--tokentweak-color-border);font-weight:600;font-size:13px;color:var(--tokentweak-color-fg);display:flex;align-items:center;justify-content:space-between;gap:12px}.tokenpanel-highlight-settings-header-label{flex:1;min-width:0}.tokenpanel-highlight-settings-outline-control{display:flex;align-items:center;gap:4px;flex-shrink:0}.tokenpanel-highlight-settings-outline-input{width:44px;background:var(--tokentweak-color-bg);border:1px solid var(--tokentweak-color-border);border-radius:3px;color:var(--tokentweak-color-fg);font-size:12px;font-variant-numeric:tabular-nums;padding:3px 6px;text-align:right}.tokenpanel-highlight-settings-outline-px{color:var(--tokentweak-color-muted);font-size:12px;font-weight:400}.tokenpanel-highlight-settings-list{padding:4px 0;display:grid;grid-template-columns:1fr 1fr}.tokenpanel-highlight-settings-row{display:grid;grid-template-columns:22px 32px 1fr;gap:8px;align-items:center;padding:8px 12px}.tokenpanel-highlight-settings-row:hover{background:rgb(from var(--tokentweak-color-fg) r g b / .03)}.tokenpanel-highlight-settings-num{color:var(--tokentweak-color-muted);font-variant-numeric:tabular-nums;text-align:right;font-size:11px}.tokenpanel-highlight-settings-ring{width:28px;height:28px;border-radius:3px;background:transparent;box-sizing:border-box;cursor:pointer;flex-shrink:0}.tokenpanel-highlight-settings-ring:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-highlight-settings-name{font-family:var(--tokentweak-font-mono);font-size:12px;color:var(--tokentweak-color-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-highlight-settings-name.is-active{color:var(--tokentweak-color-fg)}.tokenpanel-highlight-settings-footer{padding:12px 16px;border-top:1px solid var(--tokentweak-color-border);display:flex;justify-content:flex-end;gap:var(--tokentweak-pad-sm)}.tokenpanel-highlight-settings-reset-btn{padding:6px 12px;background:var(--tokentweak-color-code-bg);border:1px solid var(--tokentweak-color-border);border-radius:3px;cursor:pointer;font-size:12px;color:var(--tokentweak-color-fg);transition:background .15s ease}.tokenpanel-highlight-settings-reset-btn:hover{background:rgb(from var(--tokentweak-color-fg) r g b / .08)}.tokenpanel-highlight-settings-reset-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:3px}.tokenpanel-gear-btn{color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;transition:color .15s ease;display:inline-flex;align-items:center;justify-content:center}.tokenpanel-gear-btn:hover{color:var(--tokentweak-color-fg)}.tokenpanel-gear-btn:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-elpath-toggle,.tokenpanel-tweaker-toggle{color:var(--tokentweak-color-muted);background:none;border:none;padding:0;cursor:pointer;flex-shrink:0;transition:color .15s ease;display:inline-flex;align-items:center;justify-content:center}.tokenpanel-elpath-toggle:hover,.tokenpanel-tweaker-toggle:hover{color:var(--tokentweak-color-fg)}.tokenpanel-elpath-toggle:focus-visible,.tokenpanel-tweaker-toggle:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px;border-radius:2px}.tokenpanel-elpath-toggle.is-active,.tokenpanel-tweaker-toggle.is-active{color:var(--tokentweak-color-accent)}:where(.tokenpanel-shell) .tokenpanel-elpath-toggle svg,:where(.tokenpanel-shell) .tokenpanel-tweaker-toggle svg,:where(.tokenpanel-shell) .tokenpanel-element-inspect-toggle svg{fill:none!important;stroke:currentColor}:where(.tokenpanel-shell) .tokenpanel-element-inspect-toggle svg path{fill:none!important;stroke:currentColor}html.tokenpanel-elpath-inspecting,html.tokenpanel-elpath-inspecting *{cursor:crosshair!important;-webkit-user-select:none!important;user-select:none!important}.tokenpanel-elpath-box{margin:0;padding:0;border:0;pointer-events:none;box-sizing:border-box;background:#6fa8dc40;outline:1px solid rgb(111 168 220 / .9);outline-offset:-1px;box-shadow:inset 0 0 0 1px #6fa8dce6}.tokenpanel-elpath-label{pointer-events:none;display:inline-flex;align-items:baseline;gap:8px;max-width:90vw;padding:2px 6px;border-radius:3px;background:var(--tokentweak-color-surface, #1c1c1c);color:var(--tokentweak-color-fg, #b8b8b8);font-family:var(--tokentweak-font-mono, Menlo, Monaco, Consolas, monospace);font-size:11px;line-height:1.4;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-shadow:0 1px 3px #0006}.tokenpanel-elpath-label-name{color:var(--tokentweak-color-accent, #d69a66);font-weight:600;overflow:hidden;text-overflow:ellipsis}.tokenpanel-elpath-label-size{color:var(--tokentweak-color-muted, #888888);flex-shrink:0}.tokenpanel-elpath-toast{pointer-events:none;display:inline-flex;align-items:center;gap:8px;margin:12px auto 0;padding:8px 14px;border-radius:6px;background:var(--tokentweak-color-surface, #1c1c1c);color:var(--tokentweak-color-fg, #b8b8b8);font-family:var(--tokentweak-font-mono, Menlo, Monaco, Consolas, monospace);font-size:12px;line-height:1.4;max-width:min(90vw,520px);box-shadow:0 4px 16px #00000073;border:1px solid rgb(255 255 255 / .08)}.tokenpanel-elpath-toast .tokenpanel-elpath-toast-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-elpath-toast svg{flex-shrink:0;fill:none!important;stroke:var(--tokentweak-color-success, #93bb77);pointer-events:none;display:inline-block;overflow:visible}.tokenpanel-elpath-toast.is-error svg{stroke:var(--tokentweak-color-danger, #da6871)}.tokenpanel-row-number-input:focus-visible,.tokenpanel-row-text-input:focus-visible,.tokenpanel-row-select:focus-visible,.tokenpanel-color-preset-select:focus-visible,.tokenpanel-density-slider:focus-visible,.tokenpanel-pill-toggle-checkbox:focus-visible,.tokenpanel-bulk-checkbox:focus-visible,.tokenpanel-bulk-number-input:focus-visible,.tokenpanel-highlight-settings-outline-input:focus-visible,[data-design-token-panel-modal] [class*=__textarea]:focus-visible{outline:2px solid var(--tokentweak-color-accent);outline-offset:2px}.tokenpanel-close-btn{position:relative}.tokenpanel-close-btn:after{content:"";position:absolute;inset:-4px}.tokenpanel-gear-btn{position:relative}.tokenpanel-gear-btn:after{content:"";position:absolute;inset:-5px}.tokenpanel-elpath-toggle,.tokenpanel-tweaker-toggle{position:relative}.tokenpanel-elpath-toggle:after,.tokenpanel-tweaker-toggle:after{content:"";position:absolute;inset:-4px}.tokenpanel-highlight-toggle{position:relative}.tokenpanel-highlight-toggle:after{content:"";position:absolute;inset:-4px}.tokenpanel-resize-handle{overflow:visible}.tokenpanel-resize-handle:after{content:"";position:absolute;inset:-4px;cursor:nwse-resize}@media(prefers-reduced-motion:reduce){[data-design-token-panel-modal] [class*=__spinner]{animation:design-token-panel-modal-pulse 1.5s ease-in-out infinite}@keyframes design-token-panel-modal-pulse{0%,to{opacity:1}50%{opacity:.4}}.tokenpanel-tooltip{transform:none;transition:opacity 90ms ease}.tokenpanel-tooltip[data-show=true]{transform:none}}.tokenpanel-tab-button{position:relative}.tokenpanel-changed-tab-badge{position:absolute;top:6px;right:-2px;display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;padding-inline:4px;border-radius:999px;background:var(--tokentweak-color-accent-bar);color:var(--tokentweak-color-bg);font-family:var(--tokentweak-font-mono);font-size:10px;font-weight:700;line-height:1}.tokenpanel-changed-only-toggle{display:inline-flex;align-items:center;gap:var(--tokentweak-pad-xs);flex-shrink:0;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;white-space:nowrap;-webkit-user-select:none;user-select:none;cursor:pointer}.tokenpanel-changed-only-toggle:hover{color:var(--tokentweak-color-fg)}.tokenpanel-changed-only-checkbox{accent-color:var(--tokentweak-color-accent-bar)}.tokenpanel-changed-footer-content{display:flex;align-items:center;gap:var(--tokentweak-pad-sm);width:100%;min-width:0}.tokenpanel-changed-summary{min-width:0;overflow:hidden;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:11px;text-overflow:ellipsis;white-space:nowrap}.tokenpanel-changed-summary-count{color:var(--tokentweak-color-fg);font-weight:700}.tokenpanel-changed-footer-spacer{flex:1 1 auto;min-width:var(--tokentweak-pad-xs)}.tokenpanel-changed-footer-content .tokenpanel-action-link{flex-shrink:0}.tokenpanel-changed-copy[aria-disabled=true],.tokenpanel-changed-revert-all[aria-disabled=true]{opacity:.35;cursor:default}.tokenpanel-changed-revert-all{color:var(--tokentweak-color-danger)}.tokenpanel-changed-revert-all:hover,.tokenpanel-changed-revert-all:focus-visible{color:var(--tokentweak-color-fg)}.tokenpanel-row.is-changed,.tokenpanel-row--column.is-changed{position:relative;border-left:2px solid var(--tokentweak-color-accent-bar);padding-left:6px;margin-left:-8px}.tokenpanel-row.is-changed .tokenpanel-row-number-input,.tokenpanel-row--column.is-changed .tokenpanel-row-number-input,.tokenpanel-row.is-changed .tokenpanel-row-select,.tokenpanel-row--column.is-changed .tokenpanel-row-select,.tokenpanel-row.is-changed .tokenpanel-row-text-input,.tokenpanel-row--column.is-changed .tokenpanel-row-text-input,.tokenpanel-row.is-changed .tokenpanel-color-field-swatch,.tokenpanel-row--column.is-changed .tokenpanel-color-field-swatch,.tokenpanel-row.is-changed .tokenpanel-row-color-input,.tokenpanel-row--column.is-changed .tokenpanel-row-color-input{border-color:var(--tokentweak-color-accent-bar);color:var(--tokentweak-color-code-fg)}.tokenpanel-row.is-changed .tokenpanel-row-number-input:focus-visible,.tokenpanel-row.is-changed .tokenpanel-row-select:focus-visible,.tokenpanel-row.is-changed .tokenpanel-row-text-input:focus-visible,.tokenpanel-row.is-changed .tokenpanel-color-field-swatch:focus-visible{outline-color:var(--tokentweak-color-accent-bar)}.tokenpanel-changed-tail{display:inline-flex;align-items:baseline;min-width:0;color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:10px;line-height:1.2;white-space:nowrap}.tokenpanel-changed-tail-old{text-decoration:line-through;text-decoration-color:var(--tokentweak-color-muted)}.tokenpanel-changed-tail-new{color:var(--tokentweak-color-accent-bar)}.tokenpanel-changed-revert{position:relative;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:20px;height:20px;padding:0;border-radius:var(--radius-tokentweak);color:var(--tokentweak-color-muted);cursor:pointer}.tokenpanel-changed-revert:hover,.tokenpanel-changed-revert:focus-visible{color:var(--tokentweak-color-accent-bar)}.tokenpanel-changed-revert:focus-visible{outline:2px solid var(--tokentweak-color-accent-bar);outline-offset:1px}.tokenpanel-changed-revert:after{content:"";position:absolute;inset:-2px}.tokenpanel-changed-revert svg{fill:none!important;stroke:currentColor!important;pointer-events:none}.tokenpanel-changed-marker{flex:0 0 auto;color:var(--tokentweak-color-accent-bar);font-size:9px;line-height:1}.tokenpanel-color-swatch-wrap.is-changed{position:relative;border-left:2px solid var(--tokentweak-color-accent-bar);padding-left:4px;margin-left:-6px}.tokenpanel-color-swatch-wrap.is-changed .tokenpanel-color-swatch-button{border-color:var(--tokentweak-color-accent-bar)}.tokenpanel-color-swatch-wrap.is-changed .tokenpanel-color-swatch-button:focus-visible{outline-color:var(--tokentweak-color-accent-bar)}.tokenpanel-palette-selector.is-changed{border-left:2px solid var(--tokentweak-color-accent-bar);padding-left:4px;margin-left:-6px}.tokenpanel-palette-selector.is-changed .tokenpanel-palette-trigger{border-color:var(--tokentweak-color-accent-bar)}.tokenpanel-palette-selector.is-changed .tokenpanel-palette-trigger:focus-visible{outline-color:var(--tokentweak-color-accent-bar)}.tokenpanel-palette-edit-group-changed-count{display:inline-flex;align-items:center;justify-content:center;min-width:16px;height:16px;margin-left:4px;padding-inline:4px;border-radius:999px;background:var(--tokentweak-color-accent-bar);color:var(--tokentweak-color-bg);font-family:var(--tokentweak-font-mono);font-size:10px;font-weight:700;line-height:1}.tokenpanel-changed-empty{padding:var(--tokentweak-pad-lg);color:var(--tokentweak-color-muted);font-family:var(--tokentweak-font-mono);font-size:12px;text-align:center}@container tokenpanel (max-width: 479px){.tokenpanel-changed-footer-content{flex-wrap:wrap}.tokenpanel-changed-summary{flex:1 1 100%}.tokenpanel-changed-footer-spacer{display:none}}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@takazudo/zdtp",
-  "version": "0.4.13",
+  "version": "0.4.15",
   "description": "Dynamic design-token tweak panel — host-config-driven, framework-agnostic Preact UI.",
   "private": false,
   "license": "MIT",
@@ -110,6 +110,8 @@
     "test:browser": "vitest run --project browser",
     "test:unit:watch": "vitest --project node",
     "test:watch": "vitest",
+    "test:e2e": "playwright test --config playwright.e2e.config.ts",
+    "test:pack": "node scripts/pack-smoke.mjs",
     "test:vrt": "playwright test",
     "test:vrt:update": "playwright test --update-snapshots",
     "typecheck": "tsc --noEmit",

package/dist/controls/pill-slider-row.d.ts

@@ -1,36 +0,0 @@
-import type { TokenDef } from '../tokens/manifest';
-/**
- * Slider row variant with a "Pill" checkbox on top.
- *
- *   [x] Pill (9999px)
- *   [label]  ... [9999 px]   ← inputs disabled while pill is on
- *   [=========o==================]
- *
- * When the checkbox is ON the token value is pinned to `token.pill.value`
- * (e.g. `"9999px"` for the full-radius sentinel) and the underlying slider /
- * number input go read-only so the user can't accidentally de-pill via typing.
- *
- * When the checkbox is OFF the row behaves as a normal `SliderRow` — the user
- * can type any numeric value in the number input (unconstrained free input).
- *
- * Toggling between modes preserves the last custom value (kept in a ref so we
- * don't round-trip it through state / persistence) — this is the "without data
- * loss" requirement from the Size sub-issue: you can flip Pill off to tweak
- * 16px, flip back on for the sentinel, flip off again and land on 16px.
- *
- * `onChange` is `(id, next)` — the row passes its own `token.id` back so the
- * parent can use a single stable handler across every row, keeping React.memo
- * effective.
- */
-export interface PillSliderRowProps {
-    /** Token must carry `token.pill` metadata. */
-    token: TokenDef;
-    /** Current persisted value (the manifest default if no override yet). */
-    value: string;
-    /** Called with the row's `token.id` and the new CSS string whenever pill
-     *  toggles or slider commits. */
-    onChange: (id: string, next: string) => void;
-}
-declare function PillSliderRow({ token, value, onChange }: PillSliderRowProps): import("preact").JSX.Element;
-declare const _default: typeof PillSliderRow;
-export default _default;

package/dist/controls/select-row.d.ts

@@ -1,25 +0,0 @@
-import type { TokenDef } from '../tokens/manifest';
-/**
- * One manifest-driven token row backed by a native `<select>`.
- *
- *   [label]                                     [  400 ▾]
- *
- * Used for tokens whose value is one of a small, enumerated set — e.g.
- * `--font-weight-*` (100..900). The selected option string is stored verbatim
- * in persisted state (no numeric round-tripping; font-weight values are
- * conventionally written as bare numbers in CSS).
- *
- * `onChange` is `(id, next)` — the row passes its own `token.id` back so the
- * parent can use a single stable handler across every row, keeping React.memo
- * effective.
- */
-export interface SelectRowProps {
-    token: TokenDef;
-    /** Current persisted value (or the token's default if no override). */
-    value: string;
-    /** Called with the row's `token.id` and the newly selected option value. */
-    onChange: (id: string, next: string) => void;
-}
-declare function SelectRow({ token, value, onChange }: SelectRowProps): import("preact").JSX.Element;
-declare const _default: typeof SelectRow;
-export default _default;