/* DEX pools (apps/dexview.py, assets/dex.js): the range and candles bar above the chart, the chart, the feed */
.dx-bar { gap:6px 8px; }
.dx-bar .dx-lbl { margin:0 2px 0 0; }
.dx-bar .dx-sep { flex:1 1 12px; }
.app .dx-bar .dx-date { width:170px; }
.dx-bar .seg-lbl { padding:0 8px; }
.dx-summary { margin:6px 0 8px; }
.dx-chart { min-height:560px; }
@media (max-width:700px) { .app .dx-bar .dx-date { width:calc(50% - 16px); } .dx-bar .dx-sep { display:none; } }
.dx-note { font:400 10.5px/1.4 var(--rv-font); color:var(--rv-faint); margin:4px 0 2px; }
.dx-sync { font:400 12px var(--rv-font); color:var(--rv-mute); }
.dx-sync label { display:inline-flex; align-items:center; gap:4px; cursor:pointer; }
.dx-badges { display:flex; flex-wrap:wrap; gap:6px; min-height:24px; margin:4px 0 8px; align-items:center; }
.dx-badge { display:inline-flex; align-items:center; gap:4px; border:1px solid var(--rv-ink); padding:0 2px 0 8px; font:500 12px/22px var(--rv-font); background:var(--rv-paper); color:var(--rv-ink); }
.app .dx-badge .dx-badge-x { border:none; background:none; min-height:0; height:22px; padding:0 6px; font:500 12px var(--rv-font); cursor:pointer; color:var(--rv-mute); }
.app .dx-badge .dx-badge-x:hover { color:var(--rv-ink); }
.dx-ov { flex:0 1 260px; min-width:180px; }
/* the range bar's own button rule (.tv-winbar button: 32px) also caught the dropdown's button, cutting it off: the dropdown keeps its own */
.app .tv-winbar .dx-ov button.dash-dropdown { height:auto; min-height:32px; padding:0; font:inherit; background:var(--rv-paper); color:var(--rv-ink); }
.app .tv-winbar .dx-ov .dash-dropdown-trigger { min-height:32px; height:auto; padding:2px 8px; font:500 12px var(--rv-font); }