/* Native BTCStar chart. Scoped to the alternative chart surface. */
.native-chart { border: 1px solid var(--color-border); border-radius: 12px; color: var(--color-text-main); background: var(--chart-bg); min-width: 0; overflow: hidden; }
.native-chart-top, .native-chart-toolbar, .native-chart-studies { display: flex; align-items: center; flex-wrap: wrap; gap: 5px; padding: 8px 10px; border-bottom: 1px solid var(--color-border-subtle); min-width: 0; }
.native-chart-top { gap: 12px; }
.native-chart-brand { font-size: 14px; letter-spacing: -.02em; }
.native-chart-symbol { font-size: 12px; color: var(--color-text-muted); flex: 1; overflow-wrap: anywhere; }
.native-chart-select, .native-chart-date, .native-chart-button { font: inherit; font-size: 12px; color: inherit; background: var(--chart-bg); border: 1px solid var(--color-border); border-radius: 8px; min-height: 34px; min-width: 34px; padding: 5px 9px; max-width: 100%; }
.native-chart-button { cursor: pointer; }
.native-chart-button:hover { background: var(--e-panel2); }
.native-chart-button[aria-pressed="true"] { color: var(--color-on-accent); background: var(--color-accent); border-color: var(--color-accent); }
.native-chart-button:disabled { opacity: .45; cursor: default; }
.native-chart :is(button,select,input,summary):focus-visible, .native-chart-canvas:focus-visible { outline: 2px solid var(--color-accent); outline-offset: -2px; }
.native-chart-date { min-width: 0; width: 168px; }
.native-chart-body { display: grid; grid-template-columns: 64px minmax(0,1fr); min-width: 0; }
.native-chart-tools { display: flex; flex-direction: column; gap: 4px; padding: 7px 5px; border-right: 1px solid var(--color-border-subtle); background: var(--e-panel); }
.native-chart-tools .native-chart-button { font-size: 10px; padding: 4px 1px; min-height: 36px; }
.native-chart-canvas { width: 100%; height: 470px; min-width: 0; }
.native-chart-drawing { cursor: crosshair; }
.native-chart-readout { font: 11px/1.55 "PT Mono", "Courier Prime", ui-monospace, Consolas, monospace; font-variant-numeric: tabular-nums; margin: 0; padding: 7px 10px; min-height: 50px; max-height: 116px; overflow: auto; white-space: pre-wrap; overflow-wrap: anywhere; border-top: 1px solid var(--color-border-subtle); }
.native-chart-status, .native-chart-timing { margin: 0; padding: 4px 10px; color: var(--color-text-muted); font-size: 11px; font-weight: 400; overflow-wrap: anywhere; }
.native-chart-status { min-height: 24px; }
.native-chart-muted { font-size: 11px; color: var(--color-text-muted); }
.native-chart details { padding: 0 10px; border-top: 1px solid var(--color-border-subtle); font-size: 12px; }
.native-chart summary { cursor: pointer; padding: 8px 0; min-height: 34px; }
.native-chart details p { font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.native-chart-drawing-list { display: flex; flex-wrap: wrap; gap: 5px; padding-bottom: 8px; }
.native-chart-fill-list { max-height: 240px; overflow: auto; }
.native-chart-fill-row { padding: 8px 0; border-bottom: 1px solid var(--color-border-subtle); overflow-wrap: anywhere; }
.native-chart-fill-row p { margin: 4px 0; }
.native-chart-help .smartgrid-attribution { display: inline-block; margin-bottom: 10px; font-size: 11px; }
@media (max-width: 600px) {
  .native-chart-top { gap: 8px; }
  .native-chart-top .native-chart-select { width: 100%; }
  .native-chart-body { grid-template-columns: minmax(0,1fr); }
  .native-chart-tools { flex-direction: row; flex-wrap: wrap; border-right: 0; border-bottom: 1px solid var(--color-border-subtle); }
  .native-chart-tools .native-chart-button { min-width: 42px; min-height: 44px; font-size: 10px; }
  .native-chart .native-chart-button, .native-chart-select, .native-chart-date { min-height: 44px; min-width: 44px; }
  .native-chart-select, .native-chart-date { font-size: 16px; }
  .native-chart-date { width: 200px; }
  .native-chart-canvas { height: 380px; }
  .native-chart-readout { max-height: 90px; }
}
@media (pointer: coarse), (max-width: 900px) and (max-height: 500px) {
  .native-chart .native-chart-button, .native-chart-select, .native-chart-date { min-height: 44px; min-width: 44px; }
  .native-chart-select, .native-chart-date { font-size: 16px; }
}
.native-chart-study-error { color: var(--color-danger); font-size: 12px; flex-basis: 100%; }
