.metric-picker { position: relative; min-width: 180px; font-size: 12px; }
.metric-picker > summary { position: relative; overflow: hidden; padding: 8px 30px 8px 10px; border: 1px solid var(--ls-strong-rule, var(--line, #dbe4df)); border-radius: 5px; background: var(--ls-input, var(--card, #fff)); color: var(--ls-ink, var(--ink, #13211f)); cursor: pointer; list-style: none; text-overflow: ellipsis; white-space: nowrap; }
.metric-picker > summary::-webkit-details-marker { display: none; }
.metric-picker > summary::after { position: absolute; right: 11px; content: '⌄'; }
.metric-picker[open] > .metric-picker-menu { position: absolute; z-index: 1101; top: calc(100% + 4px); left: 0; width: max(100%, 220px); padding: 5px; border: 1px solid var(--ls-strong-rule, var(--line, #dbe4df)); border-radius: 6px; background: var(--ls-card, var(--card, #fff)); color: var(--ls-ink, var(--ink, #13211f)); box-shadow: 0 8px 24px #14271e24; }
.metric-picker-category, .metric-picker-subcategory { position: relative; }
.metric-picker-category-trigger, .metric-picker-subcategory-trigger { display: block; width: 100%; padding: 8px 10px; border: 0; border-radius: 4px; background: transparent; color: inherit; cursor: pointer; text-align: left; text-transform: capitalize; }
.metric-picker-category-trigger::after, .metric-picker-subcategory-trigger::after { float: right; content: '›'; }
.metric-picker-category-trigger:hover, .metric-picker-category-trigger:focus-visible, .metric-picker-subcategory-trigger:hover, .metric-picker-subcategory-trigger:focus-visible, .metric-picker-options button:hover { background: var(--ls-stone, #f0f3ef); }
.metric-picker-subcategories { position: absolute; top: var(--metric-picker-top, 0px); left: calc(100% - 3px); z-index: 1102; display: none; width: max(100%, 220px); padding: 5px; border: 1px solid var(--ls-strong-rule, var(--line, #dbe4df)); border-radius: 6px; background: var(--ls-card, var(--card, #fff)); color: var(--ls-ink, var(--ink, #13211f)); box-shadow: 0 8px 24px #14271e24; }
.metric-picker-menu[data-side="left"] .metric-picker-subcategories { right: calc(100% - 3px); left: auto; }
.metric-picker-category:hover > .metric-picker-subcategories, .metric-picker-category.is-keyboard-open > .metric-picker-subcategories { display: grid; }
.metric-picker-options { position: absolute; top: var(--metric-picker-top, 0px); left: calc(100% - 3px); z-index: 1103; display: none; grid-auto-flow: column; grid-template-columns: repeat(var(--metric-picker-columns, 1), minmax(0, 220px)); grid-template-rows: repeat(var(--metric-picker-rows, 20), 30px); width: max-content; padding: 5px; border: 1px solid var(--ls-strong-rule, var(--line, #dbe4df)); border-radius: 6px; background: var(--ls-card, var(--card, #fff)); color: var(--ls-ink, var(--ink, #13211f)); box-shadow: 0 8px 24px #14271e24; }
.metric-picker-subcategories[data-metric-side="left"] .metric-picker-options { right: calc(100% - 3px); left: auto; }
.metric-picker-subcategory:hover > .metric-picker-options, .metric-picker-subcategory.is-keyboard-open > .metric-picker-options { display: grid; }
.metric-picker-options button { min-width: 0; overflow: hidden; padding: 5px 8px; border: 0; border-radius: 4px; background: transparent; color: inherit; line-height: 20px; text-align: left; text-overflow: ellipsis; white-space: nowrap; }
.metric-picker-options button[aria-pressed="true"] { color: var(--ls-accent, var(--accent, #16796c)); font-weight: 600; }
.metric-picker-empty { padding: 9px; color: var(--ls-secondary, var(--muted, #6c7b78)); }
.chart-series-row .metric-picker { min-width: 0; }