.telemetry-setting-action {
  min-width: 92px;
  min-height: 38px;
  border: 1px solid rgba(102, 231, 255, .22);
  border-radius: 10px;
  background: rgba(35, 102, 116, .16);
  color: #dffbff;
  font: inherit;
  font-size: .62rem;
  font-weight: 950;
  letter-spacing: .06em;
  cursor: pointer;
}
.telemetry-overlay {
  position: fixed;
  inset: 0;
  z-index: 1900;
  display: grid;
  place-items: center;
  padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
  background: rgba(2, 9, 13, .92);
  backdrop-filter: blur(10px);
}
.telemetry-overlay[hidden] { display: none; }
.telemetry-panel {
  width: min(95vw, 820px);
  max-height: min(90vh, 820px);
  overflow: auto;
  padding: 18px;
  border: 1px solid rgba(98, 226, 255, .25);
  border-radius: 20px;
  background: linear-gradient(180deg, rgba(7, 30, 38, .99), rgba(3, 15, 22, .99));
  box-shadow: 0 28px 90px rgba(0, 0, 0, .58);
}
.telemetry-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 14px;
}
.telemetry-head__copy span {
  color: #7fe8fb;
  font-size: .58rem;
  font-weight: 1000;
  letter-spacing: .13em;
}
.telemetry-head__copy h2 {
  margin: 5px 0 6px;
  color: #effcff;
  font-size: clamp(1.45rem, 5vw, 2rem);
}
.telemetry-head__copy p {
  margin: 0;
  color: #8eb9c2;
  font-size: .72rem;
  line-height: 1.45;
}
.telemetry-close,
.telemetry-toolbar button {
  min-height: 40px;
  border: 1px solid rgba(255,255,255,.13);
  border-radius: 10px;
  background: rgba(255,255,255,.05);
  color: #e6f9fc;
  font: inherit;
  font-size: .62rem;
  font-weight: 950;
  cursor: pointer;
}
.telemetry-close { min-width: 72px; }
.telemetry-summary {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px;
  margin: 16px 0 12px;
}
.telemetry-summary__item {
  min-height: 70px;
  padding: 10px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: 12px;
  background: rgba(255,255,255,.025);
}
.telemetry-summary__item span {
  display: block;
  color: #78a9b3;
  font-size: .54rem;
  font-weight: 950;
  letter-spacing: .08em;
}
.telemetry-summary__item strong {
  display: block;
  margin-top: 6px;
  color: #a8f4ff;
  font-size: 1.2rem;
}
.telemetry-toolbar {
  display: flex;
  gap: 8px;
  margin-bottom: 10px;
}
.telemetry-toolbar button { flex: 1; padding: 0 10px; }
.telemetry-toolbar button[data-danger="true"] { border-color: rgba(255, 114, 114, .24); color: #ffc1c1; }
.telemetry-event-list {
  display: grid;
  gap: 7px;
}
.telemetry-event {
  display: grid;
  grid-template-columns: 110px 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 9px 10px;
  border-radius: 10px;
  background: rgba(255,255,255,.025);
  border: 1px solid rgba(255,255,255,.06);
}
.telemetry-event strong {
  color: #dffbff;
  font-size: .61rem;
  overflow-wrap: anywhere;
}
.telemetry-event span,
.telemetry-event small {
  color: #7fa9b2;
  font-size: .56rem;
}
.telemetry-event small { text-align: right; }
.telemetry-empty {
  padding: 20px 10px;
  text-align: center;
  color: #7398a0;
  font-size: .68rem;
}
@media (max-width: 720px) {
  .telemetry-panel { padding: 14px; max-height: 92vh; }
  .telemetry-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .telemetry-event { grid-template-columns: 1fr auto; }
  .telemetry-event span { grid-column: 1 / -1; }
  .telemetry-toolbar { flex-direction: column; }
}
@media (prefers-reduced-motion: reduce) {
  .telemetry-overlay { backdrop-filter: none; }
}