* { box-sizing: border-box; }
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  background: #0e1116;
  color: #e5e8ed;
}
header {
  padding: 16px 24px;
  border-bottom: 1px solid #1f242c;
  display: flex;
  align-items: center;
  gap: 24px;
}
h1 { font-size: 18px; margin: 0; font-weight: 500; }
.controls { display: flex; gap: 16px; align-items: center; }
label { font-size: 13px; display: flex; gap: 6px; align-items: center; }
select {
  background: #151a21;
  color: #e5e8ed;
  border: 1px solid #2a313c;
  border-radius: 4px;
  padding: 4px 8px;
  font-size: 13px;
}
#status { color: #7d8695; font-size: 12px; }
#chart {
  width: 100%;
  height: calc(100vh - 64px);
  position: relative;
}
.tooltip {
  position: absolute;
  display: none;
  background: #151a21;
  color: #e5e8ed;
  border: 1px solid #2a313c;
  border-radius: 4px;
  padding: 8px 10px;
  font-size: 12px;
  font-family: "SF Mono", Menlo, Consolas, monospace;
  pointer-events: none;
  z-index: 10;
  min-width: 140px;
}
.tooltip .t {
  color: #7d8695;
  margin-bottom: 4px;
  font-size: 11px;
}
.tooltip div { display: flex; justify-content: space-between; gap: 12px; }
.tooltip span {
  color: #7d8695;
  margin-right: 8px;
}