* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { width: 100%; height: 100%; overflow: hidden; font-family: sans-serif; }
#cesiumContainer { width: 100%; height: 100%; }

.tab {
  background: transparent; border: none; color: rgba(255,255,255,0.6);
  padding: 5px 12px; border-radius: 14px; cursor: pointer;
  font-size: 12px; transition: all 0.2s;
}
.tab:hover { color: white; background: rgba(255,255,255,0.1); }
.tab.active { background: #e74c3c; color: white; }

.panel-title {
  font-size: 11px; text-transform: uppercase;
  letter-spacing: 0.08em; color: #aaa; margin-bottom: 8px;
}
.toggle-row {
  display: flex; align-items: center; gap: 8px;
  padding: 4px 0; cursor: pointer; color: #ddd; font-size: 13px;
}
.toggle-row input { accent-color: #e74c3c; cursor: pointer; }
.toggle-row:hover { color: white; }

.f-select {
  width: 100%; margin-top: 4px;
  background: rgba(255,255,255,0.1); color: white;
  border: 1px solid rgba(255,255,255,0.2);
  border-radius: 6px; padding: 3px 6px; font-size: 11px;
}