function Stat({label,value,unit}) {
  return <VStack spacing={5}>
    <Text fontSize={11} color={$env.accent}>{label}</Text>
    <Text fontSize={24} color={$env.foreground}>{value===null?'—':value.toFixed(1)}</Text>
    <Text fontSize={10} color={$env.foreground}>{unit}</Text>
  </VStack>;
}
function main() {
  const r=$data.current;
  return <CardContent title="海拔与姿态">
    <HStack spacing={18}>
      <Stat label="海拔" value={r.altitude} unit="m"/>
      <Stat label="侧倾" value={r.roll} unit="°"/>
      <Stat label="俯仰" value={r.pitch} unit="°"/>
    </HStack>
  </CardContent>;
}