.study-chart-modes{display:flex;align-self:flex-end;gap:2px;flex:0 0 30px;min-height:30px;margin:0 0 4px;padding:2px;border-radius:6px;background:var(--panel-2,var(--soft));}
.study-chart-modes button{border:0;border-radius:4px;min-height:26px;padding:3px 10px;font:inherit;font-size:11px;color:var(--muted);background:transparent;cursor:pointer;}
.study-chart-modes button[aria-pressed=true]{background:var(--panel,var(--bg));color:var(--accent);box-shadow:0 1px 3px #0002;}
.has-study-chart{position:relative;isolation:isolate;}
.has-study-chart[data-chart-mode=depth] canvas{inset:0 0 28px;height:calc(100% - 28px);}
.has-study-chart.has-progress-depth button[aria-pressed=true]{background:color-mix(in srgb,var(--accent) 8%,transparent);box-shadow:inset 0 -2px var(--accent);}
.has-study-chart .study-chart-plot{position:absolute;inset:0 0 24px;width:100%;height:calc(100% - 24px);overflow:visible;z-index:0;fill:none;stroke:none;}
.study-chart-plot .chart-grid line{stroke:var(--border,var(--line));stroke-width:1;}
.study-chart-plot .chart-grid text{fill:var(--muted);stroke:none;font:10px system-ui,sans-serif;}
.study-chart-plot .chart-line{stroke:var(--accent);stroke-width:2;fill:none;stroke-linecap:round;stroke-linejoin:round;}
.study-chart-plot .chart-data{fill:var(--accent);stroke:none;opacity:.7;}
.study-chart-plot .chart-data.is-selected{opacity:1;stroke:var(--text);stroke-width:1.5;}
.has-study-chart:not([data-chart-mode=depth]){padding-left:var(--chart-left,42px);padding-right:var(--chart-right,10px);border-bottom:0;}
.has-study-chart:not([data-chart-mode=depth])>button{z-index:1;touch-action:pan-y;background:transparent;}
.has-study-chart:not([data-chart-mode=depth])>button::before{visibility:hidden;}
.has-study-chart:not([data-chart-mode=depth])>button[aria-pressed=true]{background:color-mix(in srgb,var(--accent) 6%,transparent);}
.has-study-chart:not([data-chart-mode=depth])>button>span{bottom:0;font-size:10px;}
.widget-streak .study-chart-modes{margin-top:2px;}
@container widget (max-height:260px){
  .widget-streak .streak-mark{display:none;}
  .widget-streak .streak-widget-head{grid-template-columns:minmax(0,1fr) 28px;gap:2px;}
  .widget-streak .streak-widget-metrics{margin:0;padding:0;border:0;}
  .widget-streak .study-chart-modes{margin:0;min-height:26px;flex-basis:26px;padding:0;}
  .widget-streak:has(+.widget-connect) .streak-widget-chart,
  .widget-streak:has(+.widget-connect) .widget-study-detail,
  .widget-streak:has(+.widget-connect) .study-chart-modes,
  .widget-streak:has(+.widget-connect) .streak-action{display:none;}
}
@media(pointer:coarse){.study-chart-modes,.study-chart-modes button{min-height:32px;}}